Skip to content

README.md

Latest commit

 

History

History
40 lines (25 loc) · 2.8 KB

README.md

File metadata and controls

40 lines (25 loc) · 2.8 KB

Image Component Example

This example shows how to use the Image Component in Next.js serve optimized, responsive images.

The index page (pages/index.js) has a couple images, one internal image and one external image. In next.config.js, the domains property is used to enable external images. The other pages demonstrate the different layouts. Run or deploy the app to see how it works!

Preview

Quickly preview this example directly in your browser with StackBlitz:

Open in StackBlitz

🌏 Open in other Cloud IDES

Click any of the buttons below to start a new development environment to demo or contribute to the codebase without having to install anything on your machine:

Open in Glitch Open in GitHub Codespaces Edit in Codesandbox Open in Repl.it Open in Codeanywhere Open in Gitpod

Deploy your own

Deploy the example using Vercel:

Deploy with Vercel

How to use

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example image-component image-app
# or
yarn create next-app --example image-component image-app

Deploy it to the cloud with Vercel (Documentation).