Welcome to the Comment Section App, a fullstack application that allows users to engage in conversations through a comment section component. Additionally, the app features a contact page for user inquiries, an about page providing more information about the project, and a profile page displaying user details, statistics, and comment history.
- Users can engage in real-time conversations by posting comments and replies to each other.
- Real-time updates enable users to see new comments and replies as they are posted.
- Users can express their opinions by liking or disliking other posts within the comment section.
- The comment section provides a dynamic and interactive user experience.
- Allows users to submit inquiries and messages to the contact team for prompt assistance.
- The contact form includes fields for name, email, subject, and a description, ensuring comprehensive user feedback.
- Displays personalized user details, including username, avatar, and registration information.
- Presents statistics such as the number of comments posted, liked posts, and overall user engagement.
- Features a comment history section, showcasing the user's past interactions within the comment section.
- Provides an in-depth overview of the project, its objectives, and the technologies used.
- The website is designed to support a wide range of screens, including phones, tablets, laptops, and desktop computers.
- Responsive design ensures a seamless and visually appealing experience across various devices and screen sizes.
Check out the live version of the Comment Section App here.
The app is hosted on Render.com, a cloud platform that simplifies the deployment and scaling of web applications. Render provides a hassle-free experience for hosting, managing, and scaling applications, allowing seamless deployment.
| Category | Technology/Library | Role | Logo | ||||
|---|---|---|---|---|---|---|---|
| Frontend | React | User Interface |  |
||||
| React Router | Navigation |  |
|||||
| Axios | HTTP Requests |  |
|||||
| SCSS | Styling |  |
|||||
| Vite | Frontend Build Tool |  |
|||||
| Socket.io | Real-time Communication |  |
|||||
| Backend | Node.js | Server-Side JavaScript |  |
||||
| Express.js | Web Application Framework |  |
|||||
| MongoDB | Database |  |
|||||
| Mongoose | MongoDB ODM |  |
|||||
| JWT | Authentication |  |
|||||
| Testing | Vitest | Unit Testing |  |
||||
| React Testing Library | Unit Testing |  |
|||||
| Cypress | E2E Testing |  |
This project is an extended version of a Frontend Mentor challenge. The original challenge can be found here.