draftNG 🚀

An open-source repository dedicated to the Angular community, offering premium, highly polished, and modern web application templates designed to follow industry best practices and clean architecture.

📁 Project Structure

The project is structured as follows:

• /home: The primary showcase and landing website built using Astro and Tailwind CSS v4. It serves as the catalog and live demo portal for all available templates.
• /templates: A collection of beautifully crafted frontend templates for various platform types, built using Angular 22 (and latest modern Angular guidelines) combined with Tailwind CSS v4.

📦 Available Templates & Projects

Here are the templates currently featured on draftNG:

1. KleenTrack (Premium)

   • Category: Finance & Budgeting
   • Description: A premium, high-performance Angular 22+ finance tracking dashboard template. Features interactive budgeting tools, transaction histories, accounts management, invoice generators, and optimized charts.
   • Links: Live Preview | Buy Template

2. ProjectNG (Open Source / Free)

   • Category: Workspace & Management
   • Description: A premium, zoneless Angular 22+ dashboard template styled with Tailwind CSS v4. Features tasks, calendar, team view, inbox, and optimized animations.
   • Links: Live Preview | Get Source Code

3. Jordy AI (Premium)

   • Category: AI Chatbot & Platform
   • Description: A premium, modern AI chatbot platform template (similar to Gemini or Perplexity). Fully built with Angular 22 and Tailwind CSS v4, featuring integrated AI image generation, video generation, code generation, and a personal library.
   • Links: Live Preview | Buy Template

🌟 Philosophy

The goal of draftNG is to help Angular developers kickstart their projects with pre-designed, premium interfaces that do not compromise on code quality. Every template in this repository adheres to:

• Modern Angular standards (Zoneless, Standalone Components, Signals, etc.)
• Highly optimized performance and semantic HTML structures
• Premium, modern design aesthetics using Tailwind CSS v4's CSS-first capabilities

🛠️ Getting Started

1. Main Website (/home)

To run the showcase site locally:

cd home
npm install
npm run dev

2. Angular Templates (/templates)

Each template in the /templates folder is a self-contained Angular workspace. Navigate to any template and run:

cd templates/<template-name>
npm install
npm run dev

📄 License

This project is open-source and licensed under the MIT License.