ReaList requires a whitelisting Spotify acccount. Please email Travis Nguyen ([email protected]) or ([email protected]) and provide him with the email associated to your Spotify account.
git clone https://github.com/tr-vs/realist
cd realist
Set up dependencies for the backend by running:
cd backend
npm install
Create an .env file in the backend directory with the contents as follows:
PORT=3000
MONGO_URI=mongodb+srv://travis:[email protected]/?retryWrites=true&w=majority&appName=AtlasApp
SECRET=eCYnhZr.u!_L6qXvLXU@u*YZWFXJNMLqx7@TP4iw
SPOTIFY_CLIENT_ID=a8a847ca5ed14e64b16219206363ee5a
SPOTIFY_CLIENT_SECRET=61793825b72d4c0bbf03bd316a672486
SPOTIFY_REDIRECT_URI=http://localhost:3000/api/spotify/call_back
PASSAGE_APP_ID=p3g1mBImLM5FUPBfnbeodby2
PASSAGE_API_KEY=7d8lLpm3Hf.3cf1DkjE3B3kocMbXmqwXdQYfUfE0jrWDbJtlKJ3aOOrOtVwecVoBPHMZ5LJh88y
FRONTEND=http://localhost:3001
SPOTIFY_ACCOUNT_ID=31vihtxadq4ycnc5ges7ha5tl36m
cd backend
npm start
Set up dependencies for the frontend by running:
cd frontend/rea-list
npm install
Create an .env file in the frontend\rea-list directory with the contents as follows:
REACT_APP_BACKEND=http://localhost:3000/
REACT_APP_FRONTEND=http://localhost:3001/
REACT_APP_PASSAGE_APP_ID=p3g1mBImLM5FUPBfnbeodby2
cd frontend/rea-list
npm start
Make sure that both backend and frontend processes are running together with the backend ran before the frontend. If they are, then you can access the page at https://localhost:3001 :D
Note: Passkeys biometrics do not work on localhost due to the requirement of TLS. To use biometric authentication, visit our site--https://realist.top
- Jasi Bermejo
- Mikey Choi
- Lance Giang
- Hyun Kim
- Brianna Tran
The MERN stack (MongoDB, Express.js, React.js, Node.js) was used in order to create this project.
-
Spotify for Developers: https://developer.spotify.com/.
-
Color Thief React. NPM Registry. Available from: https://www.npmjs.com/package/color-thief-react.
-
Material-UI. Material-UI: The core components for React. Available from: https://mui.com/material-ui/
-
1Password. Available from: https://passage.1password.com/
-
Net Ninja. MERN Stack Crash Course Tutorial. YouTube. Available from: https://youtube.com/playlist?list=PL4cUxeGkcC9iJ_KkrkBZWZRHVwnzLIoUE&feature=shared
-
BeReal. BeReal. Available from: https://bereal.com/en/.
-
Swiper. React - Swiper.js. Available from: https://swiperjs.com/react.