What is Nuxt.js?
Who uses Nuxt.js?
Here are some stack decisions, common use cases and reviews by companies and developers who chose Nuxt.js in their tech stack.
For our internal team and collaboration panel we use Nuxt.js (with TypeScript that is transpiled into ES6), Webpack and npm. We enjoy the opinionated nature of Nuxt.js over vanilla Vue.js, as we would end up using all of the components Nuxt.js incorporates anyways and we can adhere to the conventions setup by the Nuxt.js project, which allows us to get better support in case we run into any dead ends. Webpack allows us to create reproducable builds and also debug our application with hot reloads, which greately increased the pace at which we are able to perform and test changes. We also incorporated a lot of testing (ESLint, Chai, Jasmine, Nightwatchjs) into our pipelines and can trigger those jobs through GitLab CI. All packages are fetched through npm, so that we can keep our git repositories slim and are notified of new updates aswell as reported security flaws.
I want to build a documentation tool - functionally equivalent to MkDocs. The initial choice ought to be VuePress - but I know of at least one respectable developer who started with VuePress and switched to Nuxt.js. A rich set of "themes" is a plus and all documents ought to be in Markdown.
Our whole Vue.js frontend stack (incl. SSR) consists of the following tools:
- Vue Styleguidist as our style guide and pool of developed Vue.js components
- Vuetify as Material Component Framework (for fast app development)
- TypeScript as programming language
- Apollo / GraphQL (incl. GraphiQL) for data access layer (https://apollo.vuejs.org/)
- ESLint, TSLint and Prettier for coding style and code analyzes
- Jest as testing framework
- Google Fonts and Font Awesome for typography and icon toolkit
- NativeScript-Vue for mobile development
The main reason we have chosen Vue.js over React and AngularJS is related to the following artifacts:
- Empowered HTML. Vue.js has many similar approaches with Angular. This helps to optimize HTML blocks handling with the use of different components.
- Detailed documentation. Vue.js has very good documentation which can fasten learning curve for developers.
- Adaptability. It provides a rapid switching period from other frameworks. It has similarities with Angular and React in terms of design and architecture.
- Awesome integration. Vue.js can be used for both building single-page applications and more difficult web interfaces of apps. Smaller interactive parts can be easily integrated into the existing infrastructure with no negative effect on the entire system.
- Large scaling. Vue.js can help to develop pretty large reusable templates.
- Tiny size. Vue.js weights around 20KB keeping its speed and flexibility. It allows reaching much better performance in comparison to other frameworks.
I'm planning to make a web app with browser games that would be a Progressive Web App. I decided to use Vue.js as the front framework and Firebase to store basic information about users. Then I found out about Nuxt.js and I figured it could be really handy for making the project as PWA.
So my questions are:
Any help would be appreciated!
I would like some advice on what you would suggest for a website showing products & services. Max, about 100 products. No eCommerce features are required at the moment. I will also add a search feature and a couple of forms.
I already use Storyblok CMS for the content side of things. One thing that worries me about choosing the build is I ideally don't want the public API key visible, just to prevent any future abuse. I understand if I use the build module in Nuxt.js for storybook, the API key is visible in $nuxt in the console.
TL;DR: Shall I keep developing with Nuxt.js 2 and wait for a migration guide to Nuxt 3? Or start developing with Vue.js 3 using Vite, and then migrate to Nuxt 3 when it comes out?
Long version: We have an old web application running on AngularJS and Bootstrap for frontend. It is mostly a user interface to easily read and post data to our engine.
We want to redo this web application. Started from scratch using the newest version of Angular 2+ and Material Design for frontend. We haven't even finished rewriting half of the application and it is becoming dreadful to work on.
- The cold start takes too much time
- Every little change reload the whole page. Seconds to minutes of development lost looking at a loading blank page just changing css
- Code maintainability is getting worse... again... as the application grows, since we must create everytime 5 files for a new page (html, component.ts, module.ts, scss, routing.ts)
I'm currently trying to code a Proof of Concept using Nuxt.js and Tailwind CSS. But the thing is, Vue.js 3 is out and has interesting features such as the composition API, teleport and fragments. Also we wish to use the Vite frontend tooling, to improve our time developing regardless of our application size. It feels like a better alternative to Webpack, which is what Nuxt 2 uses.
I'm already trying Nuxt.js with the nuxt-vite experimental module, but many nuxt modules are still incompatible from the time I'm posting this. It is also becoming cumbersome not being able to use teleport or fragments, but that can be circumvented with good components.
What I'm asking is, what should be the wisest decision: keep developing with Nuxt 2 and wait for a migration guide to Nuxt 3? Or start developing with Vue.js 3 using Vite, and then migrate to Nuxt 3 when it comes out?
- Automatic transpilation and bundling
- Hot module replacement
- Server-side rendering OR Single Page App OR Static Generated, you choose 🔥
- Static file serving
- Configurable with a nuxt.config.js file
- Custom layouts with the layouts/ directory
- Code splitting for every pages