Getting started

Gridsome is a Vue.js-powered, modern site generator for building the fastest possible websites for any Headless CMS, APIs or Markdown-files. Gridsome makes it easy and fun for developers to create fast, beautiful websites without needing to become a performance expert.

Why Gridsome?

  • Local development with hot-reloading - See code changes in real-time.
  • Data source plugins - Use it for any popular Headless CMSs, APIs or Markdown-files.
  • File-based page routing - Quickly create and manage pages with files.
  • Vue.js for frontend - A lightweight and approachable front-end framework.
  • Auto-optimized code - Get code-splitting and asset optimization out-of-the-box.
  • Static files generation - Deploy securely to any CDN or static web host.

Learn more about how Gridsome works

Install Gridsome

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 page routes.
  2. Use gridsome build to generate static files in a /dist folder

Edit this page on GitHub