Quick Install Guide

Get Aurelia running in under 5 minutes with this quick installation guide.

Get Aurelia up and running in 5 minutes or less.

Prerequisites

Node.js (latest version recommended)
A code editor of your choice

Option 1: Try Aurelia Instantly (No Setup Required)

Want to try Aurelia immediately? Copy this into an HTML file and open it in your browser:

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Aurelia 2 Quick Try</title>
    <base href="/" />
    <link rel="dns-prefetch" href="//cdn.jsdelivr.net">
    <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>
    <link rel="modulepreload" href="https://cdn.jsdelivr.net/npm/aurelia@latest/+esm" crossorigin fetchpriority="high">
  </head>
  <body>
    <app-root></app-root>
    <script type="module">
      import { Aurelia, CustomElement } from 'https://cdn.jsdelivr.net/npm/aurelia@latest/+esm';

      const App = CustomElement.define({
        name: 'app-root',
        template: `
          <h1>Hello, \${name}!</h1>
          <input value.bind="name" placeholder="Enter your name">
          <p>You typed: \${name}</p>
        `
      }, class {
        name = 'World';
      });

      new Aurelia()
        .app({ component: App, host: document.querySelector('app-root') })
        .start();
    </script>
  </body>
</html>

No installation required! This uses Aurelia directly from a CDN. Perfect for experimentation or simple projects. For a more complete example, see the realworld-vanilla example which demonstrates a full application with routing.

Option 2: Create Your App

Aurelia uses the Makes scaffolding tool. No global installs required.

npx makes aurelia

When prompted:

Project name: Enter your project name
Setup: Choose TypeScript (recommended) or ESNext
Install dependencies: Select "Yes"

Why TypeScript? Get intellisense, type safety, and better tooling support out of the box.

Run Your App

Navigate to your project and start the development server:

cd your-project-name
npm start

Your browser will automatically open to http://localhost:8080 showing your new Aurelia app.

Verify Everything Works

You should see "Hello World!" displayed in your browser. The development server watches for changes and auto-reloads.

What's Next?

New to Aurelia? Try our Hello World Tutorial for a hands-on introduction
Ready for more? Explore our developer guides and tutorials
Need help? Check out troubleshooting

Core Concepts (Optional Reading)

Aurelia is built on familiar web technologies with a few key concepts:

Components: Made of view-models (.ts/.js) and views (.html)
Conventions: File names and structure follow predictable patterns
Dependency Injection: Built-in system for managing services and dependencies
Enhanced HTML: Templates use familiar HTML with powerful binding syntax

These concepts become clearer as you build with Aurelia. Start with the tutorial above to see them in action!

PreviousComplete Getting Started Guide NextAurelia for New Developers

Last updated 2 months ago

Was this helpful?

hashtagPrerequisites

hashtagOption 1: Try Aurelia Instantly (No Setup Required)

hashtagOption 2: Create Your App

hashtagRun Your App

hashtagVerify Everything Works

hashtagWhat's Next?

hashtagRecommended Reading

hashtagCore Concepts (Optional Reading)