Trigger fast refresh when a non javascript file changes in CRA - reactjs

I am using a symlink to a file with a custom extension that acts like a ressource file. The file is used by a proxy API that my React application (made with CRA) uses, so I would like to refresh the app when the file changes so requests can be remade. All I want is to avoid the necessessity of having to manually refresh the browser...
Is there any way this can be done ?

Related

Using config map in React JS project deployed on kubernetes

I building a react application and deploying it on Kubernetes. On page load i have to show certain elements and i want them to be configurable. I am driving them from json file.
I want to keep that json on config map and whenever i want to make change. Updating config map should be sufficient.
My react application is not server side application, hence not sure for approach. Is it possible to keep some file in project and then later replace it with config using docker or something.

How can I build a Go app with a ReactJS GUI in a single binary?

I would like to develop a Go application with a ReactJS "GUI".
My point is to launch a single binary "app" that launch a server at "localhost:someport" serving a ReactJS app.
I would like my actions in the ReactApp to be taken into account in the Go-side app.
I can do a Websocket-based ReactJS-Go application but I'd like everything to be bundled into a single binary.
I've followed this : https://medium.com/#esslamben/serving-static-sites-with-go-55bfc1ae4495.
This tutorial helped me to serve static files (a React App) with a single file.
But, I don't know how to continue to satisfy my wishes.
The thing I would like to achieve is the behavior like the old "RethinkDB".
When you run "rethinkdb.exe" in command line, it notifies a administration panel is running on 8080 port.
Navigating through localhost:8080 enables to administrate the database with a web-based GUI.
Does someone have advice to help me to obtain such a behavior?
You cant make binary for your React code , it should be copied
Your react built code (I assume static ) and put it in a specific path
Use Go http FileServer handler to serve the app as static one.
This might work or may not , I am not sure what are the bindings which is necessary should alos be copied. (your node modules and additional libraries you use it in your package.json)
Put your *.js binary data inside an HTTP handler to serve the client.
Store your js file as an []byte inside your application.

How do I prevent browser caching of webpack bundle?

I am using webpack to bundle a react app in a js file which I want add to client site. So I end up with a app.js and I can provide a url for where the file is hosted to clients https://example.mysite.com/apps/app.js and this can be included via a script tag on client site. Simple enough.
The issue I might run into here is browser side caching. I can't use version tags here because asking a client to continuously update code on their site is not a realistic expectation.
Webpack hashing is also not an option because this would mean updating the file on the client side, which again is something I would like to work around.
Is there a way to prevent my app.js file from being cached and fetching a new version of the file every time the app.js file has changed?

Can I have a config.json file to hand to my clients so they can change values on their website?

Using react-app and webpack, I was wondering if it's possible to bundle a config.json file such that you can access it after the site builds and be able to change values within it and have that be reflected on the website. This is mainly so that I can have values in my config.json file like "header__1" or "about__description" in my config.json file and hand them over to my clients so that they may change values themselves w/o having to consult me.
Welcome to stackoverflow Shaun,
since you're writing a web application with react and it is all about Javascript, you can't work with files like you can with desktop clients. Neither should you (read more here).
If you want your web clients to be modifiable by the customer you should add something like a config page to your app. The values that change should then be stored in the localStorage of the browser or something similar.
EDIT: Of cause a config file could be loaded from an external source. But then you have to differ between users and their individual configurations (which might be not what you want). Files bundled with webpack can't be edited (permanently) on the users side.

Admin-on-rest (React) - How to handle browser caching of JS files

I have recently put an admin-on-rest app into production and it works great. However, when I update the app, the updated files within my project src directory are cached. For example I made a change to the restClient.js file, but this only gets loaded after users do a CTRL+F5 in the app.
What is the recommended way to handle this? Can I somehow add a cachebust to the files? Or should I simply set expires in the index.html file head section?
Ps. this questions is maybe more related to React apps in general then admin-on-rest..

Resources