Comment lancer un site sur AWS gratuitement en 15 minutes

Si vous êtes complètement nouveau sur Amazon Web Services (AWS), cela peut sembler extrêmement compliqué.

Non seulement il semble comme il y a un millier de différents services au choix, dont chacun a un nom tout aussi cryptique (comme S3, Lambda, EC2, ou Athena), mais il y a aussi si bienconfigurer.

Vous devez décider de la quantité de mémoire à allouer à vos fonctions, de la région géographique du monde à partir de laquelle vous voulez que votre code soit servi, et vous devez créer un objet JSON étrange pour accorder des autorisations? Il est VRAIMENT facile de plonger vos orteils et de décider que c'est trop déroutant pour commencer.

Si cela décrit votre expérience jusqu'à présent, alors bien - cet article est pour vous.

J'étais dans le même bateau plus longtemps que je ne voudrais l'admettre.

Mais malgré toute sa complexité décourageante, il y a quelque chose dans AWS qui ne cesse de vous interpeller.

Il y a la vitesse, la fiabilité, et même juste le poids professionnel de pouvoir dire que vous avez de l'expérience avec AWS.

Mais, comme pour tout, si vous voulez commencer, vous devez faire le premier pas. Mon objectif dans cet article est donc de rendre cela facile. Je veux vous amener au point où vous pouvez dire «J'ai déployé un projet sur AWS».

Ce sera beaucoup plus facile que vous ne le pensez et cela vous donnera un point à partir duquel commencer à explorer les autres services d'AWS.

Étape 0: ce que vous devrez suivre

La liste est courte, mais j'ai pensé que je la mettrais au premier plan pour m'assurer qu'elle est claire dès le début.

  1. Une carte de crédit / débit en état de marche (ne vous inquiétez pas, tout est gratuit, comme le titre l'indique. Mais vous devrez saisir les informations de votre carte de crédit pour créer un compte AWS)
  2. Code frontal que vous pouvez télécharger et héberger sur AWS. Cela peut être aussi simple qu'un document HTML avec

    Hello World

    dans le corps.

Étape 1: créer un compte AWS

Pour être honnête, je me suis arrêté à ce stade plusieurs fois simplement parce que c'était l'une de ces situations «d'essai gratuit mais ils demandent les informations de votre carte de crédit», auxquelles j'ai tendance à résister par principe.

Mais le niveau gratuit de 12 mois est assez incroyable. Une année complète est longue pour pouvoir expérimenter sur AWS avant de décider s'il vaut la peine de continuer à l'utiliser. (Je ne suis en aucun cas affilié à AWS, juste pour mémoire).

Alors suivez ce lien et créez votre compte: l'offre gratuite d'AWS.

Je sais que certaines personnes pourraient avoir des inquiétudes concernant les limitations du plan gratuit. Par exemple, il existe un plafond mensuel pour les demandes GET et PUT (20 000 et 2 000 respectivement), après quoi vous commencez à être facturé.

Mais tant que vous ne l'utilisez que pour expérimenter et apprendre pour le moment, il n'y a pratiquement aucune chance de dépasser les limites.

Et même si vous le faites, le prix du dépassement des plafonds est généralement de fractions d'un centime pour 1000 demandes.

Étape 2: Créez un compartiment S3 pour votre projet / site

Pour que les choses restent aussi simples que possible, le seul service AWS que nous utiliserons pour ce projet sera Simple Storage Service (ou S3), l'un des services de stockage cloud d'Amazon.

S3 se comporte un peu comme Google Drive ou Dropbox. Mais il peut également être configuré pour servir des fichiers plutôt que simplement les stocker, ce que nous allons faire.

Étant donné que nous ne servirons que des fichiers hébergés sur S3, ce sera un site statique, sans backend ni connexions à une base de données.

Maintenant que vous avez un compte AWS, connectez-vous à la console de gestion (liée ici) et cliquez sur «Services» en haut à gauche du menu principal.

Vous verrez cette liste ahurissante d'options de service que j'ai mentionnées au début. Ne vous inquiétez pas pour tout cela, cliquez simplement sur «S3» dans la section «Stockage».

Cela vous mènera à la page S3, où vous pourrez créer différents «compartiments» pour stocker vos différents projets.

Les seaux sont comme des dossiers sur votre bureau. Mais le système de stockage de documents sur S3 ne suit pas la structure de dossier traditionnelle (plus à ce sujet si vous êtes intéressé). Donc, à la place, «seau» semble être le bon mot à utiliser.

Cliquez sur le gros bouton bleu en haut à gauche appelé "Create Bucket" pour créer un bucket qui contiendra vos fichiers de projet.

La principale chose que vous devez faire ici est de vous assurer que les autorisations publiques sont définies sur "Accorder l'accès public en lecture à ce compartiment".

Vous recevrez un avertissement d'AWS, mais ne vous inquiétez pas. Ils veulent juste s'assurer que personne ne peut faire cela par accident. Mais c'est exactement ce que vous voulez faire.

Une fois que vous avez terminé, vous verrez votre compartiment dans la liste sur votre console S3.

Étape 3: Ajoutez des fichiers et configurez les paramètres de votre bucket

Cliquez sur votre seau nouvellement créé dans la liste. Cela vous amènera à une page où vous pourrez ajouter du contenu à votre bucket et configurer ses paramètres.

Tout d'abord, vous voudrez ajouter vos fichiers de projet (mentionnés au début) dans l'onglet «Présentation». N'oubliez pas qu'il peut s'agir des fichiers de tout projet frontal fonctionnel.

Vous ne pourrez pas télécharger de dossiers (encore une fois, puisque S3 n'a pas réellement de structure de dossiers). Au lieu de cela, vous devrez créer manuellement tous les dossiers que vous avez dans votre projet dans S3 et y télécharger vos fichiers.

Ensuite, cliquez sur l'onglet «Propriétés».

C'est là que vous indiquerez à S3 que vous souhaitez utiliser ce compartiment pour héberger vos fichiers.

Cliquez simplement sur la vignette qui dit «Hébergement de site Web statique» et entrez les noms de vos documents d'index (requis) et d'erreur (non requis) et vous avez terminé.

Ensuite, cliquez sur l'onglet «Permissions».

Vous verrez juste en dessous les onglets principaux que vous démarrez dans une sous-section intitulée «Liste de contrôle d'accès». Ceci est déjà configuré correctement, puisque vous avez déjà dit que tout le monde devrait pouvoir lire les fichiers hébergés dans ce compartiment.

Now you’ll need to click on the “Bucket Policy” subsection. Here, you’ll be prompted to create a JSON object that contains the details of your bucket’s access permission policy.

This part can be confusing. For now, I’ll just give you the JSON that will grant full public access to the files in your bucket. This will make the website publicly accessible.

Paste this into the bucket policy editor shown above:

{ "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadForGetBucketObjects", "Effect": "Allow", "Principal": "*", "Action": "s3:GetObject", "Resource": "arn:aws:s3:::YOUR-BUCKET-NAME/*" } ]}

Don’t forget to replace “YOUR-BUCKET-NAME” with… your bucket’s name.

You’re done!

That’s it! You have now deployed a very simple static site on AWS S3.

To access your site, go back to the “Overview” tab on S3 and click on your index document (click on a blank area in the list item, not on the link to the document itself). You’ll get a slide-in menu on the right with a link to your site!