TechBook #1 : Développer une application iOS avec Swift 4, Node.js et MongoDB

Dans cette série d’articles nous allons partager avec vous la création d’une application mobile iOS développée en Swfit 4 et consommant une API implémentée en Node.js avec une base de données MongoDB.

Description de l’application

TECHBOOK est un mini réseau social destiné aux informaticiens qui permet de publier des articles, des statuts, des images, des vidéos dans des secteurs prédéfinis (développement web, mobile, sécurité, design……).

L’application comporte 5 modules principaux 

1 – l’authentification 

2 – la gestion de profil

3 – la gestion des publications : ajout, affichage, suppression et consultation

5 – le module de recherche : l’utilisateur peut rechercher des publications par titre ou par catégorie.

La stack technique

Avant d’entamer la réalisation du projet, nous avons étudié les besoins techniques nécessaires pour réaliser notre application. Voici ce qui a été retenu pour la stack.

• Swift 4 : un langage de programmation orienté objet développé par la société Apple. Il est destiné à la programmation d’applications sur les systèmes d’exploitation iOS, macOS, watchOS et tvOS. Il est conçu pour coexister avec l’Objective-C, langage actuel de programmation pour les systèmes d’exploitation d’Apple. 

• Node.js : Encore une fois notre objectif est de pouvoir gérer une grande charge de données ce qui demande une grande performance de traitement de données du côté serveur. Parmi les langages serveur connus, il y a le PHP, Java EE, etc..Et comme toujours, puisqu’il est important de choisir une technologie par rapport aux besoins du projet que l’on développe, nous avons opté pour le Node.js. En fait Node.js est une plateforme de développement Javascript, ce n’est pas un serveur ou un framework, c’est juste le langage Javascript avec des bibliothèques permettant de réaliser des actions comme écrire sur la sortie standard, ouvrir/fermer des connections réseau ou encore créer un fichier. Pour faire simple on peut dire que Node.js nous permet d’utiliser le langage JavaScript sur le serveur. 

Pourquoi utiliser NodeJS ? : 

• Logiciel libre (licence MIT).
• Performance du moteur v8.
• Modèle non bloquant.
• Communauté très active. 
• Système de paquet intégré (NPM ) : Il permet de chercher, installer, désinstaller des paquets (packages).
• De nombreux paquets sont disponibles.
• Les grandes entreprises l’utilisent

Installation de l’environnement de développement

Installation de Xcode

Xcode est un environnement de développement, un IDE pour Mac OS X, ainsi que pour iOS, watchOS et tvOS. 

Vous pouvez télécharger la dernière version de Xcode 10.1 via AppStore ou via le site officiel à partir de ce lien : https://developer.apple.com/xcode/

Le téléchargement peut durer enivrent 2 heures selon votre connexion.

Installation Node.js sur Mac OS X

• Télécharger-le via le site officiel http://: https://nodejs.org  la version recommandée LTS. 
• Installer le fichier téléchargé
• Vous pouvez voir la version du « node package manager » en tapent la commande suivante dans le terminal : 

npm -v

• Vous pouvez voir la version du node en tapent la commande suivante dans le terminal : 

node –v

Installation Visual studio code

Nous allons utilisé comme éditeur pour le développement des web services le fameux Visual studio code que vous le télécharger via : https://code.visualstudio.com/download

Installation de MongoDB sur MAC

• Puisque notre objectif est de pouvoir gérer de grandes quantités de données nous avons opté pour la solution NoSQL. Quand on parle de NoSQL, on regroupe des systèmes de base de données qui ne sont pas relationnels, mais il faut savoir qu’il existe plusieurs types de bases de données NoSQL. Celui que nous allons utiliser est une base orientée documents permettant de représenter les informations sous forme d’objects JSON et ce qui correspond bien à notre besoin. Et parmi les solutions les plus connues dans ce type de bases NoSQL MongoDB se trouve en bonne place MongoDB.

Procédons maintenant à l’installation de MongoDB en commençant d’abord par le télécharger depuis le site officiel : https://www.mongodb.com/download-center/community

Puis extrayez le fichier téléchargé via le terminal via comme suit :

cd ~/Download
tar -zxvf mongodb-osx-ssl-x86_64-3.6.1.tgz
sudo mv mongodb-osx-ssl-x86_64-3.6.1 /usr/local/mongodb

Copier ensuite le dossier extrait sous /usr/local/mongodb en procédant comme suit :

 sudo mv mongodb-osx-ssl-x86_64-3.6.1 /usr/local/mongodb

On crée ensuite le dossier qui contiendra nos données 

$ cd /usr/local/mongodb
$ sudo mkdir -p /data/db

N’oubliez pas de changer la permission du dossier ainsi créé.

$ cd /data/db
$ whoami
votre_nom
$ sudo chown votre_nom /data/db

Mettre le path de MongoDB dans le fichier .bash_profile afin de pouvoir lancer les commandes plus simplement.

$ ls -al

Si le fichier .bash_profile n’existe pas il faut le créer en tapant 

$ touch .bash_profile

Ouvrir le fichier .bash_profile en tapent 

$ open .bash_profile

Copier ces deux lignes dans le fichier

export MONGO_PATH=/usr/local/mongodb
export PATH=$PATH:$MONGO_PATH/bin

Ouvrir nouveau terminal et tester la version de Mongo.

$ mongo –version

Ouvrir un nouveau terminal afin de lancer mongo daemon

$ mongo –version

Installation Mongo Compass

C’est un logiciel open source compatible avec Mac OS. C’est une interface utilisateur pour gérer des bases de données, des collections et documents MongoDB. Il permet de créer, éditer et supprimer des documents. Il gère également la connexion à plusieurs hôtes ce qui permet de basculer d’une instance à une autre facilement. 

Il est téléchargéable à partir de ce lien https://docs.mongodb.com/compass/master/install/

Installation Postman

Afin de pouvoir gérer l’ensemble de nos interactions avec notre API web en dehors de tout contexte métier nous avons utilisé le logiciel Postman qui est un environnement graphique complet permettant d’exécuter des requêtes HTTP à un serveur. Vous pouvez le télécharger à partir de ce lien  https://www.getpostman.com/downloads/

Création du projet Node.js :

Petit rappel :

• npm est gestionnaire de paquets pour Node.js
• npm sera automatiquement installé avec Node.js

Commencez par créer un dossier nommé api. Il contiendra le code de l’API. Ouvrez le terminal et accédez au dossier api et installez les modules nécessaires :

$ npm init
$ npm install –save express
$ npm install –save mongoose

Ouvrez le dossier dans Visual Studio Code

Créer le fichier app.js avec le contenu suivant :

const express = require('express');
const app = express();
const mongoose = require('mongoose');
const bodyParser = require('body-parser');
const config = require('./config');
//Database connection
mongoose.Promise = global.Promise;
mongoose.connect(config.DATABASE,{ useNewUrlParser: true });
mongoose.connection.on('connected', function(req, res) {
    console.log('Connected to the database');
});
mongoose.connection.on('error', function(req, err){
    console.log('Unable to connect to the database ' + err);
});
 
app.all('/*', function(req, res, next) {
    // CORS headers
    res.header("Access-Control-Allow-Origin", "*"); // restrict it to the required domain
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
    // Set custom headers for CORS
    res.header('Access-Control-Allow-Headers', 'Content-type,Accept,X-Access-Token,X-Key');
    if (req.method == 'OPTIONS') {
        res.status(200).end();
    } else {
        next();
    }
});
 
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }));
// parse application/json
app.use(bodyParser.json());
const _PORT = config.PORT;
//Start the server
app.listen(_PORT, function (){
    console.log('Server Started on port ', _PORT);
});

Ensuite créer le fichier config.js et mettez-y le contenu suivant :

module.exports = {
    'SECRET': 'MySecret',
    'DATABASE': 'mongodb://localhost:27017/TechBook_db',
    'PORT': '2500',
    'host':'http://localhost:2500/'
};

• Lancer le serveur via le terminal du vsCode 

$node app.js

Perspective :

Dans ce premier article nous avons mis en place notre environnement et bootstrappé l’API. Dans le prochain article nous développerons l’API et la consommerons depuis l’application mobile. A très bientôt pour le prochain article.