This project was bootstrapped with React Starter Kit.
├──
.github
— GitHub configuration including CI/CD workflows
├──
.vscode
— VSCode settings including code snippets, recommended extensions etc.
├──
common
— common (shared) React components
├──
core
— core modules and utility functions
├──
dialogs
— React components implementing modal dialogs
├──
fragments
— common (shared) Relay fragments
├──
hooks
— React hooks such as useLocation()
, useCurrentUser()
, etc.
├──
icons
— custom icon React components
├──
menu
— React components implementing popup menus
├──
public
— static assets such as robots.txt, index.html etc.
├──
routes
— application routes and page (screen) components
├──
scripts
— automation scripts such as yarn deploy
├──
theme
— application theme - colors, fonts, paddings, etc.
├──
workers
— Cloudflare Worker scripts (reverse proxy, SSR)
├──
config
— client-side application settings per environment
└──
index.ts
— application entry point
- React, Relay, Emotion, Material UI v5
- TypeScript, Babel, ESLint, Prettier, Jest, Yarn v2 with PnP, Webpack v5
- Node.js v14 or newer, Yarn package manager
- VS Code editor with recommended extensions
- Clone the repo
git clone -o seed -b main --single-branch https://github.com/kriasoft/react-starter-kit.git
- Install project dependencies —
yarn install
- Launch the app —
yarn start
, it will become available at http://localhost:3000
IMPORTANT: Ensure that VSCode is using the workspace versions of TypeScript and ESLint.
yarn start
— Launches the app in development mode onhttp://localhost:3000
yarn update-schema
— Update GraphQL API schema by running an introspection queryyarn relay
— Updates GraphQL fragments used in the codeyarn build
— Compiles and bundles the app for deploymentyarn lint
— Validate code using ESLintyarn tsc
— Validate code using TypeScript compileryarn test
— Run unit tests with Jest, Supertestyarn deploy
— Deploys the app to Cloudflare
Ensure that client-side application settings for test
(QA) and prod
(production) environments are up-to-date found in the config.ts
file, as well as Cloudflare account credentials found in the .env
file:
# Cloudflare
# https://dash.cloudflare.com/
# https://developers.cloudflare.com/api/tokens/create
CLOUDFLARE_ACCOUNT_ID=
CLOUDFLARE_ZONE_ID=
CLOUDFLARE_API_TOKEN=
Compile and deploy the app by running:
$ yarn build
$ yarn deploy [--env #0]
Where --env
argument is the target environment, e.g. yarn deploy --env=prod
.
yarn set version latest
— Bump Yarn to the latest versionyarn upgrade-interactive
— Update Node.js modules (dependencies)yarn pnpify --sdk vscode
— Update TypeScript, ESLint, and Prettier settings in VSCode