cdk nextjs

Menyebarkan NextJs dengan CDK

Apa ini?

Konstruk CDK untuk menggunakan aplikasi NextJS menggunakan AWS CDK. Versi NextJS yang Didukung:> = 12.3.0+ (Termasuk 13.0.0+)

Menggunakan mode build output mandiri.

QuickStart

 import { App , Stack , StackProps } from 'aws-cdk-lib' ;
import { Construct } from 'constructs' ;
import { Nextjs } from 'cdk-nextjs-standalone' ;

class WebStack extends Stack {
  constructor ( scope : Construct , id : string , props ?: StackProps ) {
    super ( scope , id , props ) ;
    const nextjs = new Nextjs ( this , 'Nextjs' , {
      nextjsPath : './web' , // relative path from your project root to NextJS
    } ) ;
    new CfnOutput ( this , "CloudFrontDistributionDomain" , {
      value : nextjs . distribution . distributionDomain ,
    } ) ;
  }
}

const app = new App ( ) ;
new WebStack ( app , 'web' ) ; 

Catatan penting

• Karena keterbatasan pencocokan pola perilaku cache CloudFront, perilaku cache akan dibuat untuk setiap file atau direktori tingkat atas di public/ folder Anda. Cloudfront memiliki batas lunak 25 perilaku cache per distribusi. Oleh karena itu, disarankan untuk memasukkan semua aset yang dapat berada di bawah folder tingkat atas seperti public/static/ . Pelajari lebih lanjut di dokumen terbuka-next di sini.

Dokumentasi

Tersedia di hub konstruk.

Contoh

Lihat contoh aplikasi CDK di sini termasuk:

• Router aplikasi
• Router halaman
• Router aplikasi/halaman
• Keamanan tinggi
• Beberapa situs untuk memberikan contoh, pastikan untuk membaca readme.md

Obrolan Perselisihan

Kami berada di saluran #-Open-Next di Sverless Stack Discord.

Tentang

Menyebarkan situs statis NextJS dengan rendering sisi server dan dukungan API. Menggunakan AWS Lambda dan Cloudfront.

Ada mode output mandiri baru (sejak 12 berikutnya) yang menggunakan penelusuran output untuk menghasilkan server minimal dan file statis. Server mandiri ini dapat dikonversi menjadi distribusi CloudFront dan penangan lambda yang menangani SSR, API, dan perutean.

Asal default CloudFront pertama memeriksa S3 untuk file statis dan kembali ke asal HTTP menggunakan URL fungsi lambda.

Manfaat

Pendekatan ini paling kompatibel dengan fitur NextJS baru seperti Konfigurasi ESM, Middleware, Next-Auth, dan React Server Components ("AppDir").

Proyek @Serverless-NextJS yang tidak terpasang menggunakan target Build NextJS serverless yang telah mencegah penggunaan fitur baru. Konstruk ini dibuat untuk menggunakan fitur output standalone baru dan fitur AWS yang lebih baru seperti URL fungsi Lambda dan asal -usul Fallback.

Anda mungkin ingin melihat tumpukan tanpa server dan konstruk NextJssite untuk pengalaman pengembang yang ditingkatkan jika Anda membangun aplikasi tanpa server di CDK.

Dependensi

Dibangun di atas Open-Next, yang sebagian dibangun menggunakan inti asli CDK-nextjs-standalone.

Sangat berdasarkan

• Open-Next
• https://github.com/iiroj/iiro.fi/commit/bd43222032d0dbb765e1111825f64dbb5db851d9
• https://github.com/sladg/nextjs-lambda
• https://github.com/serverless-nextjs/serverless-next.js/tree/master/packages/compat-layers/apigw-lambda-compat
• Tumpukan Tanpa Server
  • Konstruksi Remixsite
  • NextJssite Construct

Menyumbang

Lihat Kontribusinya.

Melanggar perubahan

Lihat perubahan besar.