Heroku et Amazon S3, Déployer facilement votre projet Web

Posté le octobre 16, 2016 Par upidmin

Dans ce tutoriel, nous apprendrons comment déployer un projet web en ligne grâce à Heroku et Amazon S3.

upidev-heroku-tuto

Création de compte heroku

Créer un compte

Accès à Amazon S3 à partir d’un compte Amazon

Accéder ou créer un compte amazon

Création des clés de connexion

Pour autoriser Heroku à récupérer les fichiers statiques depuis l’espace de stockage sur Amazon S3, nous devons préalablement générer une clé de connexion Amazon AWS.

Accédons à l’interface Amazon AWS.

amazon-generate-credentials

Ensuite, cliquez sur “Continue to Security Credentials” -> “Access Keys” -> “Create Access Key”.

Une fois la clé de connexion créée, vous pouvez la télécharger.

Préparation du projet au déploiement

Installation du client heroku

Client Windows

Client Mac

Client Linux :

A copier/coller dans le terminal pour Linux

Récupération du projet

Le projet de demo est disponible ici.

Afin de pouvoir exécuter et tester le projet, installons les modules Python nécessaires.

A présent, connectons le projet à notre compte heroku.

Création de l’application

Créons maintenant une application sur Heroku pour supporter le déploiement.

Puis, nous attachons le compte Amazon fraichement créé à Heroku grâce aux clés de connexion.

Hébergement des fichiers statiques sur Amazon S3

Dans le but, d’héberger les fichiers statiques du projet, nous souhaitons créer un bucket ( espace de stockage) sur Amazon.

Depuis la page console de Amazon AWS, cliquez sur “S3” dans la catégorie “Storage & Content Delivery”.

Un moyen de paiement vous sera demandé, vous serez prélevé si vous dépasser les limites de l’offre gratuite ou si la période d’essai expire.

L’essai gratuit vous permet d’utiliser Amazon S3 en stockant 5GO maximum pendant 12 mois et accepte 20000 requêtes vers les fichiers stockés.

Une fois l’essai gratuit expiré, vous serez débité en fonction de votre utilisation du service.

Stockage Standard Stockage en accès Standard – Peu fréquent † Stockage dans Glacier
Premier 1 To/mois 0.027€ par Go 0.011€ par Go 0.001€ par Go
49 To suivants par mois 0.027€ par Go 0.011€ par Go 0.001€ par Go
450 To suivants par mois 0.026€ par Go 0.011€ par Go 0.001€ par Go
500 To suivants par mois 0.026€ par Go 0.011€ par Go 0.001€ par Go
4 000 To suivants par mois 0.026€ par Go 0.011€ par Go 0.001€ par Go
Plus de 5 000 To/mois 0.025€ par Go 0.011€ par Go 0.001€ par Go

A présent, Cliquez sur “Create Bucket” et ajoutez s’y un nom.

create-bucket

Maintenant, uploadez le dossier static en gardant la même arborescence que dans le projet.

Autoriser l’accès des fichiers à un tiers

Les propriétés du bucket doivent être modifiés pour autoriser un tier à y accéder.

Cliquez sur le bucket puis sur “Properties” -> “Permissions” -> “Edit CORS Configuration” puis ajoutez le code suivant.
Par simplicité, n’importe qui pourra accéder aux ressources du projet.

A présent, dans “Propriétés” -> “Static Website Hosting”, cochez “Enable website hosting” en précisant le endpoint dans IndexDocument ( ex: upidev.s3-website-us-east-1.amazonaws.com ).

bucket-properties-changes

Afin de rendre public vos fichiers statiques, la dernière modification consiste à faire un clique droit sur le dossier “static” et sélectionnez “Make Public”.

Les urls contenant url_for(‘static’,…) doivent être modifiées dans index.html pour pointer vers les fichiers statiques hébergés dans le bucket.

Indiquons à présent à notre application Héroku, le bucket à utiliser.

Déploiement de l’application

On ajoute les changements à effectuer sur le repository git local.

Puis, on enregistre les modifications en local.

Finalement, on pousse le repo local vers le repo distant.

Une fois, le push effectué, vous pouvez insérer cette commande afin de tester le projet hébergé.

Le tutoriel se termine, Félicitations !!, vous savez à présent héberger un projet web flask grâce à Héroku et Amazon S3.

Laisser un commentaire