PeterPortal Getting Started (#8)

* docs: 📚️ add getting started mdx for peterportal

* docs: 📚️ use code blocks for commands

* Update syntax highlighting branch name

Co-authored-by: Jacob Sommer <[email protected]>

* docs(getting-started): 📚️ fix codeblock spacing

---------

Co-authored-by: Jacob Sommer <[email protected]>

pages/peterportal/getting-started.mdx

@@ -0,0 +1,91 @@
+import { Steps } from "nextra/components";
+
+# Getting Started
+
+This document will guide you through setting up the project on your local machine, from cloning the repository to running the project locally. Whether you're a committee member or an open-source contributor, you'll find all the necessary steps to get started below.
+
+## Setup
+
+<Steps>
+
+### Cloning the Repository
+
+#### For Committee Members
+
+1. Clone the repository using the following command:
+
+   ```bash
+   git clone https://github.com/icssc/peterportal-client
+   ```
+
+2. Navigate into the cloned repository:
+
+   ```bash
+   cd peterportal-client
+   ```
+
+#### For Open Source Contributors
+
+1. Fork the project on GitHub by clicking the fork button in the top right, above the "About" section.
+2. Clone your forked repository to your local machine using the following command (replace `your username` with your GitHub username):
+
+   ```bash
+   git clone https://github.com/yourusername/peterportal-client
+   ```
+
+3. Navigate into the cloned repository:
+
+   ```bash
+   cd peterportal-client
+   ```
+
+### Installing Dependencies
+
+1. Ensure you have Node.js version 18 or 20 LTS installed. If not, consider using nvm for version management.
+2. Install all node dependencies by running:
+
+   ```bash
+   npm install
+   ```
+
+### Setting up Environment Variables
+
+1. Inside the `api` directory, rename the `.env.example` file to `.env`
+2. Add additional variables as needed for features requiring authentication or database access.
+
+### Switching Branches
+
+Before starting your work, switch to a new branch with a relevant name to your task:
+
+```bash
+git checkout -b [branch-name]
+```
+
+</Steps>
+
+## Commands
+
+<Steps>
+
+### Development
+
+To facilitate the development process, follow these steps:
+
+1. Navigate to the project's root directory in your terminal.
+2. Run the development servers for both the backend and frontend:
+
+   ```bash
+   npm run dev
+   ```
+
+   This command starts the backend Express server and the frontend Vite dev server. Visit the link printed in the console by Vite to view the application.
+
+Alternatively, you can run the backend and frontend separately by navigating to their respective directories and running `npm run dev` in separate terminal windows.
+
+</Steps>
+
+Note: Some steps, such as setting up IAM credentials or accessing certain environment variables, might be restricted to internal contributors. If you're an external contributor, ensure you have the necessary permissions or discuss with a project lead.
+
+## Additional Information
+
+For more detailed instructions on contributing to the project, including how to pick issues and submit pull requests, please refer to the Open Source Contribution Guide section of the project repository.

pages/peterportal/index.md

@@ -1 +1,3 @@
 # PeterPortal
+
+A web application aimed to aid UCI students with course discovery and planning.