diff --git a/website/docs/guides/application-development.mdx b/website/docs/guides/application-development.mdx
index f8074d150..9d04fe917 100644
--- a/website/docs/guides/application-development.mdx
+++ b/website/docs/guides/application-development.mdx
@@ -219,8 +219,33 @@ be saved to your project config and become the default.
Some frameworks come with their own live-reloading server, however they will not be able to take advantage of the Wails
Go bindings. In this scenario, it is best to run a watcher script that rebuilds the project into the build directory, which
Wails will be watching. For an example, see the default svelte template that uses [rollup](https://rollupjs.org/guide/en/).
-For [create-react-app](https://create-react-app.dev/), it's possible to use
-[this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result.
+
+### Create React App
+
+The process for a Create-React-App project is slightly more complicated. In order to support live frontend reloading the following configuration
+needs to be added to your `wails.json`:
+
+```json
+ "frontend:dev:watcher": "yarn start",
+ "frontend:dev:serverUrl": "http://localhost:3000",
+```
+
+The `frontend:dev:watcher` command will start the Create-React-App development server (hosted on port `3000` typically). The `frontend:dev:serverUrl` command then
+instructs Wails to serve assets from the development server when loading the frontend rather than from the build folder. In addition to the above, the
+`index.html` needs to be updated with the following:
+
+```html
+
+
+
+
+
+```
+
+This is required as the watcher command that rebuilds the frontend prevents Wails from injecting the required scripts. This circumvents that issue by ensuring
+the scripts are always injected. With this configuration, `wails dev` can be run which will appropriately build the frontend and backend with hot-reloading enabled.
+Additionally, when accessing the application from a browser the React developer tools can now be used on a non-minified version of the application for straightforward
+debugging. Finally, for faster builds, `wails dev -s` can be run to skip the default building of the frontend by Wails as this is an unnecessary step.
## Go Module
diff --git a/website/docs/guides/sveltekit.mdx b/website/docs/guides/sveltekit.mdx
index 6be409492..3f82eb813 100644
--- a/website/docs/guides/sveltekit.mdx
+++ b/website/docs/guides/sveltekit.mdx
@@ -93,7 +93,7 @@ wails dev
##### The Wails runtime unloads with full page navigations!
- Anything that causes full page navigations: `window.location.href = '//'` or Context menu reload when using wails dev. What this means is that you can end up losing the ability to call any runtime breaking the app. There are two ways to work around this.
- Use `import { goto } from '$app/navigation'` then call `goto('//')` in your +page.svelte. This will prevent a full page navigation.
-- If full page navigation can't be prevented the Wails runtime can be added to all pages by adding the below into the of myapp/frontend/src/app.html
+- If full page navigation can't be prevented the Wails runtime can be added to all pages by adding the below into the `` of myapp/frontend/src/app.html
```
...
diff --git a/website/versioned_docs/version-v2.4.0/guides/application-development.mdx b/website/versioned_docs/version-v2.4.0/guides/application-development.mdx
index f8074d150..9d04fe917 100644
--- a/website/versioned_docs/version-v2.4.0/guides/application-development.mdx
+++ b/website/versioned_docs/version-v2.4.0/guides/application-development.mdx
@@ -219,8 +219,33 @@ be saved to your project config and become the default.
Some frameworks come with their own live-reloading server, however they will not be able to take advantage of the Wails
Go bindings. In this scenario, it is best to run a watcher script that rebuilds the project into the build directory, which
Wails will be watching. For an example, see the default svelte template that uses [rollup](https://rollupjs.org/guide/en/).
-For [create-react-app](https://create-react-app.dev/), it's possible to use
-[this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result.
+
+### Create React App
+
+The process for a Create-React-App project is slightly more complicated. In order to support live frontend reloading the following configuration
+needs to be added to your `wails.json`:
+
+```json
+ "frontend:dev:watcher": "yarn start",
+ "frontend:dev:serverUrl": "http://localhost:3000",
+```
+
+The `frontend:dev:watcher` command will start the Create-React-App development server (hosted on port `3000` typically). The `frontend:dev:serverUrl` command then
+instructs Wails to serve assets from the development server when loading the frontend rather than from the build folder. In addition to the above, the
+`index.html` needs to be updated with the following:
+
+```html
+
+
+
+
+
+```
+
+This is required as the watcher command that rebuilds the frontend prevents Wails from injecting the required scripts. This circumvents that issue by ensuring
+the scripts are always injected. With this configuration, `wails dev` can be run which will appropriately build the frontend and backend with hot-reloading enabled.
+Additionally, when accessing the application from a browser the React developer tools can now be used on a non-minified version of the application for straightforward
+debugging. Finally, for faster builds, `wails dev -s` can be run to skip the default building of the frontend by Wails as this is an unnecessary step.
## Go Module
diff --git a/website/versioned_docs/version-v2.5.0/guides/application-development.mdx b/website/versioned_docs/version-v2.5.0/guides/application-development.mdx
index f8074d150..9d04fe917 100644
--- a/website/versioned_docs/version-v2.5.0/guides/application-development.mdx
+++ b/website/versioned_docs/version-v2.5.0/guides/application-development.mdx
@@ -219,8 +219,33 @@ be saved to your project config and become the default.
Some frameworks come with their own live-reloading server, however they will not be able to take advantage of the Wails
Go bindings. In this scenario, it is best to run a watcher script that rebuilds the project into the build directory, which
Wails will be watching. For an example, see the default svelte template that uses [rollup](https://rollupjs.org/guide/en/).
-For [create-react-app](https://create-react-app.dev/), it's possible to use
-[this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result.
+
+### Create React App
+
+The process for a Create-React-App project is slightly more complicated. In order to support live frontend reloading the following configuration
+needs to be added to your `wails.json`:
+
+```json
+ "frontend:dev:watcher": "yarn start",
+ "frontend:dev:serverUrl": "http://localhost:3000",
+```
+
+The `frontend:dev:watcher` command will start the Create-React-App development server (hosted on port `3000` typically). The `frontend:dev:serverUrl` command then
+instructs Wails to serve assets from the development server when loading the frontend rather than from the build folder. In addition to the above, the
+`index.html` needs to be updated with the following:
+
+```html
+
+
+
+
+
+```
+
+This is required as the watcher command that rebuilds the frontend prevents Wails from injecting the required scripts. This circumvents that issue by ensuring
+the scripts are always injected. With this configuration, `wails dev` can be run which will appropriately build the frontend and backend with hot-reloading enabled.
+Additionally, when accessing the application from a browser the React developer tools can now be used on a non-minified version of the application for straightforward
+debugging. Finally, for faster builds, `wails dev -s` can be run to skip the default building of the frontend by Wails as this is an unnecessary step.
## Go Module