Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/epicweb-dev/advanced-react-patterns
This is the latest advanced react patterns workshop
https://github.com/epicweb-dev/advanced-react-patterns
epicreact-dev kcd-edu react react-components react-patterns workshop
Last synced: about 2 months ago
JSON representation
This is the latest advanced react patterns workshop
- Host: GitHub
- URL: https://github.com/epicweb-dev/advanced-react-patterns
- Owner: epicweb-dev
- License: other
- Created: 2019-02-11T21:46:26.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2024-07-19T17:11:23.000Z (2 months ago)
- Last Synced: 2024-07-19T22:16:52.313Z (2 months ago)
- Topics: epicreact-dev, kcd-edu, react, react-components, react-patterns, workshop
- Language: TypeScript
- Homepage: https://advanced-react-patterns.epicweb.dev
- Size: 27.5 MB
- Stars: 3,379
- Watchers: 41
- Forks: 1,085
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
🤯 Advanced React Patterns
Learn how to build simple and flexible React Components and Hooks using
modern patterns
Not only learn great patterns you can use but also the strengths and
weaknesses of each, so you know which to reach for to provide your custom
hooks and components the flexibility and power you need.
[![Build Status][build-badge]][build]
[![GPL 3.0 License][license-badge]][license]
[![Code of Conduct][coc-badge]][coc]
## Prerequisites
- The more experience you have with building React abstractions, the more
helpful this workshop will be for you.
## 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:
- [Inversion of Control](https://kentcdodds.com/blog/inversion-of-control)
- [Implement Inversion of Control](https://egghead.io/lessons/egghead-implement-inversion-of-control?pl=kent-s-blog-posts-as-screencasts-eefa540c&af=5236ad)
## 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.
Follow these steps to get this set up:
```sh nonumber
git clone --depth 1 https://github.com/epicweb-dev/advanced-react-patterns.git
cd advanced-react-patterns
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).
[](https://www.epicweb.dev/get-started)
[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/advanced-react-patterns/validate.yml?branch=main&logo=github&style=flat-square
[build]: https://github.com/epicweb-dev/advanced-react-patterns/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/advanced-react-patterns/blob/main/LICENSE.md
[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/advanced-react-patterns/issues/new