I’ve had a lot of trouble picking a JS UI library because there are too many options Angular, React, Ember, VueJS, and so many others but I had to choose one, so my first choice was the most popular then… Angular, but it wasn’t for me.
Then I started catching up with my Twitter feed and found React, everyone was making a lot of good comments, and I thought it might be the new boom. Then the Thought Works Radar for November 2016 came out and there it was… React in the Adopt section… that was the drop of water that fell out of the glass. Right away I started reading like crazy the React official documentation and started a little project with it… didn’t like it… didn’t finish it.
After that, I started to look new ideas for side projects and found a site that gathers lots of tweets with ideas, and this one attracted my attention:
For me, well, I had my challenge to complete to share my experience with you, and it was to Learn React, at least the basics.
Challenge Accepted!
Create a project in React that will challenge the user
That was my challenge, but I couldn’t stop there, the final piece is to write a post about it… This post.
It was an adventure. First, I had to learn React, and with me, the theory is not enough, I have to get my hands dirty, so after reading the documentation, I pinned it on a Chrome tab and created the project with the technologies React.js recommends: ES6, JSX, and Webpack. I also used React Router for the site navigation.
Everything was relatively easy except for Webpack. I must confess it gave me some trouble to configure and understand but with the help of Webpack’s documentation and a variety of Medium posts I have a webpack.config.js working with no issues.
This project also opened an opportunity to get some practice in Design, one of my biggest weaknesses. With various videos on Youtube and a lot of second opinions, I was able to pick the typography and organize the layout a little bit, and my eye for design leveled up.
I know it’s not perfect but it is a beginning, there are still so many things to learn, the Javascript world is always growing, changing and evolving, and we should never stop learning.
If you want your challenge with React here are some useful resources I found:
- React.js Official Docs
- Presentational and Container Components by Dan Abramov
- Webpack Official Docs
- Leveling Up with React: React Router
- ES6 Features
- Top JavaScript Frameworks & Topics to Learn in 2017 by Eric Elliot
- How to Use Classes and Sleep at Night
Basic Graphic Design Videos:
If you want to see the code and/or give me some suggestions to keep improving my skills: Challenge me! Github.