Gatsby Starters & Templates Logo Gatsby Starters & Templates
Gatsby Starter Directive screenshot

Gatsby Starter Directive

Author Avatar Theme by Anubhavsrivastava
Updated: 13 Jan 2022
9 Stars

Gatsby.js V2 starter template based on Directive by HTML5 UP

Github Live Preview

Categories

React Scss

Overview:

The Gatsby-starter-directive is a Gatsby.js V4 starter template based on the Directive theme by HTML5 UP. It provides a customizable and responsive design for websites built with Gatsby. This template makes it easy to create a stylish and functional website using Gatsby.js.

Features:

  • Responsive design: The template is designed to be fully responsive, ensuring that your website will look great on any device.
  • Easy customization: You can easily customize the template by editing the config.js file to add your own details and personalize the site.
  • Github pages deployment: The package.json file includes a default script that uses the gh-pages module to easily publish your site on Github pages.
  • Multiple similar starters available: The template provides a list of other similar starters that you can use as a starting point for your Gatsby project.

Installation:

To install the Gatsby-starter-directive, follow these steps:

  1. Make sure you have the Gatsby CLI program installed on your system.

  2. Run the following command in your CLI to create a new Gatsby project based on the directive starter template:

gatsby new my-directive-site https://github.com/anubhavsrivastava/gatsby-starter-directive
  1. Navigate to the project directory:
cd my-directive-site
  1. Install the project dependencies:
npm install

  1. Edit the config.js file to customize the template with your own details.

  2. To run the site locally, use the following command:

gatsby develop
  1. To deploy the site on Github pages, use the following command:
npm run deploy
  1. If your site is hosted on a subpath of a domain, update the pathPrefix value in the config.js file. If your site is hosted as the root site, remove the pathPrefix configuration.

Summary:

The Gatsby-starter-directive is a starter template for Gatsby.js that is based on the Directive theme by HTML5 UP. It offers a responsive design, easy customization options, and the ability to deploy the site on Github pages. With this template, you can quickly create a stylish and functional website using Gatsby.js.