philipcdavis / react-is-for-designers

I'm going to be creating resources to help designers learn the parts of react that are relevant for their work. If you're interested in using react for design work you should follow along.

React is a powerful design tool. There's a lot you can do with React that would be difficult with a traditional design application. Prototyping with live data, creating complex interactive experiences, and creating component libraries for designers & developers. React opens up many ways of designing that were previously difficult or totally inaccessible.

You don't need to know everything about javascript or react to get a lot out of it. One of the nice things about learning React is that you end up learning much more about the technologies that underpin the web: JavaScript, CSS, and HTML.

If you are a designer interested in learning React, but don't know how to get started, here is what I would recommend:

1. Scaffold a project and build something simple

Avoid any method of learning React that doesn't have you spending most of your time coding.

Manual setup and configuration of React projects can stop you from ever getting started. I would use create-react-app to scaffold your projects at first. If you don't know how to use the terminal, don't be afraid to open it up and learn a few commands.

You don't need to create an entire web app. Try building small design components with multiple states, slimmed down design systems, or simple data visualizations.

2. Read the React docs all the way through

The actual React API isn't that long, and it shouldn't take more the 2 hours to read it all. Read it once, all the way through. Don't worry if you don't understand what everything means. It's good to have a high level overview of what react is doing and what types of things are in the library.