my-kitsu-clone

A web app I made for practice using NodeJS and ReactJS, my first ever project. Built using MERN stack.

screenshots :

tech used :

• ReactJS(front-end)
• Redux(front-end)
• NodeJS(back-end)
• ExpressJS(back-end)
• MongoDB
• SocketIO

features :

1. populate home page with animes by status
2. signup & signin
3. view animes in your library
4. filter animes in your library by watching status('Completed','Currently Watching',etc.)
5. add new anime to your library
6. create a reaction for any animes that are in your library (after posting will update every users via socketio)
7. upvote and un-upvote yours and other users reaction
8. view your followers/following list
9. follow other users (both you and the user you followed list of follower/following will be updated via socketio)
10. view others anime library + all reactions + followers/following list
11. view all animes available
12. view each specific anime
13. 404 page
14. add a new anime to the database (only user with the status 'admin', including image upload to server)
15. edit an anime ('admin' only)

install :

requirements :

• npm
• mongodb cluster

clone my repo :

git clone https://github.com/kaikaew13/my-kitsu-clone.git
cd my-kitsu-clone

inside my-kitsu-clone will have server and client directories.

cd into those directories and run npm i.

npm i

inside server directory create nodemon.json file and add these 2 environment variables in :

{
  "env": {
    "MONGO_URI": "<your mongodb connection string>",
    "PORT": "<your port number>"
  }
}

inside client directory create .env file and add :

REACT_APP_URL=http://localhost:<your port number>

note: make sure your server and client PORT are not the same

run the application :

run npm start from both server and client directories

npm start