DEV Community

Cover image for Scaffold React & Angular Apps in Minutes — Meet polyfront scaffold 🚀
Nirmal Samaranayaka
Nirmal Samaranayaka

Posted on • Edited on

Scaffold React & Angular Apps in Minutes — Meet polyfront scaffold 🚀

#beginners #angular #frontend #webdev

I’m excited to share my new open-source CLI tool: polyfront-scaffold!

After weeks of building and testing, this tool helps you scaffold modern React (Vite/Webpack) and Angular applications in minutes, with ready-to-use presets for UI, state management, testing, and more.

🎯 What It Does

polyfront-scaffold generates production-ready frontend projects with opinionated but flexible defaults. Instead of wiring boilerplate, teams can focus on building features.

Key Highlights

  • Frameworks supported: React (Vite/Webpack) & Angular
  • UI stacks: MUI, Bootstrap, Tailwind, Ant Design, Chakra, Angular Material
  • State management (React): Redux, MobX, React Query, or none
  • Built-in utilities: HTTP clients, i18n placeholders, date libraries (moment/dayjs/date-fns), and testing setup (Jest, Vitest, Cypress, Playwright)
  • Folder structure: Clean, scalable, with .env presets
  • Cross-platform: Works on Windows, macOS, Linux
  • Node support: Fully tested on Node 20 & 22

🖼️ Screenshots & Demo

MUI

MUI-Home

MUI-About

MUI-Dashboard

MUI-Profile

Bootstrap

Bootstrap-Home

Bootstrap-About

Bootstrap-Dashboard

Bootstrap-Profile

Tailwind

Tailwind-Home

Tailwind-about

Tailwind-Dashboard

Tailwind-Profile

Ant Design

Antd-Home

Antd-About

Antd-Dashboard

Antd-Profile

Chakra UI Design

Chakra-Home

Chakra-About

Chakra-Dashboard

Chakra-Profile

⚡ Quick Start

Install globally 

npm install -g polyfront-scaffold
Enter fullscreen mode Exit fullscreen mode

Interactive wizard 

polyfront-scaffold --interactive
Enter fullscreen mode Exit fullscreen mode

Scaffold a React + Vite + MUI project 

polyfront-scaffold my-app --framework react-vite --ts --ui mui --store none --test-unit vitest --test-e2e none
Enter fullscreen mode Exit fullscreen mode

👥 Who Is This For?

*Solo developers & freelancers → Skip repetitive boilerplate, build faster.
*Startup teams → Enforce consistent structure across multiple apps.
*Enterprise developers → Standardize scaffolding for large teams & speed onboarding.
*Educators & trainers → Spin up demo projects for workshops or bootcamps.

⏱️ Why Use It?

Without polyfront-scaffold ⌛: ~30+ minutes setup

npx create-react-app ...
npm install mui redux react-router ...
mkdir src/components ...
touch src/pages/Home.tsx ...

With polyfront-scaffold 🚀: <1 minute 🎉 

polyfront-scaffold my-app --framework react-vite --ts --ui mui --store none --test-unit vitest --test-e2e none
Enter fullscreen mode Exit fullscreen mode

💡 Community Contributions

  • Experimental presets (AntD) welcome for testing.
  • Open issues, submit PRs, or give feedback via GitHub.

📦 Try It Today

👉 npm : polyfront-scaffold
👉 GitHub Repo

⭐ Star the repo if you find it useful!

Try polyfront-scaffold today and give your productivity a boost ⚡

#react #angular #frontend #opensource #cli #mui #bootstrap

Top comments (0)