Let me introduce you to Nuxt, a tool that makes web development simple. You need very little to have a ready-to-use web application and with just a few more clicks you can deploy it. Especially smaller projects that don’t require too much additional functionality can be written in it smoothly. At the same time, it offers plenty of options to go deeper and create sophisticated web applications as well.

In the following series of articles, we will gradually look at it in more detail.

What is it about?

Nuxt is a meta-framework for creating web applications in (predominantly) JavaScript or TypeScript. It is built on top of Vue.js, which is “the third one” in the family of large and popular JavaScript frameworks (alongside React and Angular). Unlike those two, it is not backed by a large tech company, but purely by an open-source community. A colleague who knows Angular finds programming in Vue being “punk”, but perhaps that’s why I’ve been enjoying exploring its world lately.

Like other tools of this type, it abstracts developers from the necessity of constantly repeat boring and repetitive basic tasks and helps them focus on important functional and content matters. Nuxt goes even further than pure Vue.js – many things that you would otherwise have to write manually can be handled simply by placing a file in the correct format into the designated directory. Moreover, the term meta-framework refers to the fact that it’s more than just a library for creating frontends – it also offers, among other features, a sophisticated way to create your own JS/TS backend.

This website is also written in it, for example.

What do you need?

All you need is a JavaScript runtime. The best option is arguably the latest LTS version of Node.js on the computer where you want to develop. The resulting application can also run in a Node.js environment, but this isn’t strictly necessary. Nuxt allows you to generate static JavaScript output that can run in any modern browser. While you’ll lose some features this way, ordinary static web hosting would be sufficient. On the other hand, in today’s era of cloud services and containers, the “dynamic” variant is no longer a problem either.

Other prerequisites include some knowledge of HTML, CSS, and JavaScript. Ideally, at least a basic understanding of TypeScript is also helpful. The Vue.js and Nuxt developers emphasize that they don’t force anyone into TypeScript, but from my own experience, it’s a significant step forward and worth the time spent learning and exploring. Type checking will help you catch many trivial errors before they accidentally make it into production, saving you from having to debug them later.

To program comfortably, you’ll want an IDE. For JavaScript development, VS Code is probably the best choice – it’s designed for it, it’s excellent, it’s free, and it has many plugins, including the official Vue extension. Most people in the Vue.js community use it as well.

For installing and managing JavaScript dependencies in your local environment, you need a package manager. Just like with JS frameworks, there are multiple options. For a long time, I used npm, which came first and much of the current JavaScript world is built around it. However, the more advanced pnpm has one significant advantage – using symlinks to a single central directory, it deduplicates dependencies from different projects that would otherwise be downloaded into local node_modules repeatedly, slowly consuming gigabytes of your disk space. Another minor benefit is that scripts defined in package.json can be run directly as pnpm script (whereas in npm it’s npm run script). I’ve never tried yarn, although I know many people prefer and recommend it. The choice is yours – the general principles are the same, and ultimately it’s just about the command syntax.

Last but not least, you’ll need Git for managing and versioning source code. For smaller test projects, you might get by without it, but for developing anything more substantial, it’s almost essential. If you prefer other version control systems, you’ll need to adapt accordingly. I once started with SVN at work, but I wouldn’t want to go back.

How to get started?

Guides, tips, and tricks will be added into the series gradually. You can access individual chapters using the links in the box below.

For now, you can check out my growing repository with demo projects: demos-nuxt @ GitHub. It assumes the use of Git and pnpm.

Then, of course, there are the official resources:

• Nuxt documentation
• Nuxt forum

I started writing these articles back in 2023. I’ll be releasing them one by one. As Nuxt continues to evolve, the content of my articles will (hopefully) evolve along with it. If you come across something that’s no longer valid, or something I learned incorrectly, please let me know.

Now let’s move on to the first minimal project created using the Nuxt framework.