From 9674d8ac41750ad37baae694e784fa00d5a1bc69 Mon Sep 17 00:00:00 2001 From: Mars Hall Date: Tue, 11 Dec 2018 11:07:13 -0800 Subject: [PATCH 1/3] =?UTF-8?q?=F0=9F=93=9A=20default=20routing?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 39 +++++++++++++++++++++------------------ 1 file changed, 21 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index 30411bf3..8d66d7fa 100644 --- a/README.md +++ b/README.md @@ -17,7 +17,7 @@ Deploy React.js web apps generated with [create-react-app](https://github.com/fa * 👓 [Customization](#user-content-customization) * [Procfile](#user-content-procfile) * [Web server](#user-content-web-server) - * [Routing clean URLs](#user-content-routing-clean-urls) + * [Routing](#user-content-routing) * [HTTPS-only](#user-content-https-only) * [Proxy](#user-content-proxy) * [Environment variables](#user-content-environment-variables) @@ -194,20 +194,6 @@ The config file `static.json` should be committed at the root of the repo. It wi The default `static.json`, if it does not exist in the repo, is: -```json -{ "root": "build/" } -``` - -### Changing the root - -If a different web server `"root"` is specified, such as with a highly customized, ejected create-react-app project, then the new bundle location may need to be [set to enable runtime environment variables](#user-content-custom-bundle-location). - -### Routing clean URLs - -[React Router](https://github.com/ReactTraining/react-router) (not included) may easily use hash-based URLs like `https://example.com/index.html#/users/me/edit`. This is nice & easy when getting started with local development, but for a public app you probably want real URLs like `https://example.com/users/me/edit`. - -Create a `static.json` file at the root of the repo to configure the web server for clean [`browserHistory` with React Router v3](https://github.com/ReactTraining/react-router/blob/v3/docs/guides/Histories.md#browserhistory) & [`BrowserRouter` with v4](https://reacttraining.com/react-router/web/api/BrowserRouter): - ```json { "root": "build/", @@ -217,7 +203,15 @@ Create a `static.json` file at the root of the repo to configure the web server } ``` -👓 See [custom routing w/ the static buildpack](https://github.com/heroku/heroku-buildpack-static#custom-routes). +### Changing the root + +If a different web server `"root"` is specified, such as with a highly customized, ejected create-react-app project, then the new bundle location may need to be [set to enable runtime environment variables](#user-content-custom-bundle-location). + +### Routing + +🚥 ***Client-side routing is supported by default.** Any server request that would result in 404 Not Found returns the React app.* + +👓 See [custom routing w/ the static buildpack](https://github.com/heroku/heroku-buildpack-static/blob/master/README.md#user-content-custom-routes). ### HTTPS-only @@ -226,6 +220,9 @@ Enforce secure connections by automatically redirecting insecure requests to **h ```json { "root": "build/", + "routes": { + "/**": "index.html" + }, "https_only": true } ``` @@ -235,16 +232,19 @@ Prevent downgrade attacks with [HTTP strict transport security](https://develope ```json { "root": "build/", + "routes": { + "/**": "index.html" + }, "https_only": true, "headers": { "/**": { - "Strict-Transport-Security": "max-age=7776000" + "Strict-Transport-Security": "max-age=31557600" } } } ``` -* `max-age` is the number of seconds to enforce HTTPS since the last connection; the example is 90-days +* `max-age` is the number of seconds to enforce HTTPS since the last connection; the example is one-year ### Proxy @@ -273,6 +273,9 @@ Add `"proxies"` to `static.json`: ```json { "root": "build/", + "routes": { + "/**": "index.html" + }, "proxies": { "/api/": { "origin": "${API_URL}" From b06539c93362795ed9e896f91723d377781b441b Mon Sep 17 00:00:00 2001 From: Mars Hall Date: Tue, 11 Dec 2018 11:09:05 -0800 Subject: [PATCH 2/3] Switch inner buildpack to try default-routing --- .buildpacks | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.buildpacks b/.buildpacks index 29867bfa..7b398f61 100644 --- a/.buildpacks +++ b/.buildpacks @@ -1,3 +1,3 @@ https://github.com/heroku/heroku-buildpack-nodejs.git -https://github.com/mars/create-react-app-inner-buildpack.git#v7.0.0 +https://github.com/mars/create-react-app-inner-buildpack.git#default-routing https://github.com/heroku/heroku-buildpack-static.git From 52519afe3b2c0974fd0f59e67a4c8dbf2a0a09a4 Mon Sep 17 00:00:00 2001 From: Mars Hall Date: Sun, 23 Dec 2018 07:51:35 -0600 Subject: [PATCH 3/3] Upgrade to inner buildpack w/ default routing --- .buildpacks | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.buildpacks b/.buildpacks index 7b398f61..4b4241a9 100644 --- a/.buildpacks +++ b/.buildpacks @@ -1,3 +1,3 @@ https://github.com/heroku/heroku-buildpack-nodejs.git -https://github.com/mars/create-react-app-inner-buildpack.git#default-routing +https://github.com/mars/create-react-app-inner-buildpack.git#v8.0.0 https://github.com/heroku/heroku-buildpack-static.git