Skip to content
This repository has been archived by the owner on Oct 30, 2022. It is now read-only.

meeshkan/shortcut-startup-school-workshop

Repository files navigation

CircleCI

This is a Node.js application running an Express server and using React for server-side rendering. The application displays a list of your GitHub repositories (that's you, the developer).

Accompanying slides can be found here.

Instructions

Running the application locally

  1. Create a new personal GitHub access token with read access to your repositories
  2. Set the environment variable GITHUB_TOKEN in .env file (see .env.example for an example)
  3. Install dependencies: yarn (or npm i)
  4. Run the development server with hot reloading: yarn dev
  5. Navigate to localhost:3000
  6. To build the app and run in production mode: yarn build && yarn start

Running tests

Run tests:

$ yarn test

Everything is skipped because nothing's implemented yet: we'll do that!

Note that running tests should not require a GitHub access token: they should use Unmock.

Workshop agenda

Part 1: Getting started

9.50 - 10.20

  1. SSR 101
  2. Tour of the app

Hands-on:

  1. Fork the repository
  2. Get the application to run locally
  3. Make any pull request to your fork, "approve" and merge 🦄
  4. Make a pull request to unmock/shortcut-startup-school-workshop

Part 2: CI/CD

10.20 - 10.40

  1. Introduction to CI/CD

Hands-on:

  1. Log into CircleCI
  2. Add CircleCI to your fork
  3. Add command to run tests

Part 3: Testing

10.40 - 11.30

  1. Slides
  2. Tour of Unmock

Hands-on:

  1. Writing tests for our application

Part 4: Hacking

11.30 - 11.50

  1. Hack away and ask questions
  2. Ideas:
    • Add test reporter
    • Add support for fetching all GitHub repositories
    • Add continuous deployment to Heroku

Disclaimer

Note that the application server renders static markup and does not attempt to hydrate the markup. So adding event listeners etc. will fail. If you want to add interactivity, client-side routing, and/or more complex logic on what to fetch in server and in client, you might want to take a look at a framework like Next.js.

Deployment to Heroku

  1. Add the deploy job from noitulos branch to .circleci/config.yml
  2. Login to Heroku, install CLI, create API key
  3. Login with CLI: heroku login
  4. Create app: heroku create
  5. Add GITHUB_TOKEN in Heroku as ENV var
  6. Add HEROKU_API_KEY and HEROKU_APP_NAME in CircleCI

About

Materials for the CI/CD workshop at Shortcut

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published