https://github.com/nadavbitran/comment-section-web-app
https://github.com/nadavbitran/comment-section-web-app
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/nadavbitran/comment-section-web-app
- Owner: NadavBitran
- Created: 2023-12-24T17:06:26.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-12-28T15:50:17.000Z (over 2 years ago)
- Last Synced: 2025-02-26T17:47:07.657Z (over 1 year ago)
- Language: HTML
- Size: 2.85 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Comment Section App đ
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.
## Table of Contents
- [Features](#features)
- [Live Site](#live-site)
- [Tech Stack](#technologies-and-libraries-used)
- [Acknowledgements](#acknowledgements)
## Features
### Comment Section Page đŦ
- 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.
### Contact Page đ§
- 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.
### Profile Page đ¤
- 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.
### About Page âšī¸
- Provides an in-depth overview of the project, its objectives, and the technologies used.
### Design Support đąđģ
- 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.
## Live Site đ
Check out the live version of the Comment Section App [here](https://commentsection.onrender.com).
The app is hosted on [Render.com](https://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.
## Technologies and Libraries Used đ ī¸
| 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 |  | | | |
## Acknowledgements đ
This project is an extended version of a [Frontend Mentor](https://www.frontendmentor.io/) challenge.
The original challenge can be found [here](https://www.frontendmentor.io/challenges/interactive-comments-section-iG1RugEG9).