To enhance React project we should learn Tailwind css because Tailwind css is componenent base so...

Since you list such a bunch of other packages for React, why not to add also mobx-react, mobx-react-lite, mobx-state-tree? These are all important parts of the ecosystem.

Some recommended technologies are outdated and there are better alternatives！

such as:

1. immutable-js

The project has actually been abandoned. Also, I think immer is a good alternative.

2. classnames

The project has not been updated for more than two years. Also, I think clsx is a good alternative.

3. moment

The project is great, but its build size has been criticized in recent years, and officials have introduced new alternatives. However, I think dayjs is a lighter alternative.

4. semantic-ui

In the early years, the project was excellent, but in recent years, due to the emergence of material design, the project has actually been abandoned. I recommend a good pure JavaScript component library UIKit that is not based on react.

Sorry, can't do a PR because I don't know what package you've used to create the diagram, but the one thing I noticed is that Isomorphic/Universal/SSR seemed to be an obvious omission.

Great diagram though, really helping me make some choices.

What is the drawing tool for the roadmap? I feel that this drawing tool is very good and I like it very much. thx!

that would be great. will provide some more input on the topics if you like

I think it would be nice to design an ISSUE_TEMPLATE to standardize the discussions and requests of improvement in the repo.

Let me know your opinion and I would be able to draft an ISSUE_TEMPLATE.md to discuss it.

Thanks to the author create such a clear roadmap. I am a Chinese developer who often encounters difficult-to-understand English words on the road to learning react. I hope that not only the language version of my native language, but also other developers in different languages in the world can understand how to become a react developer.

It might be worth mentioning features like hooks, context, etc outside of simply 'React' as they solve some of the problems that recommended-to-learn technologies addressed previously.

Since these roadmaps are often used by developers learning a tech, who don't necessarily know about its new or upcoming features, it would be worthwhile to let them know that they don't always need to go outside of React to do, for example, state management. It'd also be a useful hint as to what they are for.

Another issue is that these newer features are often considered to be optional when it comes to learning that technology. For example, most people probably wouldn't say that someone who doesn't know hooks is someone who doesn't 'know React'. So, even if you are aware of the existence of these features, you might not include them mentally in any of the points along the roadmap.

Any thoughts?

just curious if there is already a similar path just for React Native developers

On React Native, developing Virtual Reality and Augmented Reality interfaces are gaining popularity this year, so I would purpose converting "Virtual Reality" to "Virtual Reality / Augmented Reality" and adding:

• React 360
• ViroMedia
• react-native-arkit

It would be nice to add UI-Router to the list of routers. It's an awesome state based router solution with event-hooks and state transitions and can be used to route between both Angular and React components. It has also a set of Core APIs so it can be implemented for other frameworks as well, e.g. Vue.

Make react native a section and include

• create-react-native-app
• expo
• ignite

RxJS is a state management solution, but it does not relate to MobX at all. It features different kind of observables. In fact MobX observables and RxJS observables have very little in common.

You could add MobX state tree as a state management solution related to MobX if you want.

I think gsap and react-motion could be included in a animation section.

Hi, nice idea you had! It will be useful to many people.

Do you think it is worth to add browserify as bundler? I am using it for many projects, in particular with budo and they work like a charm.
In my opinion the developer experience is far better than webpack:

• minimal configuration
• simpler build process
• dev server with source maps working out of the box
• rock solid dev stack

If you want to try them quickly, I wrote a bundle package that let you develop almost instantly: checkout http://g14n.info/zeroconf-redux/ or just launch

npm install zeroconf-redux
npx zeroconf-redux

May I ask what software did you use to draw this digrama?

Please read this issue

Since glamorous is unmaintained and going to be deprecated, it should be the one of possibilities or got rid of from the roadmap.

the author of glamorous recommends emotion instead.

Keeping your state immutable is a big part of designing performant React applications. While we're at it, let's point it out for everyone's reference. 🎉

Ref- ImmutableJS by fb

Its been a while since ES 6 is renamed to "ECMAScript 2015" I think that the terms that we should use everywhere. https://www.ecma-international.org/ecma-262/6.0/index.html

What do you think? Happy to create PR for this.

Can you export a PDF?

I would like to add hyperlinks but with PNG that wouldn't make sense.

https://github.com/typestack/class-transformer

This tool takes a typescript model and some json data and combines it to a proper model (even with sub models). It maps all the way down through the object tree.

This makes you able to create proper domain models with methods etc.

Style-guide driven development using tools like Storybook or Styleguidist is a very relevant area to a component framework like React.

date-fns is a popular alternative to Moment that's more lightweight and has a nicer API; detailed comparison.

immer is a fantastic improvement over Immutable.js regarding interop and ease of use.

There are typos and grammars issues can be fixed. The paragraphs can be more concise in the perspective of technical writing.

1. Create React App [Personal must know]

2. React boilerplate [Possibilities]

3. React Starter Kit [Possibilities]

As it was suggested in this issue #75, we are probably missing a very important topic in React Ecosystem:

Style Guide Development Tools

• Storybook
• Docz
• React Syleguidist
• MDX

Before proceeding with the PR I would like to discuss if you agree with:

• The title of the Group
• Any missing tool?
• Which should be the "level" for each? [Personal must know / Good To know / Possibilities]

Charts and Animations is something that you are going to face as a web developer, sooner or later.

For charts, maybe D3 should be the "must" and Recharts as the proposed library (http://recharts.org/en-US/)

For Animations... I have my second thoughts

• Rematch
• DVA

It would be great if the diagrams had better resolution to be printed out or lasered on wood.

It would be nice if there was an official Website for the roadmap. Kinda like what the 100daysofcode has.

Include:

Gatsby
Phenomic

I think it's important to fully understand setState and new context API before learning a more complex solution like redux or mobX.
It usually covers most of the state management requirements and let's you understand what problems those tool help you with.

Create webapp to keep track of your progress, with option to tick off items you already know and so on.

I'm working on it in my free time :-) if anyone wants to help, just reply here.

收藏

https://github.com/lingui/js-lingui

is there a PHP version?

I think Node.js is missing and it should actually be a Personal must know.

Accessibility is extremely important and I think it would be amazing if that was mentioned somewhere in the roadmap, specifically within the basics section. That might help boost the number of developers actively thinking about how to best build universal experiences for all users.

I have no idea, how to reach you without opening the issue. I am following the road map and I am curious to know some books that are best to learn Design Patterns and for Algorithms and Data Structures. It would be great if you link those books in the map as well.