Principles and patterns in designing good React components

Get your ticket
Verona
English

Workshop: Principles and patterns in designing good React components

🇬🇧 This workshop is held in English language

Designing good React components that can help the team steadily build reliable features while maintaining a quality codebase is not an easy feat.

In this workshop, we’re gonna cover principles of good architecture and how to apply them to a real-world React use case.

Throughout the workshop, we’re gonna development a sandbox application and explore how to design good React software. Topics include decomposing UI complexity into proper components, enforcing business rules in the type system, composing asynchronous side-effects and testing everything of course.

Get your ticket

Teacher

Jiayi Hu

Front-end Consultant and Trainer

I’m currently working remotely as Front-end Consultant and Trainer. I’ve spent countless hours writing TypeScript and React for a variety of companies located in Europe. Likewise I’ve taught many people how to write good software in TS and React, or at least I’ve tried. I enjoy spending time chatting in the Italian JS communities and I speak sometimes at public tech events. In my spare time, I enjoy reading Baricco or Murakami and experimenting in the kitchen. Or just chilling somewhere with fresh air.

Jiayi Hu

Syllabus

  • Leverage the type system

  • Brief introduction to TypeScript
  • Algebraic data types
  • Type guards and type refinements
  • Modelling logic constraints in the type system"
  • Using Sum Types to model React states
  • Exhaustive type checking

  • Just compose

  • Principles of software complexity
  • How to design components for common use and extensibility
  • Compose components and state for reusability and accessibility
  • Designing good Component boundaries

  • Asynchronous side effects

  • The nature of side-effects and asynchronous events
  • The good and the bad side of useEffect
  • The good and the bad side of react-query
  • Comparison of solutions for async composition
  • Outstanding problems of side effect handling in React

  • Testing

  • Testing and TypeScript, choose smartly what to test
  • Make tests more convenient with fixtures and API mocks in Jest
  • Unit testing components and hooks in react-testing-library
  • Write mostly integration tests for the application
  • End-to-end testing in Playwright

Prerequisities

Participants must have past experience with React projects and a good knowledge of JavaScript.
A good understanding of TypeScript is also strongly recommended.

Useful information

The workshop is happening in Verona, in the same venue as the conference. Coffee breaks and lunch are included.
Please note that tickets for the workshop are sold separately from the conference.

Hurry up. There are only a few available places!

Get your ticket
Where
Hotel San Marco, Verona
Via Longhena 42, 37138 Verona (VR) Italy
https://www.sanmarco.vr.it/

The hotel offers discounts for participants, contact them for more details.

How and when

The workshop takes place in person, on Thursday 20th October 2022, from 9:30 to 6:00.

Language
English
Teacher

Jiayi Hu
Front-end Consultant and Trainer

See all workshops