- Local development with hot-reloading - See code changes in real-time.
- Data source plugins - Connect to any popular Headless CMSs, APIs or Markdown-files.
- File-based page routing - Quickly create and manage routes with files.
- Centralized data management - Pull data into a local, unified GraphQL data layer.
- 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.
How to install
1. Install Gridsome CLI tool
- Using YARN:
yarn global add @gridsome/cli
- Using NPM:
npm install --global @gridsome/cli
2. Create a Gridsome project
gridsome create my-gridsome-siteto create a new project
cd my-gridsome-siteto open folder
gridsome developto start local dev server at
- Happy coding 🎉🙌
3. Next steps
.vuecomponents in the
/pagesdirectory to create page routes.
gridsome buildto generate static files in a
- VuePress. Another static site generator for Vue.js. It uses local markdown files for content and is perfect for documentation sites. It is possible to build anything in VuePress and Markdown (Like a blog f.ex).
- Nuxt. A Universal Vue.js Framework for server-side rendered (SSR) apps and websites. It also has a static site generator feature, but the main focus is SSR.
- Gatsby.js Gridsome is highly inspired by Gatsby.js (React.js based), which collects data sources and generates a static site from it. Gridsome is an alternative for Gatsby.js.