Acebook is a Facebook clone project, showcasing use of the MERN stack, Socket.io and Tailwind, created at Makers Academy.
This version is a WIP personal extension of Acebook Team Griffins with a focus on demonstrating modern UI principles and FE methods.
It adds real-time messaging and notifications through the use of websockets, as well as modern component design through Tailwind CSS.
Users can sign up, log in, create posts with images and/or text, interact with posts, add friends, send messages, and receive real-time notifications. All UI designs are responsive and aim to follow Facebook's early 2024 UI 1-to-1.
- Install Node Version Manager (nvm)
Then follow the instructions to update your
brew install nvm
~/.bash_profile
. - Open a new terminal
- Install the latest version of Node.js, currently
18.1.0
.nvm install 18
- Install MongoDB
Note: If you see a message that says
brew tap mongodb/brew brew install mongodb-community@5.0
If you need to have mongodb-community@5.0 first in your PATH, run:
, follow the instruction. Restart your terminal after this. - Start MongoDB
brew services start mongodb-community@5.0
-
npm install in the three main folders:
; cd api ; npm install ; cd ../frontend ; npm install ; cd ../socket ; npm install
-
Add Cloudinary account API credentials
This project uses Cloudinary for media storage.
Add a .env
file to your root folder and add the following variables (replacing the values with your Cloudinary account API credentials)
; CLOUDINARY_CLOUD_NAME=your_cloud_name
; CLOUDINARY_API_KEY=your_api_key
; CLOUDINARY_API_SECRET=your_api_secret
-
Start the server application (in the
api
directory); cd api ; JWT_SECRET=f6d278bb34e1d0e146a80b16ec254c05 npm start
-
Start the front end application (in the
frontend
directory)
In a new terminal session...
; cd frontend
; npm start
You should now be able to open your browser and go to http://localhost:3000/
-
Start the socket (in the
socket
directory)In a new terminal session...
; cd socket
; npm start