Learning React – Managing state with React Redux

Designing your application using a component-based architecture is a first step towards a nice decoupled design. But with great power comes great complexity! Components might need to interact in different ways in order to achieve some common goals. How can components communicate with each other? In this post, I am going to show how to make components communicate by using the redux pattern.

Learning React – Components and state

Components are small, isolated and reusable units of work that make up a piece of a user interface. Each component is independent, with emphasis in separation of concerns, having it’s own business & presentation logic.

In this post, I am going to show you how to create a single component, as well as how to mutate state within that component by either passing variables, one way in the component or by changing an input value which changes the component’s state.

Learning React – Hello World

Care to learn some React, build your own application and become from zero to hero in just some few steps? Well, you are in the right place, this blog post is all about learning how to setup your environment and get you up and running with React. In just 7 easy steps you will be able to run your hello world app, no sweat.

ES6 generators and async/await in Typescript

Generator

Some exciting features Javascript has developed during the latest versions (ES6, ES2016) are without doubt the generator functions and the async/await support.

These features exist in Typescript for quite some time; the language supported async/await since 1.7 version. But what about them? What they really are and how they work?
In this post I am going to explore their world, their Typescript syntax and implementations.

Socket.io integration tests with chai and mocha

Ah, all the goodies that you are building need to be of highest quality. But how is quality possible when no tests are in place?

If you have followed along, this very website promotes test driven development, very passionately if you ask me. I want my code to be thoroughly tested, I want confidence, I want speed. Remember, test driven development is the practice that makes you agile, in terms of speedy development and ability to cope with the code’s evolution. You go faster when you write tests.

That is no different when we code real time applications, in this particular instance, with socket.io, which heavily relies on an event driven style. We need to make sure that our channels, our business rules and the wiring work properly and that is exactly the story that I am going to tell you, so let’s dive in.

Loading JSON files with SystemJS module loader

I really hate this mess on JavaScript modules. We have AMD, CommonJS or UMD to support both. Then ES6 came into the game. But what about .json files on browser? There are different ways to load them and not all libraries support them! Your module loader should be sophisticated enough to handle this.

In this post, I am going to talk about SystemJS and how it simply loadsĀ files in the browser, other than .js files, like text or JSON, especially from third party modules, without driving you nuts!