next.js/examples/layout-component/README.md

[![Deploy to now](https://deploy.now.sh/static/button.svg)](https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/layout-component)

# Layout component example

## How to use

Download the example [or clone the repo](https://github.com/zeit/next.js):

```bash
curl https://codeload.github.com/zeit/next.js/tar.gz/master | tar -xz --strip=2 next.js-master/examples/layout-component
cd layout-component
```

Install it and run:

```bash
npm install
npm run dev
```

Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download))

```bash
now
```

## The idea behind the 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 `<head>` settings, the `<nav>` and the `<footer>`. Further more, the title (and potentially other head elements) can be sent as a prop to the layout component so that it's customizable in all pages.
Add deploy now button to the top of all example READMEs (#1763) * Add deploy now button to the top of all example READMEs * Remove unnecessary whitespace changes 2017-04-22 12:51:51 +00:00			`[![Deploy to now](https://deploy.now.sh/static/button.svg)](https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/layout-component)`
Added layout component example (#560) * added layout component example * coding style fixes * trailing spaces removed * updated README file * added layout example in docs * moved .babelrc so that it handles all projects from the examples folder 2017-01-05 21:03:36 +00:00
			`# Layout component example`

			`## How to use`

Fix link (#789) * Fix link * Fix links 2017-01-16 21:23:24 +00:00			`Download the example [or clone the repo](https://github.com/zeit/next.js):`
Added layout component example (#560) * added layout component example * coding style fixes * trailing spaces removed * updated README file * added layout example in docs * moved .babelrc so that it handles all projects from the examples folder 2017-01-05 21:03:36 +00:00
			```bash
Fix/example instructions (#1559) * Using developit/unfetch as the Fetch API polyfill * Fixed layout component example instructions 2017-03-29 15:00:13 +00:00			`curl https://codeload.github.com/zeit/next.js/tar.gz/master \| tar -xz --strip=2 next.js-master/examples/layout-component`
			`cd layout-component`
Added layout component example (#560) * added layout component example * coding style fixes * trailing spaces removed * updated README file * added layout example in docs * moved .babelrc so that it handles all projects from the examples folder 2017-01-05 21:03:36 +00:00			```

			`Install it and run:`

			```bash
			`npm install`
			`npm run dev`
			```

			`Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download))`

			```bash
			`now`
			```

			`## The idea behind the 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 `<head>` settings, the `<nav>` and the `<footer>`. Further more, the title (and potentially other head elements) can be sent as a prop to the layout component so that it's customizable in all pages.