First of all, I wish you a Happy New Year. May it be full of happiness and lines of code :-)

Let's now talk about the new hotness, a JavaScript library getting more and more trendy, with an unceasingly growing community: React. It's under active development these days, powered by Facebook (and initially created by). Basically, it's meant to build user interfaces in a web context, but recently they also exported it to mobile development, alloying anyone to write some kind of cross-platform code for both Android and iOS, in JavaScript, just like Appcelerator Titanium.

At the present time, I'm still getting acquinted with it, but here are a few pieces of advice about how to get started correctly.

Must read

How to

You have 2 main tools of choice, to compile it into some browser-compliant package: Webpack or Browserify. I personally decided to go with the former, as it's the most popular and offer more possibilites. Briefly, how to start a new project with webpack:

npm init # Entry point: index.js
npm install --save react react-dom babel-preset-react babel-preset-es2015
# The previous line is required to run React with ES6
npm install webpack --save-dev
# --save-dev allow us to add it to the package.json
npm install webpack-dev-server --save-dev
# To live reload changes in the browser in development
# MUST NOT BE USED IN PRODUCTION
npm link webpack # To make the command available as if it was installed globally
npm link webpack-dev-server

# Install babel
npm install babel-loader --save-dev
# OR, in case of problem
npm install babel-loader@5.x --save-dev

Configure webpack

There are two ways to pass the configuration object to webpack. However, here we're going to use the CLI way, which uses a conf file. Create webpack.config.js at the root of the project, containing this:

module.exports = {
    // configuration
};

That's all for now. This article is likely to be updated in a near future, stay tuned!

PS: a friend of mine also gave a talk last year, at our school, about React. He was an avant-gardist ;-)

React

Must read

How to

Configure webpack

Futher reading

Bundle size optimization

Performance

Functional components

About Babel

About Redux