This is a gatsby starter, it supports multiple languages, NetlifyCMS, styling in Sass, and material ui components. A hosted demo is found at https://mountaincentral.netlify.com

• Built With
• Getting Started
  • Prerequisites
  • Clone the repo
  • Development
  • Sass
  • Set up NetlifyCMS
  • Configuring NetlifyCMS
• Lighthouse Audit
• Author

• GatsbyJS - to obtain static/offline Progressive Web App
• NetlifyCMS - to obtain blog posts from markdown files.
• react-i18next - Internationalization to obtain multilingual site
• Sass - for styling
• react-md - Material UI components customizable in Sass instead of inline styles

These instructions will get you a copy of this gastby starter up and running on your local machine for development and testing purposes.

Make sure to have Node & Yarn installed on your local machine

Open a terminal window and install React & Gatsby's command line tool

yarn add react react-dom gatsby-cli

Clone the repo in the directory of your choice and then move to this new directory

git clone https://github.com/charbelchahine/multilingual-gatsby-netlifycms.git
cd multilingual-gatsby-netlifycms

Install all dependencies for the prototype

yarn install

Start a hot-reloading development environment

gatsby develop

You will now be able to view the prototype at http://localhost:8000/. Any change you make to your React components will immediately be visible in the browser.

Run yarn sasss before making changes to any of the .scss files.

The following steps-by-steps use Netlify to host the starter from GitHub. Other methods can be used to implement NetlifyCMS.

1. Sign in or make a Netlify account
2. Make a New site From Git and select GitHub
3. Select the appropriate repo
4. Go to the Identity tab and Enable Identity
5. Click on Settings and usage
6. Under Registration check Invite only
7. Under External providers, add GitHub, Google etc
8. Under Services enable git gateway
9. Go back to the Identiy tab and invite users/yourself
10. Go to your netlify hosted website /admin/ and login using your credentials to access the CMS

In /static/admin/confiq.yml, the CMS can be configured. Right now, blog posts are configured to have the same path in english & french; hence the titles are also the same since they are configured to create the path in gatsby-node.js.

Charbel Chahine - LinkedIn