Date: 9-10 May 2018, Iasi
Days: 2 (16 hours)
Target audience: Frontend developers with basic React and Redux knowledge required willing to make the leap to more advanced levels.
1. Stateless functions
a. What are stateless functions?
b. When to use
2. JSX spread attributes
3. Destructuring arguments
4. Conditional rendering
c. If / Else block
5. Arrays as children
a. Usage with functional methods (map, filter, etc.)
b. Explanation of React keys
6. Controlled vs. uncontrolled components
a. What are controlled components?
b. What are uncontrolled components?
c. Dealing with controlled vs. uncontrolled
d. When to use controlled vs. uncontrolled
7. Container vs. presentational components
a. What are container components?
b. What are presentational components?
c. Reasons behind the split
d. Practice with container vs. presentational in simple React
e. Practice with container vs. presentational in React + Redux
8. State hoisting
a. Advantages of hoisting state
b. Drawbacks and possible gotchas
9. Provider / Consumer pattern
a. New context API in React 16
b. When to use Provider / Consumer pattern
10. Higher Order Components
a. What are HOCs?
b. Practice with HOCs
c. Example of HOCs in the wild (withRouter, connect, etc.)
d. When to use HOCs
11. Functions as child components
a. What are functions as child components?
b. Practice with functions as child components
c. Differences between functions as child components and HOCs
d. When to use functions as child components
12. Short recap
This agenda represents the contents for a 2 days (16 hours) based training, covering a great number of React related concepts, knowledge and practical applications. Although the training content can be tweaked on a per case by case basis, for maximum results we recommend sticking with the complete agenda.
1. Every student will have his/her own laptop. For best results, it is not advisable to multiple people working on the same machine
2. Node v8.9.4 or greater installed (https://nodejs.org/en/download/)
3. Git v2.16.0 installed (https://git-scm.com/downloads)
4. An IDE/code editor of choice (Sublime Text, Atom, Visual Studio Code, WebStorm, etc.)
This training assumes the participants are already familiar with ES6 concepts
This training targets intermediate developers who would like to upgrade their
React knowledge by finding out more about React component patterns, when
and how to apply them and gain architectural knowledge useful in scaling
applications based on this technical stack.
Vlad is a pragmatic software engineer, Google Developer Expert and an avid caffeine consumer. He loves surrounding himself with ever smiling people and he’s constantly pushing his limits in order to become a better professional. He always keeps an eye opened to the ever-changing landscape of technologies he’s interested in. A true believer in the power of sharing your knowledge and becoming a better individual through collaboration and feedback, Vlad regularly speaks at conferences and meetups where he shares his passion for everything tech related.
Vlad is co-organizer of CluJSers, being actively involved in the development of several tech communities and acting as an advisor for a couple of well known
Romanian conferences such as Codecamp and JSHeroes. In October 2016 he
Browse more masterclasses here.