海外にもアプリを宣伝するため、英語版のブログを作成しました。
英語版ブログはCloudflareのPages上で運用するようにしました。
本ブログはAWSのCloudfront・Lambda・S3で運用しているため、事実上の移植になります。
変更点
本ブログはこちらのNuxt3で作成されたブログを元に作られています。
そのため、ブログそのものは nuxt.config.jsを
nitro: {
- preset: 'aws-lambda'
+ preset: 'cloudflare_pages'
}
へと変更するだけで済みました。 お手軽〜
そんなわけで、実際変更したところのほとんどは Github Actions 用のファイルでした。
.github/workflows/deploy.yaml
- name: Sign in
uses: aws-actions/configure-aws-credentials@v1
with:
aws-region: ap-northeast-1
aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
- name: Sync files to S3
run: aws s3 sync .output/public s3://bucket/ --delete
- name: lambda deploy
run: npx serverless deploy
serverless.yml
service: lambda
frameworkVersion: '3'
provider:
name: aws
stage: dev
region: ap-northeast-1
runtime: nodejs18.x
package:
patterns:
- '!**'
- '.output/server/**'
functions:
NuxtSsrEngine:
handler: '.output/server/index.handler'
url: true
を
.github/workflows/deploy.yaml
- name: Deploy
uses: cloudflare/wrangler-action@v3
with:
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
command: pages deploy dist/ --project-name=project
へと変更しました。
測定
PageSpeed Insights で測定してみました。
日本版
英語版
秒数自体は英語版の方が短いですが...スコアにはさほど差が出ませんでした。
これなら日本語版はAWS上のままでいいかな〜
アプリを作ったりしています! よかったらみていってくださいね→
つくったもの
今のイチオシ↓
