loading...

#1 Introduction to Gridsome VueJS

hellonehha profile image Neha Sharma Updated on ・1 min read

What is Gridsome?

"Gridsome is Vuejs powered JAM STACK framework for building static generated websites."

This is the definition available on the official website of the Gridsome. But what exactly it means for the developer?

To understand it better we first need to understand first what is JAMStack?

JAMStack?

"JAM" in JAMStack stands for - "JavaScript, API, markup. "
"JAMStack is not based on the server".

JAMStack websites are the pre-rendered files served directly from the CDNs. This made the websites fast and secure. This also removes the dependency of managing the web servers.

To build the JAMStack websites we need:

1) HTML
2) CSS
3) Data Source Layer (API, CMS, GraphQL, etc)

Gridsome is not the only option available in the market to create JAMStack websites. We have Gatsby, NextJS, and a few more.

Why Gridsome

  • SEO
    As the Gridsome pre-render the HTML files with the data from APIS, etc. All the sites build with Gridsome are SEO friendly.

  • Fast
    Gridsome sites are not dependent on the server. Everything is pre-rendered and serve from CDN, this makes the sites FAST by default.

  • Vuejs
    Gridsome is based on the Vuejs - one of the popular UI libraries.

  • GraphQL data layer
    Gridsome is powered by GraphQL to read the data from different data sources.

  • Plugins ecosystem
    Gridsome has a very big and strong ecosystem of the plugins which ease the development of the developers as well as help in the implementation of the complex features too.

and many more...

In the next article, we will learn about how to install Gridsome and project structure walkthrough

Posted on by:

hellonehha profile

Neha Sharma

@hellonehha

UI Engineer ,I love Web,JavaScript, Design System, A11Y, HTML5, CSS3 ,React; Community Advocate and enjoy giving talks and codelabs at the Meetups and conference. I am self-taught calligrapher too.

Discussion

markdown guide