Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jabedalimollah/aliet
ALIET is a social media web application built using the MERN stack (MongoDB, Express.js, React.js, and Node.js).
https://github.com/jabedalimollah/aliet
axios cookies env expressjs jsonwebtoken mongodb nodejs react-redux reactjs realtime-chat redux-toolkit shadcn-ui socket-io tailwindscss
Last synced: about 18 hours ago
JSON representation
ALIET is a social media web application built using the MERN stack (MongoDB, Express.js, React.js, and Node.js).
- Host: GitHub
- URL: https://github.com/jabedalimollah/aliet
- Owner: jabedalimollah
- Created: 2024-11-04T05:33:40.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-11-29T06:21:48.000Z (2 months ago)
- Last Synced: 2024-12-17T05:23:09.620Z (about 2 months ago)
- Topics: axios, cookies, env, expressjs, jsonwebtoken, mongodb, nodejs, react-redux, reactjs, realtime-chat, redux-toolkit, shadcn-ui, socket-io, tailwindscss
- Language: JavaScript
- Homepage: https://youtu.be/pdyayBR9mLI?si=tQbXg8tOTe7wEY9u
- Size: 8.9 MB
- Stars: 4
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ALIET - Social Media Web Application
ALIET is a feature-rich social media web application developed using the MERN stack (MongoDB, Express.js, React.js, and Node.js). It enables users to connect with others, share content, and manage their profiles effortlessly.
## Screenshots
![App Screenshot](https://github.com/jabedalimollah/aliet/blob/b9fb0d0a66eb8c70bedf40fc37d1e0db2e131f70/Screenshot/Screenshot%202024-11-27%20105412.png?raw=true)
![App Screenshot](https://github.com/jabedalimollah/aliet/blob/main/Screenshot/Screenshot%202024-11-27%20105338.png?raw=true)
![App Screenshot](https://github.com/jabedalimollah/aliet/blob/main/Screenshot/Screenshot%202024-11-27%20104105.png?raw=true)
![App Screenshot](https://github.com/jabedalimollah/aliet/blob/main/Screenshot/Screenshot%202024-11-27%20104303.png?raw=true)
![App Screenshot](https://github.com/jabedalimollah/aliet/blob/main/Screenshot/Screenshot%202024-11-27%20104433.png?raw=true)
![App Screenshot](https://github.com/jabedalimollah/aliet/blob/main/Screenshot/Screenshot%202024-11-27%20104448.png?raw=true)
## π Features
### User Authentication & Profile Management
- #### User Account:
- Create a new account.
- Update profile information, including profile photo and personal details.
- Change account password.
- Delete account permanently.
- Secure login and logout functionality.
### Social Features
- #### Posting:
- Create posts with text and/or media.
- Delete existing posts.
- Bookmark posts for later or save them to your device.
- #### Engagement:
- Like posts and view the total likes.
- Comment on posts and participate in discussions.
### Interaction
- #### User Search:
- Search for other users by name or username.
- #### Profile Viewing:
- View other usersβ profiles, including their posts and activity.
- #### Follow System:
Follow and unfollow other users to stay updated on their activities.
### Messaging
- #### Real-Time Chat:
- Send and receive messages with other users in real time.## π οΈ Technologies Used
**Client:** React, Redux, TailwindCSS, Axios
**Server:** Node, Express
**Database:** MongoDB
**Real-time Communication:** Socket.IO
**AI Integration:** API integration with AI model
**Other Tools:** JWT for secure authentication,
Cloudinary (optional) for media storage## π₯οΈ Installation
### Prerequisites
- Node.js and npm installed on your machine.
- MongoDB installed and running locally or have access to a MongoDB Atlas cluster.### Clone the Repository
```bash
git clone https://github.com/jabedalimollah/aliet.git
cd aliet```
### Backend Setup
- Navigate to the backend directory:```bash
cd backend```
- Install the required dependencies:
```bash
npm install```
- Create a .env file in the backend directory and add your environment variables:
```bash
PORT=
CORS_ORIGIN=
CORS_ORIGIN_LOCAL=
CORS_ORIGIN_CLIENT=
MONGODB_URI=
DB_NAME=
JWT_SECRET_KEY=
CLOUDINARY_CLOUD_NAME=
CLOUDINARY_API_KEY=
CLOUDINARY_API_SECRET=
```
- Start the backend server
```bash
npm run dev
```### Frontend Setup
- Navigate to the frontend directory:```bash
cd frontend
```
- Install the required dependencies:```bash
npm install
```
- Create a .env file in the frontend directory and add your environment variables:
```bash
VITE_APP_API_KEY=
VITE_APP_URI=
```
- Start the frontend development server:
```bash
npm run dev
```### Running the Application
- Ensure both the frontend and backend servers are running.
- Open your browser and navigate to http://localhost:5173.
## Environment VariablesTo run this project, you will need to add the following environment variables to your .env file
### Frontend`VITE_APP_URI`
`VITE_APP_API_KEY`
### Backend
`PORT`
`MONGODB_URI`
`DB_NAME`
`JWT_SECRET_KEY`
`CORS_ORIGIN`
`CORS_ORIGIN_LOCAL`
`CORS_ORIGIN_CLIENT`
`CLOUDINARY_CLOUD_NAME`
`CLOUDINARY_API_KEY`
`CLOUDINARY_API_SECRET`
## π§ Contact
- Email: [email protected]
- LinkedIn: [Jabed Ali Mollah](https://www.linkedin.com/in/jabedalimollah)
- GitHub: [Jabed Ali Mollah](https://github.com/jabedalimollah)#
If you find this project useful, don't forget to star the repository! β
#
## π Links
[![portfolio](https://img.shields.io/badge/my_portfolio-000?style=for-the-badge&logo=ko-fi&logoColor=white)](https://jabedalimollah.netlify.app/)[![linkedin](https://img.shields.io/badge/linkedin-0A66C2?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/jabedalimollah/)
[![twitter](https://img.shields.io/badge/twitter-1DA1F2?style=for-the-badge&logo=twitter&logoColor=white)](https://x.com/JabedAliMollah7)