IT2810-H26 · wilhelsr · Sep 18, 2026 · Sep 14, 2026 · Sep 14, 2026 · Sep 14, 2026
@@ -0,0 +1,25 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+node_modules/
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
@@ -1,7 +1,36 @@
 # T15-Project-1
 
+[The website should now be available](http://it2810-15.idi.ntnu.no/project1/)
+
 Repository for team IT2810-H26-T15 in IT2810-H26.
 
+An F1 driver overview with search, team filtering, sorting, favorites and driver details.
+
+## Run locally
+
+```bash
+npm install
+npm run dev
+```
+
+## Technical choices
+
+- **React and TypeScript:** separate components for cards, details and filters, with typed props to catch mistakes during development.
+- **Vite:** provides the development server and production build.
+- **OpenF1 and TanStack Query:** a shared API module handles fetching and HTTP errors; TanStack Query handles query caching and loading/error states. Standings use the latest completed race in 2026.
+- **Browser storage:** `localStorage` keeps favorites between visits, while `sessionStorage` keeps search, team and sorting choices within the tab session.
+- **Vitest and Testing Library:** test component behavior through props and user actions. Mock data makes tests independent of OpenF1.
+
+## Testing
+
+Run `npm run test:run` for the Vitest tests, or `npm test` for watch mode.
+
+Tests cover component props, search, favorite state, saved favorites, filter and navigation callbacks, and loading/error messages. `DriverCard` also has a DOM snapshot test.
+
+The API is mocked with fixed data, so tests do not fetch live data.
+
+The website has also been manually tested for both desktop and mobile view.
+
 ## Working in this repository
 
 `main` is protected — you cannot push to it directly. Work on a branch and
@@ -21,4 +50,24 @@ Before a pull request can be merged:
    or explain why not, then click *Resolve conversation*.
 3. **Pushing new commits dismisses the approval**, so if you change something
    after being approved, ask for another review. This is deliberate: what was
-   approved is what gets merged.
+   approved is what gets merged.
+
+
+## Building / Copying over to the VM
+
+To build on your own pc and then copy the files over to the VM.
+Replace NTNU-USERNAME with your NTNU username, and use your NTNU password when promted.
+
+   ```bash
+   npm run build
+   scp -r dist/ NTNU-USERNAME@it2810-15.idi.ntnu.no:/tmp
+   ssh NTNU-USERNAME@it2810-15.idi.ntnu.no
+   sudo cp -r /tmp/dist/* /var/www/html/project1
+   ```
+
+## Use of Artificial Intelligence
+
+The group used AI to support areas where we had less experience, particularly setting up and writing tests and using TanStack Query. We also used AI as a discussion partner during development to explore solutions, understand concepts, and help debug code.
+AI helped us understand unfamiliar tools and debug code, but some suggestions needed simplifying and careful review.
+
+The car animation in the header is made with a lot of help from AI.
@@ -0,0 +1,22 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+import { defineConfig, globalIgnores } from 'eslint/config'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      js.configs.recommended,
+      tseslint.configs.recommended,
+      reactHooks.configs.flat.recommended,
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      globals: globals.browser,
+    },
+  },
+])
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>t15-project-1</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>