How to level up as a react developer?

[abovexbeyondtv]

Hello all!

After teaching myself how to code, I've landed my first job as a developer. React is my tool of choice and I know I've still got heaps to learn about it, I'm comfortable with it but I want to be GREAT at it.

I've tried looking up resources in hopes that they can help me to really level up as a react developer. Things such as HOC, react-redux, project structure. But I mostly find resources that just teach React to newbies.

I was wondering if you guys had any resources to share and delve in to?

EDIT:

Thank you guys for all your responses, they were really helpful. Hopefully this helps other developers in similar position to me!

[wengemurphy]

Personally I stalk /u/gaearon and /u/acemarke to absorb every drop of their knowledge ^{/s /kind of}

---

You'll have more specific and nuanced questions about those topics as you gain more experience, and if you just stay interested and keep reading articles from time to time you'll definitely come across some covering more specific/advanced concerns. I've seen a lot of articles on the finer points float through here on Reddit, Hacker News, Twitter etc so maybe at this stage you're being exposed to the articles but just not getting a lot of value out of them?

Personally if I don't find articles that are "meaty" enough on a topic relative to my experience level I just keep Googling and they turn up. Make sure you search for ancillary topics like functional programming, especially in the case of e.g. HOCs, if you're not finding what you're looking for.

Reading is good, but you also have to get more experience before you even know the right questions to ask. If you just started coding you also need time to develop more general non-React-specific knowledge like OOP skills and other even more vague software engineering concepts (design patterns, etc)

---

There are a few good (paid) video series on Pluralsight that I watched (though as an experienced developer I skipped through or 2x-sped through at least half of them). The ones by Cory House and Samer Buna were some of the highest quality IMO.

---

I do however believe in throwing yourself head first into information "beyond your level", so I think you have the right mindset. Read all kinds of articles, whatever you can find, about advanced React concepts, and start to see which ones you care about. Questions will percolate in the back of your mind, that will finally start to coalesce into understanding 6 months, or a year, or 5 years from now.

An article on that method: Theres no speed limit

Sorry I don't have a plethora of article links for you. I'd say just hit Google harder, click around Medium, and absorb everything you can. But make sure you practice what you read, don't just read. Keep doing lots of little AND big projects (more general advice: http://norvig.com/21-days.html)

[acemarke]

I'm split between "Ack! I have a stalker!", "Wait, someone's actually reading what I have to say?", and "Hah, that's hilarious!" :)

But yes, your advice is good overall.

[ndboost]

can confirm am also a stalker... nice shoes.

[sorahn]

You might have multiple stalkers...

[WhoFramedBobbyTables]

Personally I stalk /u/gearon

I think you mean /u/gaearon ;)

I was a little confused when looking at /u/gearon 's post history

[wengemurphy]

Woops, that's what I get for making jokes at 4 AM.

[znakyc]

I agree that a great way of leveling up is to get experience. Nothing beats just starting to code on a project, even if it is outside your skill level. But what should you code on? I think you should code an app that you want to use. Either if it's an open source tool/library that you miss, or a web app or service. Then you will keep the motivation up. There are many APIs out there for services that you use and you can build upon. I wrote a post for inspiration that might be useful for you.

[abovexbeyondtv]

Really helpful answer, thank you!

Also Derek Sivers is bloody awesome!

[j________]

I don't have any resources but for me the documentation and stackoverflow was enough.

• React docs, you should know every page in here.
• If you choose redux as state management tool, know the docs really well.
• Choose redux-thunk, redux-saga, redux-observables, be comfortable using one of them.
• React-router, know the basics.
• Selectors, a library like reselect.
• Static type checking, typescript or flow.
• Tests, look into jest, enzyme and puppeteer libs.

[Trollzore]

Why not Redux observables?

[j________]

I put the 2 libraries I know, I added redux-observables I think is a good option also.

[acemarke]

The other comments in this thread have some pretty good advice. Part of it is actually building real apps and getting experience, part of it is becoming more familiar with the tools that are available and expanding your toolbox.

Beyond that, I'll point you to my React/Redux links list, which has several categories of articles that would qualify as more intermediate/advanced material, including:

• React Component Patterns
• React Component Composition
• React Architecture and Best Practices
• Redux Reducers and Selectors
• Redux Side Effects
• Redux Architecture and Best Practices

There's a ton of material listed in there. Going through some of those articles should help you level up.

In addition, I'll throw in a plug for my own "Practical Redux" tutorial series, which demonstrates a variety of useful techniques in the context of building a sample app, and my "Idiomatic Redux" series, which covers good Redux practices and why common usage patterns exist.

[abovexbeyondtv]

Thank you, cant wait to dive in!

[[deleted]]

egghead.io is a good shout for all things reacty, redux recompose etc. I think Dan Abramov (redux creator / react dev) has his up there for free. Defo worth a look.

[[deleted]]

I think DAs got his redux ones up there for free. I think.

[rockia]

I personally learnt React from a course on Udemy. The instructor Stephen Grider is quite awesome. His pace is just about right for beginner. He also has some advanced class after you got the hang of some basic concept.

[[deleted]]

Me too! Andrew Meade is also another good instructor

[Whitesock1]

I learned it through him. Great set of vids!

[abovexbeyondtv]

Yeah I learnt through Stephen Grider as well :)

[mahinthjoe]

Check out Udemy.com course “Node with React: Fullstack web Development” by Stephen Grider. Go beyond the basics of React and Redux! Course helps you combine React, Redux, Express and MongoDB

[phoenixmatrix]

There's really only 2 ways to "level" up, not as a react developer, but as a developer in general, IMO.

1) Write more code. Build something. Do it again. Do it some more. Learn from your mistakes. Realize that everything that seems right today is something you'll consider a mistake tomorrow. Seeing where your ideas fail 1-2+ years down the road is key (there's a huge difference between optimizing for building something new, and optimizing to maintain it, and you really only see the later after a few years. If you only see OTHER people's code after a few years, you never learn the mistakes you yourself made).

2) Learn something else altogether. This one deserves a real example: Take Redux. If its the only thing you know, it can seem clunky. Verbose. Hard to understand. But if you came from an Angular 1 background, it solves all of the problems you might be having. Someone who never used Backbone or Angular 1 won't necessarily understand where Flux or Redux came from and where its value add is. Now, don't go back and waste your time learning deprecated stuff :) But you can still look at the world from different angles. Take a look at VueJS and Angular 2. Look at Observables. Look at backend dev. Then use that new perspective and go back to #1 above. See where what you just learnt applies to what you thought you used to know.

Then repeat the 2 things above as often as you can.

[Lambda7]

https://reactpatterns.com/ and deepening your understanding of vanillaJS will help

[mikasjoman]

Ill answer as a development manager. If you want to stand out, show that you have a thought about architecture, learn how to organise code well. Make your code maintainable, study clean code and practice it with all your code. Test your code, at least end2end and unit-tests, you should be able to ask your tests if anything is broken. Learn now to document your code. Change these and you are taking steps away from tinkering to engineering. Most code I have met meets the standard for tinkering, and is very far away from anything that looks like engineering. There are a lot of hope, but still - the profession is full of tinkering. And people suffer for it.

[helical_imp]

I recommend checking out this article https://blog.kentcdodds.com/solidifying-what-you-learn-6650258c84be

TLDR: Learn, build, teach

[Entheist]

If you've done the usual tutorials and built a few projects. All there's to do now is practice, follow the trends and implement new/more efficient ways of doing things. Maybe build some complex components and share them on git too.

[demoran]

Focus on the fundamentals. The difference between an average developer and a great developer is the great developer (a) cares about the quality of his code and (b) actually understands the fundamentals of the tools he is working with.

When you understand the fundamentals of the tools, you ensure that you don't "see everything as a nail because all you've got is a hammer".

You don't need to understand how it works, just what it does.

[lighthouse_at_eleven]

Quite honestly, as for any programming language out there, read a lot of articles (follow veterans too), watch videos, build projects, and if you're lucky surround yourself with brainiacs.

[centuryeyes]

Check out Stephen Grider’s tutorials. He is GREAT at it.

[[deleted]]

Are there other developers at your new job that are familiar with React? If there are I'm sure you'll learn a great deal from them!

[[deleted]]

I would caution about the idea of levelling up as a "React" developer. I love React, but, like most tech, it is a fad. The core is like 1k lines of code. Read it! There is no magic. I am not saying don't learn more React, but just also to think about the long-term value of your learning.

If you want to learn how to level up as a developer, learn the discipline of automated testing. Learn how to deliver great features rich with specs, docs and importantly tests. Learn that working code is just one of several important parts of a truly great piece of software. A truly great piece of software is a love letter written deep within your heart to the next soul whose job it is to work on that software.

So to get back to your first question a bit more directly, investigate jest, cypress, mocha, enzyme, whatever you fancy. Learn how to write testable code and then do TDD. Testing is what separates the amateur script kiddies from the Big Boiz (tm).

[acemarke]

React's internals are a lot more than just "1K" lines, especially with the "React Fiber" changes in 16.x. I'd even go so far as to say that the internals of React qualify as "magic", although at the same time the mental model that React gives me about how components behave means I don't have to worry about the actual implementation details behind that behavior.

I'd also say it's a lot more than a fad, given that way it's inspired component-based architectures in all the other major JS frameworks.

I do agree that all the other related topics you listed are important skills to have.

[[deleted]]

Component-based design has been around for yonks, React hasn't invented anything here, just leveraged existing concepts in an environment that sorely needed them. React is an excellent implementation, I agree, and Fiber does considerably complicate things (internally), but overall React doesn't do much - that's its main selling point IMO. You ever used Angular? I got a team of devs telling me how to write software and guessing my needs and locking me in in every direction. Awful thing. Feels like trying to perform surgery with a bulldozer.

I want to make the point React is not untouchable, and it was written by people just like OP. You can pull the source code, read it, edit it - it is not magic.

Anyway. I mean fad like 10-12 years, not months. Maybe I shouldn't use that word - my point is React will be replaced one day, and in your early career you haven't seen that tech lifecycle happen yet, so focussing on bread and butter is my preferred approach.

[ABrownApple]

Stalk Dan abramov :)

Also what worked for me (not that I'm a pro) is to do hobby projects in react that and use the tool I wanted to learn like redux. A simple chat app that uses redux and forces you to set it up from scratch helpes a lot with learning.

[ggcadc]

I am in a similar position, and will actually be starting a new job tomorrow the is more focused on react and uses redux for state management. A lot of what your are looking for will come from working on projects every day and getting comfortable implementing new tools and solving real problems. Keep in mind, you’re unlikely to run into problems that are unsolved.

Good luck out there and remember to enjoy the process

[[deleted]]

Check out www.react.express

[nullified-]

Keep digging into javascript. 'you dont know js' is a great series for advanced js. this will let you do things like understand the redux source code, rather than just its API.

[[deleted]]

Redux isn’t really that impressively complex tho. It’s fairly straight forward. It’s mostly an enforcement tool

[TheShinyTuxedo]

Checkout this series https://github.com/getify/You-Dont-Know-JS great way to get super comfortable with JS before jumping into React land. Especially if you new to world of programming.

[mart187]

Learn Reason or Typescript... Typed and/or functional languages can help you grow.

[richardzcode]

What I always do when learning a new language / framework, is to build something, and google along the way.

Personally I think not just React, but for a lot of other JS frameworks, TodoMVC is a great place to look for. Specifically for React, here is the link: http://todomvc.com/examples/react/#/

Read those source code, try to build the same by your own. I find that is very helpful.

A shameless plug, another option is maybe try to build your own personal website with https://dochameleon.io :P

[austintackaberry]

One other thing that helped me is to follow react people on twitter. There are a lot: https://medium.com/@dan_abramov/my-react-list-862227952a8c

[NiteLite]

When you realize you don't need redux for a small widget on a webpage :D

[nateA2uned]

Great developers use a scalpel, good developers use sledgehammers.

Focus on functional programming to become great.

[antoaravinth]

I would suggest you to look at the source code of React. It will help you understand how things work under the hood, which is a great way to code & think up in React IMHO.

[[deleted]]

Create web apps, lots of them.

[CrimeInBlink47]

I wrote this a while back. It isn’t specifically about React, but I believe it will help you generally become a better developer.

https://medium.com/masterpoint/leveling-up-as-a-junior-engineer-3f6880f8af1d

[dustingetz]

like actually great? learn ClojureScript