Skip to content

Latest commit

 

History

History
70 lines (56 loc) · 2.71 KB

DevSetup.md

File metadata and controls

70 lines (56 loc) · 2.71 KB

OHack Development Environment Setup

Opportunity Hack site uses NextJS which makes most things pretty easy. This page provides a couple of things you will still need to do to get you development environment up and running.

Developers can set up their environments on their local computers or use Codespaces. We recomend that develoers use VSCode if they choose to develop on their local computers.

Fork the OHACK repository.

You will need to fork either the frontend-ohack.dev reository and/or backend-ohack.dev repository or both.

  • All pull requests (PR) must be done from your fork.
  • All code should be pushed to your private fork. Create a PR by merging from your fork.

IDE Setup

As stated, developers can use either a local (on you local PC) or Codespaces. There are pros and cons to both.

Setup Pros Cons
Codespaces All NodeJS is set up.
Your VSCode IDE is set up.
Code is remote.
You must be online.
Local All your code is local. You need to set all NodeJS tools.
You need to set up your IDE.

Codespaces Setup

  • In you browser, go to YOUR fork.
  • Click on the GREEN code button -> Codespaces tab -> Codespaces "Your workspaces in the cloud" plus link.

  • Your Codespaces automatically set up in you browser. You will have a VSCode IDE.

Local PC Setup

  • If you have not done so, install NodeJS. Follow the instructions from the NodeJS page.

  • As of 2024, we're using Node v20

  • If you have not done so, install VSCode.

  • Create you local clone on your PC using the following command:

git clone [email protected]:<your_fork>/frontend-ohack.dev.git

Remaining tasks

  • Change directory to your local clone on your PC.

  • Create and new file in you clone root directory using your IDE called .env.

  • Add the following lines to the new .env file.

  • See this OHack doc to get the values you should add to this .env file.

  • Install the application depended node modlules.

npm install
  • Start the applcation. Make sure your application is running on port 3000 to support PropelAuth's allowlist.
npm run dev
  • To force this to run on port 3000, you can use the following
PORT=3000 npm run dev

You have successfully set up your frontend development environment!

"May the force be with you!"