Dockeriser les applications monolithiques

Récemment, j'ai voulu implémenter docker pour une application, que j'ai développée en utilisant Node.js et Angular. Mais le problème ici est que le frontend et le backend résident dans le même dossier. Bien sûr, il aurait été plus facile de les répartir dans des référentiels distincts puis de dockeriser chacun d'eux. Mais j'ai décidé de ne pas changer la structure car l'application elle-même était très basique - avec des fonctionnalités limitées et je ne voulais pas maintenir deux référentiels différents et les héberger sur des serveurs différents. Vous avez peut-être également rencontré de tels problèmes, en particulier lorsque vous travaillez avec une application monolithique héritée. Alors, essayons d'implémenter docker ensemble !

CONDITIONS PRÉALABLES

1. Node.js et NPM—https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
2. Postgresql —https://www.postgresql.org/download
3. Docker —https://docs.docker.com/get-docker

PORT=3000
ENV=development
URL=http://api.jsoneditoronline.org/v1/docs/088b6155ffc749e9a8ace0721f2cc384/data
SESSION_SECRET=psyduck
DB_USER=postgres
DB_PASSWORD=root

Suivez ces commandes pour exécuter le projet dans votre système —

npm install
npm run migrate
npm start

Ouvrez localhost:3000dans votre navigateur pour voir le projet en cours d'exécution.

Remarque : Si vous souhaitez voir les modifications en direct pour l'interface, exécutez la commande npm run servedans un terminal séparé et ouvrez localhost:4200.

Ajout de docker à l'application

Remarque : Pour ajouter Docker, assurez-vous que Docker est installé sur votre système. Sinon, suivez ce lien pour l'installer.

Ajouter Dockerfileau répertoire racine du projet. Celui-ci contient toutes les commandes à appeler sur la ligne de commande pour assembler une image.

FROM node:16-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
CMD [ "npm", "run", "start" ]
EXPOSE 3000

FROM node:16-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 4200
CMD [ "npm", "run", "serve" ]

services:
  server:
    build:
      context: ./
      dockerfile: Dockerfileserver
    volumes:
      - .:/app
      - /app/node_modules
    restart: always
    ports:
      - "3000:3000"
    depends_on:
      - client
  client:
    build:
      context: ./
      dockerfile: Dockerfileclient
    volumes:
      - .:/app
      - /app/node_modules
    restart: always
    ports:
      - "4200:4200"

Remarque : assurez-vous d'exécuter docker desktop avant d'exécuter ces commandes.

docker-compose build
docker-compose up

Avant les dockers, le frontend et le backend des applications fonctionnaient sur des ports différents - 4200et 3000respectivement. Mais comment communiquaient-ils entre eux ? La réponse se trouve dans le fichier — proxy.conf.json. Cela indique à l'interface que toutes les requêtes API adressées au serveur doivent être transmises par proxy localhost:3000.

{
    "/api": {
      "target": "http://localhost:3000/",
      "secure": false
    }
}

{
    "/api": {
      "target": "http://server:3000/",
      "secure": false
    }
}

Il y a un problème ici - si nous apportons des modifications à l'interface, cela se reflète dans l'application lors d'un rechargement. Mais les modifications apportées au serveur nécessitent un redémarrage de l'application. Pour résoudre ce problème, utilisons nodemon.

Installez la bibliothèque à l'aide de — npm install nodemon. Maintenant, ajoutez le script package.jsonpour démarrer l'application à l'aide de nodemon —

"dev": "nodemon --ignore 'dist/*' server.js"

Pour arrêter le conteneur docker, utilisez la commande docker-compose down.

Dans la prochaine partie de ce blog, nous discuterons de la façon d'ajouter une base de données à cette application et de la faire fonctionner avec les dockers ! La partie 2 arrive bientôt !

J'espère que vous avez trouvé cet article utile et n'hésitez pas à me le faire savoir en cas de question ou de requête. Laissez un commentaire ici et je vous répondrai sûrement!