React: Managing Complex Interactions
1h 45mIntermediate2018-03-14
Authors
Emmanuel Henri
Executive with 20+ years of experience in programming and design
Course details
One of the most powerful things you can build in React-interactions-is also one of the most complicated. But to create a compelling user experience, you'll need to be able to connect and combine a wide variety of interactions. This course shows how to add and manage complex interactions in React using states and some useful third-party libraries. Learn how to add hover and click interactions, navigation popups, grids and galleries, scrolling, and more. Instructor Emmanuel Henri also provides tips for improving your UX designs after implementing interactions.
Learning objectives
Using the component state for interactions
Creating components
Implementing hover, navigation, and scrolling interactions
Loading animation
Improving the user experience
Learning objectives
Using the component state for interactions
Creating components
Implementing hover, navigation, and scrolling interactions
Loading animation
Improving the user experience
Skills covered
React.jsMetaFront-End Web DevelopmentWeb DevelopmentDeep Dive (X:Y)
Concepts
0. Introduction
- 01 - Welcome
- 02 - Course prerequisites
- 03 - Using the exercise files
1. Set Up the Project
- 04 - Brief introduction of our toolset
- 05 - Initialize a new project
2. Basic Interactions
- 06 - Base modifications
- 07 - Use the state for interactions
- 08 - Create initial card component
- 09 - Hover interactions
- 10 - Clicked interactions
- 11 - Loading animations
- 12 - Navigation and menu interactions, part 1
- 13 - Navigation and menu interactions, part 2
- 14 - Grid and galleries interactions
- 15 - Hero interactions
- 16 - Scrolling interactions
3. UX and Complex Interactions
- 17 - UX application and web planning
- 18 - UX improvements with our project
Conclusion
- 19 - Next steps