1. Introduction
Dans cet article,nous allons voir comment Cloud Run et MongoDB s'associent pour permettre une expérience de développement d'applications MEAN stack entièrement sans serveur. Nous allons apprendre à créer une application MEAN sans serveur avec Cloud Run et MongoDB Atlas, la plate-forme de données d'application multicloud de MongoDB.
Qu'est-ce que Cloud Run ?
Cloud Run vous permet de créer et de déployer des applications conteneurisées évolutives écrites dans n'importe quel langage (y compris Go, Python, Java, Node.js, .NET et Ruby) sur une plate-forme entièrement gérée. Cloud Run se distingue de la concurrence en nous permettant :
- Empaqueter le code dans plusieurs conteneurs sans état qui sont sensibles aux requêtes et l'appeler via des requêtes HTTP
- Ne payer que les ressources exactes que vous utilisez
- Compatible avec n'importe quel langage de programmation, n'importe quelle bibliothèque de système d'exploitation de votre choix ou n'importe quel binaire
Pour en savoir plus sur les fonctionnalités, consultez ce lien.
Base de données sans serveur avec MongoDB Atlas
Pour résoudre ce problème, MongoDB a lancé des instances sans serveur, un nouveau déploiement de base de données sans serveur entièrement géré dans Atlas. Avec les instances sans serveur, vous n'avez jamais à vous soucier de l'infrastructure. Il vous suffit de déployer votre base de données, et elle s'adaptera à la demande de manière fluide, sans nécessiter de gestion manuelle. Et le meilleur dans tout ça ? Vous ne serez facturé que pour les opérations que vous exécutez. Pour que notre architecture soit véritablement sans serveur, nous allons combiner les capacités de Cloud Run et de MongoDB Atlas.
Pile MEAN
La pile MEAN est une pile technologique permettant de créer des applications Web full stack entièrement avec JavaScript et JSON. La pile MEAN se compose de quatre composants principaux : MongoDB, Express, Angular et Node.js.
- MongoDB est responsable du stockage des données.
- Express.js est un framework d'application Web Node.js permettant de créer des API.
- Angular est une plate-forme JavaScript côté client.
- Node.js est un environnement d'exécution JavaScript côté serveur. Le serveur utilise le pilote MongoDB Node.js pour se connecter à la base de données, et récupérer et stocker les données.
Ce que vous allez faire
Vous allez écrire une application full stack Employee-Job Role dans MongoDB, Express JS, Angular JS et Node JS. Il comprend :
- Application serveur dans Node.js et Express.js, conteneurisée
- Application cliente créée dans AngularJS et conteneurisée
- Les deux applications sont déployées dans Cloud Run.
- L'application serveur se connecte à l'instance MongoDB sans serveur à l'aide du pilote MongoDB NodeJS.
- L'API du serveur effectue les interactions en lecture-écriture avec la base de données.
- L'application cliente est l'interface utilisateur de l'application Employee-Job Role.
Points abordés
- Créer des instances MongoDB sans serveur
- Configurer un projet Cloud Run
- Déployer des applications Web dans Google Cloud Run
- Créer et déployer une application MEAN Stack
2. Conditions requises
3. Créer l'instance et la base de données MongoDB Serverless
- Pour commencer, découvrez MongoDB Atlas sur Google Cloud.
- Une fois inscrit, cliquez sur le bouton "Build a Database" (Créer une base de données) pour créer une instance serverless. Sélectionnez la configuration suivante :
- Une fois votre instance sans serveur provisionnée, elle devrait être opérationnelle.
- Cliquez sur le bouton "Connect" (Se connecter) pour ajouter une adresse IP de connexion et un utilisateur de base de données.
- Pour cet atelier de programmation, nous allons utiliser le paramètre "Autoriser l'accès depuis n'importe où". MongoDB Atlas est fourni avec un ensemble de fonctionnalités de sécurité et d'accès. Pour en savoir plus, consultez l'article de documentation sur les fonctionnalités de sécurité.
- Utilisez les identifiants de votre choix pour le nom d'utilisateur et le mot de passe de la base de données. Une fois ces étapes terminées, vous devriez voir ce qui suit :
- Cliquez sur le bouton "Choisir une méthode de connexion", puis sélectionnez "Connecter votre application".
- Copiez la chaîne de connexion qui s'affiche et remplacez le mot de passe par le vôtre. Nous utiliserons cette chaîne pour nous connecter à notre base de données dans les sections suivantes.
4. Configurer un projet Cloud Run
- Tout d'abord, connectez-vous à la console Cloud, puis créez un projet ou réutilisez un projet existant.
- Mémorisez l'ID du projet que vous avez créé.
- Vous trouverez ci-dessous une image de la nouvelle page de projet, où vous pouvez voir l'ID de votre projet au fur et à mesure de sa création.
- Ensuite, activez l'API Cloud Run depuis Cloud Shell :
- Activez Cloud Shell depuis la console Cloud. Il vous suffit de cliquer sur "Activer Cloud Shell".
- Une fois connecté à Cloud Shell, vous êtes en principe authentifié, et le projet est déjà défini avec votre ID de projet. Si, pour une raison quelconque, le projet n'est pas défini, exécutez simplement la commande suivante :
gcloud config set project PROJECT_ID
- Exécutez la commande ci-dessous :
gcloud services enable run.googleapis.com
- Nous allons utiliser Cloud Shell et l'éditeur Cloud Shell pour les références de code. Pour accéder à l'éditeur Cloud Shell, cliquez sur "Ouvrir l'éditeur" dans le terminal Cloud Shell :
5. Cloner le projet MEAN Stack
- Nous allons déployer une application Web de gestion des employés. L'API REST est conçue avec Express et Node.js, l'interface Web avec Angular, et les données seront stockées dans l'instance MongoDB Atlas que nous avons créée précédemment.
- Clonez le dépôt du projet en exécutant la commande suivante dans le terminal Cloud Shell :
git clone https://github.com/mongodb-developer/mean-stack-example.git
6. Déployer l'API REST Express et Node.js
Fichier de configuration Docker
- Nous allons d'abord déployer un service Cloud Run pour l'API REST Express. Le fichier le plus important pour notre déploiement est le fichier de configuration Docker. Voici un exemple :
mean-stack-example/server/Dockerfile
# Use the official lightweight Node.js 12 image.
# https://hub.docker.com/_/node
FROM node:17-slim
WORKDIR /usr/app
COPY ./ /usr/app
# Install dependencies and build the project.
RUN npm install
RUN npm run build
# Run the web service on container startup.
CMD ["node", "dist/server.js"]
- La configuration configure Node.js, puis copie et compile le projet. Lorsque le conteneur démarre, la commande ci-dessous lance le service.
node dist/server.js
- Pour démarrer un déploiement Cloud Run, cliquez sur l'icône Cloud Run dans la barre latérale de gauche :
- Cliquez ensuite sur l'icône "Déployer sur Cloud Run" :
- Remplissez la configuration du service comme suit :
- Nom du service : node-express-api
- Plate-forme de déploiement : Cloud Run (entièrement géré)
- Région : sélectionnez une région proche de celle de votre base de données pour réduire la latence.
- Authentification : autoriser les appels non authentifiés
- Sous "Paramètres de révision", cliquez sur "Afficher les paramètres avancés" pour les développer :
- Port du conteneur : 5200
- Variables d'environnement. Ajoutez la paire clé/valeur suivante et assurez-vous d'ajouter la chaîne de connexion pour votre propre déploiement MongoDB Atlas :
ATLAS_URI:mongodb+srv:/<username>:<password>@sandbox.pv0l7.mongodb.net/meanStackExample?retryWrites=true&w=majority
- Pour l'environnement de compilation, sélectionnez "Cloud Build".
- Enfin, dans la section "Build Settings" (Paramètres de compilation), sélectionnez :
- Compilateur : Docker
- Docker : mean-stack-example/server/Dockerfile
- Cliquez sur le bouton "Deploy" (Déployer), puis sur "Show Detailed Logs" (Afficher les journaux détaillés) pour suivre le déploiement de votre premier service Cloud Run.
- Une fois la compilation terminée, l'URL du service déployé devrait s'afficher :
- Ouvrez l'URL et ajoutez "/employees" à la fin.
- Vous devriez voir un tableau vide, car il n'y a actuellement aucun document dans la base de données.
Déployons l'interface utilisateur pour pouvoir en ajouter.
7. Déployer l'application Web Angular
Notre application Angular se trouve dans le répertoire client. Pour le déployer, nous utiliserons le serveur Nginx et Docker. Juste une idée : vous pouvez également utiliser Firebase Hosting pour le déploiement de votre application Angular, car vous pouvez diffuser votre contenu directement sur un CDN (réseau de diffusion de contenu).
Fichiers de configuration
Examinons les fichiers de configuration :
mean-stack-example/client/nginx.conf
events{}
http {
include /etc/nginx/mime.types;
server {
listen 8080;
server_name 0.0.0.0;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
}
}
- Dans la configuration Nginx, nous spécifions le port par défaut (8080) et le fichier de démarrage (index.html).
mean-stack-example/client/Dockerfile
FROM node:17-slim AS build
WORKDIR /usr/src/app
COPY package.json package-lock.json ./
# Install dependencies and copy them to the container
RUN npm install
COPY . .
# Build the Angular application for production
RUN npm run build --prod
# Configure the nginx web server
FROM nginx:1.17.1-alpine
COPY nginx.conf /etc/nginx/nginx.conf
COPY --from=build /usr/src/app/dist/client /usr/share/nginx/html
# Run the web service on container startup.
CMD ["nginx", "-g", "daemon off;"]
- Dans la configuration Docker, nous installons les dépendances Node.js et créons le projet. Nous copions ensuite les fichiers créés dans le conteneur, puis nous configurons et démarrons le service Nginx.
- Enfin, nous devons configurer l'URL de l'API REST afin que notre application cliente puisse lui envoyer des requêtes. Comme nous n'utilisons l'URL que dans un seul fichier du projet, nous allons la coder en dur. Vous pouvez également associer la variable d'environnement à l'objet window et y accéder à partir de là.
mean-stack-example/client/src/app/employee.service.ts
...
@Injectable({
providedIn: 'root'
})
export class EmployeeService {
// Replace with the URL of your REST API
private url = 'https://node-express-api-vsktparjta-uc.a.run.app';
...
- Nous sommes prêts à déployer sur Cloud Run. Démarrez un nouveau déploiement avec les paramètres de configuration suivants :
- Service Settings: Create a service - Nom du service : angular-web-app
- Plate-forme de déploiement : Cloud Run (entièrement géré)
- Authentification : autoriser les appels non authentifiés
- Pour l'environnement de compilation, sélectionnez "Cloud Build".
- Enfin, dans la section "Build Settings" (Paramètres de compilation), sélectionnez :
- Compilateur : Docker
- Docker : mean-stack-example/client/Dockerfile
- Cliquez à nouveau sur le bouton "Deploy" (Déployer) et consultez les journaux pendant que votre application est envoyée dans le cloud. Une fois le déploiement terminé, l'URL de l'application cliente doit s'afficher.
- Ouvrez l'URL et testez votre application.
8. Effectuer un nettoyage
Pour éviter que les ressources utilisées dans cet atelier soient facturées sur votre compte Google Cloud, procédez comme suit :
Arrêter les instances MongoDB
- Accédez aux clusters MongoDB Instance.
- Sélectionnez le cluster et l'instance que vous avez créés.
- Cliquez sur les points de suspension à côté du nom du cluster, puis sélectionnez "Arrêter" dans la liste.
Supprimer les déploiements Cloud Run
- Accédez à la page Cloud Run de la console Google Cloud.
- Sélectionnez le service Cloud Run que vous souhaitez supprimer.
- Cliquez sur l'icône de suppression en haut de la console.
9. Félicitations
Félicitations ! Vous avez créé une application Web MEAN Stack sur Cloud Run.