So, for the past few years I’ve been diving into different kinds of projects, from converting PSDs designs into HTML(5) websites using CSS(3) and my favorite tool SASS or Bootstrap 3, to coding backend modules with Go or PHP(Laravel) and creating clusters for Neo4j with Docker containers, its been one heck of a ride, but all of these projects have one thing in common, Reactjs.
At first I started modifying existing components, getting used to the idea of component based websites, but as the projects evolved, I had to create new websites from scratch, only having the PSD design or creating new components to consume an API. So here is where my journey really begins.
So many tutorials out there, from the official documentation to specialized courses, I had to decide where to start. Nothing better than to start with the official doc, life was looking good, but then the confussion began. When looking at other tutorials I noticed that javascript was written differently, here comes the versioning of javascript, es5, es6 and not to mention the compilers that I needed to configure when working with Reactjs. So I took a step back and started learning webpack since its the backbone for every Reactjs project that I’ve seen and/or worked on. How to configure SASS, resource loading, optimizing images and of course the compiler so I can use the new version of javascript (which I love. I was always forgetting to use .bind but the arrow functions really solved that).
After getting the hang of webpack , and stablishing a basic starting point for every Reactjs project (I just fork that from my repo and I know I have a working starting point), I moved to reactjs itself, playing around with it, seeing how it worked, what can I do with it, the use of the virtual dom. I though life was good again, but then here comes Redux, although not made only for reactjs, it really helped me managed application state, at first it was confusing, jumping from handling the states within reactjs to using a (middleware) for it, but boy, I have to say, it’s really handy for creating clean and understandable code. All of this I had to learn it while working on projects and applying that new knowledge to it, I think its the best way to learn, under pressure!!! and on live projects(wouldn’t you agree?) :)
My journey with Reactjs or any related technology is far from over, as the projects grow in complexity and its popularity keeps increasing, I’ll learn even more.
So to recap my steps for leaning and working with Reactjs
- Learn webpack
- Learn Reactjs
- Create a working initial point of modules and .conf files to save time
- Play around and keep creating with Reactjs
- Consume APIs (here is a collective list of public JSON APIs you can use to practice or even use on your projects)