Web app architecture based on Redux

Yokohama Art Museum. Photo credit: matiosus via Visualhunt / CC BY

Introduction

My latest side project is a full-blown web app made with some of the latest front-end technologies. The purpose of this article is to describe the modular architecture solution that I’ve used in that web app.

This architecture is dependent on some libraries and their concepts, which will be somewhat explained throughout the article:

  • Redux which is a “predictable state container for JavaScript apps” helping you to “write applications that behave consistently”;
  • RxJS which is a “library for composing asynchronous and event-based programs by using observable sequences”;
  • “Epics” from Redux-Observable which is a side-effects manager for Redux, allowing for composing of asynchronous actions in reaction to other actions using observables (there are other similar solutions, e.g. @ngrx/effects);
  • Apollo GraphQL client. GraphQL is “a query language for APIs” and a beautiful evolution from REST. On the architecture depicted here the GraphQL is not a mandatory option.

[…]


Read the full article.

The front-end web programming is now enterprise-grade

Frontend development started as web-designer-plus thing

In the era of HTML/CSS and Flash, JavaScript was used by a few developers and widespread mainly by web designers as black box gimmicks that allow interaction between the HTML and some dynamic behavior. Managing conflicts, dependencies and versions soon became nightmarish, and it was clear that there was a road ahead.

Besides offering sites displaying fancy animations, companies started betting on web applications, either for interacting with customers or internally within collaborators. HTML was being produced by server code within the realm of full-fledged developers. Also, the tools and speed were on the server side. Modularity and code reuse (for example, using HTML templates) was readily applied using technologies like ASP or JSP.

Classic programming paradigms in front-end technologies

Fast-forward to the second decade of the second millennium and the front-end web programming is a vast and evolving world. One where the classic programming paradigms, I’ve learned in computer science, fully apply.
[…]


Read the full article.

Using Typescript for programming ArangoDB FOXX services

Going back from Typescript to Javascript for programming Foxx services for ArangoDB was a nuisance. The documentation informs that it is possible to use typescript to program the Foxx services and after some searching I’ve found that there is not much information about the subject. Maybe because it is really not that difficult, since the Foxx services are essentially Node modules. Searching for programming Node modules in typescript set me in the right direction. Although I’ve had to take care of some particularities, hence this article.

This article depicts a startup repository and its structure for programming Foxx services using Typescript 2.0. Foxx services are attached to a particular database and allow to build a web-accessible API for your database.

This project assumes that:

  • an ArangoDB database is created
  • a Foxx Service is initialized and on development mode

Which you can learn about on the ArangoDB documentation.

Now let’s followup on this project options and particularities.
[…]


Read the full article.