About Support SF Schools

Hello! Thanks for checking out Support SF Schools. We started this project in summer 2022 to solve a big problem in San Francisco. Schools need help. And people who live or work in SF want to support local schools, but they don’t know how. We are building a website to help solve that.

Tech Stack

Mapbox

You need to sign up for Mapbox to run the project locally.

1. Goto https://www.mapbox.com and sign up

2. It will ask you for billing information, but it is pay as you go. You have 500 instances before you are charged.

Prisma

We're using Prisma as our ORM. If you're unsure of what it is or what it does here is a link to the prisma documentation regarding how it works and why its used

Model changes

Prisma documentation on prototyping schema

• If you want to make changes to any model in prisma, the schema file within the prisma folder is where those changes will take place

• Once you have made the changes to a model you're going to run this command in your terminal

  • The CLI will ask if you want to continue knowing that you will lose data, because we are seeding data and there is no user changes being made to our data this is completely acceptable

     npx prisma db push

• This will execute the changes required to make the vercel postgres database schema reflect the state of our prisma schema

Seeding

• After running npx prisma db push we lose all the data so we need to seed our database with all the school information, run this command in your terminal after making changes to the model

  • it should be noted that if you're making changes to the model the seed script will also need to be updated to account for the new fields that were added

     npx prisma db seed

  
  

Environment File

Create an environment file to pass your default public token from Mapbox and connect Prisma to postgres

1. Create the local server env file in the main directory (with the README.md file):

   cp .env.example .env

2. Add your default public token to your .env

   NEXT_PUBLIC_MAPBOX_ACCESS_TOKEN=your_default_public_token

3. For the prisma configuration you're going to need the vercel postgres URLs. For security, please ask an existing developer for this information. Add both of these to your .env file. Alternatively, you can follow these instructions to set up a local Postgres instance in a Docker container.

   POSTGRES_PRISMA_URL=ask_a_dev
   POSTGRES_URL_NON_POOLING=ask_a_dev

Get Started

To run this project locally, please perform the following steps:

1. Clone the repository

   git clone https://github.com/sfbrigade/support-sfusd.git

2. Install dependencies at the root directory

   npm install

3. Run the development server

   npm run dev

4. Open http://localhost:3000 with your browser to see the result

   • Alternatively, you can open http://[LAN_IP]:3000 on another device, such as a phone on the same network. Replace LAN_IP with the IP address of your development server, which can be found inside of the "LAN url" part of the npm run dev log.

Further Notes to help you out

Visit our Notion for Engineers

Gotchas

For Tailwind CSS, do not use h-screen as it is broken on mobile Safari. Instead, use our custom class h-dvh-with-fallback until which time the official h-dvh alone suffices (fallbacks are not needed).