Next 13.4 App router example

examples/v7-nextjs-app-router/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

examples/v7-nextjs-app-router/.github/pull_request_template.md

@@ -0,0 +1,5 @@
+**NOTICE TO CONTRIBUTORS**
+
+This repository is not actively monitored and any pull requests made to this repository will be closed/ignored.
+
+Please submit the pull request to [edgio-docs/edgio-examples](https://github.com/edgio-docs/edgio-examples) instead.

examples/v7-nextjs-app-router/.github/workflows/edgio.yml

@@ -0,0 +1,16 @@
+name: Deploy to Edgio
+
+on:
+  workflow_dispatch:
+  push:
+
+jobs:
+  deploy-to-edgio:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+      - run: if [ -f yarn.lock ]; then yarn install; else npm ci; fi
+      - run: if [ -f yarn.lock ]; then yarn edgio:deploy -- --token=$EDGIO_DEPLOY_TOKEN; else npm run edgio:deploy -- --token=$EDGIO_DEPLOY_TOKEN; fi
+        env:
+          EDGIO_DEPLOY_TOKEN: ${{secrets.EDGIO_DEPLOY_TOKEN}}

examples/v7-nextjs-app-router/.gitignore

@@ -0,0 +1,38 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+# Edgio generated build directory
+.edgio

examples/v7-nextjs-app-router/README.md

@@ -0,0 +1,39 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) and powered by [Edgio](https://edg.io).
+
+## Getting Started
+
+### Install Packages
+
+```bash
+npm install
+```
+
+### Local Development Server
+
+```bash
+npm run edgio:dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Edgio, take a look at the following resources:
+
+- [Edgio Documentation](https://docs.edg.io) - learn about Edgio features
+
+## Deploy on Edgio
+
+Deploy this project on Edgio with the following command:
+
+```bash
+npm run edgio:deploy
+```
+
+Check out our [Next.js  documentation](https://docs.edg.io/guides/v7/sites_frameworks/getting_started/next) for more details.
+
+#

examples/v7-nextjs-app-router/edgio.config.js

@@ -0,0 +1,128 @@
+// This file was automatically added by edgio init.
+// You should commit this file to source control.
+// Learn more about this file at https://docs.edg.io/guides/edgio_config
+module.exports = {
+  connector: '@edgio/next',
+
+  // The name of the site in Edgio to which this app should be deployed.
+  // name: 'my-site-name',
+
+  // The name of the team in Edgio to which this app should be deployed.
+  // team: 'my-team-name',
+
+  // Overrides the default path to the routes file. The path should be relative to the root of your app.
+  // routes: 'routes.js',
+
+  next: {
+    // Output sourcemaps so that stack traces have original source filenames and line numbers when tailing
+    // the logs in the Edgio developer console.
+    // This config options replaces the edgioSourceMaps option in next.config.js.
+    // @default true
+    // generateSourceMaps: true
+    //
+    // Disables the Edgio image optimizer and allows to use the Next's built in image optimizer.
+    // This config options replaces the disableImageOptimizer option in edgio.config.js root.
+    // @default false
+    // disableImageOptimizer: false
+    //
+    // Disables the Edgio development tools widget on the site.
+    // This config options replaces the disableEdgioDevTools option in next.config.js.
+    // @default false
+    // disableDevtools: false
+    //
+    // Disables the build of the service worker.
+    // @default false
+    // disableServiceWorker: false
+    //
+    // Forces the @edgio/next connector to use the server build.
+    // This config option replaces the NEXT_FORCE_SERVER_BUILD env variable.
+    // @default false
+    // forceServerBuild: false
+    //
+    // Optimizes the server build by bundling all server assets and decreasing the overall startup time.
+    // This option has no effect on apps with serverless build.
+    // This option is set to false for Next 13.x apps.
+    // @default true
+    // optimizeServerBuild: true
+    //
+    // Set this option to false to remove the default rule that proxies all requests to Next.js in serverless.
+    // This is useful if you want to proxy all unmatched pages to different origin.
+    // @default true
+    // proxyToServerlessByDefault: true
+    //
+    // Set this option to true to honor Next's internal redirects that either add or remove a trailing slash
+    // depending on the value of the `trailingSlash` config. When set to false, these internal redirects are not honored,
+    // so sites that fallback to serving from an origin do not add or remove the trailing slash for origin URLs.
+    // @default true
+    // enforceTrailingSlash: true
+  },
+
+  // If you need to proxy some URLs to an origin instead of your Next.js app, you can configure the origins here:
+  origins: [
+    {
+      name: 'api',
+      override_host_header:
+        'edgio-community-ecommerce-api-example-default.layer0-limelight.link',
+      hosts: [
+        {
+          scheme: 'match',
+          location: [
+            {
+              hostname:
+                'edgio-community-ecommerce-api-example-default.layer0-limelight.link',
+            },
+          ],
+        },
+      ],
+      tls_verify: {
+        allow_self_signed_certs: true,
+        use_sni: true,
+        sni_hint_and_strict_san_check:
+          'edgio-community-ecommerce-api-example-default.layer0-limelight.link',
+      },
+    },
+    {
+      name: 'image',
+      override_host_header: 'opt.moovweb.net',
+      hosts: [
+        {
+          scheme: 'match',
+          location: [
+            {
+              hostname: 'opt.moovweb.net',
+            },
+          ],
+        },
+      ],
+      tls_verify: {
+        allow_self_signed_certs: true,
+        use_sni: true,
+        sni_hint_and_strict_san_check: 'opt.moovweb.net',
+      },
+    },
+  ],
+
+  // Options for hosting serverless functions on Edgio
+  // serverless: {
+  //   // Set to true to include all packages listed in the dependencies property of package.json when deploying to Edgio.
+  //   // This option generally isn't needed as Edgio automatically includes all modules imported by your code in the bundle that
+  //   // is uploaded during deployment
+  //   includeNodeModules: true,
+  //
+  //   // Include additional paths that are dynamically loaded by your app at runtime here when building the serverless bundle.
+  //   include: ['views/**/*'],
+  // },
+
+  // The maximum number of URLs that will be concurrently prerendered during deployment when static prerendering is enabled.
+  // Defaults to 200, which is the maximum allowed value.
+  // prerenderConcurrency: 200,
+
+  // A list of glob patterns identifying which prerenderConcurrency source files should be uploaded when running edgio deploy --includeSources.
+  // This option is primarily used to share source code with Edgio support personnel for the purpose of debugging. If omitted,
+  // edgio deploy --includeSources will result in all files which are not gitignored being uploaded to Edgio.
+  //
+  // sources : [
+  //   '**/*', // include all files
+  //   '!(**/secrets/**/*)', // except everything in the secrets directory
+  // ],
+};

examples/v7-nextjs-app-router/next.config.js

@@ -0,0 +1,13 @@
+// This file was automatically added by edgio init.
+// You should commit this file to source control.
+const { withEdgio } = require('@edgio/next/config')
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {}
+
+const _preEdgioExport = nextConfig;;
+
+module.exports = (phase, config) =>
+  withEdgio({
+    ..._preEdgioExport
+  })