Introduction to NuxtJS Framework

NuxtJS is a progressive JS framework based on VueJS to create modern web applications. It is a top layer above VueJS. NuxtJS goal is to make web development performant with good developer experience in mind.

What is the purpose NuxtJS Framework on the top of VueJS?

All the common JavaScript Frameworks like Angular, React, VueJS populate the content of their pages dynamically. 

So these Frameworks achieve client-side rendering that is bad from an SEO point of view. Eg. the Google search engine finishes with the page crawling of the page, but our content is still not available there. That is because these Frameworks just started injecting the content only. 

Different framework implementations try to provide an SEO-friendly webpage using unique solutions to solve the problem. NuxtJS is one solution for server-side rendering. This approach is compatible with the VUEJS Framework. So this is the reason why Nuxt JS sits on the top of VUE.js.

What are the benefits of NuxtJS?

Developers who designed NuxtJS give you an architecture to follow the official VueJS guidelines. You can create everything from static landing pages to complex enterprise-ready web applications. Furthermore, it supports different targets (server, serverless or static), and the server-side rendering feature is switchable also.

It is extendable with a module system. So you can connect it to your REST or GraphQL endpoints. It also communicates with your favorite CMS and CSS frameworks. Furthermore, the PWA and AMP support is only a module away from your NuxtJS project.

Wait! What is PWA?

Progressive Web Apps (PWA) are built and enhanced with modern APIs to deliver native-like capabilities, reliability, and installability while reaching anyone, anywhere, on any device with a single codebase.

And what is an AMP?

AMP is a simple and robust web components framework. It makes it easy to build fast websites that are user-first experiences for the web.

What type of applications can we build with NuxtJS?

NuxtJS allows us to create three types of applications, depending on our purpose.

• Static Generated Pages (Pre-rendering)
  • They do not require API calls to fetch data
  • The page contains the data already
• Single Page Application (SAP)
  • Most of the JavaScript frameworks are single-page applications
  • The content is dynamically populated
  • Most of the SPAs use the HTML5 history API or the location HASH for routing
• Server Side Rendered Applications (SSR)
  • Fetching and displaying the client-side data on the server to set a fully rendered SEO-friendly page to the client.

Conclusion & Closing

This post tried clarifying some basic info of NUXT.js that provides server-side rendering for the VUE.JS Framework. As I detailed above, the benefit of using makes faster page loads and helps our page in SEO ranking.