2024-06-16 07:51:12 +00:00
[![Nuxt banner ](./.github/assets/banner.svg )](https://nuxt.com)
2022-11-16 11:19:41 +00:00
2023-08-30 09:06:45 +00:00
# Nuxt
2022-11-16 11:19:41 +00:00
2023-08-30 09:06:45 +00:00
< p >
< a href = "https://www.npmjs.com/package/nuxt" > < img src = "https://img.shields.io/npm/v/nuxt.svg?style=flat&colorA=18181B&colorB=28CF8D" alt = "Version" > < / a >
< a href = "https://www.npmjs.com/package/nuxt" > < img src = "https://img.shields.io/npm/dm/nuxt.svg?style=flat&colorA=18181B&colorB=28CF8D" alt = "Downloads" > < / a >
2024-06-16 07:47:32 +00:00
< a href = "https://github.com/nuxt/nuxt/tree/main/LICENSE" > < img src = "https://img.shields.io/github/license/nuxt/nuxt.svg?style=flat&colorA=18181B&colorB=28CF8D" alt = "License" > < / a >
2023-08-30 09:06:45 +00:00
< a href = "https://nuxt.com" > < img src = "https://img.shields.io/badge/Nuxt%20Docs-18181B?logo=nuxt.js" alt = "Website" > < / a >
< a href = "https://chat.nuxt.dev" > < img src = "https://img.shields.io/badge/Nuxt%20Discord-18181B?logo=discord" alt = "Discord" > < / a >
< / p >
2022-11-16 11:19:41 +00:00
2023-08-30 09:06:45 +00:00
Nuxt is a free and open-source framework with an intuitive and extendable way to create type-safe, performant and production-grade full-stack web applications and websites with Vue.js.
2022-11-16 11:19:41 +00:00
2023-08-30 09:06:45 +00:00
It provides a number of features that make it easy to build fast, SEO-friendly, and scalable web applications, including:
2024-03-06 23:37:20 +00:00
- Server-side rendering, Static Site Generation, Hybrid Rendering and Edge-Side Rendering
- Automatic routing with code-splitting and pre-fetching
- Data fetching and state management
- SEO Optimization and Meta tags definition
- Auto imports of components, composables and utils
- TypeScript with zero configuration
- Go fullstack with our server/ directory
- Extensible with [200+ modules ](https://nuxt.com/modules )
2023-11-20 19:02:11 +00:00
- Deployment to a variety of [hosting platforms ](https://nuxt.com/deploy )
2023-08-30 09:06:45 +00:00
- ...[and much more](https://nuxt.com) 🚀
2022-11-16 11:19:41 +00:00
2024-03-06 23:37:20 +00:00
### Table of Contents
- 🚀 [Getting Started ](#getting-started )
- 💻 [ Vue Development ](#vue-development )
- 📖 [Documentation ](#documentation )
- 🧩 [Modules ](#modules )
- ❤️ [Contribute ](#contribute )
- 🏠 [Local Development ](#local-development )
- ⛰️ [Nuxt 2 ](#nuxt-2 )
2024-05-21 13:58:33 +00:00
- 🛟 [Professional Support ](#professional-support )
2024-07-11 06:11:01 +00:00
- 🔗 [Follow Us ](#follow-us )
2024-03-06 23:37:20 +00:00
- ⚖️ [License ](#license )
---
## <a name="getting-started">🚀 Getting Started</a>
2021-03-28 21:03:37 +00:00
2023-08-30 09:06:45 +00:00
Use the following command to create a new starter project. This will create a starter project with all the necessary files and dependencies:
```bash
2023-09-12 14:48:26 +00:00
npx nuxi@latest init < my-project >
2023-08-30 09:06:45 +00:00
```
2024-03-06 23:37:20 +00:00
> [!TIP]
> Discover also [nuxt.new](https://nuxt.new): Open a Nuxt starter on CodeSandbox, StackBlitz or locally to get up and running in a few seconds.
2023-08-30 09:06:45 +00:00
2024-03-06 23:37:20 +00:00
## <a name="vue-development">💻 Vue Development</a>
2023-11-20 19:02:11 +00:00
Simple, intuitive and powerful, Nuxt lets you write Vue components in a way that makes sense. Every repetitive task is automated, so you can focus on writing your full-stack Vue application with confidence.
Example of an `app.vue` :
```vue
2024-02-13 12:50:38 +00:00
< script setup lang = "ts" >
2023-11-20 19:02:11 +00:00
useSeoMeta({
title: 'Meet Nuxt',
description: 'The Intuitive Vue Framework.'
})
< / script >
< template >
< div id = "app" >
< AppHeader / >
< NuxtPage / >
< AppFooter / >
< / div >
< / template >
2024-03-06 23:37:20 +00:00
< style scoped >
2023-11-20 19:02:11 +00:00
#app {
background-color: #020420 ;
color: #00DC82 ;
}
< / style >
```
2024-03-06 23:37:20 +00:00
## <a name="documentation">📖 Documentation</a>
2023-08-30 09:06:45 +00:00
We highly recommend you take a look at the [Nuxt documentation ](https://nuxt.com/docs ) to level up. It’ s a great resource for learning more about the framework. It covers everything from getting started to advanced topics.
2024-03-06 23:37:20 +00:00
## <a name="modules">🧩 Modules</a>
2023-08-30 09:06:45 +00:00
Discover our [list of modules ](https://nuxt.com/modules ) to supercharge your Nuxt project, created by the Nuxt team and community.
2024-03-06 23:37:20 +00:00
## <a name="contribute">❤️ Contribute</a>
2023-08-30 09:06:45 +00:00
We invite you to contribute and help improve Nuxt 💚
Here are a few ways you can get involved:
- **Reporting Bugs:** If you come across any bugs or issues, please check out the [reporting bugs guide ](https://nuxt.com/docs/community/reporting-bugs ) to learn how to submit a bug report.
2024-04-16 08:04:41 +00:00
- **Suggestions:** Have ideas to enhance Nuxt? We'd love to hear them! Check out the [contribution guide ](https://nuxt.com/docs/community/contribution ) to share your suggestions.
2023-08-30 09:06:45 +00:00
- **Questions:** If you have questions or need assistance, the [getting help guide ](https://nuxt.com/docs/community/getting-help ) provides resources to help you out.
2021-07-30 16:40:50 +00:00
2024-03-06 23:37:20 +00:00
## <a name="local-development">🏠 Local Development</a>
2021-07-30 16:40:50 +00:00
2023-10-18 10:59:43 +00:00
Follow the docs to [Set Up Your Local Development Environment ](https://nuxt.com/docs/community/framework-contribution#setup ) to contribute to the framework and documentation.
2022-11-16 11:19:41 +00:00
2024-05-21 13:58:33 +00:00
## <a name="professional-support">🛟 Professional Support</a>
- Technical audit & consulting: [Nuxt Experts ](https://nuxt.com/enterprise/support )
- Custom development & more: [Nuxt Agencies Partners ](https://nuxt.com/enterprise/agencies )
2024-07-11 06:11:01 +00:00
## <a name="follow-us">🔗 Follow Us</a>
2022-11-16 11:19:41 +00:00
< p valign = "center" >
2024-06-16 07:51:12 +00:00
< a href = "https://chat.nuxt.dev" > < img width = "20px" src = "./.github/assets/discord.svg" alt = "Discord" > < / a > < a href = "https://twitter.nuxt.dev" > < img width = "20px" src = "./.github/assets/twitter.svg" alt = "Twitter" > < / a > < a href = "https://github.nuxt.dev" > < img width = "20px" src = "./.github/assets/github.svg" alt = "GitHub" > < / a >
2022-11-16 11:19:41 +00:00
< / p >
2021-10-11 12:57:54 +00:00
2024-03-06 23:37:20 +00:00
## <a name="license">⚖️ License</a>
2021-10-11 12:57:54 +00:00
2024-06-16 07:47:32 +00:00
[MIT ](https://github.com/nuxt/nuxt/tree/main/LICENSE )