icssc · js0mmer · Jan 21, 2024 · Oct 31, 2023 · Nov 1, 2023 · Nov 1, 2023
diff --git a/README.md b/README.md
@@ -29,6 +29,7 @@ Features include:
 * MongoDB
 * GraphQL
 * TypeScript
+* Vite
 
 ## First time setup
 ### Committee Members
@@ -42,7 +43,7 @@ Features include:
     git checkout -b [branch name]
     ```
 
-3. Check your Node version with `node -v`. Make sure you have version 14 or above (18 recommended).
+3. Check your Node version with `node -v`. Make sure you have version 16 or above (18 or 20 LTS recommended).
 
 4. Open a terminal window and `cd` into the directory of your repo.
 
@@ -74,7 +75,7 @@ PUBLIC_API_URL=https://api.peterportal.org/rest/v0/
 PUBLIC_API_GRAPHQL_URL=https://api.peterportal.org/graphql/
 PORT=8080
 ```
-Note: the port should also match the one set up on the frontend's proxy to the backend under `site/src/setupProxy.js` By default this is 8080.
+Note: the port should also match the one set up on the frontend's proxy to the backend under `site/vite.config.ts` By default this is 8080.
 
 8. (Optional) Set up your own MongoDB and Google OAuth to be able to test features that require signing in such as leaving reviews or saving roadmaps to your account. Add additional variables/secrets to the .env file from the previous step.
 ```
@@ -88,7 +89,7 @@ ADMIN_EMAILS=["<your email>"]
 ## Running the project locally (after setup)
 1. Open two terminal windows and `cd` into the directory of your repo in each of them.
 
-2. In the first terminal window, enter the client directory with `cd site`. Then run the React development server using `npm start`. Ensure the server is running on port 3000 by default.
+2. In the first terminal window, enter the client directory with `cd site`. Then run the Vite development server using `npm run dev`. Ensure the server is running on port 3000 by default.
 
 3. In the second terminal window, enter the API directory with `cd api`. Then run the Express development server using `npm run dev`. Ensure the server is running on port 8080 by default.
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,15 +2,13 @@
   "name": "peterportal-root",
   "version": "0.1.0",
   "scripts": {
-    "postinstall": "npm install --prefix api && npm install --prefix site",
-    "heroku-postbuild": "cd api && npm run build && cd .. && cd site && npm run build && cp -r build ../api/",
-    "start": "npm start --prefix api"
+    "postinstall": "npm install --prefix api && npm install --prefix site"
   },
   "dependencies": {
     "dotenv-flow": "^3.2.0",
     "sst": "^2.5.8"
   },
   "engines": {
-    "node": "18.x.x"
+    "node": ">=18.x.x"
   }
 }
diff --git a/site/.eslintrc.cjs b/site/.eslintrc.cjs
@@ -0,0 +1,21 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react/recommended',
+    'plugin:react/jsx-runtime',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react', 'react-refresh'],
+  rules: {
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+    'react/no-unescaped-entities': 'off'
+  },
+}
diff --git a/site/README.md b/site/README.md
diff --git a/site/index.html b/site/index.html
@@ -0,0 +1,36 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta version="1.1.2">
+    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
+    <link rel="manifest" href="/site.webmanifest">
+    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+
+    <link href="https://fonts.googleapis.com/css2?family=Titillium+Web:wght@300;400;600;700&display=swap"
+      rel="stylesheet">
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.css" />
+    <link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet" />
+
+    <meta name="description" content="A web application for course discovery and planning at UCI, featuring an enhanced catalogue and a 4-year planner." />
+    <title>PeterPortal</title>
+    <!-- Global site tag (gtag.js) - Google Analytics -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id=G-R44HQTN9E1"></script>
+    <script>
+      window.dataLayer = window.dataLayer || [];
+      function gtag() { dataLayer.push(arguments); }
+      gtag('js', new Date());
+
+      gtag('config', 'G-R44HQTN9E1');
+    </script>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
+</html>