diff --git a/examples/custom-universal-routing/components/link.js b/examples/custom-universal-routing/components/link.js new file mode 100644 index 0000000000000..1af03da6adbe4 --- /dev/null +++ b/examples/custom-universal-routing/components/link.js @@ -0,0 +1,21 @@ +import React from 'react' +import NextLink from 'next/link' +import {customRoutes} from '../next.config' + +function matchInternal (route) { + const match = customRoutes.find((element) => { + return route.match(element.test) + }) + + return match ? match.routeTo : false +} + +export default class Link extends React.Component { + render () { + const internalRoute = matchInternal(this.props.href) + + return + {this.props.children} + + } +} diff --git a/examples/custom-universal-routing/next.config.js b/examples/custom-universal-routing/next.config.js new file mode 100644 index 0000000000000..a82918890ca51 --- /dev/null +++ b/examples/custom-universal-routing/next.config.js @@ -0,0 +1,9 @@ +module.exports = { + customRoutes: [{ + test: /^\/$/, + routeTo: '/foo' + }, { + test: /^\/about(\/?)$/, + routeTo: '/bar' + }] +} diff --git a/examples/custom-universal-routing/package.json b/examples/custom-universal-routing/package.json new file mode 100644 index 0000000000000..a22f722743390 --- /dev/null +++ b/examples/custom-universal-routing/package.json @@ -0,0 +1,10 @@ +{ + "scripts": { + "dev": "node server.js", + "build": "next build", + "start": "NODE_ENV=production node server.js" + }, + "dependencies": { + "next": "^2.0.0-beta" + } +} diff --git a/examples/custom-universal-routing/pages/bar.js b/examples/custom-universal-routing/pages/bar.js new file mode 100644 index 0000000000000..42fabbabe06b1 --- /dev/null +++ b/examples/custom-universal-routing/pages/bar.js @@ -0,0 +1,11 @@ +import React from 'react' +import Link from '../components/link' + +export default class Bar extends React.Component { + render () { + return
+

About (Bar Template)

+
Click here to go back home.
+
+ } +} diff --git a/examples/custom-universal-routing/pages/foo.js b/examples/custom-universal-routing/pages/foo.js new file mode 100644 index 0000000000000..d968ec6a75389 --- /dev/null +++ b/examples/custom-universal-routing/pages/foo.js @@ -0,0 +1,11 @@ +import React from 'react' +import Link from '../components/link' + +export default class Foo extends React.Component { + render () { + return
+

Home (Foo Template)

+
Click here to see the about page.
+
+ } +} diff --git a/examples/custom-universal-routing/server.js b/examples/custom-universal-routing/server.js new file mode 100644 index 0000000000000..bd880db168245 --- /dev/null +++ b/examples/custom-universal-routing/server.js @@ -0,0 +1,30 @@ +const { createServer } = require('http') +const { parse } = require('url') + +const next = require('next') +const nextConfig = require('./next.config') + +const dev = process.env.NODE_ENV !== 'production' +const app = next({ dev }) +const handle = app.getRequestHandler() + +app.prepare() + .then(() => { + createServer((req, res) => { + const { pathname, query } = parse(req.url, true) + + const match = nextConfig.customRoutes.find((definition) => { + return pathname.match(definition.test) + }) + + if (match) { + app.render(req, res, match.routeTo, query) + } else { + handle(req, res) + } + }) + .listen(3000, (err) => { + if (err) throw err + console.log('> Ready on http://localhost:3000') + }) + })