init-project
Project Initialization Best Practices
When creating new projects, always prefer official CLI tools and scaffolding commands over manually creating files and directories. These tools:
- Set up correct project structure and config
- Install dependencies with compatible versions
- Configure build tools, linting, testing
- Follow framework best practices
JavaScript/TypeScript
| Framework | Command |
|---|---|
| Vite | bun create vite or npm create vite@latest |
| Next.js | bunx create-next-app or npx create-next-app@latest |
| Remix | bunx create-remix or npx create-remix@latest |
| Astro | bun create astro or npm create astro@latest |
| SvelteKit | bun create svelte or npm create svelte@latest |
| Nuxt | bunx nuxi init or npx nuxi@latest init |
| React Native | npx @react-native-community/cli init |
| Expo | bunx create-expo-app or npx create-expo-app |
| Electron | npm init electron-app@latest |
| Tauri | bun create tauri-app or npm create tauri-app@latest |
TypeScript Package Preference
- Prefer
pnpmas the package manager for TypeScript packages/libraries.
Key Principles
- Don't manually create config files - Let the CLI generate them
- Use interactive prompts - Most CLIs ask about TypeScript, linting, testing
- Check framework docs - Commands change; verify current syntax
- Prefer package-manager conventions - use
pnpmfor TypeScript packages unless project constraints require otherwise - Use templates - Many CLIs offer starter templates (e.g.,
--template react-ts)
When Manual Setup is OK
- Adding to existing monorepo with specific conventions
- Learning how tools work under the hood
- Very minimal projects (single script)
- Custom build requirements not covered by templates
More from linct96/ai
playwright-browser
Playwright CLI and MCP tools for headless browser automation, E2E testing,screenshots, and web scraping. Use for CI-safe browser operations.
12find-skills
Helps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.
8frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
6tanstack-router
Type-safe, file-based React routing with route loaders, search params validation, code splitting, preloading, navigation, route context, and TanStack Query integration. Use when setting up file-based routing, adding search params validation, implementing route loaders, code splitting routes, configuring virtual file routes, protecting routes with auth guards, or fixing type registration errors. Use for router setup, navigation patterns, URL state management, data loading.
5pnpm
Node.js package manager with strict dependency resolution. Use when running pnpm specific commands, configuring workspaces, or managing dependencies with catalogs, patches, or overrides.
4code-review
Expert code review of current git changes with a senior engineer lens. Detects SOLID violations, security risks, and proposes actionable improvements.
3