GenerateNU · Tomahawk2191 · Aug 25, 2026 · Aug 25, 2026 · Aug 25, 2026 · Aug 25, 2026
diff --git a/bun.lock b/bun.lock
diff --git a/index.html b/index.html
@@ -0,0 +1,28 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" />
+    <meta name="description" content="Join a community that shares the same goal: turning ideas into reality" />
+    <link rel="icon" href="/images/LandingPageImages/generate_logo.png" />
+    <link rel="stylesheet" type="text/css" href="/css/style.css" />
+    <link rel="stylesheet" type="text/css" href="/css/applyPage.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
+      integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
+      crossorigin="anonymous"
+    />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Outfit&display=swap" rel="stylesheet" />
+    <link href="https://fonts.googleapis.com/css2?family=Space+Mono&display=swap" rel="stylesheet" />
+    <title>Generate, Northeastern's Product Development Studio</title>
+  </head>
+
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <script type="module" src="/src/index.jsx"></script>
+  </body>
+</html>
diff --git a/package.json b/package.json
@@ -2,11 +2,12 @@
   "name": "frontend",
   "version": "0.1.0",
   "private": true,
+  "type": "module",
   "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test --passWithNoTests",
-    "eject": "react-scripts eject",
+    "start": "vite",
+    "build": "vite build",
+    "serve": "vite preview",
+    "test": "vitest",
     "knip": "knip",
     "knip:fix": "knip --fix",
     "lint": "oxlint",
@@ -22,34 +23,25 @@
     "react": "^19.2.8",
     "react-bootstrap": "^2.10.10",
     "react-dom": "^19.2.8",
-    "react-router-dom": "^7.18.2",
-    "react-scripts": "^5.0.1"
+    "react-router-dom": "^7.18.2"
   },
   "devDependencies": {
     "@oxlint/plugins": "1.79.0",
     "@types/node": "^26.2.0",
+    "@vitejs/plugin-react": "^6.1.1",
     "eslint-plugin-react-you-might-not-need-an-effect": "^1.0.2",
     "husky": "^9.1.7",
     "knip": "^6.32.2",
     "lint-staged": "^17.3.0",
     "oxfmt": "^0.64.0",
     "oxlint": "^1.79.0",
     "oxlint-tsgolint": "^7.0.2001",
-    "typescript": "^7.0.2"
+    "typescript": "^7.0.2",
+    "vite": "^8.2.2",
+    "vite-plugin-svgr": "^5.2.0",
+    "vitest": "^4.1.11"
   },
   "lint-staged": {
     "*": "oxfmt --no-error-on-unmatched-pattern"
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
   }
 }
diff --git a/public/index.html b/public/index.html
diff --git a/sanity/schemas/index.js → sanity/schemas/index.jsx b/sanity/schemas/index.js → sanity/schemas/index.jsx
diff --git a/src/App.js → src/App.jsx b/src/App.js → src/App.jsx
diff --git a/src/assets/images/applypage-v2/RightArrow.js → ...assets/images/applypage-v2/RightArrow.jsx b/src/assets/images/applypage-v2/RightArrow.js → ...assets/images/applypage-v2/RightArrow.jsx
diff --git a/...es/landingpage-v3/DynamicArcadeMachine.js → ...s/landingpage-v3/DynamicArcadeMachine.jsx b/...es/landingpage-v3/DynamicArcadeMachine.js → ...s/landingpage-v3/DynamicArcadeMachine.jsx
diff --git a/...mages/landingpage-v3/DynamicArcadeText.js → ...ages/landingpage-v3/DynamicArcadeText.jsx b/...mages/landingpage-v3/DynamicArcadeText.js → ...ages/landingpage-v3/DynamicArcadeText.jsx
diff --git a/src/client.js b/src/client.js
@@ -2,9 +2,9 @@ import { createClient } from '@sanity/client'
 import imageUrlBuilder from '@sanity/image-url'
 
 export const client = createClient({
-  projectId: process.env.REACT_APP_SANITY_PROJECT_ID,
-  dataset: process.env.REACT_APP_SANITY_DATASET,
-  token: process.env.REACT_APP_SANITY_API_TOKEN,
+  projectId: import.meta.env.VITE_SANITY_PROJECT_ID,
+  dataset: import.meta.env.VITE_SANITY_DATASET,
+  token: import.meta.env.VITE_SANITY_API_TOKEN,
   apiVersion: '2022-03-07',
   useCdn: true
 })

diff --git a/...omponent/Footer/HorizontalFooter/index.js → ...mponent/Footer/HorizontalFooter/index.jsx b/...omponent/Footer/HorizontalFooter/index.js → ...mponent/Footer/HorizontalFooter/index.jsx
diff --git a/src/component/Footer/VerticalFooter/index.js → ...component/Footer/VerticalFooter/index.jsx b/src/component/Footer/VerticalFooter/index.js → ...component/Footer/VerticalFooter/index.jsx
diff --git a/src/component/Footer/index.js → src/component/Footer/index.jsx b/src/component/Footer/index.js → src/component/Footer/index.jsx
diff --git a/src/component/NavBar/index.js → src/component/NavBar/index.jsx b/src/component/NavBar/index.js → src/component/NavBar/index.jsx
diff --git a/src/component/SocialIcon.jsx b/src/component/SocialIcon.jsx
@@ -1,11 +1,11 @@
 import { Col } from 'react-bootstrap'
-import { ReactComponent as InstaIcon } from '../assets/images/socialMediaIcons/Insta.svg'
-import { ReactComponent as LinkedInIcon } from '../assets/images/socialMediaIcons/Linkedin.svg'
-import { ReactComponent as FbIcon } from '../assets/images/socialMediaIcons/Facebook.svg'
-import { ReactComponent as YoutubeIcon } from '../assets/images/socialMediaIcons/Youtube.svg'
-import { ReactComponent as MosaicIcon } from '../assets/images/socialMediaIcons/Mosaic.svg'
-import { ReactComponent as NortheasternIcon } from '../assets/images/socialMediaIcons/Northeaster.svg'
-import { ReactComponent as Sherm } from '../assets/images/socialMediaIcons/Sherm.svg'
+import InstaIcon from '../assets/images/socialMediaIcons/Insta.svg?react'
+import LinkedInIcon from '../assets/images/socialMediaIcons/Linkedin.svg?react'
+import FbIcon from '../assets/images/socialMediaIcons/Facebook.svg?react'
+import YoutubeIcon from '../assets/images/socialMediaIcons/Youtube.svg?react'
+import MosaicIcon from '../assets/images/socialMediaIcons/Mosaic.svg?react'
+import NortheasternIcon from '../assets/images/socialMediaIcons/Northeaster.svg?react'
+import Sherm from '../assets/images/socialMediaIcons/Sherm.svg?react'
 
 export const socialIcons = [
   [

diff --git a/src/index.js → src/index.jsx b/src/index.js → src/index.jsx
diff --git a/src/pages/ApplyPageV2/RoleCategory/index.js → src/pages/ApplyPageV2/RoleCategory/index.jsx b/src/pages/ApplyPageV2/RoleCategory/index.js → src/pages/ApplyPageV2/RoleCategory/index.jsx
diff --git a/src/pages/ApplyPageV2/Tag/index.js → src/pages/ApplyPageV2/Tag/index.jsx b/src/pages/ApplyPageV2/Tag/index.js → src/pages/ApplyPageV2/Tag/index.jsx
diff --git a/.../ApplyPageV2/TeamApplicationCard/index.js → ...ApplyPageV2/TeamApplicationCard/index.jsx b/.../ApplyPageV2/TeamApplicationCard/index.js → ...ApplyPageV2/TeamApplicationCard/index.jsx
@@ -1,9 +1,9 @@
 import React, { useState } from 'react'
-import RoleCategory from '../RoleCategory'
-import Tag from '../Tag'
-import { ReactComponent as WhiteDownArrow } from '../../../assets/images/applypage-v2/WhiteDownArrow.svg'
-import { ReactComponent as WhiteUpArrow } from '../../../assets/images/applypage-v2/WhiteUpArrow.svg'
-import RightArrow from '../../../assets/images/applypage-v2/RightArrow.js'
+import RoleCategory from '../RoleCategory/index.jsx'
+import Tag from '../Tag/index.jsx'
+import WhiteDownArrow from '../../../assets/images/applypage-v2/WhiteDownArrow.svg?react'
+import WhiteUpArrow from '../../../assets/images/applypage-v2/WhiteUpArrow.svg?react'
+import RightArrow from '../../../assets/images/applypage-v2/RightArrow.jsx'
 import './style.css'
 
 export default function TeamApplicationCard({ team }) {

diff --git a/src/pages/ApplyPageV2/index.js → src/pages/ApplyPageV2/index.jsx b/src/pages/ApplyPageV2/index.js → src/pages/ApplyPageV2/index.jsx
diff --git a/...s/LandingPageV3/CelebrateOurWins/index.js → .../LandingPageV3/CelebrateOurWins/index.jsx b/...s/LandingPageV3/CelebrateOurWins/index.js → .../LandingPageV3/CelebrateOurWins/index.jsx
@@ -1,11 +1,11 @@
 import React, { useState, useEffect } from 'react'
 import celebrate from '../../../assets/images/aboutpage/spirited.jpg'
-import { ReactComponent as LeftArrow } from '../../../assets/images/landingpage-v3/LeftTriangleArrow.svg'
-import { ReactComponent as RightArrow } from '../../../assets/images/landingpage-v3/RightTriangleArrow.svg'
-import { ReactComponent as LargeStars } from '../../../assets/images/landingpage-v3/LargeShowcaseStars.svg'
-import { ReactComponent as SmallStars } from '../../../assets/images/landingpage-v3/SmallShowcaseStars.svg'
-import { ReactComponent as PrevArrow } from '../../../assets/icons/arrows/prevArrowLeft.svg'
-import { ReactComponent as NextArrow } from '../../../assets/icons/arrows/nextArrowRight.svg'
+import LeftArrow from '../../../assets/images/landingpage-v3/LeftTriangleArrow.svg?react'
+import RightArrow from '../../../assets/images/landingpage-v3/RightTriangleArrow.svg?react'
+import LargeStars from '../../../assets/images/landingpage-v3/LargeShowcaseStars.svg?react'
+import SmallStars from '../../../assets/images/landingpage-v3/SmallShowcaseStars.svg?react'
+import PrevArrow from '../../../assets/icons/arrows/prevArrowLeft.svg?react'
+import NextArrow from '../../../assets/icons/arrows/nextArrowRight.svg?react'
 import { useSanity } from '../../../services/useSanity'
 import { urlFor } from '../../../client'
 

diff --git a/...andingPageV3/ChooseYourCharacter/index.js → ...ndingPageV3/ChooseYourCharacter/index.jsx b/...andingPageV3/ChooseYourCharacter/index.js → ...ndingPageV3/ChooseYourCharacter/index.jsx
@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from 'react'
-import ArcadeText from '../../../assets/images/landingpage-v3/DynamicArcadeText.js'
-import ArcadeMachine from '../../../assets/images/landingpage-v3/DynamicArcadeMachine.js'
-import { urlFor } from '../../../client'
-import { useSanity } from '../../../services/useSanity'
+import ArcadeText from '../../../assets/images/landingpage-v3/DynamicArcadeText.jsx'
+import ArcadeMachine from '../../../assets/images/landingpage-v3/DynamicArcadeMachine.jsx'
+import { urlFor } from '../../../client.js'
+import { useSanity } from '../../../services/useSanity.js'
 import Mascot from './Mascot.jsx'
 
 const MascotRadioButton = ({

diff --git a/...ages/LandingPageV3/Footer/MobileFooter.js → ...ges/LandingPageV3/Footer/MobileFooter.jsx b/...ages/LandingPageV3/Footer/MobileFooter.js → ...ges/LandingPageV3/Footer/MobileFooter.jsx
@@ -3,9 +3,9 @@ import { FooterLink } from '.'
 import { useNavigate } from 'react-router-dom'
 import { pages } from '.'
 import ShadowedButton from '../../../component/ShadowedButton'
-import { ReactComponent as Instagram } from '../../../assets/icons/socials/Instagram.svg'
-import { ReactComponent as Email } from '../../../assets/icons/socials/Email.svg'
-import { ReactComponent as LinkedIn } from '../../../assets/icons/socials/LinkedIn.svg'
+import Instagram from '../../../assets/icons/socials/Instagram.svg?react'
+import Email from '../../../assets/icons/socials/Email.svg?react'
+import LinkedIn from '../../../assets/icons/socials/LinkedIn.svg?react'
 import UpArrowMobile from '../../../assets/icons/arrows/upArrowMobile.svg'
 
 function MobileFooter() {

diff --git a/src/pages/LandingPageV3/Footer/WebFooter.js → src/pages/LandingPageV3/Footer/WebFooter.jsx b/src/pages/LandingPageV3/Footer/WebFooter.js → src/pages/LandingPageV3/Footer/WebFooter.jsx
@@ -3,9 +3,9 @@ import GenerateLogo from '../../../assets/images/landingpage-v2/footerlogo.svg'
 import { FooterLink } from '.'
 import { pages } from '.'
 import ShadowedButton from '../../../component/ShadowedButton'
-import { ReactComponent as Instagram } from '../../../assets/icons/socials/Instagram.svg'
-import { ReactComponent as Email } from '../../../assets/icons/socials/Email.svg'
-import { ReactComponent as LinkedIn } from '../../../assets/icons/socials/LinkedIn.svg'
+import Instagram from '../../../assets/icons/socials/Instagram.svg?react'
+import Email from '../../../assets/icons/socials/Email.svg?react'
+import LinkedIn from '../../../assets/icons/socials/LinkedIn.svg?react'
 import UpArrow from '../../../assets/icons/arrows/upArrow.svg'
 
 function WebFooter() {

diff --git a/src/pages/LandingPageV3/Footer/index.js → src/pages/LandingPageV3/Footer/index.jsx b/src/pages/LandingPageV3/Footer/index.js → src/pages/LandingPageV3/Footer/index.jsx
diff --git a/.../LandingPageV3/HowWereStructured/index.js → ...LandingPageV3/HowWereStructured/index.jsx b/.../LandingPageV3/HowWereStructured/index.js → ...LandingPageV3/HowWereStructured/index.jsx
diff --git a/src/pages/LandingPageV3/Navigation/index.js → src/pages/LandingPageV3/Navigation/index.jsx b/src/pages/LandingPageV3/Navigation/index.js → src/pages/LandingPageV3/Navigation/index.jsx
@@ -1,8 +1,8 @@
-import { ReactComponent as GenerateLogo } from '../../../assets/images/landingpage-v3/GenerateLogo.svg'
-import { ReactComponent as DownArrow } from '../../../assets/images/landingpage-v3/DownArrow.svg'
-import { ReactComponent as Instagram } from '../../../assets/icons/socials/Instagram.svg'
-import { ReactComponent as Email } from '../../../assets/icons/socials/Email.svg'
-import { ReactComponent as LinkedIn } from '../../../assets/icons/socials/LinkedIn.svg'
+import GenerateLogo from '../../../assets/images/landingpage-v3/GenerateLogo.svg?react'
+import DownArrow from '../../../assets/images/landingpage-v3/DownArrow.svg?react'
+import Instagram from '../../../assets/icons/socials/Instagram.svg?react'
+import Email from '../../../assets/icons/socials/Email.svg?react'
+import LinkedIn from '../../../assets/icons/socials/LinkedIn.svg?react'
 
 export default function Navigation({ scrollToWhatIsGenerate }) {
   const icons = [

diff --git a/src/pages/LandingPageV3/ParentOrgs/index.js → src/pages/LandingPageV3/ParentOrgs/index.jsx b/src/pages/LandingPageV3/ParentOrgs/index.js → src/pages/LandingPageV3/ParentOrgs/index.jsx
@@ -1,5 +1,5 @@
-import { ReactComponent as ShermLogo } from '../../../assets/images/landingpage-v3/ShermanLogo.svg'
-import { ReactComponent as MosaicLogo } from '../../../assets/images/landingpage-v3/MosaicLogo.svg'
+import ShermLogo from '../../../assets/images/landingpage-v3/ShermanLogo.svg?react'
+import MosaicLogo from '../../../assets/images/landingpage-v3/MosaicLogo.svg?react'
 
 export default function ParentOrgs() {
   return (

diff --git a/src/pages/LandingPageV3/Sponsors/index.js → src/pages/LandingPageV3/Sponsors/index.jsx b/src/pages/LandingPageV3/Sponsors/index.js → src/pages/LandingPageV3/Sponsors/index.jsx
diff --git a/src/pages/LandingPageV3/WeAre/index.js → src/pages/LandingPageV3/WeAre/index.jsx b/src/pages/LandingPageV3/WeAre/index.js → src/pages/LandingPageV3/WeAre/index.jsx
diff --git a/...ges/LandingPageV3/WhatIsGenerate/index.js → ...es/LandingPageV3/WhatIsGenerate/index.jsx b/...ges/LandingPageV3/WhatIsGenerate/index.js → ...es/LandingPageV3/WhatIsGenerate/index.jsx
diff --git a/src/pages/LandingPageV3/WhyGenerate/index.js → ...pages/LandingPageV3/WhyGenerate/index.jsx b/src/pages/LandingPageV3/WhyGenerate/index.js → ...pages/LandingPageV3/WhyGenerate/index.jsx
diff --git a/src/pages/LandingPageV3/index.js → src/pages/LandingPageV3/index.jsx b/src/pages/LandingPageV3/index.js → src/pages/LandingPageV3/index.jsx
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
@@ -0,0 +1,7 @@
+type ImportMetaEnv = {
+  readonly VITE_APP_API_URI: string;
+  readonly VITE_SANITY_PROJECT_ID: string;
+  readonly VITE_SANITY_DATASET: string;
+  readonly VITE_SANITY_API_TOKEN?: string;
+};
+type ImportMeta = { readonly env: ImportMetaEnv };
diff --git a/tsconfig.json b/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "jsx": "react-jsx",
+    "strict": true,
+    "noEmit": true,
+    "allowJs": true,
+    "checkJs": false,
+    "skipLibCheck": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "types": ["vite/client", "vite-plugin-svgr/client"]
+  },
+  "include": ["src", "vite.config.ts", "oxlint.config.ts"]
+}
diff --git a/vite.config.ts b/vite.config.ts
@@ -0,0 +1,12 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import svgr from 'vite-plugin-svgr';
+
+export default defineConfig(() => {
+  return {
+    build: {
+      outDir: 'build',
+    },
+    plugins: [react(), svgr()],
+  };
+});