GithubHelp home page GithubHelp logo

gatsby-contentful-starter

Gatsby Contentful starter for creating a blog

The index page of the starter blog

Static sites are scalable, secure and have very little required maintenance. They come with a drawback though. Not everybody feels good editing files, building a project and uploading it somewhere. This is where Contentful comes into play.

With Contentful and Gatsby you can connect your favorite static site generator with an API that provides an easy to use interface for people writing content and automate the publishing using services like Travis CI or Netlify.

Features

  • Simple content model and structure. Easy to adjust to your needs.
  • Contentful integration using our Sync API
  • Using our Delivery API.
  • Responsive/adaptive images via gatsby-image

Contribution

This project is part of contentful-userland which means that we’re always open to contributions and you can be part of userland and shape the project yourself after your first merged pull request. You can learn more about how contentful userland is organized by visiting our about repository.

Requirements

To use this project you have to have a Contentful account. If you don't have one yet you can register at www.contentful.com/sign-up.

Getting started

Install Yarn (if you haven't already).

Get the source code and install dependencies.

$ git clone [email protected]:contentful-userland/gatsby-contentful-starter.git
$ yarn install

Or use the Gatsby CLI.

$ gatsby new contentful-starter https://github.com/contentful-userland/gatsby-contentful-starter

Set up of the needed content model and create a configuration file

This project comes with a Contentful setup command yarn run setup.

Command line dialog of the yarn run setup command

This command will ask you for a space ID, and access tokens for the Contentful Management and Delivery API and then import the needed content model into the space you define and write a config file (./contentful.json).

yarn run setup automates that for you but if you want to do it yourself rename .contentful.json.sample to .contentful.json and add your configuration in this file.

Crucial Commands

This project comes with a few handy commands for linting and code fixing. The most important ones are the ones to develop and ship code. You can find the most important commands below.

yarn run dev

Run in the project locally.

yarn run build

Run a production build into ./public. The result is ready to be put on any static hosting you prefer.

yarn run deploy

Run a production build into ./public and publish the site to GitHub pages.

yarn run cleanup-repository

Removes all dependencies, scripts and data from the installation script.

Roadmap

Other resources

Hafeez Syed's Projects

jaws icon jaws

JAWS: The Javascript + AWS Stack – A monstrously scalable, server-free, web application boilerplate using bleeding-edge AWS services...

joola icon joola

Embedded, realtime data analytics and visualization.

jquery-ui icon jquery-ui

The official jQuery user interface library.

jslint icon jslint

The JavaScript Code Quality Tool

kappa icon kappa

A hierarchical npm-registry proxy

karma icon karma

Spectacular Test Runner for JavaScript

keenclient-node icon keenclient-node

Official NodeJS client for the Keen IO API. Build analytics features directly into your NodeJS apps.

kenobi icon kenobi

Render external objects and array in view engines

learnyounode icon learnyounode

Learn You The Node.js For Much Win! An intro to Node.js via a set of self-guided workshops.

libsass icon libsass

A C/C++ implementation of a Sass compiler

lodash icon lodash

A JavaScript utility library delivering consistency, modularity, performance, & extras.

log.io icon log.io

Real-time log monitoring in your browser

loopback icon loopback

LoopBack is an open source Node.js framework built on top of Express optimized for mobile, web, and other devices. Connect to multiple data sources, write business logic in Node.js, glue on top of your existing services and data, connect using JS, iOS & Android SDKs.

lusca icon lusca

Application security for express apps.

markdown-here icon markdown-here

Google Chrome, Firefox, and Thunderbird extension that lets you write email in Markdown and render it before sending.

mars icon mars

Forget live coding, easy code demos.

mean icon mean

MEAN (Mongo, Express, Angular, Node) - A Simple, Scalable and Easy starting point for full stack javascript web development - utilizing many of the best practices we've found on the way

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.