Introduction to MobX with React

MobX has slowly built itself up as Redux’s main competition for state management real-estate. Which is definitely not a coincidence. Because, not only is MobX incredibly easy to use; it’s also very powerful. And, believe me when I say this: I’ve never seen React perform any better than when I mix the two of them. But, instead of me telling you, why don’t I show you instead?

A little bit of History: I’ve been working with Redux since version 1.0.0 came out. I was one of the early adopters at my previous company, gave courses on it, and tried to evangelize everyone to my cause. Pretty standard stuff.

Which means that, by the time I found out about MobX, I was already pretty familiar with the competition. Making me change sides was going to be no easy task.

And that’s when I ran into this video by Matt Ruby:

But, since it’s 42 minutes long, I’ll summarize it for you: Mixing MobX and React is like giving your car a consistent Nitro Boost while also reducing its fuel consumption by 90%.

What do I mean by this? The combination literally reduces the number of updates and (by extension) rendering to the bare minimum. Which brings your application to the peak of its performance.

If that doesn’t convince you to give this combo meal a try, nothing will. But, if being super fast is something that interests you, then boy do I have a treat for you next.

Continue Reading "Introduction to Mobx with React"
Should developers know design?

Should developers know design? Or should designers know development? This is an argument that’s been around for several years, although it was mostly aimed at the design crowd. But that could all change with the recent advancements in front end development. Developers could benefit now, more than ever, from understanding design and its principles. Ever since the…Continue Reading “Should Developers know Design?”

react + mobx in es6

On the interest of teaching a topic, I usually try to keep my opinions to myself. After all, I’d much rather you guys come to your own conclusions about things, you know? But, today is not one of those days. No, good sir. None of that objective nonsense. Today we’re going to talk about why ES6 (Or JavaScript 2015) is just the best thing ever.

To do that I have prepared a list of my 5 favorite features about it. But, don’t get me wrong. I don’t mean these are the best ES6  features; that’s definitely up there for debate.

What do I mean then? Just that these are the 5 features that keep me installing Babel on all my projects. And I’m not even kidding. They just make my life that much more awesome.

So without further ado (and in no particular order) here are the 5 reasons why ES6 ROCKS, yo:

Continue Reading "5 reasons why ES6 ROCKS, yo"

I feel like, lately, a lot of my blog posts start the same way: I explain that I didn’t particularly like something in the past, then follow that up with how my perception changed. This time its different: I love TDD with my whole being, and did so from the very start.

There were, however, times when Test Driven Development and I didn’t stand on the best of terms. And, being fair with this wonderful software development process: I was wrong in all of them.

TDD wasn’t any less amazing when I didn’t like it. I just didn’t have enough experience to use it to its full potential. And this lack of vision kept me from reaping the full benefits of the approach; which in turn caused me frustration.

But as time went by, and I kept using the approach over and over again, I slowly began to see the light. And once I began to really understand it, TDD showed me a new world I didn’t even know existed, one of certainty and easy refactors.

And I’m here to share that world with you today, if you wish to join me.

Continue Reading "TDD: A story of ups, downs, and ups again."

Let me be honest with you, pair programming wasn’t really my thing back in the day. I actually pretty much hated it: It seemed intrusive, slow, and even time-wasting sometimes. And It really annoyed me to have someone looking over my shoulder, and seeing everything I typed into my machine.

It’s been two years since then and I’ve spent countless hours pair programming (specially remotely). And I can very confidently say that it’s been one of the most enriching experiences of my career.

Programming with another person can be a pretty intrusive experience when you’re just starting. But it can also be incredibly rewarding once you get used to doing it: You gain access to an entirely new lense through which to see your own code. One that isn’t blind to all your biases and bad practices, and (in the best case scenario) actively challenges you to improve.

Letting another person into your workflow can also lead you to discover parts of yourself (as a professional) that you didn’t know were in you: Maybe you’re a passionate teacher that never had any students before, for example.

And, out of all the things you’ll learn by pair programming, I can guarantee you one: Having a second set of eyes help you code will, without a doubt, teach you a thing or two about yourself and the coding world in general.

Got you interested? Let’s talk about that.

Continue Reading "What Developers get out of Pair Programming"

A lot of talk has been given around React Fiber since it was first announced last year. And even five months later, there are still a lot of questions about it. This article seeks to answer one of them: What question does Fiber answer when it comes to rendering in ReactOr, in other words, what problem does React Fiber solve?

Author’s note: Unlike most of my other articles, this one benefits from some understanding of Javascript, as well as familiarity with ReactJS.  Stephen Grider‘s Modern React with Redux is my personal favorite course for learning this topic, and the one I recommend to most people. I should also mention that, while this article will focus on the web version of the framework, the core concepts can be applied to React Native as well.

React Fiber is an ongoing reimplementation of React’s core algorithm. It is the culmination of over two years of research by the React team.

This is a quote from Geoffrey DhuyvettersWhat is React Fiber and How can I try it out today? Which offers some pretty good guidance towards mastering this new technology, and is definitely worth a read.

But more importantly, this definition tells us two things:

  1. Fiber has been in development for half of React’s open source lifetime.
  2. Fiber is going to change React’s core algorithm.

What is it actually changing though? In very simple terms: Fiber seeks to change the way in which React renders our applications. But, before we can tackle how it will be doing that, we need to understand some core concepts that it aims to improve upon:

Continue Reading "What problem does React Fiber solve?"

Before we can talk about clean, well designed and beautiful code, I would like to ask you a few questions:

Have you ever written a piece of code, and then looked at your creation and wished you never had to open that thing again? Ever opened a file only to find yourself immediately overwhelmed by its contents?

Does this image bring back fond memories of college?

Screen Shot 2017-03-11 at 12.11.53 PM
For some, minimized JQuery. For others, Tuesday.

If that’s the case, then you’ve probably experienced the bizarre world of code that was never meant to be read by a person. And that means that this article, my friend, is for you.

Continue Reading "Beautiful Code (and how to write it.)"
Developer advice from a seasoned professional

Author’s note: I originally intended for this to be a single post containing some of the lessons I had gathered over the years of doing website development and design. Alas, it proved to be a little bit too long (spanning over 3000 words and 15 pages), so I decided to break it up a little. 

It is strongly recommended that you read part 1 of these series before moving forward onto the next, if only so I may let you know of the situation that inspired me to write these pieces of advice here for everyone to see them.

But, now that we’ve cleared that out, these are the last 6 pieces of advice I would like to share with you all:

Continue Reading "10 things new developers should know – Part 2"

My friend Red had a problem with his code.

He was working on integrating a popover onto an application that used a home-brewed variant of Redux Form. This version came with a few extra features to [attempt to] make itself easier to use and reduce development time.

I’ll try to describe the problem in the easiest way possible:

  1. The popover was to be summoned by clicking a button inside the form.
  2. Upon clicking the button, the popover indeed showed up (so good so far.)
  3. The submit event for the form was triggered at the same time.

As you may imagine, this was less than desirable: You’d have an extra AJAX call without the necessary parameters, validation would trigger, children would cry, etc.

By the time I found him, he was proposing to catch the source of the event and use it to filter which buttons were allowed to initiate it. He also tried to scout the entire source code for Redux Form and the plugin built on top of it.

I suggested he change his trigger from a button to an anchor. The code was working 2 minutes later.

Continue Reading "Can it really be that easy? Well yes, yes it can be."

Edit: I felt like the original article was a little too long, and wanted to break it up and make it a little bit easier to take in, you can find part II of the series here.

A friend of mine is leaving the company this week. And among all the feelings that such an event could have sprung inside me; I really found myself wishing there was some kind of wisdom that I could bestow upon him.

Why? Well, to explain that I need to tell you a little bit about him.

You see, when I first met him he was a rookie in many different ways (this being his first job as a developer), and watching him grow into a full-fledged developer has been one of the most satisfying experiences of my career so far.

Working with him taught me a lot too because, before, I had always been the newbie at every office I was at. But now there was somebody younger and less experienced than me, who before I noticed began taking in a lot of my own technique and adding it to his own.

That experience opened my eyes to a lot of the things I had missed from my own development a few years back. And this time I was able to experience them, not through the eyes of a hot-headed kid trying desperately to become good at what I was doing (Thank you for your patience Josh.) But as a seasoned developer watching a rookie slowly come into his own.

So now that I close into the end of an era, I’d like to share with you a few of the things I learned from it. Plus a few others I wish I one day have the time to teach my friend.

Without further delay, here’s my advice to new developers:

Continue Reading "10 things new developers should know – Part 1"