Getting Started

Step-by-step guide to setting up your modern Angular environment with Tailwind CSS and Spartan UI.

Step 1: Install Angular CLI
Node.js Required

Install the Angular Command Line Interface (CLI) global on your machine.

npm install -g @angular/cli

Ensure you have a recent version of Node.js (LTS recommended) installed.

Step 2: Create a New Angular Project

Initialize your application using the CLI. This will set up the workspace and project files.

ng new my-awesome-app --style=css --ssr

Follow the prompts to configure your project. We recommend enabling SSR (Server Side Rendering) for better performance and SEO.

Step 3: Add Tailwind CSS

Tailwind CSS is the primary styling engine used by Spartan UI.

ng add tailwindcss

Official Tailwind Guide Angular.dev Tailwind Guide

Rocket Step 4: Install Spartan UI

Now, add the power of Spartan UI to your project using the official CLI.

1. Install the Spartan CLI (Dev Dependency):

npm install -D @spartan-ng/cli

2. Initialize Spartan in your project:

ng g @spartan-ng/cli:init

(Note: Use 'npx nx g @spartan-ng/cli:init' if you are using an Nx Workspace)

3. Add UI components as needed:

ng g @spartan-ng/cli:ui

The CLI will prompt you to select components. Each component includes:

  • Brain primitive: Headless logic (installed to node_modules)
  • Helm styles: Visual styling (copied to your project)
  • All necessary dependencies automatically managed

Explore the full documentation and interactive examples:
spartan.ng

Built with Angular, Tailwind CSS, and passion.