arnausd23

// use case: Retrieve user Quonto information

/* Quonto service layer: */
/* This layer does HTTP calls to our APIs */
connectToQuonto = () => Promise<Token | Error>
readUserInformation = (token) => Promise<User | Error>
    
/* Use case layer: */
/* Handle domain logic */
retrieveUserQuontoInformation = async (onSuccess, onError) => {

arnausd23

What is Plop

​ Plop is a file generator tool system which allows you to define a script file to generate all the boilerplate files for you. Similar in how Angular schematics works, you can define a set of actions who would generate all the pre-defined code for you either automatically or by answering to some CLI prompts. ​ First you will need to define a plopfile.js who would contain a function who would receive a plop object with access to all the methods to generate the code. ​

module.exports = function (plop) {
    plop.setGenerator('components', {

arnausd23

How to organize folders: function-first VS feature-first

Function first

Function-first means that we separate each file into the folder they belong to by their usage. For example in a modern frontend project we might have the following folders:

• /components: Dumb components who only have presentational purposes
• /containers: Smart components who fetch data and have the logic to parse or modify it before sending it into the dumb components:
• /store: Contains all the store files like actions, reducers, selectors, etc.

This might be troublesome when having a large application. For example you might see yourself adding a lot of containers for each page and then having problems finding the file you want inside the containers folder. A common approach to solve this is put every container file inside a folder with the feature name, but then we are using feature-first.

arnausd23

Lenguajes basados en clases

• Clase: Define el comportamiento, así como propiedades y métodos de un objeto. La clase actua como plantilla del objeto a la hora de instanciarlo.
• Entidad: Instancia de una clase. Esta entidad obtiene todos los métodos y propiedades de la clase en el momento de su creación.

Una instancia obtiene sus propiedades y métodos en el momento de su creación, por lo que una vez instanciada no podremos añadir ni modificarlos. De esta forma nos aseguramos que al instanciar una clase, cuando modifiquemos sus atributos o métodos las clases ya instanciadas no se verán afectadas.

Lenguages basados en prototipos

A diferencia de los lenguajes basados en clases, no existe el concepto de entidad o clase, solo existen objetos. Los objetos pueden especificar sus propiedades al ser declarados o en ejecución. Esto permite que un objeto existente pueda ver modificados sus atributos una vez ya creado, lo que puede dar lugar a errores inesperados.

arnausd23

Artículo CSS Grid

Antes de pasar a explicar qué es y para qué sirve css grid explicaré cuál es el estado actual de las herramientas de las que disponemos al desarrollar un layout para nuestra web.

Supongamos que queremos maquetar el siguiente layout:

Deberíamos usar un html con cada sección necesaria, como el siguiente: