Project 1 - Frontend Management System for ITS

Getting Started

To get started with your own development, you will need the following prerequisites:

1. A Vercel account
2. Basic knowledge of Git and NPM

Part 1: Set up a Vercel environment

Please note that you are free to use your own preferred deployment and storage services. For the purpose of this project, we have chosen to use Vercel and its storage services (Vercel Postgres, Vercel Blob) for ease of deployment.

1. Fork this repository using these steps
2. Import the forked repository to Vercel using these steps
3. Add the following environment variable during the import process

# Key: AUTH_SECRET
# Value:
openssl rand -base64 32

4. Follow the steps in this guide to create and connect Vercel Postgres to your project (similar steps for Vercel Blob)

Part 2: Set up a local environment

5. Clone the forked repository into your local drive
6. Open up your command line and navigate to the project directory
7. Create a local environment variable file .env.local with the following key-value retrieved from Vercel.com > Your project > Settings > Environment Variables

POSTGRES_URL=""
POSTGRES_PRISMA_URL=""
POSTGRES_URL_NO_SSL=""
POSTGRES_URL_NON_POOLING=""
POSTGRES_USER=""
POSTGRES_HOST=""
POSTGRES_PASSWORD=""
POSTGRES_DATABASE=""
BLOB_READ_WRITE_TOKEN=""
AUTH_SECRET=""

Alternatively, you may use the Vercel CLI and directly pull the environment variables from the deployed project (requires additional set up)

vercel env pull

9. Install the project dependencies and generate Prisma client

npm install

Part 3: Initialise the database

At this point, you should have correctly configured the deployed project on Vercel and the local project environment

10. Push the database schema and seed the database with some initial values

npx prisma db push
npx prisma db seed

11. Finally you can view the deployed project or run a local development

npm run dev
# Open http://localhost:3000 with your browser