logo

Getting Started

Learn how to create and run your first project using the Razerspine ecosystem

CLI → Templates → Runtime → Build system

This guide walks you through the process of creating and running your first project using a modular frontend tooling ecosystem built around independent packages. You will learn how to scaffold an application with the CLI, understand how templates are structured, and see how build and runtime layers work together.

The system supports both SPA and MPA architectures, allowing you to choose the approach that best fits your project requirements. Generated projects come preconfigured with a scalable structure, modern tooling, and production-ready defaults.

The build system handles asset bundling and environment configuration, while the runtime provides reactive state, routing, and component lifecycle for SPA applications. This separation of concerns ensures flexibility, maintainability, and full control over your architecture. By the end of this guide, you will have a clear understanding of how all parts of the ecosystem fit together.

Create Your First Project

To create a new project using the CLI, follow the quick start guide.

Open CLI Guide

Project Structure

Generated projects follow a predictable and scalable structure.

Tree
src/
  app/
  pages/
  shared/
  assets/
  styles/

Each part of the application is separated to keep architecture clean and maintainable.

Application Types

SPA

Single Page Applications use the runtime engine for routing, state management and component lifecycle.

Best for dashboards and dynamic applications.

MPA

Multi Page Applications use independent pages generated by webpack entry points.

Best for landing pages and static websites.

How It Works

The CLI uses a pipeline-based system to generate fully configured projects.

Text
resolve template → scaffold project → install deps → run dev

Build & Runtime

Build System

Projects are powered by @razerspine/build, a modular webpack abstraction with defineConfig API and plugin-based architecture.

Runtime Engine

SPA projects use @razerspine/runtime which provides DI container, router, reactive state and component lifecycle.

Next Steps

Templates

Explore available project templates

Open

Runtime

Learn how the runtime engine works

Open

Build System

Deep dive into build configuration

Open