OUTLINE.md

Advanced React Patterns

Some sweeeeeeeet patterns 🍭

👋 I'm Kent C. Dodds

• 🏡 Utah
• 👩 👧 👦 👦 👦 🐕
• 🏢 kentcdodds.com
• 🐦/🐙 @kentcdodds
• 🏆 testingjavascript.com
• 🥚 kcd.im/egghead
• 🥋 kcd.im/fem
• 💌 kcd.im/news
• 📝 kcd.im/blog
• 📺 kcd.im/devtips
• 💻 kcd.im/coding
• 📽 kcd.im/youtube
• 🎙 kcd.im/3-mins
• ❓ kcd.im/ama

What this workshop is

• Lots of exercises

What this workshop is not

• Solo
• Lecture

Logistics

Schedule

• 😴 Logistics
• 💪 Compound Components
• 💪 Flexible Compound Components
• 😴 10 Minutes
• 💪 Prop Collections and Getters
• 🌮 30 Minutes
• 💪 State Reducers
• 😴 10 Minutes
• 💪 Control Props
• 😴 10 Minutes
• 💪❓ Higher Order Components (If time permits)
• 💪❓ Render Props (If time permits)

Scripts

• npm run start
• npm run test

Asking Questions

Please do ask! Interrupt me. If you have an unrelated question, please ask on my AMA.

Zoom

• Help us make this more human by keeping your video on if possible
• Keep microphone muted unless speaking
• Breakout rooms

Exercises

• src/exercise/0x.md: Background, Exercise Instructions, Extra Credit
• src/exercise/0x.js: Exercise with Emoji helpers
• src/__tests__/0x.js: Tests
• src/final/0x.js: Final version

Emoji

• Kody the Koala 🐨 "Do this"
• Matthew the Muscle 💪 "Exercise"
• Chuck the Checkered Flag 🏁 "Final"
• Marty the Money Bag 💰 "Here's a hint"
• Hannah the Hundred 💯 "Extra Credit"
• Olivia the Owl 🦉 "Pro-tip"
• Dominic the Document 📜 "Docs links"
• Berry the Bomb 💣 "Remove this code"
• Peter the Product Manager 👨‍💼 "Story time"
• Alfred the Alert 🚨 "Extra helpful in test errors"

Workshop Feedback

Each exercise has an Elaboration and Feedback link. Please fill that out after the exercise and instruction.

At the end of the workshop, please go to this URL to give overall feedback. Thank you! https://kcd.im/arp-ws-feedback