Giter VIP home page Giter VIP logo

docs.cryptowerk.com's Introduction

Inspired by gatsby-gitbook-starter from Hasura.io

See their repo for all the goods. They get the credit here. We like what they are doing and pull from them.

$ git clone [email protected]:hasura/gatsby-gitbook-starter.git
$ npm install
$ npm start

๐Ÿš€ Quickstart for docs.cryptowerk.com

Get started by running the following commands:

$ git clone https://github.com/cryptowerk/docs.cryptowerk.com.git
$ npm install
$ npm start

Visit http://localhost:8000/ to view the app.

๐Ÿ”ง Configure

Write markdown files in content folder.

Open config.js for templating variables. Broadly configuration is available for gatsby, header, sidebar and siteMetadata.

  • gatsby config for global configuration like

    • pathPrefix - Gatsby Path Prefix
    • siteUrl - Gatsby Site URL
    • gaTrackingId - Google Analytics Tracking ID
  • header config for site header configuration like

    • title - The title that appears on the top left
    • githubUrl - The Github URL for the docs website
    • helpUrl - Help URL for pointing to resources
    • tweetText - Tweet text
    • links - Links on the top right
    • search - Enable search and configure Algolia
  • sidebar config for navigation links configuration

    • forcedNavOrder for left sidebar navigation order. It should be in the format "/"
    • frontLine - whether to show a front line at the beginning of a nested menu.(Collapsing capability would be turned of if this option is set to true)
    • links - Links on the bottom left of the sidebar
    • ignoreIndex - Set this to true if the index.md file shouldn't appear on the left sidebar navigation. Typically this can be used for landing pages.
  • siteMetadata config for website related configuration

    • title - Title of the website
    • description - Description of the website
    • ogImage - Social Media share og:image tag
    • docsLocation - The Github URL for Edit on Github
  • For sub nesting in left sidebar, create a folder with the same name as the top level .md filename and the sub navigation is auto-generated. The sub navigation is alphabetically ordered.

Live Code Editor

To render react components for live editing, add the react-live=true to the code section. For example:

<button>Edit my text</button>

In the above code, just add javascript react-live=true after the triple quote ``` to start rendering react components that can be edited by users.

๐Ÿค– SEO friendly

This is a static site and comes with all the SEO benefits. Configure meta tags like title and description for each markdown file using MDX Frontmatter

---
title: "Title of the page"
metaTitle: "Meta Title Tag for this page"
metaDescription: "Meta Description Tag for this page"
---

Canonical URLs are generated automatically.

โ˜๏ธ Deploy

Deploy to Netlify

docs.cryptowerk.com's People

Contributors

i001962 avatar zoemeckbach avatar

Stargazers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.