orjwan98 / react-week

🔥 React 💧 Week 🌫

React Week

🌐

Learning Outcomes

1. ES6 classes, destructuring and this
2. How modern frontend works

• The differences between server-rendered and single-page apps
• Why frontend is great/hard

3. React's benefits/tradeoffs
4. The React API
   • JSX
   • Functional & class-based components
   • Component state
   • Lifecycle methods
5. Real-world React patterns
6. Testing React components
7. How bundlers work (ish)
   • Setting up a project with Parcel
   • Modularising frontend code

Schedule

Day 1

08:30-09:00 Introduction to React Week and learning outcomes

09:00-10:00 Intro to ES6 Classes

10:05-10:30 Modern frontend & how React fits in (talk/discussion)

10:30-12:00 React API (workshop)

12:00-13:00 -- LUNCH --

13:00-14:00 React API (workshop continued)

14:05-16:00 Build a stopwatch (mini project)

Day 2

08:30-09:45 Destructuring morning challenge

09:45-10:05 Intro to bundlers (talk)

10.10-12:00 React with dynamic data

12:00-13:00 -- LUNCH --

13:00-15:00 Testing React components

15:00-15:15 React project

15:15-16:00 Project Setup

Day 3

08:30-09:45 this workshop

09:50-10:50 - Thinking in React and React File Structure

10:50-12:00 Project planning

12:00-13:00 -- LUNCH --

13:00-16:00 Projects

Day 4

08:30-12:00 Projects

12:00-13:00 -- LUNCH --

13:00-16:00 Projects

Day 5

08:30-11:00 Work on projects / fix issues

11:00-12:00 Plan presentations

12:00-13:00 -- LUNCH --

13:00-14:00 Present projects

14:00-15:00 Discussion on second project