-
Clone repository.
Clone this repository to your local environment
git clone https://github.com/svenjungnickel/hayahaycafe.git
-
Install dependencies.
Navigate into the cloned repo and install dependencies.
cd hayahaycafe/ npm install
-
Define environment variables.
-
Gatsby
Define your environment variables before you start. To do so, simply copy
.env.dist
and rename it to.env.development
. Then update the variables with your parameters.Hint: Use the predefined SITE_RECAPTCHA_KEY and GATSBY_SITE_RECAPTCHA_KEY for automated tests. More details under E2E tests.
-
Cypress
You have to define the Netlify CMS login details in the cypress environment files in order to run E2E Tests. Copy
cypress.env.json.dist
, rename it tocypress.env.json
and enter the login credentials. Additional copy the.env.development
and rename it to.env.production
. This is necessary because we are running the cypress tests against a local production server.
-
-
Start developing.
4.1 Netlify CMS local backend
If you want to use Netlify CMS locally to edit your content first start the Netlify CMS proxy server before you start the gatsby developer server.
npx netlify-cms-proxy-server
Alternatively you can use a predefined npm command
npm run netlifycms:proxyserver
4.2 Gatsby local developer server
Start a local server for developing via gatsby.
gatsby develop
Alternatively you can use a predefined npm command which cleans also the gatsby cache and makes the dev server accessible in your local network (for visiting from your mobile device).
npm run develop
-
Open the source code and start editing!
Your site is now running at
http://localhost:8000
!Note: You'll also see a second link:
http://localhost:8000/___graphql
. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.Open the
hayahaycafe
directory in your code editor of choice and editsrc/pages/index.js
. Save your changes and the browser will update in real time!
To deploy on Netlify just hit following button:
You can also test the Netlify build before you deploy.
-
Link Netlify Project.
Run following command to link the project.
netlify link
Select a way to link the project.
-
Run test build.
To test the build run following command:
netlify build
This will run the build on your local dev environment. The logs will show if the build will be successful or has any errors.
We are using EsLint for Javascript linting. Simply run following command to lint your code:
npm run lint
To fix any issues simply run the fix command:
npm run lint:fix
We are using Jest for unit tests. You can find more details in the gatsby docs.
To run all unit tests simply use following command:
npm run test
You can also watch unit tests while developing:
npx jest --watch
To watch all unit tests run following:
npx jest --watchAll
All unit tests generate also code coverage. You can find the generated code coverage under <rootDir>/coverage/index.html
.
We are using Cypress for E2E tests. You can find more details in the gatsby docs.
To start cypress simply use following command:
npm run test:e2e
To run all tests in headless mode use following command:
npm run test:e2e:ci
E2E tests running in CI are recorded. You can find all recorded tests in the
We are running lighthouse audits via lighthouse CI CLI.
To start Lighthouse audits simply use following command:
npm run lighthouse
We are using stryker for mutation tests.
To start stryker simply use following command:
npm run stryker:run
You can find a full report of the mutation tests in the Stryker Dashboard
To test GitHub actions locally before pushing to GitHub we are using nektos/act.
You have to install it first via brew brew install act
. Then you can run actions via following command:
act -j <workflow-name>
Visit the docs for more example commands.
This project is setup to reject push and commits directly to master. To prevent commits to master on your local machine
install following pre-commit hook to your .git/hooks/pre-commit
file.
#!/bin/sh
branch="$(git rev-parse --abbrev-ref HEAD)"
if [ "$branch" = "master" ]; then
echo "You can't commit directly to master branch"
exit 1
fi
After your created the file you have to make it executable:
chmod +x .git/hooks/pre-commit
If you work on a Mac OS using OS X Mojave and get weird error messages, try following work around.