Skip to content
No description, website, or topics provided.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.editorconfig
.eslintrc
.gitignore
.stylelintrc
CHANGELOG.MD
LICENSE
README.md
gatsby-browser.js
gatsby-config.js
gatsby-node.js
gatsby-ssr.js
package-lock.json
package.json

README.md

TakeShape

Shape Portfolio — A TakeShape Sample Project Build With Gatsby.js

This is a sample project to get you started building a static website with TakeShape (TS) and Gatsby.js. You can see the sample project in action here: https://shape-portfolio.takeshapesampleproject.com/

Quickstart with Netlify

  1. Fork this repo.
  2. Visit https://app.netlify.com/start to create a new Netlify site from the forked repo.
  3. Clone the forked repo.
  4. Run netlify link to link the working directory to the netlify site.
  5. Run netlify addons:create takeshape --template shape-portfolio.
  6. Run netlify addons:auth takeshape.
  7. Follow the instructions to create a TakeShape account and claim the TakeShape project.
  8. Change some content in the TakeShape project.
  9. From Netlify, observe Gatsby build on Netlify and then visit the deployed site.

Quickstart

  1. Signup or login at TakeShape.
  2. Create a new project and select the "Shape Portfolio" template
  3. Create a new API key in TakeShape and name is "Gatsby". Copy the API key into your clipboard
  4. git clone https://github.com/takeshape/takeshape-samples takeshape-samples && cd takeshape-samples/shape-portfolio-gatsbyjs
  5. Make a .env file that contains the following
TAKESHAPE_PROJECT=<TAKESHAPE-PROJECT-ID-FROM-URL>
TAKESHAPE_TOKEN=<TAKESHAPE-API-KEY-YOU-COPIED>
  1. npm install - This will install all dependencies
  2. npm start - Start the development server. It runs on http://localhost:8000 by default
  3. Have fun playing around with the sample site!
    • Change some markup a template file and the site will regenerate automatically
    • Try adding a new field to an existing content type then add it to the corresponding GraphQL query and template

Deploy

Check our walkthrough for instructions on how to deploy this Gatsby site to Netlify and trigger builds with TakeShape's webhooks.

GraphQL tips

If you're using JetBrains we recommend using the JS GraphQL plugin. This plugin allows for real time validation of your queries against the schema you define in TS though modeling

Reach out

If we can make your life easier we want to hear from you at support@takeshape.io

Learning Gatsby

Looking for more guidance? Full documentation for Gatsby lives on the website. Here are some places to start:

You can’t perform that action at this time.