Configuring Custom 404 Page for Static Next.js Website on AWS S3

[erickcestari]

Issue Description

The S3 bucket is not displaying the custom 404.html page when a page is not found. For example, navigating to a non-existent URL like https://uwu.games/123 does not show the 404.html page as expected.

How to Resolve the Issue on S3

1. Enable Static Website Hosting

• Go to the Properties tab of your S3 bucket.
• Locate the Static website hosting section.
• Select Enable to turn on static website hosting.

2. Configure Index and Error Documents

• Set the Index document field to index.html.
• Set the Error document field to 404.html.

3. Save Changes

• Ensure you save the changes after configuring the index and error documents.

This configuration will ensure that users are directed to the 404.html page when they access a non-existent page.