A simple React Vite app with a Node backend to help us vote for movie night suggestions. Self hosted in Oracle cloud through Nginx.
Users ids are generated into cookies. Why? I don't want to hassle with a proper account / user management, but still wanted to monitor who can delete what posts and how likes and dislikes are calculated. Random generated ID in cookies is good enough for that!
Main view:
Add Movie:
Copy the .env-example file and rename it to .env. Fill in values:
- API_PORT: The port the API will be opened to.
- API_ROOT: Don't touch if you don't know what you are doing.
- API_URL: The URL where the API is hosted in.
- VITE_API_URL: Frontend connects to this. No need to touch.
- VITE_POSTER_URL: A backup poster image URL that is used, if no URL is provided when adding a movie.
In a monorepo setup where frontend and backend are ran in the same environment, only the API_PORT needs to be changed.
- CD to frontend
cd ./frontend- Install NPM packages
npm install- Build files
npm run build- Copy files
Copy the static files from the /dist folder to /var/www/your-folder (or where ever they need to be in your setup)
- Remember to reference the correct folder in your webserver setup
- CD to backend
cd ./backend- Install NPM packages
npm install- Build files
npm run build- Run with PM2
pm2 start dist/main.js --name movies-api- Test it out
If the backend is not connecting correctly you can check the status of containers and logs with:
pm2 list
pm2 logs