Play Online

If you just want to play around with Nuxt in your browser without setting up a project, you can use one of our online sandboxes:

Open on StackBlitz

Open on CodeSandbox

Or follow the steps below to set up a new Nuxt project on your computer.

New Project

Prerequisites

Additional notes for an optimal setup:
  • Node.js: Make sure to use an even numbered version (18, 20, etc)
  • Nuxtr: Install the community-developed Nuxtr extension

Open a terminal (if you're using Visual Studio Code, you can open an integrated terminal) and use the following command to create a new starter project:

npx nuxi@latest init <project-name>

yarn dlx nuxi@latest init <project-name>

pnpm dlx nuxi@latest init <project-name>

bun x nuxi@latest init <project-name>

Alternatively, you can find other starters or themes by opening nuxt.new and following the instructions there.

Open your project folder in Visual Studio Code:

code <project-name>

Or change directory into your new project from your terminal:

cd <project-name>

Development Server

Now you'll be able to start your Nuxt app in development mode:

npm run dev -- -o

yarn dev --open

pnpm dev -o

bun run dev -o

Well done! A browser window should automatically open for http://localhost:3000.

Next Steps

Now that you've created your Nuxt project, you are ready to start building your application.

Surround

[
  {
    "title": "Introduction",
    "path": "/nuxt/getting-started/introduction",
    "stem": "nuxt/1.getting-started/1.introduction",
    "description": "Nuxt's goal is to make web development intuitive and performant with a great Developer Experience in mind.",
    "icon": "i-ph-info"
  },
  {
    "title": "Configuration",
    "path": "/nuxt/getting-started/configuration",
    "stem": "nuxt/1.getting-started/3.configuration",
    "description": "Nuxt is configured with sensible defaults to make you productive.",
    "icon": "i-ph-gear"
  }
]