https://github.com/vektorprogrammet/homepage
Work in progress
https://github.com/vektorprogrammet/homepage
react react-router shadcn-ui tailwindcss typescript website
Last synced: 2 months ago
JSON representation
Work in progress
- Host: GitHub
- URL: https://github.com/vektorprogrammet/homepage
- Owner: vektorprogrammet
- Created: 2021-01-19T17:47:40.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2026-01-12T14:32:25.000Z (2 months ago)
- Last Synced: 2026-01-12T21:13:18.293Z (2 months ago)
- Topics: react, react-router, shadcn-ui, tailwindcss, typescript, website
- Language: TypeScript
- Homepage:
- Size: 6.64 MB
- Stars: 9
- Watchers: 1
- Forks: 0
- Open Issues: 33
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Vektor Homepage
Vektorprogrammets homepage website
## Required programs
- [node v22](https://nodejs.org/en)
- [pnpm v10](https://pnpm.io/)
## Scripts
### pnpm install
Install required dependencies:
```sh
pnpm install
```
### pnpm dev
Run the dev server:
```sh
pnpm run dev
```
### pnpm check
Check for linting and formatting errors:
```sh
pnpm check
```
Apply safe fixes:
```sh
pnpm check:fix
```
Apply unsafe fixes:
```sh
pnpm check:fix:unsafe
```
### pnpm lint
Check for linting errors:
```sh
pnpm lint
```
Apply safe fixes:
```sh
pnpm lint:fix
```
Apply unsafe fixes:
```sh
pnpm lint:fix:unsafe
```
### pnpm format
Check for formatting errors:
```sh
pnpm format
```
Apply fixes:
```sh
pnpm lint:fix
```
### Testing
Install required browsers for running e2e tests:
```sh
pnpm e2e:install
```
Run all tests:
```sh
pnpm e2e:test
```
Use the `ui` flag to watch the tests:
```sh
pnpm exec playwright test --ui
```
Run tests for individual browsers:
| Google Chrome | Firefox | Safari |
| --- | --- | --- |
|`pnpm e2e:test:chromium`|`pnpm e2e:test:firefox`|`pnpm e2e:test:webkit`|
Generate tests interactively:
```sh
pnpm e2e:test:generate
```
Read more in the [docs](https://playwright.dev/docs/codegen).
### Deployment
First, build your app for production:
```sh
pnpm run build
```
Then run the app in production mode:
```sh
pnpm start
```
Now you'll need to pick a host to deploy it to.
## File structure
- `dashboard/`: root folder with configuration files and subfolders
- `.github/`: GitHub config like CI/CD workflows and PR templates
- `.react-router/`: autogenerated types from React Router
- `.vscode/`: Local per user workspace settings for those using VSCode
- `build/`: Build artifacts for deploying the app to servers
- `public/`: Assets requiring no processing, clients download these files as is.
- `src/`: All source code for the web app
- `__tests__/`: End-to-end tests for full pages or user stories
- `components/`: Common components used in multiple pages. Encapsulates features into singular units.
- `ui`: Primitives acting as the foundational building blocks for composing larger features or sections, for example common layout components like headers, footers and sidebars, or features like a login modal. Most primitives originates from shadcn/ui and might be manually tweaked to our preferences.
- `hooks/`: Common React hooks reused in multiple pages
- `lib/`: Common code reused in multiple pages
- `routes/`: React Router route modules with filenames following the flat route config
- `index.css`: Style variables accessable throughout the whole app. Mainly configuration of Tailwind and CSS variables.
- `root.tsx`: Root HTML rendered for ALL pages. Contains global metadata, styles and providers.
- `routes.ts`: React Router configuration. Check out the [docs](https://reactrouter.com/start/framework/routing) for an in-depth explanation of the API.