frontend-developmentlisted
Install: claude install-skill nette/agent-plugins
## Frontend Development
See [the Nette Assets reference](references/assets.md) for asset management.
See [the Vite integration guide](references/vite.md) for build configuration.
### Technology Stack
- **Build system:** Vite with TypeScript support
- **JavaScript:** ES Modules (ESM) with `"type": "module"` in package.json
- **Styling:** SCSS with modular component architecture
- **Asset integration:** Nette Assets for PHP-frontend bridge
- **Admin framework:** Bootstrap for rapid interface development
- **Code quality:** ESLint with @nette/eslint-plugin
- **Forms:** Nette Forms with progressive enhancement
## Asset Architecture Strategy
**Source vs Built Assets separation:**
- **Development assets:** `assets/` directory with source files (SCSS, TypeScript, images)
- **Production assets:** `www/assets/` with optimized, versioned files for browsers
### Coding Standards
- Use single quotes for strings unless containing apostrophes (CSS, SCSS, JavaScript)
### Nette Assets Integration Patterns
**Basic asset loading**
```latte
{* Loads complete bundle with all dependencies *}
{asset 'app.js'}
```
**Configuration**
```neon
assets:
mapping:
default:
type: vite
path: assets # REQUIRED in practice - must match Vite's build.outDir
```
`path` is optional in the schema and nothing validates it, but when omitted it falls back to
`%wwwDir%`, so the manifest is looked up in `www/.vite/manifest.json` instead of
`www/assets/.vite/manifest.json` and you get `RuntimeE