My –hot React Summer

Share httpJunkie.com on..
Tweet about this on TwitterShare on FacebookShare on Google+Share on TumblrEmail this to someone

This will be a short article highlighting my experience as an Angular developer tasking himself with learning React in a month.

I wanted to share with you my latest experience. In June of 2017, I was laid off from what I thought was my dream job working as a UI engineer for Tesla. I don’t want to focus on that, but it should be noted that this is why I had some time on my hands and the need to further my skills by learning another framework.

Being in the San Francisco Bay area, I am close to all of the good meetups and events, so I have started to attend React meetups rather than Angular ones and started working at home to learn React from the ground up. I wanted to push myself to learn React as well as I knew Angular and I was amazed at how easy and approachable React was.

I wanted to start by learning the React basics from a test driven perspective, for this reason I started my learning of React with a course titled: Test-driven Development Using React by Chris Minnick. Since I had the time, I thought it was super important to learn React from a test driven perspective. It was easy to follow this course along and afterwards I feel confident that I could implement unit and integration tests in my code. I also think it’s important to be comfortable with whatever the default testing patterns are for each framework you work in.

In Angular, if you have the CLI installed, Jasmine and Karma are used respectively for out of the box testing. In React our equal to the CLI is create-react-app and the easiest way I found to get started testing and what most people used is Enzyme and Jest. So this course was helpful in explaining the installation and use of those tools in React.

I was well on my way to feeling great about learning React, so eager and confident that I wanted to make Redux the next thing I learned. As an Angular developer working for several large companies and seeing how they fell into bad practices often by not managing state correctly I wanted to put this as top priority, but I knew it would not be as easy as just jumping into Redux. I forced myself to learn a bit of reactive programming first, working with filter, map and reduce. I practiced these concepts in vanilla JavaScript just the same as when I learned how to implement the Flux and Redux patterns.

Using plain JavaScript to learn these concepts I think is the most important thing you can do when learning state management. Because the patterns you learn should be able to be taken to Angular, React or Vue or any other framework or library. having an understanding of these concepts outside of your framework of choice ensures that your understanding of the technology is not confined to one way of doing things.

With all that being said, I’m not sure if I would take Redux to Angular, because I think it’s easy to translate what I know about Redux into working with technologies like Ngrx/Store and I think that there are huge benefits to using that in Angualar, but I definitely realized that it would be totally OK to use Redux with Angular and knowing that I could decide one or the other because of my new found knowledge of Redux empowered me as a developer.

To be honest, I am still very much in the middle of learning state management and figuring out how to best use Redux and React together, I know this will be a longer journey that will take some time to get better at, but I found great courses to get me started at Egghead.io and Pluralsight:

Getting Started with Redux
Redux Fundamentals
Advanced Redux

If I had to recommend one of these courses for someone beginning their journey into React and Redux, it would be the “Getting Started with Redux” course linked above by Dan Abramov (the author of Redux). In fact, I would recommend the courses above in the order that I listed them.

So with more work to do on the Redux side, I still wanted to learn one other subject to ensure I could get started in React building my own applications. I was going to need to learn routing, luckily Egghead.io has us covered here as well.

Add Routing to React apps using React Router v4

I started the course on their site written by Joe Maddalone, Really great React Router 4 starter course and his teaching style is on point and although fast paced it was super concise at the same time. I love the way that he takes you step by step through all of the different variations of Links, NavLinks and Router configurations you will need to know to cover all the bases.

I think that if you are also interested in learning React and you are coming from another framework, I would say that if you have the time it is much better to have knowledge of how to work with many JavaScript frameworks. Especially for me as I interview for jobs this summer I needed to know that if I had a good job opportunity working with React, that I was just as up to date with it as I was Angular. In the meantime, I have also learned a great deal about JavaScript and new features that React takes advantage of when creating components and how easy this makes it to work with the router and just getting a basic app off the ground with minimal code.

I have created a repo that uses react-router-dom if you would like to clone it and see how easy it is to use.

create react app with routing

Have a great summer and keep learning!

Leave a Reply

You must be logged in to post a comment.