{"id":13725784,"url":"https://github.com/kentcdodds/advanced-react-patterns","last_synced_at":"2025-09-11T13:44:45.539Z","repository":{"id":224677334,"uuid":"758226908","full_name":"kentcdodds/advanced-react-patterns","owner":"kentcdodds","description":"Learn how to build simple and flexible React Components and Hooks using modern patterns","archived":false,"fork":false,"pushed_at":"2024-09-30T16:53:23.000Z","size":3279,"stargazers_count":279,"open_issues_count":1,"forks_count":72,"subscribers_count":8,"default_branch":"main","last_synced_at":"2025-04-01T12:04:43.969Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://www.epicreact.dev/modules/advanced-react-patterns-v1/advanced-react-patterns-welcome","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kentcdodds.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-02-15T21:47:35.000Z","updated_at":"2025-03-30T17:15:34.000Z","dependencies_parsed_at":null,"dependency_job_id":"0417fa9c-e5d7-4304-b26f-e154ec7d7af8","html_url":"https://github.com/kentcdodds/advanced-react-patterns","commit_stats":null,"previous_names":["kentcdodds/advanced-react-patterns"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kentcdodds%2Fadvanced-react-patterns","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kentcdodds%2Fadvanced-react-patterns/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kentcdodds%2Fadvanced-react-patterns/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kentcdodds%2Fadvanced-react-patterns/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kentcdodds","download_url":"https://codeload.github.com/kentcdodds/advanced-react-patterns/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247980843,"owners_count":21027808,"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":[],"created_at":"2024-08-03T01:02:34.966Z","updated_at":"2025-04-09T05:13:06.365Z","avatar_url":"https://github.com/kentcdodds.png","language":"JavaScript","funding_links":[],"categories":["React","JavaScript"],"sub_categories":[],"readme":"\u003cdiv\u003e\n  \u003ch1 align=\"center\"\u003e\u003ca href=\"https://www.epicreact.dev/modules/advanced-react-patterns-v1/advanced-react-patterns-welcome\"\u003e🤯 Advanced React Patterns 🚀 EpicReact.Dev\u003c/a\u003e\u003c/h1\u003e\n  \u003cstrong\u003e\n    Learn how to build simple and flexible React Components and Hooks using\n    modern patterns\n  \u003c/strong\u003e\n  \u003cp\u003e\n    Not only learn great patterns you can use but also the strengths and\n    weaknesses of each, so you know which to reach for to provide your custom\n    hooks and components the flexibility and power you need.\n  \u003c/p\u003e\n\n  \u003ca href=\"https://epicreact.dev\"\u003e\n    \u003cimg\n      alt=\"Learn React from Start to Finish\"\n      src=\"https://kentcdodds.com/images/epicreact-promo/er-1.gif\"\n    /\u003e\n  \u003c/a\u003e\n\u003c/div\u003e\n\n\u003chr /\u003e\n\n\u003c!-- prettier-ignore-start --\u003e\n[![Build Status][build-badge]][build]\n[![All Contributors][all-contributors-badge]](#contributors)\n[![GPL 3.0 License][license-badge]][license]\n[![Code of Conduct][coc-badge]][coc]\n[![Gitpod ready-to-code][gitpod-badge]](https://gitpod.io/#https://github.com/kentcdodds/advanced-react-patterns)\n\u003c!-- prettier-ignore-end --\u003e\n\n## Prerequisites\n\n- Read my blog post\n  [Inversion of Control](https://kentcdodds.com/blog/inversion-of-control). Or\n  watch\n  [Implement Inversion of Control](https://egghead.io/lessons/egghead-implement-inversion-of-control?pl=kent-s-blog-posts-as-screencasts-eefa540c\u0026af=5236ad)\n- The more experience you have with building React abstractions, the more\n  helpful this workshop will be for you.\n\n\u003e NOTE: The EpicReact.dev videos were recorded with React version ^16.13 and all\n\u003e material in this repo has been updated to React version ^18. Differences are\n\u003e minor and any relevant differences are noted in the instructions.\n\n## Quick start\n\nIt's recommended you run everything in the same environment you work in every\nday, but if you don't want to set up the repository locally, you can get started\nin one click with [Gitpod](https://gitpod.io),\n[CodeSandbox](https://codesandbox.io/s/github/kentcdodds/advanced-react-patterns),\nor by following the [video demo](https://www.youtube.com/watch?v=gCoVJm3hGk4)\ninstructions for [GitHub Codespaces](https://github.com/features/codespaces).\n\n[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/kentcdodds/advanced-react-patterns)\n\nFor a local development environment, follow the instructions below\n\n## System Requirements\n\n- [git][git] v2.13 or greater\n- [NodeJS][node] `\u003e=16`\n- [npm][npm] v8.16.0 or greater\n\nAll of these must be available in your `PATH`. To verify things are set up\nproperly, you can run this:\n\n```shell\ngit --version\nnode --version\nnpm --version\n```\n\nIf you have trouble with any of these, learn more about the PATH environment\nvariable and how to fix it here for [windows][win-path] or\n[mac/linux][mac-path].\n\n## Setup\n\n\u003e If you want to commit and push your work as you go, you'll want to\n\u003e [fork](https://docs.github.com/en/free-pro-team@latest/github/getting-started-with-github/fork-a-repo)\n\u003e first and then clone your fork rather than this repo directly.\n\nAfter you've made sure to have the correct things (and versions) installed, you\nshould be able to just run a few commands to get set up:\n\n```shell\ngit clone https://github.com/kentcdodds/advanced-react-patterns.git\ncd advanced-react-patterns\nnode setup\n```\n\nThis may take a few minutes. **It will ask you for your email.** This is\noptional and just automatically adds your email to the links in the project to\nmake filling out some forms easier.\n\nIf you get any errors, please read through them and see if you can find out what\nthe problem is. If you can't work it out on your own then please [file an\nissue][issue] and provide _all_ the output from the commands you ran (even if\nit's a lot).\n\nIf you can't get the setup script to work, then just make sure you have the\nright versions of the requirements listed above, and run the following commands:\n\n```shell\nnpm install\nnpm run validate\n```\n\nIf you are still unable to fix issues and you know how to use Docker 🐳 you can\nsetup the project with the following command:\n\n```shell\ndocker-compose up\n```\n\n## Running the app\n\nTo get the app up and running (and really see if it worked), run:\n\n```shell\nnpm start\n```\n\nThis should start up your browser. If you're familiar, this is a standard\n[react-scripts](https://create-react-app.dev/) application.\n\nYou can also open\n[the deployment of the app on Netlify](https://advanced-react-patterns.netlify.app/).\n\n## Running the tests\n\n```shell\nnpm test\n```\n\nThis will start [Jest](https://jestjs.io/) in watch mode. Read the output and\nplay around with it. The tests are there to help you reach the final version,\nhowever _sometimes_ you can accomplish the task and the tests still fail if you\nimplement things differently than I do in my solution, so don't look to them as\na complete authority.\n\n### Exercises\n\n- `src/exercise/00.md`: Background, Exercise Instructions, Extra Credit\n- `src/exercise/00.js`: Exercise with Emoji helpers\n- `src/__tests__/00.js`: Tests\n- `src/final/00.js`: Final version\n- `src/final/00.extra-0.js`: Final version of extra credit\n\nThe purpose of the exercise is **not** for you to work through all the material.\nIt's intended to get your brain thinking about the right questions to ask me as\n_I_ walk through the material.\n\n### Helpful Emoji 🐨 💰 💯 📝 🦉 📜 💣 💪 🏁 👨‍💼 🚨\n\nEach exercise has comments in it to help you get through the exercise. These fun\nemoji characters are here to help you.\n\n- **Kody the Koala** 🐨 will tell you when there's something specific you should\n  do\n- **Marty the Money Bag** 💰 will give you specific tips (and sometimes code)\n  along the way\n- **Hannah the Hundred** 💯 will give you extra challenges you can do if you\n  finish the exercises early.\n- **Nancy the Notepad** 📝 will encourage you to take notes on what you're\n  learning\n- **Olivia the Owl** 🦉 will give you useful tidbits/best practice notes and a\n  link for elaboration and feedback.\n- **Dominic the Document** 📜 will give you links to useful documentation\n- **Berry the Bomb** 💣 will be hanging around anywhere you need to blow stuff\n  up (delete code)\n- **Matthew the Muscle** 💪 will indicate that you're working with an exercise\n- **Chuck the Checkered Flag** 🏁 will indicate that you're working with a final\n- **Peter the Product Manager** 👨‍💼 helps us know what our users want\n- **Alfred the Alert** 🚨 will occasionally show up in the test failures with\n  potential explanations for why the tests are failing.\n\n## Contributors\n\nThanks goes to these wonderful people\n([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):\n\n\u003c!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --\u003e\n\u003c!-- prettier-ignore-start --\u003e\n\u003c!-- markdownlint-disable --\u003e\n\u003ctable\u003e\n  \u003ctbody\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://kentcdodds.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/1500684?v=3?s=100\" width=\"100px;\" alt=\"Kent C. Dodds\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eKent C. Dodds\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=kentcdodds\" title=\"Code\"\u003e💻\u003c/a\u003e \u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=kentcdodds\" title=\"Documentation\"\u003e📖\u003c/a\u003e \u003ca href=\"#infra-kentcdodds\" title=\"Infrastructure (Hosting, Build-Tools, etc)\"\u003e🚇\u003c/a\u003e \u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=kentcdodds\" title=\"Tests\"\u003e⚠️\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/FWeinb\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/1250430?v=4?s=100\" width=\"100px;\" alt=\"FWeinb\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eFWeinb\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/issues?q=author%3AFWeinb\" title=\"Bug reports\"\u003e🐛\u003c/a\u003e \u003ca href=\"#ideas-FWeinb\" title=\"Ideas, Planning, \u0026 Feedback\"\u003e🤔\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/dlannoye\"\u003e\u003cimg src=\"https://avatars2.githubusercontent.com/u/1383720?v=4?s=100\" width=\"100px;\" alt=\"David Lannoye\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eDavid Lannoye\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/issues?q=author%3Adlannoye\" title=\"Bug reports\"\u003e🐛\u003c/a\u003e \u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=dlannoye\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/colinrcummings\"\u003e\u003cimg src=\"https://avatars2.githubusercontent.com/u/9815009?s=460\u0026v=4?s=100\" width=\"100px;\" alt=\"Colin Cummings\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eColin Cummings\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=colinrcummings\" title=\"Code\"\u003e💻\u003c/a\u003e \u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=colinrcummings\" title=\"Tests\"\u003e⚠️\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/bkoltai\"\u003e\u003cimg src=\"https://avatars2.githubusercontent.com/u/464764?v=4?s=100\" width=\"100px;\" alt=\"Benji Koltai\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eBenji Koltai\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=bkoltai\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://baggasumit.github.io\"\u003e\u003cimg src=\"https://avatars1.githubusercontent.com/u/1779959?v=4?s=100\" width=\"100px;\" alt=\"Sumit Bagga\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eSumit Bagga\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=baggasumit\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/Tarabyte\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/2027010?v=4?s=100\" width=\"100px;\" alt=\"Yury Tarabanko\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eYury Tarabanko\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=Tarabyte\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://www.wendtedesigns.com/\"\u003e\u003cimg src=\"https://avatars2.githubusercontent.com/u/5779538?v=4?s=100\" width=\"100px;\" alt=\"Alex Wendte\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eAlex Wendte\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=themostcolm\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://twitter.com/CompuIves\"\u003e\u003cimg src=\"https://avatars3.githubusercontent.com/u/587016?v=4?s=100\" width=\"100px;\" alt=\"Ives van Hoorne\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eIves van Hoorne\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=CompuIves\" title=\"Code\"\u003e💻\u003c/a\u003e \u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=CompuIves\" title=\"Tests\"\u003e⚠️\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://team.thebrain.pro\"\u003e\u003cimg src=\"https://avatars1.githubusercontent.com/u/4002543?v=4?s=100\" width=\"100px;\" alt=\"Łukasz Gandecki\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eŁukasz Gandecki\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=lgandecki\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/deniztetik\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/14167019?v=4?s=100\" width=\"100px;\" alt=\"Deniz Tetik\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eDeniz Tetik\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"#content-deniztetik\" title=\"Content\"\u003e🖋\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/Ruffeng\"\u003e\u003cimg src=\"https://avatars1.githubusercontent.com/u/18511772?v=4?s=100\" width=\"100px;\" alt=\"Ruffeng\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eRuffeng\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"#content-Ruffeng\" title=\"Content\"\u003e🖋\u003c/a\u003e \u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=Ruffeng\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://stackshare.io/jdorfman/decisions\"\u003e\u003cimg src=\"https://avatars1.githubusercontent.com/u/398230?v=4?s=100\" width=\"100px;\" alt=\"Justin Dorfman\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eJustin Dorfman\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"#fundingFinding-jdorfman\" title=\"Funding Finding\"\u003e🔍\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://alexmunoz.github.io\"\u003e\u003cimg src=\"https://avatars3.githubusercontent.com/u/3093946?v=4?s=100\" width=\"100px;\" alt=\"Alex Munoz\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eAlex Munoz\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=AlexMunoz\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/marcosvega91\"\u003e\u003cimg src=\"https://avatars2.githubusercontent.com/u/5365582?v=4?s=100\" width=\"100px;\" alt=\"Marco Moretti\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eMarco Moretti\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=marcosvega91\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/emipc\"\u003e\u003cimg src=\"https://avatars1.githubusercontent.com/u/26004903?v=4?s=100\" width=\"100px;\" alt=\"Emili\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eEmili\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=emipc\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/balavishnuvj\"\u003e\u003cimg src=\"https://avatars3.githubusercontent.com/u/13718688?v=4?s=100\" width=\"100px;\" alt=\"balavishnuvj\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ebalavishnuvj\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=balavishnuvj\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://www.linkedin.com/in/pritamsangani/\"\u003e\u003cimg src=\"https://avatars3.githubusercontent.com/u/22857896?v=4?s=100\" width=\"100px;\" alt=\"Pritam Sangani\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ePritam Sangani\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=PritamSangani\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://linkedin.com/in/katarzynakosturek/\"\u003e\u003cimg src=\"https://avatars3.githubusercontent.com/u/36547835?v=4?s=100\" width=\"100px;\" alt=\"Kasia Kosturek\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eKasia Kosturek\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=kocvrek\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/emzoumpo\"\u003e\u003cimg src=\"https://avatars2.githubusercontent.com/u/2103443?v=4?s=100\" width=\"100px;\" alt=\"Emmanouil Zoumpoulakis\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eEmmanouil Zoumpoulakis\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=emzoumpo\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://peter.hozak.info/\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/1087670?v=4?s=100\" width=\"100px;\" alt=\"Peter Hozák\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ePeter Hozák\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=Aprillion\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/nawok\"\u003e\u003cimg src=\"https://avatars3.githubusercontent.com/u/159773?v=4?s=100\" width=\"100px;\" alt=\"Pavel Fomchenkov\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ePavel Fomchenkov\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=nawok\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://www.seemaullal.com\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/8728285?v=4?s=100\" width=\"100px;\" alt=\"Seema Ullal\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eSeema Ullal\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=seemaullal\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://git.io/JfYj5\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/25733135?v=4?s=100\" width=\"100px;\" alt=\"Patrick Clery\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ePatrick Clery\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=patrickclery\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/degeens\"\u003e\u003cimg src=\"https://avatars2.githubusercontent.com/u/33414262?v=4?s=100\" width=\"100px;\" alt=\"Stijn Geens\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eStijn Geens\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=degeens\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://michaeldeboey.be\"\u003e\u003cimg src=\"https://avatars3.githubusercontent.com/u/6643991?v=4?s=100\" width=\"100px;\" alt=\"Michaël De Boey\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eMichaël De Boey\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=MichaelDeBoey\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://www.daleseo.com\"\u003e\u003cimg src=\"https://avatars1.githubusercontent.com/u/5466341?v=4?s=100\" width=\"100px;\" alt=\"Dale Seo\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eDale Seo\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=DaleSeo\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://bobbywarner.com\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/554961?v=4?s=100\" width=\"100px;\" alt=\"Bobby Warner\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eBobby Warner\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=bobbywarner\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://www.sophiabrandt.com\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/16630701?v=4?s=100\" width=\"100px;\" alt=\"Sophia Brandt\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eSophia Brandt\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=sophiabrandt\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/ph08n1x\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/4249732?v=4?s=100\" width=\"100px;\" alt=\"ph08n1x\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eph08n1x\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=ph08n1x\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://www.suhas010.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/8597576?v=4?s=100\" width=\"100px;\" alt=\"Suhas R More\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eSuhas R More\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=Suhas010\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/0xnoob\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/49793844?v=4?s=100\" width=\"100px;\" alt=\"0xnoob\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003e0xnoob\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=0xnoob\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://pavlos.dev\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/100233?v=4?s=100\" width=\"100px;\" alt=\"Pavlos Vinieratos\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ePavlos Vinieratos\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=pvinis\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/infoxicator\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/17012976?v=4?s=100\" width=\"100px;\" alt=\"Ruben Casas\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eRuben Casas\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=infoxicator\" title=\"Code\"\u003e💻\u003c/a\u003e \u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=infoxicator\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/marioleed\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/1763448?v=4?s=100\" width=\"100px;\" alt=\"Mario Sannum\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eMario Sannum\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=marioleed\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://wrongabhishek.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/47311875?v=4?s=100\" width=\"100px;\" alt=\"Abhishek Rawat\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eAbhishek Rawat\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=AbePlays\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://fullchee.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/11246258?v=4?s=100\" width=\"100px;\" alt=\"Fullchee Zhang\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eFullchee Zhang\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=Fullchee\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/YaseenAlGailani\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/23329119?v=4?s=100\" width=\"100px;\" alt=\"Yaseen\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eYaseen\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=YaseenAlGailani\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://mangovoice.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/2466729?v=4?s=100\" width=\"100px;\" alt=\"Jeff Potter\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eJeff Potter\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=jpotts18\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/kenneth-gray\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/10341832?v=4?s=100\" width=\"100px;\" alt=\"Kenny Gray\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eKenny Gray\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/issues?q=author%3Akenneth-gray\" title=\"Bug reports\"\u003e🐛\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://jorgearuv.dev\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/7416811?v=4?s=100\" width=\"100px;\" alt=\"Jorge Ruvalcaba\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eJorge Ruvalcaba\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=jorgeruvalcaba\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://creador.dev\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/40248406?v=4?s=100\" width=\"100px;\" alt=\"Pawan Kumar\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ePawan Kumar\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=creador-dev\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://junagao.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/615616?v=4?s=100\" width=\"100px;\" alt=\"juliane nagao\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003ejuliane nagao\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=junagao\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"http://www.ianjmacintosh.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/1103259?v=4?s=100\" width=\"100px;\" alt=\"Ian MacIntosh\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eIan MacIntosh\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=ianjmacintosh\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n      \u003ctd align=\"center\" valign=\"top\" width=\"14.28%\"\u003e\u003ca href=\"https://github.com/Creeland\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/518406?v=4?s=100\" width=\"100px;\" alt=\"Creeland A. Provinsal \"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eCreeland A. Provinsal \u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/kentcdodds/advanced-react-patterns/commits?author=Creeland\" title=\"Documentation\"\u003e📖\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/tbody\u003e\n\u003c/table\u003e\n\n\u003c!-- markdownlint-restore --\u003e\n\u003c!-- prettier-ignore-end --\u003e\n\n\u003c!-- ALL-CONTRIBUTORS-LIST:END --\u003e\n\nThis project follows the\n[all-contributors](https://github.com/kentcdodds/all-contributors)\nspecification. Contributions of any kind welcome!\n\n## Workshop Feedback\n\nEach exercise has an Elaboration and Feedback link. Please fill that out after\nthe exercise and instruction.\n\nAt the end of the workshop, please go to this URL to give overall feedback.\nThank you! https://kcd.im/arp-ws-feedback\n\n\u003c!-- prettier-ignore-start --\u003e\n[npm]: https://www.npmjs.com/\n[node]: https://nodejs.org\n[git]: https://git-scm.com/\n[build-badge]: https://img.shields.io/github/actions/workflow/status/kentcdodds/advanced-react-patterns/validate.yml?branch=main\u0026logo=github\u0026style=flat-square\n[build]: https://github.com/kentcdodds/advanced-react-patterns/actions?query=workflow%3Avalidate\n[license-badge]: https://img.shields.io/badge/license-GPL%203.0%20License-blue.svg?style=flat-square\n[license]: https://github.com/kentcdodds/advanced-react-patterns/blob/main/LICENSE.md\n[coc-badge]: https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square\n[gitpod-badge]: https://img.shields.io/badge/Gitpod-ready--to--code-908a85?logo=gitpod\n[coc]: https://github.com/kentcdodds/advanced-react-patterns/blob/main/CODE_OF_CONDUCT.md\n[emojis]: https://github.com/kentcdodds/all-contributors#emoji-key\n[all-contributors]: https://github.com/kentcdodds/all-contributors\n[all-contributors-badge]: https://img.shields.io/github/all-contributors/kentcdodds/advanced-react-patterns?color=orange\u0026style=flat-square\n[win-path]: https://www.howtogeek.com/118594/how-to-edit-your-system-path-for-easy-command-line-access/\n[mac-path]: http://stackoverflow.com/a/24322978/971592\n[issue]: https://github.com/kentcdodds/advanced-react-patterns/issues/new\n\u003c!-- prettier-ignore-end --\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkentcdodds%2Fadvanced-react-patterns","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkentcdodds%2Fadvanced-react-patterns","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkentcdodds%2Fadvanced-react-patterns/lists"}