Advanced React For Enterprise: React for senior engineers

6h 4m 5s
English
Paid
October 4, 2024

Welcome to the React for Senior engineers course !!  Knowledge of React is 100% required for this course. I've been working with React.js for over 5 years now, and I am so excited to share with you the skills needed to thrive as a senior React Engineer. Do you want to build and architect react Apps like Microsoft and Github Engineers? This course is for you!

More

We'll build our very own design system from scratch. This will give us the opportunity to cover senior topics such as:

  1. CSS Architecture for react applications

  2. Typescript and its advantages for frontend engineers

  3. Design systems and atomic design principles

  4. Npm package creation, management and publishing

  5. Continuous integration and deployment for the frontend engineer

  6. Unit component testing

  7. Visual regression testing

  8. Storybook and component libraries

  9. Component design patterns

  10. Mono-repository architecture patterns

  11. Accessibility and unit accessibility testing 

And so much more to come.

This course is perfect for you if:

  • You're a beginner to midlevel react developer looking to learn more advanced concepts

  • You want to improve your skills all round as a frontend engineer

  • You are interested in building design systems

  • You want to learn the fundamentals tools you'll need to become an open source software developer

We're also going to be adding a whole new section containing advanced react concepts that you'll find almost nowhere on the internet. We'll cover advanced topics such as design patterns, hook patters, efficient state management, frontend codebase architecture, best practices for performance, and so much more.


Watch Online Advanced React For Enterprise: React for senior engineers

Join premium to watch
Go to premium
# Title Duration
1 What are design systems 06:35
2 Atomic Design principles 08:33
3 Example design systems 05:34
4 Your role as an engineer in a design system 05:03
5 What we'll build 04:06
6 Css architecture checklist 01:50
7 Setup folder and file structure 02:50
8 Define system variables 09:27
9 Define foundation colors 07:35
10 Assignment - Define foundation colors 01:54
11 Define foundation typography 02:01
12 Assignment - Define foundation typography 01:11
13 Define mixins 03:43
14 Assignment - Define mixins 03:13
15 Global root and css reset 06:32
16 Add stylelint and prettier 07:16
17 Setup husky and pre-commit hooks 03:57
18 Compile scss to css 06:49
19 Compile components to css 09:22
20 Setup mono repository with yarn and lerna 10:08
21 Add react package to mono repository 04:02
22 Add rollup to compile react 04:43
23 Setup a react playground 10:31
24 Setup dev script for all packages 03:53
25 Identify atoms, molecules and organisms 03:32
26 Assignment - Identify atoms, molecules and organisms 00:52
27 Develop the colour component 05:01
28 Dynamically generate utility classes 08:47
29 Assignment - create image atom 01:06
30 Extract foundation to a separate package 07:02
31 Spacing component 15:23
32 The select molecule 11:10
33 Styles for the select molecule 11:52
34 Calculate the overlay position 07:11
35 Style the select option 03:32
36 Selected option state 08:35
37 Animate select caret 02:18
38 Render props for custom option 07:41
39 Expanded and popup aria attributes 03:25
40 Control menu items with keyboard 16:53
41 Accessible keyboard navigation 09:53
42 Setup babel and jest 07:24
43 Assignment - Select test cases 01:00
44 Assignment - Select test cases solution 09:22
45 Tests for foundations 05:06
46 Setup storybook 07:53
47 Select component variants 04:06
48 Addon knobs 09:07
49 Addon accessibility 07:40
50 Visual regression tests with chromatic 05:57
51 Publish to npm with lerna 07:31
52 Control published files 06:57
53 Conventional commits 04:44
54 Lint commits 03:06
55 Generate changelogs with lerna 06:11
56 Setup github actions workflow 06:36
57 Fix build issues on CI 07:15
58 Automate chromatic with github actions 04:44
59 Deploy storybook to netlify 04:25

Similar courses to Advanced React For Enterprise: React for senior engineers

Redux Saga

Redux Sagapluralsight

Duration 2 hours 54 minutes 54 seconds
The React practice course, learn by building projects.

The React practice course, learn by building projects.udemy

Duration 43 hours 45 minutes 48 seconds
React Fundamentals

React Fundamentalsui.dev (ex. Tyler McGinnis)

Duration 4 hours 36 minutes 46 seconds
The essential guide to Firebase with React.

The essential guide to Firebase with React.udemy

Duration 31 hours 20 minutes 9 seconds
React Query (OLD)

React Query (OLD)ui.dev (ex. Tyler McGinnis)

Duration 7 hours 1 minute 30 seconds
The Creative React and Redux Course

The Creative React and Redux Coursedevelopedbyed.com

Duration 18 hours 13 minutes 6 seconds