Home
6 janvier 20255 min de lecture

Déployer son application Next.js sur AWS Amplify

amplifyawsnext.js

Si, comme moi, vous avez tendance à préférer Bitbucket parce que... ben... c'est ce que vous utilisez sans trop y réflechir quand il s'agit de créer un repo, vous aurez peut être constaté à votre grand étonnement que - depuis quelques temps, Vercel ne vous propose plus d'offre gratuite.

Alors bien sûr, rien de compliqué à changer de remote et à passer sur Github ou Gitlab, mais quand j'ai eu besoin de déployer mon nouveau blog, je me suis intéressé aux différentes plateformes qui permettent de déployer du Next.js rapidement.

On va parler aujourd'hui d'Amplify, et on parlera un peu plus tard des autres solutions (Netlify, Render.com, Heroku...)

Amplify parce que je suis matrixé par AWS

Amplify notre sauveur

Amplify n'est pas spécifiquement dédié à Next.js.

Ce service proposé par AWS existe depuis 2017 et propose globalement d'intégrer les services AWS dans un package afin de simplifier le déploiement et la gestion des applications web / mobile

Et c'est effectivement pas du luxe : vu la quantité phénoménale de services AWS en constante évolution, il peut être parfois difficile de s'y retrouver, de configurer et de maintenir une stack (Vas t'amuser deux minutes à gérer une stack avec les services Route53, API Gateway, Lambda, S3, Cloudfront, Cloudwatch... pour faire tourner un micro service)

On y trouve différents templates qui sont une excellente base de départ, que ce soit pour déployer rapidement un MVP, ou pour tout type d'application en conditions de prod.

C'est tout pareil que Vercel ?

En un mot : oui

En une phrase : Ben, en fait, non, pas vraiment

Considérez Amplify comme un mix entre Vercel et une config AWS classique. Vous créez votre projet sur la console AWS, mais pour le reste, c'est quasi automatique.

La customisation se fait à partir d'un fichier de config tout simple, et vous n'avez même pas besoin de vous prendre la tête avec les certificats SSL, les domaines customs ou la CI/CD.

Là où Amplify va plus loin (pour le meilleur et pour le pire, on y reviendra), c'est que vous pouvez aussi l'utiliser pour gérer votre authentification, votre stockage, vos APIs...

Typiquement, le blog que vous avez devant vos zieux zébahis est hébergé sur Amplify, et me coûte la modique somme de... trois fois rien (ce qui, au passage, me ferait mal si ça me coutait plus cher pour un blog Next.js en SSR dont les données proviennent de Sanity.io)

Instant Jamie

Interface sommaire. AWS dans toute sa splendeur

Après avoir créé votre compte AWS (BRAVO, vous venez de gagner 1 an de free tier !), vous devez connecter votre repo et la branche que vous voulez utiliser.

Amplify va scanner votre projet et détecter automatiquement que c'est du Next.js (mais ça peut aussi être autre chose, comme du Nuxt... personne n'est parfait après tout).

À partir de là, c'est que du bonheur :

  • Il configure tout seul la build
  • Il gère le SSL
  • Il vous file un joli domaine en .amplifyapp.com (que vous pouvez changer, ou que vous pouvez utiliser pour créer un CNAME)

On peut naturellement customiser, notamment via un fichier amplify.yml à la racine de votre projet qui vous permet de configurer le CI, et par exemple de créer des previews selon vos branches, ou d'orchestrer la fédération et l'authentification des users avec Cognito.

Une fois déployé, pas besoin d'aller vous taper une migraine carabinée sur Cloudwatch, vous avez par exemple accès au monitoring et aux journaux contextualisés directement depuis votre environnement

Clés en main, menottes aux poignées

On trouve de tout sur Amazon

(je suis, au passage, excessivement fier de mon titre)

Forcément, qui dit AWS dit écosystème AWS. Et le choix de passer sur Amplify implique la plupart du temps de rester dans cet écosystème avec des services parfois propriétaires (Dynamo, Aurora...), mais c'est pas forcément un mal puisque vous gérez du coup l'ensemble de vos services au même endroit, dans un VPC qui vous est propre, et sur lequel vous pouver agir comme bon vous semble en terme de configuration.

Histoire de gros sous

Si vous venez de créer un compte AWS, vous bénéficiez automatiquement de l'offre free tier pendant 1 an, ce qui vous rend éligible à la gratuité de beaucoup de services dans un usage - certes limité, mais tout de même confortable.

Par exemple, pour Amplify x Next.js, vous avez :

  • 1000 minutes de déploiement par mois
  • 5go de stockage de données (S3 + Cloudfront) par mois
  • 15go de transfert de données par mois

Mais même en dehors du free tier, la tarification reste très intéressante :

https://aws.amazon.com/fr/amplify/pricing/

Bien entendu, ca concerne uniquement l'application en elle même. Vous paierez en plus les autres services potentiels (comme Cognito ou DynamoDB) si vous vous en servez.

Du coup, Vercel ou Amplify ?

Les deux mon capitaine !

Si vous êtes déjà chez Vercel, et que ca vous convient parfaitement, tant mieux, aucune raison de changer. D'autant que l'interface est un modèle d'expérience utilisateur.

Par contre, si vous voulez pouvoir bénéficier de la grande quantité de services disponibles chez AWS (Cognito, DynamoDB, RDS, Aurora, S3, Cloudfront...) et garder une certaine logique dans votre stack en centralisant le tout, Amplify est un service qui vaut la peine qu'on s'y intéresse.

Contact

Parlons de votre prochain projet !

Email

gregory@babonaux.com

Téléphone

+33 6 50 83 23 05