React, Browserify & Babel

2015 – 03 – 02



We started chatting about the new schedule, the reasons we are having it and where are we headed.

Checked the evolution and the homework I’ve got to do with the Makefile and they worked properly. Right now I am at the chapter 10 on page 430, I came from the page 341 so I’ve done 89 pages, not a big evolution but I’ve learned a lot that I am going to implement at our project. I also have to add that it’s been a couple of busy weeks.

We started talking about the importance of the PIM (not sure about the meaning of the acronym).

AirCrewMentor let me know the importance to learn the next generation of JavaScript and a good way to do that would be starting using Babel but we didn’t got any further here. He specified that when this technology becomes available and demanded he wants to be an expert on it (I would like it too for myself 😛 ).

We commented over how facebook made open source the React library and that it is going to be a good excercise to refactor the project “Cuanto Cuesta” with React.

For this session we focused on using Browserify that allows the code on the browser to act like is hosted on a server so code on JavaScript like this:

var calculateMortage = require("./calculate_mortage.js");

would be useful and wouldn’t need the server to run so we can code and do all the testing in our computer locally.

So first we installed it locally on our project “Cuanto Cuesta”:

$ npm install browserify --save-dev

Then we had to run it so it would get a file ready for us to use on the browser without the need of the server. So we used this command:

$ browserify js/main.js > js/main.browserify.js

So it creates the file main.browserify.js that we need to include in our html file like this:

<script src="js/main.browserify.js"></script>

So with this we would have it ready to rock only browser side. Really useful.

AirCrewMentor  suggested to install on Sublime the pluggin jshint jscs but I already have it, and I got it configured so it runs everytime I save the file as well as the HTML-Prettify that fixes my JS, HTML and CSS. Really great this Sublime.

He also said that for future readings once I have finished the head first I’m with now, I should take as a reference book the Head First Object-Oriented Analysis and Design where I would find the right or the best way to design and develop my code.

It was a great session, on top of it the initial chat where we talked about the reasons and where we can be headed, sharing projects and who knows if we’ll work at the same place and sector.


  • Create a new test in a separate file for the format price function.
  • Ignore Versioning on Browserify Done
  • Add extra step for the npm so it generates automatically the Browserify file on installing the project.
  • Configurate Plugin watchify (Grunt) to automatically generate the Browserify file.
  • Include at the Makefile the command for browserify.

Any observation will be much appreciated

Thanks AirCrewMentor , with every session you keep me motivated and excited.

Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s