initial copy from react-fundamentals

.github/workflows/validate.yml

@@ -0,0 +1,55 @@
+name: deploy
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+on:
+  push:
+    branches:
+      - 'main'
+  pull_request:
+    branches:
+      - 'main'
+jobs:
+  setup:
+    strategy:
+      matrix:
+        os: [ubuntu-latest, windows-latest, macos-latest]
+    runs-on: ${{ matrix.os }}
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+
+      - name: ⎔ Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - name: ▶️ Run setup script
+        run: npm run setup
+
+      - name: ʦ TypeScript
+        run: npm run typecheck
+
+      - name: ⬣ ESLint
+        run: npm run lint
+
+  deploy:
+    name: 🚀 Deploy
+    runs-on: ubuntu-latest
+    # only deploy main branch on pushes
+    if: ${{ github.ref == 'refs/heads/main' && github.event_name == 'push' }}
+
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+
+      - name: 🎈 Setup Fly
+        uses: superfly/flyctl-actions/setup-flyctl@1.5
+
+      - name: 🚀 Deploy
+        run: flyctl deploy --remote-only
+        working-directory: ./epicshop
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}

.gitignore

@@ -0,0 +1,15 @@
+node_modules
+
+workspace/
+**/.cache/
+**/build/
+**/public/build
+**/playwright-report
+data.db
+/playground
+**/tsconfig.tsbuildinfo
+
+# in a real app you'd want to not commit the .env
+# file as well, but since this is for a workshop
+# we're going to keep them around.
+# .env

.npmrc

@@ -0,0 +1,2 @@
+legacy-peer-deps=true
+registry=https://registry.npmjs.org/

.prettierignore

@@ -0,0 +1,7 @@
+node_modules
+**/build/**
+**/public/build/**
+**/public/babel-standalone.js
+.env
+**/package-lock.json
+**/playwright-report/**

LICENSE.md

@@ -0,0 +1,4 @@
+This material is available for private, non-commercial use under the
+[GPL version 3](http://www.gnu.org/licenses/gpl-3.0-standalone.html). If you
+would like to use this material to conduct your own workshop, please contact us
+at team@epicweb.dev

README.md

@@ -0,0 +1,107 @@
+<div>
+  <h1 align="center"><a href="https://www.epicweb.dev/workshops">Get Started with React 🏃‍➡️</a></h1>
+  <strong>
+    Learn the foundational concepts necessary for building React applications and libraries
+  </strong>
+  <p>
+    Learn everything you need to be effective with the fundamental building blocks of React applications. When you're finished, you'll be prepared to create React components to build excellent experiences for your app's users.
+  </p>
+</div>
+
+<hr />
+
+<div align="center">
+  <a
+    alt="Epic Web logo with the words Deployed Version"
+    href="https://epicweb-dev-get-started-with-react.fly.dev/"
+  >
+    <img
+      width="300px"
+      src="https://github-production-user-asset-6210df.s3.amazonaws.com/1500684/254000390-447a3559-e7b9-4918-947a-1b326d239771.png"
+    />
+  </a>
+</div>
+
+<hr />
+
+<!-- prettier-ignore-start -->
+[![Build Status][build-badge]][build]
+[![GPL 3.0 License][license-badge]][license]
+[![Code of Conduct][coc-badge]][coc]
+<!-- prettier-ignore-end -->
+
+## Prerequisites
+
+- Basic understanding of HTML, CSS, JavaScript, and TypeScript
+- Install the [React DevTools](https://react.dev/learn/react-developer-tools)
+
+## Pre-workshop Resources
+
+Here are some resources you can read before taking the workshop to get you up to
+speed on some of the tools and concepts we'll be covering:
+
+- [JavaScript to Know for React](https://kentcdodds.com/blog/javascript-to-know-for-react)
+
+## System Requirements
+
+- [git][git] v2.18 or greater
+- [NodeJS][node] v20 or greater
+- [npm][npm] v8 or greater
+
+All of these must be available in your `PATH`. To verify things are set up
+properly, you can run this:
+
+```shell
+git --version
+node --version
+npm --version
+```
+
+If you have trouble with any of these, learn more about the PATH environment
+variable and how to fix it here for [windows][win-path] or
+[mac/linux][mac-path].
+
+## Setup
+
+This is a pretty large project (it's actually many apps in one) so it can take
+several minutes to get everything set up the first time. Please have a strong
+network connection before running the setup and grab a snack.
+
+> **Warning**: This repo is _very_ large. Make sure you have a good internet
+> connection before you start the setup process. The instructions below use
+> `--depth` to limit the amount you download, but if you have a slow connection,
+> or you pay for bandwidth, you may want to find a place with a better
+> connection.
+
+Follow these steps to get this set up:
+
+```sh nonumber
+git clone --depth 1 https://github.com/epicweb-dev/get-started-with-react.git
+cd get-started-with-react
+npm run setup
+```
+
+If you experience errors here, please open [an issue][issue] with as many
+details as you can offer.
+
+## The Workshop App
+
+Learn all about the workshop app on the
+[Epic Web Getting Started Guide](https://www.epicweb.dev/get-started).
+
+[![Kent with the workshop app in the background](https://github-production-user-asset-6210df.s3.amazonaws.com/1500684/280407082-0e012138-e01d-45d5-abf2-86ffe5d03c69.png)](https://www.epicweb.dev/get-started)
+
+<!-- prettier-ignore-start -->
+[npm]: https://www.npmjs.com/
+[node]: https://nodejs.org
+[git]: https://git-scm.com/
+[build-badge]: https://img.shields.io/github/actions/workflow/status/epicweb-dev/get-started-with-react/validate.yml?branch=main&logo=github&style=flat-square
+[build]: https://github.com/epicweb-dev/get-started-with-react/actions?query=workflow%3Avalidate
+[license-badge]: https://img.shields.io/badge/license-GPL%203.0%20License-blue.svg?style=flat-square
+[license]: https://github.com/epicweb-dev/get-started-with-react/blob/main/LICENSE
+[coc-badge]: https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square
+[coc]: https://kentcdodds.com/conduct
+[win-path]: https://www.howtogeek.com/118594/how-to-edit-your-system-path-for-easy-command-line-access/
+[mac-path]: http://stackoverflow.com/a/24322978/971592
+[issue]: https://github.com/epicweb-dev/get-started-with-react/issues/new
+<!-- prettier-ignore-end -->

epicshop/.npmrc

@@ -0,0 +1,2 @@
+legacy-peer-deps=true
+registry=https://registry.npmjs.org/

epicshop/Dockerfile

@@ -0,0 +1,22 @@
+FROM node:20-bookworm-slim as base
+
+RUN apt-get update && apt-get install -y git
+
+ENV EPICSHOP_CONTEXT_CWD="/myapp/workshop-content"
+ENV EPICSHOP_DEPLOYED="true"
+ENV EPICSHOP_DISABLE_WATCHER="true"
+ENV FLY="true"
+ENV PORT="8080"
+ENV NODE_ENV="production"
+
+WORKDIR /myapp
+
+ADD . .
+
+RUN npm install --omit=dev
+
+CMD node ./setup-swap.js && \
+    rm -rf ${EPICSHOP_CONTEXT_CWD} && \
+    git clone https://github.com/epicweb-dev/get-started-with-react ${EPICSHOP_CONTEXT_CWD} && \
+    cd ${EPICSHOP_CONTEXT_CWD} && \
+    npx epicshop start

epicshop/fly.toml

@@ -0,0 +1,45 @@
+app = "epicweb-dev-get-started-with-react"
+primary_region = "sjc"
+kill_signal = "SIGINT"
+kill_timeout = 5
+processes = [ ]
+
+[experimental]
+allowed_public_ports = [ ]
+auto_rollback = true
+
+[[services]]
+internal_port = 8080
+processes = [ "app" ]
+protocol = "tcp"
+script_checks = [ ]
+
+  [services.concurrency]
+  hard_limit = 100
+  soft_limit = 80
+  type = "connections"
+
+  [[services.ports]]
+  handlers = [ "http" ]
+  port = 80
+  force_https = true
+
+  [[services.ports]]
+  handlers = [ "tls", "http" ]
+  port = 443
+
+  [[services.tcp_checks]]
+  grace_period = "1s"
+  interval = "15s"
+  restart_limit = 0
+  timeout = "2s"
+
+  [[services.http_checks]]
+  interval = "10s"
+  grace_period = "5s"
+  method = "get"
+  path = "/"
+  protocol = "http"
+  timeout = "2s"
+  tls_skip_verify = false
+  headers = { }