{"id":13400349,"url":"https://github.com/kriasoft/react-starter-kit","last_synced_at":"2025-05-10T10:42:28.225Z","repository":{"id":16095192,"uuid":"18840003","full_name":"kriasoft/react-starter-kit","owner":"kriasoft","description":"The web's most popular Jamstack front-end template (boilerplate) for building web applications with React","archived":false,"fork":false,"pushed_at":"2024-03-31T20:46:53.000Z","size":19994,"stargazers_count":22886,"open_issues_count":7,"forks_count":4169,"subscribers_count":531,"default_branch":"main","last_synced_at":"2025-05-10T10:42:23.149Z","etag":null,"topics":["boilerplate","cloudflare","firebase","firestore","graphql","hackathon","hono","javascript","jotai","joy-ui","nodejs","react","reactjs","scaffolding","serverless","starter-kit","template","trpc","typescript","vite"],"latest_commit_sha":null,"homepage":"https://reactstarter.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"santoshphilip/eppy","license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kriasoft.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null},"funding":{"github":"kriasoft"}},"created_at":"2014-04-16T13:08:18.000Z","updated_at":"2025-05-08T04:25:26.000Z","dependencies_parsed_at":"2023-12-08T04:03:35.133Z","dependency_job_id":"658ce75a-a3e0-4949-906c-d2ae375710e1","html_url":"https://github.com/kriasoft/react-starter-kit","commit_stats":{"total_commits":68,"total_committers":7,"mean_commits":9.714285714285714,"dds":"0.38235294117647056","last_synced_commit":"95c3e61325cc4b1fc8acd23be81590d346dbb4d2"},"previous_names":[],"tags_count":8,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kriasoft%2Freact-starter-kit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kriasoft%2Freact-starter-kit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kriasoft%2Freact-starter-kit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kriasoft%2Freact-starter-kit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kriasoft","download_url":"https://codeload.github.com/kriasoft/react-starter-kit/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253404954,"owners_count":21903109,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["boilerplate","cloudflare","firebase","firestore","graphql","hackathon","hono","javascript","jotai","joy-ui","nodejs","react","reactjs","scaffolding","serverless","starter-kit","template","trpc","typescript","vite"],"created_at":"2024-07-30T19:00:50.979Z","updated_at":"2025-05-10T10:42:28.202Z","avatar_url":"https://github.com/kriasoft.png","language":"TypeScript","funding_links":["https://github.com/sponsors/kriasoft","http://patreon.com/koistya","https://img.shields.io/badge/dynamic/json?color=%23ff424d\u0026label=Patreon\u0026\u0026query=data.attributes.patron_count\u0026suffix=%20patrons\u0026url=https%3A%2F%2Fwww.patreon.com%2Fapi%2Fcampaigns%2F233228"],"categories":["Get Started","Uncategorized","Awesome React","JavaScript","TypeScript","Examples","Web Frontend","Features","前端","Implementations","前端开发框架及项目","React","Javascript","Front-end","Recently Updated","Boilerplates / Templates","Getting Started with (Awesome) TypeScript","Seed List","🛠️ 开发与脚手架","React [🔝](#readme)","🌐 Web Development - Frontend"],"sub_categories":["Templates","Uncategorized","Tools","JavaScript Examples","react","JavaScript/TypeScript","其他_文本生成、文本对话","React starter kit [↗](https://awesomestacks.dev/react-starter-kit)","[Jul 19, 2025](/content/2025/07/19/README.md)","Typescript Project Starters","React"],"readme":"# React Starter Kit\n\n\u003ca href=\"https://github.com/kriasoft/react-starter-kit?sponsor=1\"\u003e\u003cimg src=\"https://img.shields.io/badge/-GitHub-%23555.svg?logo=github-sponsors\" height=\"20\"\u003e\u003c/a\u003e\n\u003ca href=\"http://patreon.com/koistya\"\u003e\u003cimg src=\"https://img.shields.io/badge/dynamic/json?color=%23ff424d\u0026label=Patreon\u0026\u0026query=data.attributes.patron_count\u0026suffix=%20patrons\u0026url=https%3A%2F%2Fwww.patreon.com%2Fapi%2Fcampaigns%2F233228\" height=\"20\"\u003e\u003c/a\u003e\n\u003ca href=\"https://discord.gg/2nKEnKq\"\u003e\u003cimg src=\"https://img.shields.io/discord/643523529131950086?label=Chat\" height=\"20\"\u003e\u003c/a\u003e\n\u003ca href=\"https://github.com/kriasoft/react-starter-kit/stargazers\"\u003e\u003cimg src=\"https://img.shields.io/github/stars/kriasoft/react-starter-kit.svg?style=social\u0026label=Star\u0026maxAge=3600\" height=\"20\"\u003e\u003c/a\u003e\n\u003ca href=\"https://twitter.com/koistya\"\u003e\u003cimg src=\"https://img.shields.io/twitter/follow/koistya.svg?style=social\u0026label=Follow\u0026maxAge=3600\" height=\"20\"\u003e\u003c/a\u003e\n\nThe web's most popular Jamstack front-end template for building web applications with\n[React](https://react.dev/).\n\n## Features\n\n- Optimized for serverless deployment to CDN edge locations (Cloudflare Workers)\n- HTML page rendering (SSR) at CDN edge locations, all ~100 points on Lighthouse\n- Hot module replacement during local development using React Refetch\n- Pre-configured with CSS-in-JS styling using Emotion.js\n- Pre-configured with code quality tools: ESLint, Prettier, TypeScript, Vitest, etc.\n- Pre-configured with VSCode code snippets and other VSCode settings\n- The ongoing design and development is supported by these wonderful companies:\n\n\u003ca href=\"https://reactstarter.com/s/1\"\u003e\u003cimg src=\"https://reactstarter.com/s/1.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/s/2\"\u003e\u003cimg src=\"https://reactstarter.com/s/2.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/s/3\"\u003e\u003cimg src=\"https://reactstarter.com/s/3.png\" height=\"60\" /\u003e\u003c/a\u003e\n\n---\n\nThis project was bootstrapped with [React Starter Kit](https://github.com/kriasoft/react-starter-kit).\nBe sure to join our [Discord channel](https://discord.com/invite/2nKEnKq) for assistance.\n\n## Directory Structure\n\n`├──`[`.github`](.github) — GitHub configuration including CI/CD workflows\u003cbr\u003e\n`├──`[`.vscode`](.vscode) — VSCode settings including code snippets, recommended extensions etc.\u003cbr\u003e\n`├──`[`app`](./app) — Web application front-end built with [React](https://react.dev/) and [Joy UI](https://mui.com/joy-ui/getting-started/)\u003cbr\u003e\n`├──`[`db`](./db) — Firestore database schema, seed data, and admin tools\u003cbr\u003e\n`├──`[`edge`](./edge) — Cloudflare Workers (CDN) edge endpoint\u003cbr\u003e\n`├──`[`env`](./env) — Application settings, API keys, etc.\u003cbr\u003e\n`├──`[`scripts`](./scripts) — Automation scripts such as `yarn deploy`\u003cbr\u003e\n`├──`[`server`](./server) — Node.js application server built with [tRPC](https://trpc.io/)\u003cbr\u003e\n`├──`[`tsconfig.base.json`](./tsconfig.base.json) — The common/shared TypeScript configuration\u003cbr\u003e\n`└──`[`tsconfig.json`](./tsconfig.json) — The root TypeScript configuration\u003cbr\u003e\n\n## Tech Stack\n\n- [React](https://react.dev/), [React Router](https://reactrouter.com/), [Jotai](https://jotai.org/), [Emotion](https://emotion.sh/), [Joy UI](https://mui.com/joy-ui/getting-started/), [Firebase Authentication](https://firebase.google.com/docs/auth)\n- [Cloudflare Workers](https://workers.cloudflare.com/), [Vite](https://vitejs.dev/), [Vitest](https://vitejs.dev/),\n  [TypeScript](https://www.typescriptlang.org/), [ESLint](https://eslint.org/), [Prettier](https://prettier.io/), [Yarn](https://yarnpkg.com/) with PnP\n\n## Requirements\n\n- [Node.js](https://nodejs.org/) v18+ with [Corepack](https://nodejs.org/api/corepack.html) (`$ corepack enable`)\n- [VS Code](https://code.visualstudio.com/) editor with [recommended extensions](.vscode/extensions.json)\n- Optionally [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en)\n  and [Reactime](https://chrome.google.com/webstore/detail/reactime/cgibknllccemdnfhfpmjhffpjfeidjga?hl=en) browser extensions\n\n## Getting Started\n\n[Generate](https://github.com/kriasoft/react-starter-kit/generate) a new project\nfrom this template, clone it, install project dependencies, update the\nenvironment variables found in [`env/*.env`](./env/), and start hacking:\n\n```\n$ git clone https://github.com/kriasoft/react-starter-kit.git example\n$ cd ./example\n$ corepack enable\n$ yarn install\n$ yarn workspace app start\n```\n\nThe app will become available at [http://localhost:5173/](http://localhost:5173/) (press `q` + `Enter` to exit).\n\n**IMPORTANT**: Ensure that VSCode is using the workspace [version of TypeScript](https://code.visualstudio.com/docs/typescript/typescript-compiling#_using-newer-typescript-versions)\nand ESLint.\n\n![](https://files.tarkus.me/typescript-workspace.png)\n\n## Scripts\n\n- `yarn start` — Launches the app in development mode on [`http://localhost:5173/`](http://localhost:5173/)\n- `yarn build` — Compiles and bundles the app for deployment\n- `yarn lint` — Validate the code using ESLint\n- `yarn tsc` — Validate the code using TypeScript compiler\n- `yarn test` — Run unit tests with Vitest, Supertest\n- `yarn edge deploy` — Deploys the app to Cloudflare\n\n## How to Deploy\n\nEnsure that all the environment variables for the target deployment environment\n(`test`, `prod`) found in [`/env/*.env`](./env/) files are up-to-date.\n\nIf you haven't done it already, push any secret values you may need to CF Workers\nenvironment by running `yarn workspace edge wrangler secret put \u003cNAME\u003e [--env #0]`.\n\nFinally build and deploy the app by running:\n\n```\n$ yarn build\n$ yarn deploy [--env #0] [--version #0]\n```\n\nWhere `--env` argument is the target deployment area, e.g. `yarn deploy --env=prod`.\n\n## How to Update\n\n- `yarn set version latest` — Bump Yarn to the latest version\n- `yarn upgrade-interactive` — Update Node.js modules (dependencies)\n- `yarn dlx @yarnpkg/sdks vscode` — Update TypeScript, ESLint, and Prettier settings in VSCode\n\n## Contributors 👨‍💻\n\n\u003ca href=\"https://reactstarter.com/c/1\"\u003e\u003cimg src=\"https://reactstarter.com/c/1.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/c/2\"\u003e\u003cimg src=\"https://reactstarter.com/c/2.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/c/3\"\u003e\u003cimg src=\"https://reactstarter.com/c/3.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/c/4\"\u003e\u003cimg src=\"https://reactstarter.com/c/4.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/c/5\"\u003e\u003cimg src=\"https://reactstarter.com/c/5.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/c/6\"\u003e\u003cimg src=\"https://reactstarter.com/c/6.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/c/7\"\u003e\u003cimg src=\"https://reactstarter.com/c/7.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/c/8\"\u003e\u003cimg src=\"https://reactstarter.com/c/8.png\" height=\"60\" /\u003e\u003c/a\u003e\n\n## Backers 💰\n\n\u003ca href=\"https://reactstarter.com/b/1\"\u003e\u003cimg src=\"https://reactstarter.com/b/1.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/b/2\"\u003e\u003cimg src=\"https://reactstarter.com/b/2.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/b/3\"\u003e\u003cimg src=\"https://reactstarter.com/b/3.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/b/4\"\u003e\u003cimg src=\"https://reactstarter.com/b/4.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/b/5\"\u003e\u003cimg src=\"https://reactstarter.com/b/5.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/b/6\"\u003e\u003cimg src=\"https://reactstarter.com/b/6.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/b/7\"\u003e\u003cimg src=\"https://reactstarter.com/b/7.png\" height=\"60\" /\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u003ca href=\"https://reactstarter.com/b/8\"\u003e\u003cimg src=\"https://reactstarter.com/b/8.png\" height=\"60\" /\u003e\u003c/a\u003e\n\n## Related Projects\n\n- [GraphQL API and Relay Starter Kit](https://github.com/kriasoft/graphql-starter) — monorepo template, pre-configured with GraphQL API, React, and Relay\n- [Cloudflare Workers Starter Kit](https://github.com/kriasoft/cloudflare-starter-kit) — TypeScript project template for Cloudflare Workers\n- [Node.js API Starter Kit](https://github.com/kriasoft/node-starter-kit) — project template, pre-configured with Node.js, GraphQL, and PostgreSQL\n\n## How to Contribute\n\nAnyone and everyone is welcome to [contribute](.github/CONTRIBUTING.md). Start\nby checking out the list of [open issues](https://github.com/kriasoft/react-starter-kit/issues)\nmarked [help wanted](https://github.com/kriasoft/react-starter-kit/issues?q=label:\"help+wanted\").\nHowever, if you decide to get involved, please take a moment to review the\n[guidelines](.github/CONTRIBUTING.md).\n\n## License\n\nCopyright © 2014-present Kriasoft. This source code is licensed under the MIT license found in the\n[LICENSE](https://github.com/kriasoft/react-starter-kit/blob/main/LICENSE) file.\n\n---\n\n\u003csup\u003eMade with ♥ by Konstantin Tarkus ([@koistya](https://twitter.com/koistya), [blog](https://medium.com/@koistya))\nand [contributors](https://github.com/kriasoft/react-starter-kit/graphs/contributors).\u003c/sup\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkriasoft%2Freact-starter-kit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkriasoft%2Freact-starter-kit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkriasoft%2Freact-starter-kit/lists"}