diff options
Diffstat (limited to 'modules/templates/web/README.md')
| -rw-r--r-- | modules/templates/web/README.md | 149 |
1 files changed, 149 insertions, 0 deletions
diff --git a/modules/templates/web/README.md b/modules/templates/web/README.md new file mode 100644 index 0000000..56a3269 --- /dev/null +++ b/modules/templates/web/README.md @@ -0,0 +1,149 @@ +# Web Development Environment + +A reproducible Nix Flake for modern web development. + +This template provides a complete JavaScript and TypeScript development environment suitable for frameworks such as: + +* React +* Next.js +* Svelte +* SvelteKit +* Vue +* Nuxt +* SolidJS +* Astro +* Express +* Fastify + +## Included Software + +### Runtime + +* **Node.js 24** +* **npm** +* **pnpm** +* **Bun** + +### Development Tools + +* **TypeScript** +* **TypeScript Language Server** +* **Biome** (formatter and linter) +* **Prettier** + +### Language Servers + +* HTML +* CSS +* JSON +* TypeScript + +These work automatically in editors supporting the Language Server Protocol (LSP), such as Neovim, Helix, Zed, VS Code, and Emacs. + +## Usage + +Enter the development environment: + +```bash +nix develop +``` + +The shell prints the installed versions of Node.js, npm, pnpm, and Bun when it starts. + +## Creating a Project + +Examples: + +### Vite + +```bash +pnpm create vite +``` + +### Next.js + +```bash +pnpm create next-app +``` + +### Astro + +```bash +pnpm create astro +``` + +### SvelteKit + +```bash +pnpm create svelte@latest +``` + +## Installing Dependencies + +Using pnpm: + +```bash +pnpm install +``` + +Using npm: + +```bash +npm install +``` + +Using Bun: + +```bash +bun install +``` + +## Formatting + +Using Biome: + +```bash +biome check . +biome format . +``` + +Using Prettier: + +```bash +prettier --write . +``` + +## Project Layout + +A typical project might look like: + +```text +. +├── flake.nix +├── package.json +├── pnpm-lock.yaml +├── tsconfig.json +├── src/ +└── public/ +``` + +## Customization + +Depending on your workflow, you may want to add additional tools, such as: + +* Playwright +* Cypress +* Tailwind CSS +* Prisma +* Docker +* PostgreSQL client +* Redis client + +Because the development environment is defined entirely by the flake, anyone can reproduce the same toolchain by running: + +```bash +nix develop +``` + +without installing Node.js or any global packages manually. + |
