History

Hassan El Mghari ca8530ffc8 Changed all occurrences of etc to match (#34280 ) The [correct](https://www.grammarly.com/blog/et-cetera-etc/) way to use et cetera is to put a period right after and a comma behind it if it's being used as a list. I updated the occurrences in the docs and examples that didn't match these rules.		2022-02-13 00:22:52 +00:00
..
components	Update layouts example to persist state across client-side transitions. (#26706 )	2021-06-28 22:19:15 -05:00
pages	Changed all occurrences of etc to match (#34280 )	2022-02-13 00:22:52 +00:00
.gitignore	Added .gitignore to examples that are deployed to vercel (#15127 )	2020-07-16 10:52:23 -04:00
global.css	Update layouts example to persist state across client-side transitions. (#26706 )	2021-06-28 22:19:15 -05:00
package.json	Remove `licence` from all `example/package.json` that has them (#28007 )	2021-08-14 10:48:39 -05:00
README.md	Update layouts example to persist state across client-side transitions. (#26706 )	2021-06-28 22:19:15 -05:00

README.md

Layout component example

This example shows a very common use case when building websites where you need to repeat some sort of layout for all your pages. Our pages are: home, about and contact and they all share the same layout and sidebar.

Preview

Preview the example live on StackBlitz:

Deploy your own

Deploy the example using Vercel:

How to use

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

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

Deploy it to the cloud with Vercel (Documentation).