Added redirects for old React versions #801

bvaughn · 2018-04-13T16:46:48Z

Use Netlify's redirects API- and the fact that Netlify caches immutable builds of older versions of the site- to expose previous versions of the React documentation via a new "React Versions" page.

I did the following to identify the correct revisions to use:

Lookd at the CHANGELOG for release dates.
Cross-references Netlify build history for the master branch
Picked the most recent build before we updated the site (e.g. merged a PR that adds new API docs)

Unfortunately, our Netlify history begins with version 16 RC3 (so we can't link back to an old 15.6 release).

Since Netlify has built this PR preview as 5ad0def873f2cf6608e0d48a--reactjs.netlify.com, we should be able to test these new redirects as:

A robots.txt file has also been added- along with rel="nofollow" attributes- to prevent search crawlers from indexing older versions of the site. (We want the latest release to be what shows up in search engines at all times.)

This versioning strategy should also work well by default with any localization strategy we use.

TODO:

Add a UI mechanism for viewing old revisions
Don't let search engines crawl older versions
Make versions configurable via a single YAML file
Determine if there's a way to use a subdomain of reactjs.org for versions rather than the netlify URL

Resolves issue #85

Screenshot

reactjs-bot · 2018-04-13T16:49:54Z

Deploy preview for reactjs ready!

Built with commit 631f32c

https://deploy-preview-801--reactjs.netlify.com

gaearon · 2018-04-13T16:59:07Z

Will Netlify ever remove them?

consultwithmike · 2018-04-13T17:17:35Z

This is awesome!

Looks good at first with this screenshot:

and remains good if I use the menus to navigate:

but if I use Search it will use the latest version:

bvaughn · 2018-04-13T17:18:38Z

Will Netlify ever remove them?

I don't think so. On their features page they say each URL is permanent:

but if I use Search it will use the latest version:

Yes. That's a good point. This is a limitation of our Algolia integration. It also applies to local builds or PR preview builds. At any given time, only the latest (master) build is searchable.

gaearon · 2018-04-13T17:19:01Z

Well, as long as Netlify is in business 😛

alexkrolick · 2018-04-13T17:28:50Z

Search always uses the newest version, even for deployed previews and localhost. Probably should be tackled separately.

edit: 💨

consultwithmike · 2018-04-13T17:30:19Z

@alexkrolick we can tackle it separately with a different issue if we want, and I fully suspected that there was a code change coming down the pipeline, I just wanted to drop that information on the issue so we can get it handled.

alexkrolick · 2018-04-13T17:33:57Z

Issue for versioned search: #803

bvaughn · 2018-04-13T18:31:24Z

I added a drop-down toggle button for version switching. I'd love to get feedback, but I think I'm going to immediately replace it with a "older versions" index page because:

It would not work for mobile (since we don't even show the version number)
This would not work well once we have more than a few versions

I just wanted to add it so it would be available in the history of this PR.

(I didn't bother implementing global click-anywhere-outside-to-dismiss functionality because I don't plan on moving forward with this UI.)

Edit Looks like I forgot to actually commit the VersionToggler component, and I removed it right after pushing. Clown town! Whatever. It wouldn't have worked anyway for the reasons I mentioned.

bvaughn · 2018-04-13T18:40:54Z

Okay, I changed the version link in the header to link to a "Versions" page, which points to both the CHANGELOG and docs for recent releases of the site.

alexkrolick · 2018-04-13T19:35:49Z

Is there some way to source both the redirects and the page content from the same source? Like versions.yml:

versions:
	- title: 16.0
	  version: 16.0.0
	  url: 5ad0def873f2cf6608e0d48a--reactjs.netlify.com/version/16.0
	- title: 16.1
	  version: 16.1.1
	  url: 5ad0def873f2cf6608e0d48a--reactjs.netlify.com/version/16.1

Another thing is that we could only show links to the latest semver-compatible docs for a major release, e.g., 16.3.1, 15.6.3, 0.14.?. That's what Lodash does.

bvaughn · 2018-04-13T20:12:12Z

Yeah! Let me see if I can whip up another Gatsby startup plugin thingy for that.

Another thing is that we could only show links to the latest semver-compatible docs for a major release, e.g., 16.3.1, 15.6.3, 0.14.?. That's what Lodash does.

Maybe. I was thinking we could show minors (eg. 16.0, 16.1, 16.2) since there's been quite a bit of change between those lately.

bvaughn · 2018-04-13T20:43:34Z

Ok. I added a Gatsby plugin that reads version values from a YAML file and adds them as Netlify redirect rules. Also updated the Versions page to read from this same YAML file. It's a good bit of extra code compared to the previous version- but it simplifies the process of adding new versions.

Ideally, I could have done this in a simpler way using Gatsby's createRedirects action creator- but it doesn't see to support different domains yet (gatsbyjs/gatsby/issues/3782).

gaearon · 2018-04-14T00:55:56Z

src/pages/versions.js

+          <ul>
+            {versions.map(version => (
+              <li key={version.title}>
+                <a href={version.path} rel="nofollow">


Since the top link used to always lead to a release, what do you think about making releases first-class entities on this page?

Something like

# React 16.2.0 * Changelog * Documentation # React 16.1.0 * Changelog * Documentation

bvaughn · 2018-04-14T16:57:40Z

I think we should move forward with this and follow up with the vanity subdomain URLs (assuming Netlify supports this- I've reached out to them about it on Twitter). This is a useful feature for the community, even as-is (with ugly URLs). 😄

bvaughn · 2018-04-14T16:58:55Z

cc @danoc in case you know of a way to do this already ^

bvaughn · 2018-04-14T17:11:33Z

I wonder if a modified version of this plug-in could be useful for other Gatsby sites that use Netlify? Or maybe as an addition to the existing gatsby-plugin-netlify plugin... cc @KyleAMathews

KyleAMathews · 2018-04-14T19:09:01Z

Cool idea! The thought of duplicating documentation every time you do a new release has always filled me loathing (more-or-less) so this seems tons better. Relatively few people care about the older docs so pointing them to a snapshot seems like the least work for the most benefit.

It seems like this could be a lot simpler by fixing the redirect bug? Then you'd just need to read in the yaml file and create the redirects and the existing gatsby-plugin-netlify would setup the server redirects for you. I think all we'd need to do is to add a check here if the to path is absolute and if so, don't add the pathPrefix.

danoc · 2018-04-15T00:38:50Z

cc @danoc in case you know of a way to do this already ^

AFAIK, the only way to do this right now is with the "branch subdomains" feature in Netlify. Would be great if there was a way to "tag" certain Netlify deploys and provide clean-lookin' URLs. 😄

bvaughn · 2018-04-15T02:45:19Z

FYI there is a somewhat hacky option we could use to generate vanity subdomains (e.g. 16-0.reactjs.org) as per Netlify's tweet: https://twitter.com/NetlifySupport/status/985338587955810304

I'm not convinced this is worth it, TBH.

bvaughn · 2018-04-15T02:46:38Z

It seems like this could be a lot simpler by fixing the redirect bug? Then you'd just need to read in the yaml file and create the redirects and the existing gatsby-plugin-netlify would setup the server redirects for you.

Yes~ agreed! I assumed this bug was somewhat tricky to fix since it's been around for a while, but that would be an easier solution for sure. 😄

KyleAMathews · 2018-04-15T04:46:00Z

Nah, more no one has cared yet :-)

bvaughn · 2018-04-15T14:53:43Z

Update on the vanity subdomains: According to Netlify support, the only way to have a subdomain like 16-0.reactjs.org point to a cached snapshot of the site would be to create a Git branch from the commit that generated that build, and then setup a branch subdomain. This approach would, I suppose, have the small added benefit of allowing us to update old branches if we ever needed to- but it also adds a bit of setup work each time we want to create a version.

I also tried another approach- using a 200 proxy redirect to gives us URLs like reactjs.org/16.0. Unfortunately it didn't work. (The latest version of the site loaded, rather than the older one I was trying to proxy.)

So, I think we should move forward as-is. 😄We can always follow up with the subdomain thing if anyone thinks it's important enough. (I don't.)

We can also simplify this implementation once the Gatsby redirect plug-in bug has been fixed.

flarnie

Let's ship it!

gaearon · 2018-04-17T15:58:08Z

Now I'm hungry 😢

Added redirects for old React versions

5433a47

facebook-github-bot added the CLA Signed label Apr 13, 2018

bvaughn requested a review from gaearon April 13, 2018 16:50

bvaughn added 2 commits April 13, 2018 10:37

Added robots.txt to prevent crawling old versions of site

597fe25

Added version drop-down toggle (that I will replace in a moment)

ae0b953

Added versions page with links to recent releases

8e45c4b

bvaughn force-pushed the versions branch from b3a044a to 8e45c4b Compare April 13, 2018 18:45

Moved versions control into versions.yml and Gatsby plug-in

48a92c5

bvaughn requested review from sophiebits and flarnie April 13, 2018 20:59

gaearon reviewed Apr 14, 2018

View reviewed changes

Added links to old release changelogs also

d184d02

Minor tidying up of the gatsby-transformer-versions-yaml plugin

6c094ab

bvaughn force-pushed the versions branch from d3ae6cd to 6c094ab Compare April 14, 2018 17:16

Testing a 200 redirect proxy

7843bbe

bvaughn force-pushed the versions branch from c589d71 to 7843bbe Compare April 15, 2018 14:47

Removing redirect proxy test

fbbddee

bvaughn added 2 commits April 15, 2018 08:00

Added 16.3 changelog to version links

88bf29d

Replaced 16.3.1 link with 16.3.2

631f32c

bvaughn mentioned this pull request Apr 16, 2018

React 16.3.2 #811

Merged

flarnie approved these changes Apr 17, 2018

View reviewed changes

bvaughn merged commit ec44237 into reactjs:master Apr 17, 2018

bvaughn deleted the versions branch April 17, 2018 15:56

jbolda mentioned this pull request May 25, 2018

Version 1.0 tracking issue KaTeX/KaTeX#1330

Open

m-allanson mentioned this pull request Jun 5, 2018

Setup a link to v1 docs gatsbyjs/gatsby#5731

Closed

3 tasks

gaearon mentioned this pull request Feb 10, 2021

Documentation links missing on versions >=16.9 #3138

Closed

BetterZxx pushed a commit to BetterZxx/react.dev that referenced this pull request Mar 21, 2023

docs(cn): update reference-react.md (reactjs#801)

157e2a9

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Added redirects for old React versions #801

Added redirects for old React versions #801

bvaughn commented Apr 13, 2018 •

edited

Loading

reactjs-bot commented Apr 13, 2018 •

edited

Loading

gaearon commented Apr 13, 2018

consultwithmike commented Apr 13, 2018

bvaughn commented Apr 13, 2018 •

edited

Loading

gaearon commented Apr 13, 2018

alexkrolick commented Apr 13, 2018 •

edited

Loading

consultwithmike commented Apr 13, 2018

alexkrolick commented Apr 13, 2018

bvaughn commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 13, 2018

alexkrolick commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 13, 2018 •

edited

Loading

gaearon Apr 14, 2018

bvaughn Apr 14, 2018

bvaughn commented Apr 14, 2018

bvaughn commented Apr 14, 2018

bvaughn commented Apr 14, 2018 •

edited

Loading

KyleAMathews commented Apr 14, 2018

danoc commented Apr 15, 2018

bvaughn commented Apr 15, 2018

bvaughn commented Apr 15, 2018

KyleAMathews commented Apr 15, 2018

bvaughn commented Apr 15, 2018 •

edited

Loading

flarnie left a comment

gaearon commented Apr 17, 2018

Added redirects for old React versions #801

Added redirects for old React versions #801

Conversation

bvaughn commented Apr 13, 2018 • edited Loading

Screenshot

reactjs-bot commented Apr 13, 2018 • edited Loading

gaearon commented Apr 13, 2018

consultwithmike commented Apr 13, 2018

bvaughn commented Apr 13, 2018 • edited Loading

gaearon commented Apr 13, 2018

alexkrolick commented Apr 13, 2018 • edited Loading

consultwithmike commented Apr 13, 2018

alexkrolick commented Apr 13, 2018

bvaughn commented Apr 13, 2018 • edited Loading

bvaughn commented Apr 13, 2018

alexkrolick commented Apr 13, 2018 • edited Loading

bvaughn commented Apr 13, 2018 • edited Loading

bvaughn commented Apr 13, 2018 • edited Loading

gaearon Apr 14, 2018

Choose a reason for hiding this comment

bvaughn Apr 14, 2018

Choose a reason for hiding this comment

bvaughn commented Apr 14, 2018

bvaughn commented Apr 14, 2018

bvaughn commented Apr 14, 2018 • edited Loading

KyleAMathews commented Apr 14, 2018

danoc commented Apr 15, 2018

bvaughn commented Apr 15, 2018

bvaughn commented Apr 15, 2018

KyleAMathews commented Apr 15, 2018

bvaughn commented Apr 15, 2018 • edited Loading

flarnie left a comment

Choose a reason for hiding this comment

gaearon commented Apr 17, 2018

bvaughn commented Apr 13, 2018 •

edited

Loading

reactjs-bot commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 13, 2018 •

edited

Loading

alexkrolick commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 13, 2018 •

edited

Loading

alexkrolick commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 13, 2018 •

edited

Loading

bvaughn commented Apr 14, 2018 •

edited

Loading

bvaughn commented Apr 15, 2018 •

edited

Loading