Getting started

Gridsome is a Vue-powered static site generator for building super fast, modern PWA & SPA websites for any data source. It brings many powerful features to the table that makes it fun and easy to build highly optimized websites without being a performance expert.

Why Gridsome?

  • Local development with hot-reloading - See code changes in real-time.
  • Vue.js for frontend - A lightweight and approachable front-end framework.
  • Centralized data management - Use a local GraphQL data layer for all data.
  • Automatic page routing - Quickly create and manage pages with files.
  • Auto optimized code - Get code-splitting and asset optimization out-of-the-box.
  • Static site generation - Deploy securely and fast to any Static Web Host.
  • Data source plugins - Add data from popular Headless CMSs, APIs or Markdown-files.

Prerequisites

Gridsome requires Node.js and recommends Yarn. 👉 How to setup

1. Install Gridsome CLI tool

npm install --global @gridsome/cli

2. Create a Gridsome project

  1. gridsome create my-gridsome-site to create a new project
  2. cd my-gridsome-site to open folder
  3. gridsome develop to start local dev server at http://localhost:8080
  4. Happy coding 🎉🙌

3. Next steps

  1. Create .vue components in the /pages directory to create pages.
  2. Use gridsome build to generate static files in a /dist folder

Learn more...

Edit this page on GitHub