Flux de travail d'équipe avec les applications Amplify Gen 1 intégrales - AWS Amplify Hébergement

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

Flux de travail d'équipe avec les applications Amplify Gen 1 intégrales

Le déploiement d'une branche de fonctionnalités comprend un frontend et un environnement principal optionnel. Le frontend est créé et déployé sur un réseau mondial de diffusion de contenu (CDN), tandis que le backend est déployé par Amplify Studio ou la CLI Amplify pour. AWS Pour savoir comment configurer ce scénario de déploiement, consultezCréation d'un backend pour une application.

Amplify Hosting déploie en permanence des ressources dorsales telles que les API GraphQL et les fonctions Lambda dans le cadre de vos déploiements de branches fonctionnelles. Vous pouvez utiliser les modèles de branchement suivants pour déployer votre backend et votre frontend avec Amplify Hosting.

Flux de travail de branche de fonctionnalités

  • Créez des environnements de backend de production, de test et de développement avec Amplify Studio ou l'Amplify CLI.

  • Mappez le backend de production à la branche principale.

  • Mappez le backend de test à la branche de développement.

  • Les membres de l'équipe peuvent utiliser l'environnement de développement principal pour tester des branches de fonctionnalités individuelles.

Un diagramme qui montre comment mapper les relations entre les environnements principaux et les branches frontales.
  1. Installez l'interface de ligne de commande Amplify pour lancer un nouveau projet Amplify.

    npm install -g @aws-amplify/cli
  2. Créez un environnement backend prod pour votre projet. Si vous n'avez pas de projet, créez-en un à l'aide d'outils bootstrap tels que create-react-app Gatsby.

    create-react-app next-unicorn cd next-unicorn amplify init ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: prod ... amplify push
  3. Ajoutez des environnements backen de test et de développement.

    amplify env add ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: test ... amplify push amplify env add ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: dev ... amplify push
  4. Envoyez le code vers le dépôt Git de votre choix (dans cet exemple, nous supposerons que vous avez envoyé le code vers le dépôt principal).

    git commit -am 'Added dev, test, and prod environments' git push origin main
  5. Visitez Amplify dans le AWS Management Console pour voir votre environnement principal actuel. Naviguez d'un niveau supérieur depuis le fil d'Ariane pour afficher la liste de tous les environnements principaux créés dans l'onglet Environnements principaux.

    Capture d'écran de la console Amplify montrant tous les environnements principaux associés à une application Amplify.
  6. Accédez à l'onglet Environnements frontaux et connectez votre fournisseur de référentiel à votre branche principale.

  7. Dans l'écran des paramètres de compilation, sélectionnez un environnement principal existant pour configurer un déploiement continu avec la branche principale. Choisissez prod dans la liste déroulante et accordez le rôle de service à Amplify. Choisissez Save and deploy (Enregistrer et déployer). Une fois la compilation terminée, vous obtiendrez un déploiement de branche principale disponible sur https://main.appid.amplifyapp.com.

    Capture d'écran de la page Configurer les paramètres de build de la console Amplify, indiquant où sélectionner un environnement principal à déployer avec un environnement frontal.
  8. Connectez la branche de développement dans Amplify (supposons que le développement et la branche principale sont identiques à ce stade). Choisissez l'environnement backend test.

    Capture d'écran de la page Ajouter une branche de référentiel à la console Amplify, montrant où sélectionner un environnement principal à déployer avec une branche.
  9. Amplify est maintenant configuré. Vous pouvez commencer à travailler sur les nouvelles fonctionnalités d'une branche. Pour ajouter une fonctionnalité backend, utilisez l'environnement backend dev à partir de votre poste de travail local.

    git checkout -b newinternet amplify env checkout dev amplify add api ... amplify push
  10. Une fois que vous avez fini de travailler sur cette fonctionnalité, validez le code et créez une demande d'extraction afin d'effectuer un examen en interne.

    git commit -am 'Decentralized internet v0.1' git push origin newinternet
  11. Pour prévisualiser à quoi ressembleront les modifications, accédez à la console Amplify et connectez votre branche de fonctionnalités. Remarque : Si vous l'avez AWS CLI installé sur votre système (pas l'Amplify CLI), vous pouvez connecter une branche directement depuis votre terminal. Pour localiser l'ID de votre application, accédez à App Settings (Paramètres de l'application) > General (Général) > AppARN : arn:aws:amplify:<région>:<région>:apps/<IDapp>.

    aws amplify create-branch --app-id <appid> --branch-name <branchname> aws amplify start-job --app-id <appid> --branch-name <branchname> --job-type RELEASE
  12. La fonctionnalité sera accessible à l'adresse https://newinternet.appid.amplifyapp.com. Partagez-la avec vos collègues à votre convenance. Si tout semble correct, fusionnez la branche PR avec la branche de développement.

    git checkout develop git merge newinternet git push
  13. Cela lancera une version qui mettra à jour le backend ainsi que le frontend dans Amplify avec un déploiement de branche sur https://dev.appid.amplifyapp.com. Vous pouvez partager ce lien avec les intervenants internes afin qu'ils puissent examiner cette nouvelle fonctionnalité.

  14. Supprimez votre branche de fonctionnalités de Git, Amplify et supprimez l'environnement principal du cloud (vous pouvez toujours en créer une nouvelle en exécutant « amplify env checkout prod » et « amplify env add »).

    git push origin --delete newinternet aws amplify delete-branch --app-id <appid> --branch-name <branchname> amplify env remove dev

GitFlow flux de travail

GitFlow utilise deux branches pour enregistrer l'historique du projet. La branche principale suit uniquement le code de version, et la branche de développement est utilisée comme branche d'intégration pour les nouvelles fonctionnalités. GitFlow simplifie le développement parallèle en isolant le nouveau développement du travail terminé. Le nouveau développement (comme les fonctionnalités et les correctifs de bogues non urgents) s'effectue dans les branches de fonctionnalités. Lorsque le développeur juge que le code peut être publié, la branche de fonctionnalités est fusionnée dans la branche de développement pour l'intégration. Les seules validations vers la branche principale sont les fusions depuis les branches de version et les branches de correctifs (pour corriger les bogues d'urgence).

Le schéma ci-dessous montre une configuration recommandée avec GitFlow. Vous pouvez suivre le même processus, comme décrit dans la section ci-dessus sur les flux de travail des branches de fonctionnalités.

Schéma illustrant une configuration recommandée avec GitFlow.

Un sandbox pour chaque développeur

  • Chaque développeur d'une équipe crée un environnement de test (sandbox) dans le cloud qui est distinct de son ordinateur local. Cela permet aux développeurs de travailler indépendamment les uns des autres sans remplacer les modifications apportées par les autres membres de l'équipe.

  • Chaque branche d'Amplify possède son propre backend. Cela garantit qu'Amplify utilise le référentiel Git comme source fiable unique à partir de laquelle déployer les modifications, plutôt que de compter sur les développeurs de l'équipe pour transférer manuellement leur backend ou leur front-end en production depuis leurs ordinateurs locaux.

Schéma illustrant un flux de travail sandbox par développeur.
  1. Installez l'interface de ligne de commande Amplify pour lancer un nouveau projet Amplify.

    npm install -g @aws-amplify/cli
  2. Initialisez un environnement principal pour votre projet. Si vous n'avez pas de projet, créez-en un à l'aide d'outils bootstrap tels que create-react-app Gatsby.

    cd next-unicorn amplify init ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: mary ... amplify push
  3. Envoyez le code vers le dépôt Git de votre choix (dans cet exemple, nous supposerons que vous avez envoyé le code au dépôt principal).

    git commit -am 'Added mary sandbox' git push origin main
  4. Connectez votre repo > main à Amplify.

  5. La console Amplify détectera les environnements principaux créés par la CLI Amplify. Choisissez Créer un nouvel environnement dans la liste déroulante et accordez le rôle de service à Amplify. Choisissez Save and deploy (Enregistrer et déployer). Une fois la compilation terminée, vous obtiendrez un déploiement de branche principale disponible sur https://main.appid.amplifyapp.com avec un nouvel environnement principal lié à la branche.

  6. Connectez la branche de développement dans Amplify (supposons que le développement et la branche principale sont identiques à ce stade) et choisissez Create