ガイド

Before App Router, Next.js relied on the Pages Router ("pages/" directory) as its routing system. While simple and intuitive, it gradually revealed limitations as applications grew in complexity:In 2022, with React 18 introducing Server Components, the Next.js team saw an opportunity to reimagine the routing system. Thus, App Router was born.This represents the most fundamental paradigm shift. In App Router:

Ethan Mercer

This guide focuses on building high-performance Next.js full-stack applications and optimizing your development workflow without compromising code quality or application speed.In the upcoming sections, we'll thoroughly examine project architecture, environment configuration, routing strategies, and efficient data fetching techniques. These best practices will enable you to deploy Next.js full-stack applications seamlessly on EdgeOne Pages, harnessing edge computing power for superior performance and worldwide accessibility.The following directory structure represents our recommended Next.js hybrid rendering template. This carefully organized architecture serves as an optimal foundation for developers building scalable full-stack applications:

Ethan Mercer

This guide will help you quickly get started with the file upload system built based on AWS S3 and Next.js in EdgeOne Pages.Deploying with EdgeOne Pages templates is the fastest way to build and deploy AWS S3 projects from scratch. You can quickly find the AWS S3 Batch Uploader theme template in the template market of pages to start deploying. 

Ethan Mercer

Cross-Origin Resource Sharing (CORS) is a security mechanism implemented by browsers to control how web applications interact with resources from different origins. By default, the same-origin policy restricts web pages from making requests to servers other than their own domain. CORS relaxes these restrictions by allowing servers to specify, via HTTP headers, which origins are permitted to access their resources.When a request is considered a "non-simple request" (such as those using custom headers or methods other than GET/POST), the browser automatically sends a preflight OPTIONS request to the server. The server must return the appropriate CORS headers; otherwise, the browser will block the actual request.Pages Functions provide a serverless code execution environment running on EdgeOne edge nodes. Developers only need to write business logic and configure trigger rules—no server infrastructure management is required. Code executes elastically and securely at edge nodes close to end users.

Benjamin Carter

One of EdgeOne Pages advanced features is the ability to act as a reverse proxy, allowing you to forward client requests to your backend servers securely and efficiently. This article will guide you through the process of configuring EdgeOne Pages as a reverse proxy using the edgeone.json configuration file.EdgeOne Pages provides the “edgeone.json” configuration file to customize project build and deployment behaviors (such as build commands) and manage routing strategies (including redirects, rewrites, and HTTP response headers).Rewrites allow you to transparently route user requests to different URLs without changing the visible URL in the browser. With rewrites, you can modify the URL path, query parameters, and request headers before the request reaches your backend server.

Ethan Mercer

Every developer knows the feeling: you've just created something amazing in CodePen—maybe a stunning CSS animation, an interactive JavaScript widget, or a beautiful landing page prototype. Now you want to share it with the world, not just as a Pen, but as a real, standalone website.Traditional deployment often involves wrestling with Git, configuring build tools, or navigating complex hosting platforms. But with EdgeOne Pages you can go from CodePen to a live, production-ready site in just 30 seconds.Before diving into the details, let's see just how simple this process really is. The entire workflow consists of just three actions: Export → Drag → Deploy.

Ethan Mercer