New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support hot-reloading route data #452

Closed
getDanArias opened this Issue Mar 9, 2018 · 4 comments

Comments

Projects
None yet
3 participants
@getDanArias

getDanArias commented Mar 9, 2018

I like the premise and benefits presented by react-static!

One area where I am struggling is that I'd like the browser to refresh when there are changes to the Markdown files. I've combined these two examples:

https://github.com/EmilTholin/react-static-markdown-example
https://github.com/pkrawc/react-static-markdown/blob/master/static.config.js

In the first example, you can make changes to the markdown test file, but they are not reflected on the browser until you refresh it.

I plan to store the post in markdown under a folder. Based on the first example, I changed the second example to reading the posts folder inside the /blog route path. When I make changes to it, there is no rebuilding, which is great, but I have to manually refresh the browser to see the updated content reflected after a markdown change.

I'd appreciate any insight or guidance on how to achieve this please. It's the only thing I am missing to fully embrace this framework for a blog!

Thank you for your time!

@rileylnapier

This comment has been minimized.

Contributor

rileylnapier commented Mar 9, 2018

I use a library npm-watch for this

my scripts:

{
  "watch": {
    "copyup": {
      "patterns": "src/*",
      "extensions": "json,md,png,html"
    }
  },
  "scripts": {
      "copyup": "copyup \"src/**/*.json\" \"src/**/*.md\" \"src/**/*.png\" \"src/**/*.html\"",
      "start": "npm-watch
  }
}
@tannerlinsley

This comment has been minimized.

Collaborator

tannerlinsley commented Mar 9, 2018

Expected Functionality

Changing a data source should hot-reload on the client with the updated data.

Current Functionality

If you are retrieving your data in

  • The config.getRoutes, a server restart is required to see changes
  • Each route.getData function, a browser reload is required to see changes

Proposed Changes to support this functionality

The problem you're experiencing is that this data is cached on the client, so when you move around your site, you are getting stale data. To make this possible a couple things would need to change in React Static:

  • The user would need a way of detecting changes to the asset you're using (in this case, watching a markdown file for changes)
  • RS would need to define a generic api to notify RS that an "asset" has changed and also be able to notify the client which routes have changed.
  • On the client, the routeInfo cache for those changed routes would need to be cleared.
  • Any components relying on the updated routeInfo would need to rerequest it, and naturally, render the component with the updated data.

Though the most common use case is probably Markdown files, these proposed changes should technically make it feasible to hot-reload when CMS data changes, as long as RS can be notified of that change.

@tannerlinsley tannerlinsley changed the title from Watching changes in Markdown files to Support hot-reloading of route data Mar 9, 2018

@tannerlinsley tannerlinsley changed the title from Support hot-reloading of route data to Support hot-reloading route data Mar 9, 2018

@stale

This comment has been minimized.

stale bot commented Apr 12, 2018

This issue has been automatically marked as stale because it has not had recent activity in 7 days. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the stale label Apr 12, 2018

@tannerlinsley

This comment has been minimized.

Collaborator

tannerlinsley commented Apr 12, 2018

HA! this is done. :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment