Recommended Tech Stack
About these recommendations
This section documents Aliz's recommended tech stack for frontend projects. These are sensible defaults — not mandates. Teams may deviate when there's a good reason, but starting here means less time debating tooling and more time shipping.
Recommendations are reviewed periodically by the Web Hub maintainers. Each page is a short introduction with rationale and links to official docs — not a deep tutorial.
When to follow this stack
- New greenfield projects at Aliz
- When choosing between equivalent options and you need a tiebreaker
- When onboarding new team members and you want a consistent baseline
When to deviate
- Legacy projects already using a different stack — don't rewrite for the sake of it
- Specific client requirements that dictate other choices
- Prototypes, throwaway scripts, or one-off experiments where setup cost matters more than long-term maintainability
What's covered
Core
- React — UI library
- TypeScript — type-safe JavaScript
- Astro — content-focused web framework
Styling & UI
- Tailwind CSS — utility-first CSS framework
- shadcn/ui — component collection (Radix + Tailwind)
- MUI — Material UI component library
State & Data
- Zustand — state management
- TanStack Query — data fetching and server state
- i18next — internationalization (i18n) framework
- Luxon — date/time library (immutable API, built-in time zones and i18n)
- Zod — TypeScript-first schema validation
Advanced / Situational
- Redux Toolkit — state + data fetching (default: Zustand + TanStack Query)
- React Hook Form — form management (for complex/form-heavy apps — simple forms don't need it)
Build & Dev
- npm — package manager
- Vite — build tool and dev server
- ESLint — linter
- Prettier — code formatter
- Vitest — testing framework
- Playwright — end-to-end testing
- Storybook — UI component development and documentation tool
- Workbox — service worker tooling for offline & PWA support (optional)
- dotenv — environment variable loading for local development and Node.js scripts
Data Visualization
- Recharts — React charting library (default for dashboards)
- Apache ECharts — enterprise-grade visualization (maps, 3D, big data)
Advanced / Situational
- VisX — low-level React viz primitives built on D3 (default: Recharts)
- D3.js — foundational visualization toolkit (default: Recharts or Apache ECharts)
Backend Services
- Firebase — Google's Backend-as-a-Service platform (Firestore, Auth, Hosting, Functions)
Security
- DOMPurify — XSS sanitizer for HTML content
Documentation Frameworks
- Docusaurus — React-based documentation site generator (powers this Web Hub)
- Astro Starlight — zero-JS documentation framework built on Astro
Deprecated
- Webpack — legacy bundler (use Vite)
- Bower — abandoned package manager (use npm)
- Moment.js — legacy date library (use Luxon)
- Create React App — unmaintained React scaffolding (use Vite)
Discouraged
- Legacy Redux — legacy state management patterns (default: Zustand; modern: Redux Toolkit)
- MobX — reactive state management (default: Zustand)
- Angular — full-featured framework (default: React)
- Vue — progressive framework (default: React)
- Svelte — compiler-based framework (default: React)
- Plain JavaScript — untyped JS (default: TypeScript; fine for throwaway scripts)
Triage
- Triage — libraries that need evaluation (niche or untested at Aliz)
This section will grow over time — contributions welcome. If your team has settled on a tool that works well, open a PR.
For guidance on using AI tools and agents in your development workflow, see AI-Assisted Development.
For step-by-step project blueprints that show how these tools fit together in practice, see the Project Cookbooks — recipes for React SPAs, Firebase apps, and documentation sites.