maverick/netlify-cms-react-starter
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update readme

Browse source
This commit is contained in:
Jinksi 2017-11-18 13:52:15 +10:00
parent 3862c31062
commit e5664c497d
1 changed files with 57 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
README.md
View file

@ -1,36 +1,69 @@
# 🍉 HyperStatic
A not-so-static site boilerplate:
- **Create React App** for simplicity
- **Styled Components** for component-based css
- **React Router** for routing (v4)
- **React Helmet** for document titles, descriptions, meta
- **React Snapshot** for pre-rendering to static html so it works without Javascript ⭐️
# 🌶 Netlify CMS + React Starter
[![Standard - JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](http://standardjs.com/)
[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/Jinksi/hyperstatic)
A starter project for creating lightning-fast, offline-first websites with [Netlify CMS](https://netlifycms.org) and React.
- **[Create React App](https://github.com/facebookincubator/create-react-app)**
- **[Styled Components](https://github.com/styled-components/styled-components)** for component-based styling
- **[React Router](https://github.com/ReactTraining/react-router)** for routing
- **[React Helmet](https://github.com/nfl/react-helmet)** for document titles, descriptions, meta
- **[React Snapshot](https://github.com/geelen/react-snapshot)** for pre-rendering to static html so it works without Javascript ⭐️
- **[Netlify CMS](https://github.com/netlify/netlify-cms)** for content management
I aim to include commonly used components and best-practices e.g. forms, settings, <head> tags, lazy-loading images, etc.
## Get going
``` shell
git clone https://github.com/jinksi/hyperstatic.git
cd hyperstatic
yarn install
yarn start
```
[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/Jinksi/netlify-cms-react-starter)
## Build
1. Hit the **Deploy to Netlify** button. This will:
``` shell
yarn build
```
- Clone the repo into your Github account
- Create you a new project on Netlify, build & deploy
This will generate static html files for each route into the `./build` directory. Ready for deployment!
1. Once your Netlify project has been created, change a couple of settings:
## Thanks
- Enable **Identity**
- Change **Registration Preferences** to **Invite Only**
- Enable **Git Gateway**
Originally forked from [superhighfives/an-almost-static-stack](https://github.com/superhighfives/an-almost-static-stack). Check this out if you want a similar starting point for your own project.
1. Invite users (probably yourself) to enable admin access
Bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).
- Open the **Identity** tab and hit **Invite Users**
## Show me the CMS!
The CMS lives at [\__YOUR_SITE_NAME__.netlify.com/admin](https://__YOUR_SITE_NAME__.netlify.com/admin).
## Developing
1. Clone your repo to your local machine
1. Install dependencies
`yarn` or `npm install`
1. Run the development server
`yarn start` or `npm run start`
If you are adding or editing content locally in the CMS, a couple of things to note:
1. Changes will be pushed to the remote repo.
1. You will be prompted to enter your site's url, this is necessary for Netlify Identity to manage user login. This is stored in `localStorage`, so you might have to empty your browser cache if you are switching projects but remaining on `localhost:3000`.
## Editing CMS fields
The Netlify CMS configuration is located in `public/admin/config.yml`. This is where you will configure the pages, fields, posts and settings that are editable by the CMS.
Find out more in the [Netlify CMS Docs](https://www.netlifycms.org/docs/#configuration).
## See also
[Netlify CMS Docs](https://www.netlifycms.org/docs/)
[Netlify CMS Repo](https://github.com/netlify/netlify-cms)
[Hyperstatic](https://github.com/Jinksi/hyperstatic) – the same starter project minus Netlify CMS
[Gatsby + Netlify CMS Starter](https://github.com/AustinGreen/gatsby-starter-netlify-cms)