Разверните приложение Next.js на AWS, используя CDK & Fargate

Что фардуката?

Почему next.js на AWS?

Next.js Документация говорит:

Самый простой способ развертывания Next.js к продукции состоит в том, чтобы использовать платформу Vercel от создателей Next.js

Ну, если вы просто начинаете с вашим проектом, я скажу пойти на Vercel.

Но в моем случае у меня были все мои проекты на AWS, используя CDK, и я не хочу управлять моим приложением Next.js на другой платформе.

Давай началось

Давайте создадим основную папку проекта

mkdir nextJsOnAws
cd nextJsOnAws

Nextjs Part.

npx create-next-app

и назвать так, как вы хотите (я назвал его фронтом)

Мы собираемся создать DockerFile (я использую официальный один из документации Vercel)

# Install dependencies only when needed

FROM node:alpine AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app
COPY package.json yarn.lock ./
RUN yarn install --frozen-lockfile

# Rebuild the source code only when needed

FROM node:alpine AS builder
WORKDIR /app
COPY . .
COPY --from=deps /app/node_modules ./node_modules
RUN yarn build && yarn install --production --ignore-scripts --prefer-offline

# Production image, copy all the files and run next

FROM node:alpine AS runner
WORKDIR /app

ENV NODE_ENV production

RUN addgroup -g 1001 -S nodejs
RUN adduser -S nextjs -u 1001


COPY --from=builder /app/public ./public
COPY --from=builder --chown=nextjs:nodejs /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json

USER nextjs

EXPOSE 3000

CMD ["yarn", "start"]

CDK Part.

Давайте создадим новый проект CDK на выделенной папке

mkdir cdkPart
cd cdkPart
cdk init --language typescript

Тогда давайте установим пакет, который нам нужен

npm install @aws-cdk/aws-ec2 @aws-cdk/aws-ecs @aws-cdk/aws-ecs-patterns

В папке Lib файл был создан под названием CDK_PART-Stack, откройте его и завершите это

import * as cdk from '@aws-cdk/core';
import * as ec2 from "@aws-cdk/aws-ec2";
import * as ecs from "@aws-cdk/aws-ecs";
import * as ecs_patterns from "@aws-cdk/aws-ecs-patterns";
import { DockerImageAsset } from "@aws-cdk/aws-ecr-assets";

export class CdkPartStack extends cdk.Stack {
  constructor(scope: cdk.Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props);

 const APP_PORT = 3000
 const pathToDockerFile = "../front"

    const vpc = new ec2.Vpc(this, "MyVpc", {
      maxAzs: 2,
    });

    const taskDefinition = new ecs.FargateTaskDefinition(this, "MyTaskDefinition", {
      memoryLimitMiB: 512,
      cpu: 256,
    });

    const dockerFile = new DockerImageAsset(this, 'DockerFileAsset', {
      directory: pathToDockerFile,
      file: 'Dockerfile',
    });

    // cdk will build it and push it to en ecr repository
    const image = ecs.ContainerImage.fromDockerImageAsset(dockerFile);

    const container = taskDefinition.addContainer("MyContainer", {
      image,
      // store the logs in cloudwatch 
      logging: ecs.LogDriver.awsLogs({ streamPrefix: "myexample-logs" })
    });

    container.addPortMappings({
      containerPort: APP_PORT, 
    });

    const cluster = new ecs.Cluster(this, "MyECSCluster", {
      clusterName: "MyECSCluster",
      containerInsights: true,
      vpc,
    });

    const securityGroup = new ec2.SecurityGroup(this, `My-security-group`, {
      vpc: vpc,
      allowAllOutbound: true,
      description: 'My Security Group'
    });

    securityGroup.addIngressRule(ec2.Peer.anyIpv4(), ec2.Port.tcp(APP_PORT));

    const fargateService = new ecs_patterns.ApplicationLoadBalancedFargateService(this, 'MyFargateService', {
      cluster,
      publicLoadBalancer: true,
      cpu: 256,
      desiredCount: 1,
      memoryLimitMiB: 512,
      taskDefinition,
      securityGroups: [securityGroup]
    })

    const scalableTarget = fargateService.service.autoScaleTaskCount({
      minCapacity: 1,
      maxCapacity: 2
    })

    scalableTarget.scaleOnCpuUtilization('cpuScaling', {
      targetUtilizationPercent: 70
    })
  }
}

В настоящее время Время для развертывания

cdk synth

Затем после этого:

cdk deploy

Развертывание может быть немного долго, так что будьте терпеливы:)

Пойдем на консоль

После завершения развертывания перейдите в консоль AWS> ECS (для упругой контейнерной службы)

Нажмите на мою кластер ECS

Нажмите на сервис

Выберите вкладку «Задача»

Нажмите на задачу

Вы можете увидеть, что ваш контейнер … БЕГ:)

Давайте посмотрим на приложение !!!

Перейдите в консоль> EC2> LoadBalancer и скопируйте имя DNS вашего балансировщика нагрузки

Вставьте его в браузер и …

Поздравляю ! Вы развернули свое приложение Next.js с Fargate, и он работает:)

Очистка

Не забудьте убрать после этого учебника, я не хочу, чтобы у вас был огромный счет на AWS!

cdk destroy

Надеюсь, вам понравилось это руководство, я сделаю все возможное, чтобы опубликовать некоторые статьи о AWS.

Если вы хотите, вы можете следовать за мной в Twitter:)

Оригинал: «https://dev.to/zoun/deploy-a-next-js-application-on-aws-using-cdk-fargate-2dnh»