Crash Course: React for Back-End developers
Mentors:
Oleg Rovenskyi, JavaScript Engineering Lead at Intellias.
Kateryna Volkova, Fronted Developer at Flyaps
Buy tickets for the next conference JavaScript fwdays’24 conference!
This crash course will introduce backend developers to the basics of ReactJS. The program consists of concepts and mechanisms underlying React: from basic to high-level.
We will start with simple topics and reinforce the theory with practical examples. In this way, you will be able to familiarize yourself with the various aspects of component creation, state management, and event handling in ReactJS.
At the intermediate stage of the course, we will explore more advanced topics:
✅Working with API
✅Routing
✅ Application status.
After mastering these concepts, you'll learn how to build complex and functional React-based applications!
Format:
Date and time: March 30 & 31, 10:00 - 16:00, (Kyiv time, GMT+2). Duration of 2 days of ~6 hours with a break for lunch.
Platform: ZOOM.
Language of presentation: English
Language of the event: Ukrainian
Requirements: basic JS knowledge, backend experience in any language. Knowledge of React will be a plus.
Who will be interested?
- Back-End developers who want to be fullstack.
- Back-End developers who want to understand how React works.
Program
Chapter 1: Introduction to ReactJS
- What is ReactJS and why it's popular in web development
- Understanding the ReactJS architecture
- Setting up the development environment
- Creating the first React component
- JSX
- Handling user input and events
- How to debug
- Styling React components
- Hooks
- Trigers for re-render
- Event Loop
- Events:
-JS Event Object model, js event delagation (example and memory leak) comparing in React.
-SynteticEvent, NativeEvent
Chapter 2: Advanced ReactJS concepts
- State management in ReactJS and FLUX architecture
- Handling side effects
- HTTP
- Middlewares
- Routing
- Building reusable components
Chapter 3: FLUX and Redux
- FLUX architecture pattern
- Redux
- Redux with Redux Thunk
Chapter 4: Building a real-world ReactJS application
- Context
- Forms, Formik, Yupi
- Putting it all together: building a fully functional ReactJS application from scratch
- Best practices for ReactJS development
- Tips and tricks for optimizing ReactJS applications
Bonus: React Charts
- Overview of the Recharts library:
- Vertical Bar Chart:
- Sample code to create a vertical bar chart using Recharts. - Horizontal Bar Chart:
- Sample code to create a horizontal bar chart with Recharts.
- Tips for bars customization - Pie charts:
- Overview and sample code for customizing charts - Troubleshooting tooltips:
- customizing, changing the position - Testing charts with the jest
Oleg Rovensky
JavaScript Engineering Lead at Intellias
- 10+ years in development. Core expertise: JavaScript, Angular, React, NodeJS, RxJS.
- Active contributor of COE (Center of Excellence) at Intellias.
- Intellias speaker, JSDevTalk, Dev-Pro JS Breakfast.
- Taught at EPAM Lab, Hillel, Foxminded
Kateryna Volkova
Fronted Developer at Flyaps
- Main specialization is creating efficient and clean code using JavaScript, React and TypeScript. Believes in the importance of continuous learning and constantly updates his skills to stay on the wave of modern technological trends.
- Active contributor FE department at Flyaps.