In the article “ Angular-ElectronJS — Login API REST jwt “, the user’s token was saved in his browser thanks to localStorage.

But here, our goal is to create a cross-platform application: desktop software and web application, so we will adjust our code to meet this goal.

A few steps :

  • Creation of a shared storageService that records the information returned by the server:
  • either localStorage (in the webapp context)
  • or in a json file (in the electronjs context)
  • Replacing calls from localStorage .

The creation of this service is done with the following Angular command:

ng g service providers/storage


In the previous article, we saw how to validate an identification form. We also know how to save the token sent by the server if the connection succeeds. We are also able to manage different types of error messages, either at the level of each field (username and password) or when we receive a return that we don’t like from the server.

This time, we are going to protect some pages. Indeed, these must be visible only by the people who are connected. Hence the usefulness of our identification page.

Protecting involves 2 straightforward actions:

  • If you try to access…

A Flutter application is created by default with the blue color as on this capture.

This article describes the steps to follow to customize the colors of the application. For example, we want this application to respect the color codes defined by the company’s marketing department.

Here are the steps to follow:

  • Find the right color combination.
  • Retrieve the hexadecimal codes of these colors
  • Integrate these colors into the theme.
  • Test the rendering in the application.

Let’s go to this this link to create this custom color combination. On this page you can choose from the predefined colors or create…


Let’s get to the heart of our Angular/Electronjs application. Let’s create a login page in our web application.

This login page will communicate later with a nodejs backend developed by expressjs. This application is already functional. It uses the ORM sequelize to connect to a Mysql database.

This is an article detailing the implementation of this application.

For the general interface’s design, we could have chosen bootstrap. We will do better and follow the Angular standard;) We will then use Material Angular.

Several reasons lead us to this choice :

  • Because Material Angular is developed by Angular, therefore it integrates…

Un CMS (Content Management System) ou Système de gestion de contenu en ligne est un outil de travail. Il permet de gérer facilement le contenu d’un site Internet à partir d’une interface d’administration protégée par un mot de passe et un identifiant.

Il existe 3 types de CMS :

  • CMS couplé (ou classique) : le back-office (pour gérer le contenu) se trouve sur le même serveur que le front-office (site internet). Ils utiliser le même langage de programmation (php par exemple) et la base de données (MySQL) pour stocker le contenu.
  • CMS découplé (Decoupled CMS) : le back-office (pour gérer…

Il s’agit d’une application web qui agit comme une application mobile. C’est comme si on avait une application dans notre téléphone mais à partir d’une url dédiée. Elle est développée donc à partir des mêmes langages de programmations utilisés pour créer des sites internet : html, css et javascript.

Ionic est un framework qui permet de créer une PWA et une application hybride. Une application hybride est également une application dévelopée avec le(s) même(s) langage(s) de programmation (Javascript, css et html). …


En tant que développeur informatique, Il nous arrive souvent de mettre en place une fonctionnalité liée à un email — exemple: envoi d’un email de confirmation à la soumission d’un formulaire.

Aussi, on aimerait bien tester plusieurs choses sur cette fonctionnalité :

  • Les caractères contenus dans l’objet du mail sont-ils bien encodés ?
  • Les images dans le corps du mail sont-elles affichées correctement ?
  • Les destinataires que nous avons spécifiés dans notre script sont-ils bien affichés dans le champ “To” ou reçoivent-ils tous le mail envoyé ?
  • Les pièces jointes ont-elles été bien ajoutées ?
  • etc…

Lorsqu’on travaille en local…


Un webhook est une méthode permettant d’ajouter ou de modifier le comportement d’une page grâce à un retour d’appel ( callback). Le format est le JSON et la requête utilisée est la méthode POST.

Dans le cas de gitlab ou de github, un webhook est utilisé par exemple pour déclencher un événement suite à un nouveau push dans un repository ou à la création d’une issue ( report d’une anomalie). Cet événement lance une URL ajoutée dans gitlab en utilisant la méthode POST.

Pré-requis pour la mise en place d’un webhook dans gitlab :

  • Créer ou choisir un repository dans…

Suite à un article sur la mise en forme de la page de connexion avec Angular-Electronjs.

Nous allons implémenter cette fois-ci le côté backend de ce formulaire.

On abordera les élements suivants :

  • Nettoi du code et factorisation
  • Messages d’erreurs
  • Formulaire HTML — Ajout du reactive forms.
  • Typescript — Validation du formulaire et connexion à une api en nodeexpress-js

Nettoi du code et factorisation

Faisons un peu de ménage dans notre code.

Modules supplémentaires

En premier lieu, nous allons modifier l’utilisation de fontawesome grâce au module fontawesome pour Angular .

Le code classique sera remplacé par celui-ci

<fa-icon icon="['fas', 'spinner']" spin="true"></fa-icon>

Ce remplacement nécessite évidemment l’installation de…


is a framework built with nodejs to create a blog quickly and easily. Like wordpress or other blog platforms, articles and content are not stored in databases but the form of files written with the markdown language. These Markdown files will then be compiled into html files.

Like any application nodejs, there are several commands to create a page, a post, a category, generate static files, deploy on a server:

If you want to change platforms — for example from wordpress, Jekyll, octopress, joomla to Hexo or import an rss stream, this is also possible.

Prerequisites

Let’s install nodejs if it’s…

miary.dev

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store