diff --git a/README.md b/README.md
index a1e5dab0..abff0e6e 100644
--- a/README.md
+++ b/README.md
@@ -137,7 +137,7 @@ Say you are running `webpack-serve` on port 8080 and `netlify-lambda serve` on p
- If you are using with `create-react-app`, see [netlify/create-react-app-lambda](https://github.com/netlify/create-react-app-lambda/blob/f0e94f1d5a42992a2b894bfeae5b8c039a177dd9/src/setupProxy.js) for an example of how to do this with `create-react-app`. [setupProxy is partially documented in the CRA docs](https://facebook.github.io/create-react-app/docs/proxying-api-requests-in-development#configuring-the-proxy-manually). You can also learn how to do this from scratch in a video: https://www.youtube.com/watch?v=3ldSM98nCHI
- If you are using Gatsby, see [their Advanced Proxying docs](https://www.gatsbyjs.org/docs/api-proxy/#advanced-proxying). This is implemented in the [JAMstack Hackathon Starter](https://github.com/sw-yx/jamstack-hackathon-starter), and here is an accompanying blogpost: [Turning the Static Dynamic: Gatsby + Netlify Functions + Netlify Identity](https://www.gatsbyjs.org/blog/2018-12-17-turning-the-static-dynamic/).
-- If you are using Next.js, see [this issue for how to proxy](https://github.com/netlify/netlify-lambda/pull/28#issuecomment-439675503).
+- If you are using Nuxt.js, see [this issue for how to proxy](https://github.com/netlify/netlify-lambda/pull/28#issuecomment-439675503).
- If you are using Vue CLI, you may just use https://github.com/netlify/vue-cli-plugin-netlify-lambda/.
- If you are using with Angular CLI, see the instructions below.
@@ -159,7 +159,7 @@ module.exports = {
- Using with `Angular CLI`
+ Using with Angular CLI
CORS issues when trying to use netlify-lambdas locally with angular? you need to set up a proxy.
@@ -205,6 +205,93 @@ To make your life easier you can add these to your `scripts` in `package.json`
Obviously you need to run up `netlify-lambda` & `angular` at the same time.
+
+
+
+ Using with Next.js
+
+
+Next.js [doesnt use Webpack Dev Server](https://github.com/zeit/next.js/issues/2281), so you can't modify any config in `next.config.js` to get a proxy to run. However, since the CORS proxy issue only happens in dev mode (Functions are on the same domain when deployed on Netlify) you can run Next.js through a Node server for local development:
+
+```js
+touch server.js
+yarn add -D http-proxy-middleware express
+```
+
+```js
+// server.js
+/* eslint-disable no-console */
+const express = require('express');
+const next = require('next');
+
+const devProxy = {
+ '/.netlify': {
+ target: 'http://localhost:9000',
+ pathRewrite: { '^/.netlify/functions': '' }
+ }
+};
+
+const port = parseInt(process.env.PORT, 10) || 3000;
+const env = process.env.NODE_ENV;
+const dev = env !== 'production';
+const app = next({
+ dir: '.', // base directory where everything is, could move to src later
+ dev
+});
+
+const handle = app.getRequestHandler();
+
+let server;
+app
+ .prepare()
+ .then(() => {
+ server = express();
+
+ // Set up the proxy.
+ if (dev && devProxy) {
+ const proxyMiddleware = require('http-proxy-middleware');
+ Object.keys(devProxy).forEach(function(context) {
+ server.use(proxyMiddleware(context, devProxy[context]));
+ });
+ }
+
+ // Default catch-all handler to allow Next.js to handle all other routes
+ server.all('*', (req, res) => handle(req, res));
+
+ server.listen(port, err => {
+ if (err) {
+ throw err;
+ }
+ console.log(`> Ready on port ${port} [${env}]`);
+ });
+ })
+ .catch(err => {
+ console.log('An error occurred, unable to start the server');
+ console.log(err);
+ });
+
+```
+
+run your server and netlify-lambda at the same time:
+
+```js
+// package.json
+ "scripts": {
+ "start": "cross-env NODE_ENV=dev npm-run-all --parallel start:app start:server",
+ "start:app": "PORT=3000 node server.js",
+ "start:server": "netlify-lambda serve functions"
+ },
+```
+
+and now you can ping Netlify Functions with locally emulated by `netlify-lambda`!
+
+For production deployment, you have two options:
+
+- [using `next export` to do static HTML export](https://nextjs.org/docs/#static-html-export)
+- [using the Next.js 8 `serverless` target option](https://nextjs.org/blog/next-8/#serverless-nextjs) to run your site in a function as well.
+
+Just remember to configure your `netlify.toml` to point to the `Next.js` build folder and your `netlify-lambda` functions folder accordingly.
+
## Webpack Configuration