Next.js gh-pages example
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
out
pages
.babelrc.js
.gitignore first commit Dec 3, 2017
README-next.js.md update readme Dec 3, 2017
README.md add Custom domain setting in readme Dec 4, 2017
env-config.js
next.config.js set cacheDirectory to false for babel-loader Dec 6, 2017
package-lock.json update next Jul 17, 2018
package.json update next Jul 17, 2018

README.md

Next.js gh-pages Hello World example

This repository is a gh-pages example build with Next.js

https://thierryc.github.io/Next-gh-page-example/

Install it and run:

npm install
npm run dev

Deploy it to github

Edit env-config.js and replace 'Next-gh-page-example' by your project name.

Edit next.config.js and replace 'Next-gh-page-example' by your project name.

  1. Create repository.
  2. Link it to your github account.
  3. Publish your master branch.
npm run deploy

Test it:

Reaplce 'github-user-name' and 'github-projet-name'

https://github-user-name.github.io/github-projet-name/

Custom domain setting

You can add on to the deploy command to create the CNAME file for you. GitHub detects this file and automatically updates the custom domain setting. Edit the package.json deploy script and replace example.com with your custom domain. (Thank you to @jabacchetta)

next build
&& next export
&& touch out/.nojekyll
&& touch out/CNAME
&& echo \"example.com\" >> out/CNAME
&& git add out/
&& git commit -m \"Deploy to gh-pages\"
&& git subtree push --prefix out origin gh-pages"

Example:

https://github.com/thierryc/Next-gh-page-example/

https://thierryc.github.io/Next-gh-page-example/

The idea behind the example

This example shows the most basic idea behind Next. We have 2 pages: pages/index.js and pages/about.js. The former responds to / requests and the latter to /about. Using next/link you can add hyperlinks between them with universal routing capabilities.