https://github.com/ccssmnn/relaxed-spa
Develop & run your full stack spa without a build step using Deno, React & twind (TailwindCSS).
https://github.com/ccssmnn/relaxed-spa
deno react react-router spa tailwindcss trpc twind typescript
Last synced: about 1 year ago
JSON representation
Develop & run your full stack spa without a build step using Deno, React & twind (TailwindCSS).
- Host: GitHub
- URL: https://github.com/ccssmnn/relaxed-spa
- Owner: ccssmnn
- License: mit
- Created: 2023-01-07T17:30:02.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-02-06T19:43:06.000Z (over 3 years ago)
- Last Synced: 2025-04-04T03:46:39.674Z (about 1 year ago)
- Topics: deno, react, react-router, spa, tailwindcss, trpc, twind, typescript
- Language: TypeScript
- Homepage: https://relaxed-spa.deno.dev
- Size: 2.66 MB
- Stars: 11
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Relaxed SPA
Modern tooling and web standards are so good. You might not need a framework to
build a great SPA. Bring your own everything. Go anywhere.
This should demonstrate how drastically tools like Deno & esbuild can simplify
web development. Checkout the app at
[relaxed-spa.deno.dev](https://relaxed-spa.deno.dev)
The main utilities are the bundling setup and the live reloading.
To get started, clone the repo and run `deno task start`.
## Goals
- avoid a build step
- ready for Deno Deploy
- keep full control about request handling (as few abstractions as possible)
- gradual disclosure of complexity
## Advantages
Fully utilizing Deno, We can skip lots of tooling & vscode-extensions
- no install step (well deno does download the dependencies behind the scenes)
- no build step (ultra fast deployments)
- write the scripts you may need in typescript & execute in deno (think database
seeding)
- just-in-time client bundle generation (esbuild)
- Tailwind-in-JS (no postcss / autoprefixer)
- easily proxy or cache requests in deno and avoid cross origin requests (e.g.
Supabase API requests)
- Built in testing
- Built in TypeScript support (no extra tsc dependency)
- Built in linting (no eslint + config + vscode extension)
- Built in formatter (no prettier + vscode extension)
- Built in server (no express, but you can always opt-in if you like)
- Built in file-watching (no nodemon)
- Built in compression (no compression middleware)
## Used Libraries
- React Router (>= 6.4) has wonderful data loading APIs based on web
fundamentals
- twind enables TailwindCSS-style utility classes without a build step
## Caveats
- no HMR, but HMR doesn't work well with React Router 6.4 anyway
## Todo
How far can we get?
- code splitting
- example testing setup
- Component testing
- End-to-End testing
- Add Supabase
## License
MIT