Agence web » Actualités du digital » Comment déployer un site statique gratuitement à l’aide de la plate-forme d’applications de DigitalOcean –

Comment déployer un site statique gratuitement à l’aide de la plate-forme d’applications de DigitalOcean –

Logo DigitalOcean

App Platform est une nouvelle offre de plate-forme en tant que service (PaaS) de DigitalOcean. Il vous permet de pousser le code en production sans configurer d’infrastructure. App Platform se connecte aux référentiels GitHub et GitLab pour créer et déployer automatiquement vos projets.

DigitalOcean a lancé App Platform en octobre 2020, affirmant qu’il souhaitait «réinventer» le concept PaaS. App Platform est une solution entièrement gérée qui prend en charge les langues les plus courantes, fournit un certificat HTTPS automatique et offre une mise à l’échelle horizontale et verticale.

Création de votre site

Dans ce guide, nous vous montrerons comment utiliser le plan Starter gratuit pour créer et déployer un site Web statique sans vous soucier de l’infrastructure. Vous pouvez lancer jusqu’à trois sites gratuitement. Des sites supplémentaires peuvent être achetés en passant à un niveau supérieur ou en payant un forfait de 3 $ / mois par site.

La première étape est simple: vous devez créer votre site statique! App Platform prend en charge les générateurs statiques les plus populaires tels que Gatsby, Hugo et Jekyll. Vous pouvez également utiliser du HTML et du CSS simples, sans processus de construction du tout.

Nous utilisons un site Jekyll barebones pour ce tutoriel. Si vous souhaitez simplement suivre, vous pouvez utiliser l’un des exemples d’application de DigitalOcean. Une fois que vous avez créé votre site, assurez-vous de pousser votre code vers un référentiel Git dans votre compte GitHub ou GitLab.

Connexion de DigitalOcean à votre référentiel

Une fois que vous êtes prêt à déployer, connectez-vous à votre compte DigitalOcean. Cliquez sur le lien «Applications» dans la barre latérale gauche. Ensuite, cliquez sur le bouton bleu «Lancer votre application».

Capture d'écran montrant l'emplacement de la plate-forme d'application dans l'interface utilisateur du cloud DigitalOcean

Vous devez maintenant connecter App Platform à votre compte GitHub ou GitLab. Cliquez sur le bouton qui s’applique à vous. Suivez les invites pour vous authentifier et autoriser DigitalOcean à accéder à vos référentiels. Vous serez ensuite redirigé vers DigitalOcean.

Capture d'écran de la création d'une application dans DigitalOcean App Platform

Vous devriez maintenant voir que votre compte a été connecté. Sélectionnez le référentiel que vous souhaitez déployer dans le menu déroulant. Si votre référentiel ne s’affiche pas, assurez-vous que ses paramètres d’autorisation permettent à DigitalOcean d’y accéder. Suivez le lien d’aide en bas de l’écran si vous devez vérifier.

Capture d'écran de la création d'une application dans DigitalOcean App Platform

Configurer votre application

Sur l’écran suivant, commencez par donner un nom à votre application. Ceci est affiché dans l’interface utilisateur de DigitalOcean. C’est généralement une bonne idée de faire correspondre le nom de votre référentiel Git.

Utilisez le menu déroulant pour choisir la région du centre de données DigitalOcean vers laquelle effectuer le déploiement. Au moment de la rédaction de cet article, seules les régions de New York, Amsterdam et Francfort prenaient en charge App Platform. Vous devez généralement choisir le datacenter le plus proche géographiquement de vos utilisateurs.

Capture d'écran de la création d'une application dans DigitalOcean App Platform

Vous devez maintenant sélectionner la branche à partir de laquelle effectuer le déploiement. La valeur par défaut de master devrait être correct pour la plupart des projets. Vous pouvez modifier cela pour déployer facilement une version préliminaire de votre projet, telle qu’un staging ou test branche.

Capture d'écran de la création d'une application dans DigitalOcean App Platform

La dernière option, «Autodeploy code changes», contrôle si DigitalOcean doit automatiquement mettre à jour votre application. Lorsque cela est activé, App Platform surveillera votre référentiel Git. Il démarrera automatiquement un nouveau déploiement lorsque le nouveau code sera fusionné dans la branche sélectionnée. Vous devrez lancer manuellement chaque nouveau déploiement si vous n’activez pas ce paramètre.

Lorsque vous cliquez sur «Suivant», DigitalOcean analysera votre référentiel pour déterminer comment il est construit. Dans notre cas, App Platform a détecté que nous déployons un site Jekyll. La commande de construction a été renseignée automatiquement.

Capture d'écran de la création d'une application dans DigitalOcean App Platform

Vous pouvez modifier la commande de construction si vous avez besoin de personnaliser la façon dont votre site est construit. Vous pouvez également définir des variables d’environnement qui seront mises à disposition pour le processus de génération.

Déployez votre application

Cliquez sur le bouton Suivant pour finaliser le déploiement de votre application. Vous devrez confirmer le niveau App Platform sur lequel vous souhaitez effectuer le déploiement. Assurez-vous que le forfait Starter gratuit est sélectionné (ou passez à un forfait payant si vous préférez) et examinez le coût mensuel de l’application qui s’affiche. Enfin, cliquez sur le bouton bleu «Launch Starter App» pour commencer votre déploiement.

Capture d'écran de l'écran de sélection du plan de la plateforme d'application DigitalOcean

Le déploiement peut prendre plusieurs minutes. App Platform doit créer votre site, en exécutant le compilateur Jekyll dans notre cas, avant de le pousser sur l’infrastructure de DigitalOcean. La progression sera affichée dans le tableau de bord du projet.

Finalement, vous verrez un message vert «Déploiement réussi». Votre application est maintenant déployée sur le cloud DigitalOcean! Cliquez sur le lien «Live App» pour afficher votre déploiement. Vous aurez été assigné au hasard ondigitalocean.app sous-domaine. Dans notre cas, nous pouvons maintenant voir la page d’accueil par défaut de Jekyll.

Capture d'écran d'un exemple de site Jekyll

Gérer votre application

Maintenant que votre application est en ligne, vous pouvez utiliser le tableau de bord pour la surveiller et la gérer. L’onglet «Vue d’ensemble» vous permet de vérifier la dernière heure de déploiement et de voir en un coup d’œil les statistiques de santé.

Capture d'écran du tableau de bord DigitalOcean App Platform

Pour obtenir des informations plus détaillées, cliquez sur l’onglet «Insights». Cela affiche des graphiques de métriques qui enregistrent le débit CDN de votre application. Utilisez l’onglet «Déploiements» pour afficher l’historique des déploiements. Cela affichera un seul événement de «déploiement initial» pour commencer. Il sera rempli de nouveaux journaux à mesure que vous effectuez des déploiements supplémentaires.

Capture d'écran du tableau de bord DigitalOcean App Platform

Vous pouvez maintenant essayer de mettre à jour votre application. Modifiez un fichier dans votre référentiel, créez un commit Git et transmettez-le à la branche à partir de laquelle vous déployez. Si vous avez activé les déploiements automatiques, DigitalOcean détectera l’événement push et se redéploiera automatiquement. Dans quelques minutes, votre changement sera en ligne!

Ajouter un domaine

App Platform a une prise en charge de domaine personnalisé intégrée. L’environnement «ondigitalocean.app» qui vous est fourni par défaut est peu susceptible d’être beaucoup utilisé au-delà de l’expérimentation initiale.

Cliquez sur l’onglet « Paramètres » dans le tableau de bord de votre application. Ensuite, cliquez sur le lien «Modifier» à côté de l’en-tête Domaines. Appuyez sur le bouton « Ajouter un domaine » et tapez le domaine que vous souhaitez utiliser.

Capture d'écran montrant la page des paramètres de DigitalOcean App Platform

Sur l’écran suivant, suivez les instructions pour associer votre domaine à votre déploiement App Platform. Si vous utilisez les serveurs de noms de DigitalOcean, les enregistrements DNS pertinents seront ajoutés automatiquement. Sinon, vous devrez copier manuellement les enregistrements DNS affichés dans l’interface des paramètres DNS de votre registraire.

Capture d'écran du tableau de bord DigitalOcean App Platform

Cliquez sur « Ajouter un domaine » pour attacher le domaine à votre application. Vous pourrez l’utiliser pour accéder à votre déploiement dès que la résolution DNS est correctement configurée. DigitalOcean obtiendra automatiquement un certificat SSL pour votre site.

Conclusion

La plate-forme d’applications de DigitalOcean est un nouveau concurrent dans l’espace PaaS. Il vous permet de déployer des applications à partir d’un référentiel Git sans avoir à penser à l’infrastructure. Vous connectez votre compte, sélectionnez votre référentiel et suivez les invites pour mettre votre code en ligne sur Internet.

Nous n’avons examiné que le déploiement le plus basique, un site statique sans dépendances externes. La plate-forme d’applications peut également être utilisée pour héberger des services backend et des bases de données avec une facilité d’utilisation similaire. Chaque application peut incorporer plusieurs composants, tels qu’une API PHP, une interface statique et une base de données. À l’aide du tableau de bord, vous pouvez afficher les journaux de vos services et obtenir un accès de console interactive à vos composants en cours d’exécution.

Dans les coulisses, votre code est automatiquement conteneurisé à l’aide de Docker. Il est ensuite déployé sur des clusters Kubernetes gérés par DigitalOcean. Utiliser App Platform vous permet de vous concentrer sur votre code et de continuer à créer des fonctionnalités, sans avoir à vous soucier de l’infrastructure et des déploiements.

★★★★★