• Introduction

• Environment Variables

• Host this yourself

  • Setting up the local environment

  • Setting up the production environment

• Discord bot integration

• TODO

1. Fork this repository at the top right of this page.

2. Clone to your computer

git clone https://github.com/<YOUR GITHUB USERNAME>/scuffedmdb

cd scuffedmdb

3. Rename .env.example, to .env.local and enter the local address: http://localhost:3000 n.b Do not include a / at the end of your domain

.env.local NEXT_PUBLIC_APP_URI=http://localhost:3000

4. Create an account on discord.com and go to the developer console.
5. Create a new application and copy and past Client ID and client secret into the respective fields in .env.local

CLIENT_SECRET=_H8z9NKhasaido_diddada4SgqjQj
CLIENT_ID=24534589043255834

(these aren't mine before you try -_-)

6. Go to the oauth tab of your new discord application and add your production and development callback urls to the redirect tab. For example mine are: http://localhost:3000/api/auth/callback/discord and https://smdb.mikeroph.one/api/auth/callback/discord - /api/auth/callback/discord
7. Return to your .env.local file and enter a random string into JWT_CODE which is kept secret (just to encrypt the user data in the cookie).

JWT_CODE=SlOQwlMMnwVY3ypfNLFOtlEauH5Ra2DE

and again

8. I recommend using cloud atlas to host your mongo database, but just create an account and a m.0 db, (Vercel does not allow you to set location on the free plan, and its normally in NA, I recommend setting the mongo server to NA as well, it is slightly snappier). Also ensure the the ip address in network access is set to 0.0.0.0, as this will allow any server to connect (also why you need to create a user with a strong password), this is because we dont know the IP of the vercel instance that our server will be booted up on. Next copy the connection uri and paste into the .env.local file and append the database name.

MONGODB_URI=<connection string>/local-movie-database

9. Go to https://tmdb.org and create an account, then go to the api settings under your profile and copy the v3 key and paste it into your .env.local file under MOVIE_API_KEY

MOVIE_API_KEY=<TMDB API KEY>

10. Run npm run dev in your terminal in the project directory.

11. Stonks! ... if you are having trouble feel free to submit an issue

Make sure you have a fork of the repository by clicking the fork button top right

1. Login to https://vercel.com/ with your github.

2. Go to the homepage and create new project, select 'ScuffedMDB' and click import.

3. All the default settings are as should be, just click deploy. (Be warned it wont work just yet, we still need to provide our environment variables!)

4. Once deployed, click the big 'Go to dashboard' button, follow the tabs at the top to 'settings', then click environment variables on the left hand menu. Here you can add all of the environment variables from your .env.local file, one at a time using the box at the top.

5. CLIENT_ID, CLIENT_SECRET, OWNER_ID, NEXTAUTH_URL, and MOVIE_API_KEY will be the same as your local environment.

6. MONGO_URI should use a production database that is not the same as your local environment so set the database to a different name.

MONGODB_URI=<connection string>/production-movie-database

7. NEXT_PUBLIC_APP_URI needs to be the domain of your project on vercel. You can set a custom domain as shown in vercels' docs, but you need to click on your project to see the default domain, normally something like https://scuffedmdb.vercel.com (refer to 6 of setting up local environment to add domain to discord callback if you havent already)

NEXT_PUBLIC_APP_URI=https://smdb.mikeroph.one

8. Create a HS512 compliant code using the following command:

npm install -g node-jose-tools

jose newkey -s 256 -t oct -a HS512

Copy the whole output and paste into the .env.local file under 'JWT_HS512'.

9. Finally generate a random string for the JWT_CODE env variable for production and enter into the Vercel settings panel.

10. Go back to the overview tab and click redeploy.

11. Thats it! your very own live movie rating website. The world is yours ... and everytime you push a change to your repo, it automatically redeploys (<3 vercel).