Campus Forum Project Introduction
Overview
Demo
Currently, only the first phase of the demo is available, showcasing the initial prototype developed during the hackathon.
Background
This project originated from the Builder’s Dojo Hackathon held on the Silicon Valley Campus in March 2023. During the event, I led the development of a prototype campus forum using Django, which was recognized with a top prize at the hackathon. Building on this success, the campus faculty invited me to further enhance and expand the project, transforming it into a fully-functional platform for student engagement and collaboration.
To achieve this, I took on the challenge of redeveloping the web application with a new tech stack, leading both the frontend and backend development. The frontend was built using React, chosen for its efficient, component-based architecture, while the backend was initially developed using Express to ensure robust server-side operations. This decision was influenced by the need to scale the project and accommodate more complex features such as secure user authentication and interactive content management. Simultaneously, other team members worked on a parallel backend in Django, which I integrated with the Express-based system to demonstrate a seamless multi-framework infrastructure.
With the support and guidance of the campus faculty, this project evolved into a full-fledged campus forum designed to empower students with essential information and resources, encourage community interaction, and foster collaborative learning among students in the tech field.
Demo
The website is out of service. A live demo link: Click (Current unavailable)
Read more
Goals
- Enhancing Student Success: Empower Silicon Valley Campus students with essential campus information, valuable learning resources, and content crucial for their success in the tech field.
- Fostering Community Interaction: Establish an interactive communication and collaborative learning platform where students can pose questions, receive answers, and engage in discussions throughout their educational journey.
Tech Stack
- Frontend: React, chosen for its efficient, component-based architecture that enhances user experiences.
- Backend:
- Express: Personally developed by me, focusing on efficient and scalable server-side solutions. This backend serves as a critical part of the project’s infrastructure, showcasing my expertise in handling complex server-side operations.
- Django: Developed by other team members, offering similar functionalities. My role included ensuring seamless integration and compatibility between the Express and Django backends, reflecting my skills in collaborative development and system integration.
- Deployment: AWS with CI/CD integration for seamless, scalable deployment.
Key Features
- Secure User Authentication: Implemented JWT-based authentication, cookie-specific, and tailored for northeastern email users, ensuring robust security and data integrity.
- Resourceful Content Delivery: A comprehensive guide to campus life and academic resources, aiding students in navigating their educational paths.
- Interactive User Engagement: Facilities for user-generated content, including posts and nested comments, encourage active community participation.
- Elegant Content Presentation: Markdown format rendering allows for clear, structured content delivery.
- Consistent UI/UX: Utilization of MaterialUI for a consistent, interactive user interface design.
Each feature is carefully crafted to enhance the user experience, demonstrating my ability to translate user needs into functional design elements.
Tools and Libraries Used
- Security and Authentication, Validation:
bcrypt, cookie-parser, cors, jsonwebtoken, formik, yup - Data Handling and Storage:
mongoose, multer, nodemailer, cloudinary - UI/UX Design:
@emotion/react, @mui/material, react-syntax-highlighter
Personal Contribution
As the lead developer of this project, I spearheaded the front-end design while coordinating closely with the backend team. My role was pivotal in ensuring a seamless integration of the front and back end, demonstrating my skills in full-stack development and team collaboration.
Challenges and Learnings
One significant challenge was optimizing the user authentication process. By implementing JWT and refining the cookie-based system, I ensured a secure yet user-friendly login experience. This experience enhanced my expertise in cybersecurity and user interface design.