Main page: https://reactjs.org/
React Learning Resources
Important: These resources available to UCSB students/faculty/staff by first logging in at https://bit.ly/ucsb-or then navigating to the links below.
Online Books:
Tutorials for beginners
- Learning React, 2nd Edition
- Best intro I’ve found in the O’Reilly library
- React Key Concepts
- Another intro to React
Deeper Dives for folks with some React background
- Fluent React
- A slightly deeper dive into some of the technical concepts of React
- Good if you already know some React, and want a deeper understanding of how the pieces work together
Video Courses:
- React JS Masterclass - Go From Zero To Job Ready (34 hours)
- I suggest that if you use this resources, don’t necessarily expect to do all 34 hours!
- Instead, use it to help you get past the point of being “lost in the syntax”
- A few good videos to start with:
React Naming Conventions
See: https://maxrozen.com/guidelines-improve-react-app-folder-structure/
Linting your react code
To check your code for style issues, you can use eslint.
Install it with npm install eslint --save-dev then run this command, where directory is a directory containing your React code:
npx eslint directory
Be careful that you don’t run eslint on code in a build directory (i.e. the generated JavaScript); you only want to run it on your JavaScript source code.
If you get the error:
Error: Failed to load parser '@typescript-eslint/parser'...
then, try installing typescript manually:
npm install --save-dev typescript