Hey, backend dev here with some experience in React.

It depends a little on your knowledge of CS fundamentals. If you've got a fairly good grasp, you might benefit from learning the internals of react alongside the high level functions.

I say this because idiomatic React is quite different from traditional programming. React is declaratively programming your UI, by arranging components in a tree-like structure with unidirectional data flow. Engineers with experience in more traditional OO/procedural programming (like me, when I started learning React) can often get caught in a familiarity trap. After a while, you end up doing all sorts of taboo things like passing refs down the tree or using Observables; when there are simpler idioms.

I'm not sure of any learning materials, I learn just by following normal beginner courses and being hyper inquisitive. It's probably not the fastest way but I find it fairly natural.

Very strange how there are 15 comments and not one link to the React documentation: https://reactjs.org/docs/getting-started.html

That's the best resource because it's primary source material. Now `npx create-react-app` and make something. No need to overthink this.

I used this book and it's pretty good: https://www.roadtoreact.com/

The guy who wrote that book has a good blog too

https://www.robinwieruch.de/

I will look into it. Sounds promising!

Can I recommend you look at Svelte before jumping into more complex frameworks like Vue and React?

It's lighter and a narrower footprint, but builds on JS fundamentals while introducing core concepts of component frameworks.

This allows you to build on these concepts like stores, hooks, actions, etc. which all have equivalents in other frameworks as well.

Transitioning beyond this to other frameworks is by choice but the foundation is more or less the same.

Personally, I found the transition between Vue and Svelte more intuitive, but only real difference I found between React and Vue/Svelte is JSX syntax and getting to grips with a few of its idiosyncracies.

And Svelte's tutorial and learning ecosystem is by far the best I've experienced so far.

Hope this helps.

Good point, I will add Svelte to my list of what I want to learn at least a little bit. I looked to their website and I like a lot how they present these concepts.

I'm currently learning JavaScript and React from Scrimba[0].

I'm not affiliated with them in any way, they have an interesting video-editor-learning tool.

[0]: https://scrimba.com

Wes bos has some video courses about react but the thing is it really depends on what you are building. If it is a public app you will have SEO issues without a framework like Next.js which is nodejs based.

As a js dev myself I recommend lit (https://lit.dev). Personally I like it way more than react or vue and its easier to swap out later if you want to.

Since you’re a ruby dev, have you checked hotwire out? Or is there a specific reason to why you want to learn react?

I used Stimulus JS along with Turbolinks before Hotwire came out. And now I am migrating some older Rails SSR to Hotwire.

Why I want to learn React is looking around at the direction of web development I see less job requirements for Ruby on Rails SSR and more about Ruby on Rails API with React.

I am not looking to change my job now and I like backend development. Sometimes I also do a side project or small contract that is creating a web app just to keep myself a little up to date with frontend stuff.

I think I resisted enough the SPA hype and maybe I am on the wrong side of history :) so I want to give it a try.

Fastest way to get your feet wet is the crash course on YT by Traverse Media it's like an hour. Learning react itself is pretty straightforward it's all the other crap like what you use for state management.

create-react-app is a great way to start imo from nothing. Also learn the arrow function way to write code and go for hooks but sometimes nice to know the class-based way.

Hello I am myself learning React right now. I love this website : https://daveceddia.com/ He provides a free 5-day intro course which is well-paced and gives you already plenty to start with. Then he offers a full fledged paying course which I have not tried yet, but I will most likely do. I love the approach : rather fast-paced, hands on, with a lot of exercices, which makes the knowledge sticks.

> What worked for you?

I just sat down, set up the initial create-react-app template (using Typescript, because I like Typescript), and started building a project.

That's probably the most helpful and frustrating way. But at least with React, the tutorials and documentation are both really useful, so it's very hard to get stuck.

Ah this is also in general my preferred way of starting. It is just that now I feel that SPA is a different space than SSR and I think the different might be too big just to start off a project.

I did this with Elixir/Phoenix but somehow even if they are a different programming language some things were common with Ruby on Rails. With SPA I feel (as I don't know for sure) that it is too different than SSR.

Wes Bos courses are good for react. Well made and nice pace