Amplify Hosting で Next.js 13 がデプロイできるようになったよ

こちらは、 “ゆるWeb勉強会@札幌 Advent Calendar 2022” の 7日目の記事です。

なったよ!

Deploy a Next.js 13 app to AWS with Amplify Hosting | Amazon Web ServicesToday, AWS Amplify Hosting announces Next.js 12 and 13 support. Your app can take advantage of Next.js features including server-side rendering (SSR), API routes, middleware, incremental static regeneration (ISR), and image optimization. In combination with Next.js feature support, Amplify Hosting is improving the experience of running Next.js apps on AWS: Faster builds. Next.js apps deploy […]
Deploy a Next.js 13 app to AWS with Amplify Hosting | Amazon Web Services aws.amazon.com
Deploy a Next.js 13 app to AWS with Amplify Hosting | Amazon Web Services

ざっくりと、下記の改善が入っているとのことです。

  1. Faster builds. Next.js apps deploy at least 3x faster, helping developers deliver changes to production faster.
    ビルドが少なくとも3倍は早くなった。
  2. Amazon CloudWatch integration. Server-side logs are delivered to Amazon CloudWatch, allowing teams to observe, monitor and troubleshoot their apps.
    Amazon CloudWatch と統合され、サーバサイドのログの確認や、アプリケーションの監視などができるようになった。
  3. Next.js apps work seamlessly with Amplify back-ends such as Authentication and Data.
    Next.js のアプリケーションが Authentication や Data といった Amplify のバックエンドとシームレスに使えるようになった。
  4. Fully managed hosting infrastructure reduces operational overhead for development teams, with fewer resources to manage in your AWS account. To learn more about pricing visit https://aws.amazon.com/amplify/pricing/.
    フルマネージドのホスティング環境により、AWSアカウントでのリソース管理を少なくする。(これは元々では?)

上記記事にチュートリアルもありますが、こちらでもデプロイまでをざっくり紹介します。

手順

手元で Next.js のプロジェクトを作成します。

% npx create-next-app@latest next-app --ts
% cd next-app
% git init
% git add .
% git commit -m "Create Next App"

GitHub にリポジトリを作成し、pushします。

% git branch -M main
% git remote add origin git@github.com:[your-account]/next-app.git
% git push -u origin main

AWS Amplify コンソールでプロジェクトを作成し、上記リポジトリと連携します。

デプロイを待ちます。

デプロイできたら、ページを確認しましょう。

SSRなども使えるので、ぜひ試してみてください!

tacck
  • tacck
  • 北の大地の普通のソフトウェアエンジニア。
    インフラ・バックエンド・フロントエンドと、色々やります。

    初心者・若手向けのメンターも希望あればお受けします。

    勉強会運営中
    * ゆるWeb勉強会@札幌
    * スマートスピーカーで遊ぼう会@札幌

コメントする

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください