Commit graph

46 commits

Author SHA1 Message Date
Delba de Oliveira
84af8009e3
Docs: Explain why Layouts (RSCs) can't access pathname (#64785)
- Add section explaining why `pathname` can't be accessed in a layout
([file](https://github.com/vercel/next.js/pull/64785/files#diff-8eb7b23d3da342a1a407cdb6cc9c2d0dc2a455091ba2c4b6dbc41ba6cf840367))
- Split pages and layouts files (to add layout-specific examples in the
future)
- Clean up the existing active links example 

I'll add layout-specific examples in a follow-up PR, after creating some
demos.
2024-04-25 08:44:12 +01:00
Shane
9c35f21f38
Update blog-starter to App Router (#61170)
### What?

This updates the `blog-starter` example to Next 14.1 App Router.

### Why?

I checked out a new `blog-starter` project on Vercel and was surprised
it was using the Pages Router. I believe the App Router is a better
choice.

### How?

I tried to keep the implementation logic as close to the original Pages
`blog-starter`.

---------

Co-authored-by: Sam Ko <sam@vercel.com>
2024-01-30 17:16:55 +00:00
JTaylor0196
f7baa56792
update example Deploy button URLs (#48842)
### What?
Updates Deploy button URLs for all listed examples here:
https://github.com/vercel/next.js/tree/canary/examples

### Why?
The Deploy URLs are currently broken and result in a failed clone
attempt on Vercel.

### How?
The URLs have been changed from https://vercel.com/new/git/external?… to
-> https://vercel.com/new/clone?…
(Last updated
[here](8eaabe2fb0)
in 2021)
2023-04-26 13:31:44 -04:00
Kasper Andreassen
88ac118d1c
Add Enterspeed blog example (#35897)
# Demo: https://next-blog-demo.enterspeed.com/

Added `with-enterspeed` to examples.

Linked to `with-enterspeed` in related documentation:
- docs/advanced-features/preview-mode.md
- docs/basic-features/data-fetching/overview.md
- docs/basic-features/pages.md

Linked to `with-enterspeed` in related examples:
- examples/blog-starter/README.md
- examples/cms-agilitycms/README.md
- examples/cms-builder-io/README.md
- examples/cms-buttercms/README.md
- examples/cms-contentful/README.md
- examples/cms-cosmic/README.md
- examples/cms-datocms/README.md
- examples/cms-drupal/README.md
- examples/cms-ghost/README.md
- examples/cms-graphcms/README.md
- examples/cms-kontent/README.md
- examples/cms-prepr/README.md
- examples/cms-prismic/README.md
- examples/cms-sanity/README.md
- examples/cms-storyblok/README.md
- examples/cms-strapi/README.md
- examples/cms-takeshape/README.md
- examples/cms-tina/README.md
- examples/cms-umbraco-heartcore/README.md
2022-09-30 01:48:00 +02:00
Marcos Bérgamo
c3e5caf110
docs(examples): improve DX while copying command to create new project (#38410)
* docs(examples): improve DX while copy command to create new project

* chore: apply code review

Co-authored-by: Marcos Bérgamo <Marcos.Bergamo@refinitiv.com>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-07-26 21:57:48 -05:00
Max Proske
8783793273
Replace JS blog-starter example with TS, deprecate blog-starter-typescript example (#38395)
* Replace `blog-starter` JS example with `blog-starter-typescript`

* lint-fix, Revert pnpm-lock.yaml

* Revert root readme.md

* Add useful sections omitted from original Typescript convert

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-07-07 23:10:26 -05:00
Qiushi Pan
455b74fe54
fix: markdown format for the blog-starter example (#37792)
## Documentation / Examples

The markdown format for blog-starter example was broken, so fixed it.


- [x] Make sure the linting passes by running `pnpm lint`
  It failed, without my changes.
- [x] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)
2022-06-17 17:06:22 +00:00
Steven
57dcc9d329
Update pnpm create next-app for latest pnpm 6 and 7 (#37254)
This command changed in pnpm [6.32.13](https://github.com/pnpm/pnpm/releases/tag/v6.32.13) and [7.1.1](https://github.com/pnpm/pnpm/releases/tag/v7.1.1) so lets update it since its been a few weeks and we can expect pnpm users to update more regularly than npm users.

- Fixes https://github.com/vercel/next.js/pull/37240 
- Fixes https://github.com/vercel/next.js/pull/37045
- Fixes https://github.com/vercel/next.js/pull/37032
- Fixes https://github.com/vercel/next.js/pull/36602
- Fixes https://github.com/vercel/next.js/pull/36496
2022-05-27 21:21:40 +00:00
Tom
3e178bb801
add pnpm link to docs (#37221)
## Documentation / Examples

- [x] Make sure the linting passes by running `yarn lint`
- [ ] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)


Co-authored-by: Steven <steven@ceriously.com>
2022-05-27 15:46:38 -04:00
James Perkins
22c0b65eb5
Fixing Tina + Adding a demo URL (#35480)
## Documentation / Examples

- Updating Tina Demo URL
- Adding Tina to blog-starter example
- Adding Tina to Basic features section
- Updating Tina to actually work again
2022-05-10 17:52:54 +00:00
Steven
9f9214abe5
Updated create-next-app docs to include pnpm usage (#35755)
This PR updates the docs and examples for `create-next-app` to include pnpm usage.

The following script was used to update every example README:

```js
const fs = require('fs')
const examples = fs.readdirSync('./examples')

for (let example of examples) {
    const filename = `./examples/${example}/README.md`
    const markdown = fs.readFileSync(filename, 'utf8')
    const regex = new RegExp(`^yarn create next-app --example (.*)$`, 'gm')
    const output = markdown.replace(regex, (yarn, group) => {
        const pnpm = `pnpm create next-app -- --example ${group}`
        return `${yarn}\n# or\n${pnpm}`
    })
    fs.writeFileSync(filename, output)
}
```
2022-03-30 21:03:21 +00:00
Hassan El Mghari
33aa51ab26
Change README structure in examples (#35349)
Changed the README structure in all examples to take out the Stackblitz button and include it as a link instead using a [bash script](https://gist.github.com/Nutlope/a8f3556a5a401e32a8c6278b782ebf8a/revisions).

I also added the Vercel deploy button to 15 READMEs that didn't have it.
2022-03-16 21:39:26 +00:00
Aziz Abbas
de54ad895c
[examples] Add a statically generated blog example using Next.js and Builder.io (#22094)
A statically generated blog example using Next.js and [Builder.io](https://builder.io), demo on [https://cms-builder-io.vercel.app/](https://cms-builder-blog.vercel.app/)
2022-01-12 21:58:43 +00:00
Thomas Knickman
c658fd3276
chore(blog-starter): update tailwindcss to v3 (#32398)
Updates the [blog-starter](https://github.com/vercel/next.js/tree/canary/examples/blog-starter) example to use the new [tailwindcss v3](https://tailwindcss.com/blog/tailwindcss-v3) by following the [upgrade guide](https://tailwindcss.com/docs/upgrade-guide).

Thanks!

## Documentation / Examples

- [x] Make sure the linting passes by running `yarn lint`
2021-12-13 15:25:45 +00:00
Rasmus John Pedersen
ecf9f8775c
Add Umbraco Heartcore blog example (#21409)
Co-authored-by: Lee Robinson <me@leerob.io>
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
2021-12-07 16:38:55 +01:00
Sanath Kumar U
9dba4be132
Updated Readme (#25575)
* Updated Readme 

Split the copying instruction into separate code sections as any one of the command is used  and  Its easier to copy individual commands .

* lint-fix


Co-authored-by: JJ Kasper <jj@jjsweb.site>
2021-06-09 13:40:51 -05:00
Dominic Elm
d2caaeab64
docs: add 'Open in StackBlitz' buttons to various examples (#25853)
This PR adds a `Preview` section and a `Open in StackBlitz` button to various examples. I have tested all examples and omitted the ones that require third party API keys, or didn't work. Some examples don't work locally either.

Here's an example:
![image](https://user-images.githubusercontent.com/12571019/121027783-88971280-c7a7-11eb-851a-0ad30cf74b42.png)

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [x] Examples updated
- [ ] Telemetry added. In case of a feature if it's used or not.

## Documentation / Examples

- [x] Make sure the linting passes
2021-06-08 20:45:02 +00:00
Luc Leray
8eaabe2fb0
Fix deploy buttons URLs (#20834)
Fix all deploy button URLs in the Next.js repo to follow the following format:
```
https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/<EXAMPLE_NAME>&project-name=<EXAMPLE_NAME>&repository-name=<EXAMPLE_NAME>
```

The detailed docs for the Deploy Button can be found here: https://vercel.com/docs/more/deploy-button.

Also updates legacy Vercel import flow URLs (starting with vercel.com/import or with vercel.com/new/project), to use the new vercel.com/new URLs.

---

For example, for the `hello-world` example:

The URL is https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/hello-world&project-name=hello-world&repository-name=hello-world

And the deploy button looks like this:
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/hello-world&project-name=hello-world&repository-name=hello-world)

---

For reference, I used the following regexes to search for the incorrect URLs

```
\(https://vercel.com/import/git\?s=https://github.com/vercel/next.js/tree/canary/examples/(.*)\)
\(https://vercel.com/import/git\?c=1&s=https://github.com/vercel/next.js/tree/canary/examples/([^&]*)(.*)\)
\(https://vercel.com/import/project\?template=https://github.com/vercel/next.js/tree/canary/examples/(.*)\)
https://vercel.com/import/git
https://vercel.com/import/select-scope
https://vercel.com/import
https://vercel.com/new/project
```
2021-01-07 01:40:29 +00:00
Shu Uesugi
817cffdcbe
Use vercel.app for blog starter URL (#20820)
Rename https://next-blog-starter.now.sh to https://next-blog-starter.vercel.app (@lfades renamed the domain name)
2021-01-06 18:13:40 +00:00
Greg Rickaby
305b15e089
Update blog starter example (#19698)
* bump dependencies to latest versions

* use tailwindcss class names

* use next/image component

* pass in height & width. update tailwindcss classes

* update tailwindcss classes

* mention tailwindcss 2.0
2020-12-30 19:04:23 -05:00
Riccardo Di Maio
10f7b8f941
Improve formatting in examples (#17571) 2020-10-02 21:25:29 +00:00
NorbertLuszkiewicz
c03d4931de
Simplify example usage instructions (#16678)
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
2020-08-29 22:22:02 -04:00
Ondřej Chrastina
a856097402
Add Kontent example (#16034)
Hello everyone!

I would like to add the example using [Kentico Kontent](https://kontent.ai) as a data source for your example.
I have tried to be consistent with the other examples and showcase the preview as well.

I have tried to keep up with [Contribution guidelines](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples).

Thank you.
2020-08-24 22:58:53 +00:00
Shu Uesugi
a841d10954
Add c=1 to deploy buttons on CMS Examples (#14293)
Fixes #14291
2020-06-17 23:25:11 +00:00
Jesse
d3704a66f8
added graphcms (#14026)
* added graphcms

* Updated readme and environment variables

* Removed gitignore

* Updated tailwind config

* Some fixes in pages

* Updated api endpoints

* lint fix

* Updated readme

* Updated og image

* Updated cms examples to include this one

* Added example to docs

* Added preview demo link

* Updated step

Co-authored-by: Luis Alvarez <luis@vercel.com>
2020-06-15 12:03:34 -05:00
Luis Alvarez D
2cd691050a
Add new import flow to CMS examples (#14053)
[ch2502]

- Added new import flow to every CMS example, using the deploy button, and removed `vercel.json`
- Replaced `dotenv` with the new env support in outdated examples
2020-06-11 23:44:23 +00:00
Jazib Sawar
6ce7a0378e
CMS Cosmic Example (#13499)
* Add Cosmic CMS Example

* with native .env support, this file isn't needed anymore

* FIX use path alias

* Add cosmicjs package

* Fix alias import in pages/api/preview

* Added: react-imgix & lazysizes package

* Load lazysizes in layout

* Used imgix image with lazyloading

* Added avatar imgix optimizations

* EDITED: steps to install content, preview

* EDITED: demo link

* EDITED: Install step

* EDITED: preview link steps

* Edited: demo link

* FIXED: object_slug

* Screenshots

* Fixed object_slug link

* Update README.md

* Fix: formatting issue

* Updated readme and renamed .env to env.local

* Sanity checks

* Handle fallback data when expected

* Added link to the example in other examples

* Updated demo deployment

* Added example to docs

* minor lint fix

* Remove manual download step

* use vercel.json

Co-authored-by: Tony Spiro <tspiro@tonyspiro.com>
Co-authored-by: Luis Alvarez <luis@vercel.com>
2020-06-04 15:18:11 -05:00
Luis Alvarez D
ef22a8b7c5
[Examples] Add missing cms links (#13683)
This was a change that I forgot to push into the Agility CMS example PR, adding it now.
2020-06-02 17:36:12 +00:00
Shu Uesugi
d60fada097
CMS Strapi Example (#12701)
* Strapi Example

* Fix og image URL

* Remove next.config.js

* Apply updates

* Remove API_URL

* Bugfixes

* Finish Strapi README

* Deploy Strapi

* Add strapi examples

* now →  vercel [ch1796]

* Use npx

* Minor readme update

* Prettier fix

Co-authored-by: Luis Alvarez <luis@vercel.com>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
2020-06-01 18:49:43 -05:00
Joe Haddad
7d038dfef1
Suggest npx over npm init (#13637)
This updates old examples to the more universal `npx` command.

Fixes https://github.com/vercel/next.js/discussions/12103
2020-06-01 17:36:57 +00:00
Joe Haddad
b7e17e09e5
Update references to zeit/next.js (#13463) 2020-05-27 17:51:11 -04:00
JJ Kasper
1f6ce106ae
Update codeload and deploy links for org rename (#13141)
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
2020-05-27 14:11:39 -04:00
Timothy
9cb75d556d
Add contentful as a related example link to each CMS example (#12796) 2020-05-12 14:15:53 -05:00
Matthias Lorthiois
c81cabeae8
Update blog-starter to use Tailwind CSS v1.4's new built-in purge option (#12452) 2020-05-06 11:27:21 +02:00
Tim Neutkens
483bd3ddda
Rename ZEIT to Vercel (#12075)
* Find/replace

* Update more URLs

* More rename

* Fix remaining examples

* More updates

* Update create-next-app

* Update remaining text

* Update

Co-authored-by: Shu Uesugi <shu@chibicode.com>
2020-04-21 11:47:12 +02:00
Tim Neutkens
c59d24055d
Add Prismic Example (#10897)
* Add Prismic Example

* Update package.json

* Update constants

* Remove react-datocms

* Add Preview Mode for Prismic

* Add support for Preview Mode

* Delete author.jpg

* Delete image.jpg

* Fixes and readme updates

* Fixed issues with preview mode

* Updated preview mode steps

* Added more posts

* Updated readme

* Updated readme

* Added demo URL

* Added related examples links

* Added example to docs

Co-authored-by: Shu Uesugi <shu@chibicode.com>
Co-authored-by: Luis Alvarez <luis@zeit.co>
2020-04-10 12:41:09 +02:00
Shu Uesugi
a63ac3e715
CMS TakeShape Example (#11038)
* TakeShape Example

* Fix preview logic

* Update README

* Fix broken link

* Be more clear with the relationship field

* Use latest next.js for cms examples

* Only show enabled items

* Ignore current slug

* Fix queries

* Add takeshape demo

* Added link to blog-starter

Co-authored-by: Luis Alvarez D <luis@zeit.co>
2020-03-19 17:30:37 -05:00
JJ Kasper
756b365adf
Add CMS example for Sanity (#10907)
* Add start of Sanity CMS example

* Update cover-image

* Clean up example

* Apply suggestions from code review

Co-Authored-By: Shu Uesugi <shu@chibicode.com>

* Make changes from review

* Remove extra style

* Apply suggestions from code review

Co-Authored-By: Shu Uesugi <shu@chibicode.com>

* Make tweaks for preview mode and normalize env naming

* Update viewing preview step

* Delete author.jpg

* Delete image.jpg

* Update README

* Fix environment variable names

* Project ID is needed by lambda

* Improved steps

* Fixed issue with the project URL example

* Clarify line

* Get the preview post correctly

* preview = false

* Get unique posts

* Show preview mode on index page

* typo fix and use next latest

* Added related examples section

Co-authored-by: Shu Uesugi <shu@chibicode.com>
Co-authored-by: Luis Alvarez <luis@zeit.co>
2020-03-18 18:39:37 -05:00
Zhe Zhang
14efae931a
[Examples] fix remark link in blog-starter's README (#11177) 2020-03-18 17:36:04 +01:00
Tim Neutkens
88a6bb36ba
Update blog-starter example (#11071)
* Update blog-starter example

* Updated content

* Updated readme

* Updated readme

* static → assets

* Add bottom margin

* Add to docs

* Add excerpt

* Update docs/advanced-features/preview-mode.md

Co-authored-by: Luis Alvarez <luis@zeit.co>
Co-authored-by: Shu Uesugi <shu@chibicode.com>
2020-03-18 09:43:09 +01:00
Shu Uesugi
c57cdbb31d
Rename zeit.co/new → zeit.co/import (#10674)
* Replace zeit.co/new → zeit.co/import

* Update deployment.md
2020-02-24 19:08:34 -05:00
Shu Uesugi
5f041447bc
Remove Now CLI reference from examples (#10501)
* Find/Replace "Deploy it to the cloud..."

* Find/Replace "Deploy it to the cloud..." (no colon)

* Find/Replace "Deploy it to the cloud..." for firebase

* Convert remaining ones

* Storybook deployment

* Update with-stripe-typescript

* Update contributing.md

* Remove `now`

* Update examples/with-stripe-typescript/README.md

Co-Authored-By: Luis Alvarez D. <luis@zeit.co>
2020-02-12 17:14:57 -05:00
Shu Uesugi
6804039e94 Make example READMEs more consistent (#10124)
* npx create → npm init

* Fix inconsistent instructions

* Update amp-first

* Update with-graphql-react

* with-firebase-cloud-messaging

* Update with-higher-order-component

* change create-next-app url

* Update create-next-app instruction

* Update instructions to use npm instead of npx

* Move "the idea behind the example" to top

* Rename

* Rename

* Update contributing.md with a README template
2020-01-16 23:23:56 +01:00
Luis Alvarez D
7edf0da0c4 Add the deploy button to compatible examples (#9547) 2019-11-27 11:40:58 -05:00
Luis Alvarez D
f10f3304fe Replace the deprecated Create Next App URL (#9032) 2019-10-10 23:34:14 -04:00
Juan Olvera
cb22d3671f Added new blog example (#7511) 2019-06-13 10:32:04 -05:00