https://github.com/hellstromsamuel/budsjettet-web
https://github.com/hellstromsamuel/budsjettet-web
Last synced: 1 day ago
JSON representation
- Host: GitHub
- URL: https://github.com/hellstromsamuel/budsjettet-web
- Owner: hellstromsamuel
- Created: 2026-06-15T07:16:15.000Z (5 days ago)
- Default Branch: main
- Last Pushed: 2026-06-15T16:58:58.000Z (4 days ago)
- Last Synced: 2026-06-15T18:23:11.357Z (4 days ago)
- Language: TypeScript
- Size: 95.7 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Budsjettet
A personal budgeting web app built with React, TypeScript, and Vite.
## Stack
- **React 19** + **TypeScript** + **Vite**
- **TailwindCSS v4** with a custom OKLCH color theme
- **shadcn/ui** component library
- **TanStack Router** — file-based routing (routes live in `src/routes/`)
- **TanStack Query** — server state and data fetching
- **Supabase** — database and auth backend
- **Zustand** — client-side state management
## Getting started
```bash
npm install
npm run dev
```
Copy `.env.example` to `.env.local` and fill in your Supabase credentials:
```
VITE_SUPABASE_URL=https://.supabase.co
VITE_SUPABASE_PUBLISHABLE_KEY=sb_publishable_...
```
## Routing
Routes are file-based via `@tanstack/router-plugin`. Add a file under `src/routes/` and it's automatically picked up — `routeTree.gen.ts` is auto-generated on `npm run dev` or `npm run build`.
| File | Route |
|------|-------|
| `src/routes/__root.tsx` | Root layout |
| `src/routes/index.tsx` | `/` |
## Supabase
The client is initialised in `src/lib/supabase.ts` and exported as `supabase`. Import it wherever you need database or auth access:
```ts
import { supabase } from '@/lib/supabase'
```
## Auth
Authentication uses Supabase with Google OAuth. The user clicks "Logg inn med Google", gets redirected to Google's consent screen, and is sent back to the app with an active session. Session state is reactive — components re-render automatically on sign-in and sign-out.