Update Live reload configuration page to include Copilot

articles/flow/configuration/live-reload/hotswap-agent.adoc

@@ -12,36 +12,46 @@
 
 In addition to getting the Java changes into the running JVM, most frameworks have some global data that needs to be updated when a class changes -- or some caches that need to be cleared for the new class to take effect. HotswapAgent is a collection of plugins for various frameworks, which offers these kinds of global updates and cache clearing when needed.
 
-Setting up hotswapping consists of three steps:
+
+== Using Vaadin Copilot & Vaadin IDE Plugin
+
+If you are using IntelliJ and the Vaadin plugin, you can launch your application using the 'Debug using HotswapAgent' option without any additional configuration.
+
+When running your application using *Debug using HotswapAgent*, the Vaadin plugin checks if you're using the proper JDK, if HotswapAgent is available, and applies additional required JVM arguments.
+
+If you're using VS Code and Vaadin Copilot, you can configure everything automatically from the Copilot Development Workflow guide. Follow the instruction to install the proper JDK, install the HotswapAgent library, and prepare the run configuration.
+
+== Manual Installation
+
+Setting up hotswapping manually, consists of three steps:
 
 - Install JetBrains Runtime;
 - Download HotswapAgent and install it into JetBrains Runtime; and
 - Run the application using JetBrains Runtime with additional parameters.
 
-
-== JetBrains Runtime
+=== JetBrains Runtime
 
 You can download the latest version from the https://github.com/JetBrains/JetBrainsRuntime/releases[JetBrains GitHub release page]. Be sure to select the correct architecture. Use JetBrains Runtime to execute your application, not necessarily your IDE.
 
 
-== HotswapAgent
+=== HotswapAgent
 
-You can download HotSwapAgent from the https://github.com/HotswapProjects/HotswapAgent/releases[HotswapAgent GitHub release page]. You'll need version 1.4.2 or later. 
+You can download HotswapAgent from the https://github.com/HotswapProjects/HotswapAgent/releases[HotswapAgent GitHub release page]. You'll need version 1.4.2 or later.
 
-Download the JAR file and place it inside the JetBrains Runtime installation directory as [filename]`lib/hotswap/hotswap-agent.jar`. Use that exact file name -- you'll need to create the `hotswap` folder -- for JetBrains Runtime to get it.
+Download the JAR file and place it inside the JetBrains Runtime installation directory as [filename]`lib/hotswap/hotswap-agent.jar`. Use this exact file name for JetBrains Runtime. You'll need to create the `hotswap` folder.
 
 If you want to know more about the features of HotswapAgent, the documentation in the https://hotswapagent.org/[HotswapAgent webpage] is a good resource.
 
 
-== Running Application
+=== Running the Application
 
-To enable hotswapping when launching the application, you need to pass `-XX:+AllowEnhancedClassRedefinition -XX:HotswapAgent=fatjar` as JVM arguments -- not program arguments.
+To enable hotswapping when launching your application, pass `-XX:+AllowEnhancedClassRedefinition -XX:HotswapAgent=fatjar` as JVM arguments -- not program arguments.
 
-If you have a Spring Boot application, you would launch the application by running the `main()` method of your application class. After you've launched it once, you'll have a run configuration that you can edit in your IDE so that you can select the proper JDK and give the necessary parameters.
+If you have a Spring Boot application, you launch it by running the `main()` method of your application class. After you've launched it once, you'll have a run configuration available. You can edit that run configuration in your IDE so that you can select the proper JDK and give the necessary parameters.
 
 To do that in IntelliJ IDEA, select menu:Run[Edit configurations...]. With your application run configuration chosen, you can select the JDK to use in the first drop-down. If [guilabel]*JetBrains Runtime* isn't shown, you can select it through [guibutton]*Select alternative JRE...*.
 
-In the same dialog you need to click menu:Modify options[Add VM options] to be able to see the field where the JVM arguments can be defined. Then you can add `-XX:+AllowEnhancedClassRedefinition -XX:HotswapAgent=fatjar`.
+In the same dialog, click menu:Modify options[Add VM options] to see the field where you can add the `-XX:+AllowEnhancedClassRedefinition -XX:HotswapAgent=fatjar` JVM arguments.
 
 If you have another type of application, you'll need to pass the JVM options in the appropriate way.
 
@@ -55,36 +65,36 @@
 HOTSWAP AGENT: 10:19:02.065 INFO (org.hotswap.agent.config.PluginRegistry) - Discovered plugins: [JdkPlugin, ClassInitPlugin, AnonymousClassPatch, WatchResources, Hotswapper, Hibernate, Hibernate3JPA, Hibernate3, Spring, Jersey1, Jersey2, Jetty, Tomcat, ZK, Logback, Log4j2, MyFaces, Mojarra, Omnifaces, ELResolver, WildFlyELResolver, OsgiEquinox, Owb, OwbJakarta, Proxy, WebObjects, Weld, WeldJakarta, JBossModules, ResteasyRegistry, Deltaspike, GlassFish, Weblogic, Vaadin, Wicket, CxfJAXRS, FreeMarker, Undertow, MyBatis, IBatis, JacksonPlugin, Idea]
 ----
 
-This indicates that HotswapAgent is loaded. Now, when you navigate to a view in your application, open the corresponding Java file in your project and make some changes -- remember to compile and not only save the class if using IntelliJ IDEA. When you make changes, your view is reloaded in the browser and the changes are shown.
+This indicates that HotswapAgent is loaded. When you navigate now to a view in your application, open the corresponding Java file in your project and make some changes. Remember to compile and not only save the class if using IntelliJ IDEA. When you make changes, your view is reloaded in the browser and the changes are shown.
 
-.Use "debug", Not `spring-boot:run`
+.Use "debug" -- Not `spring-boot:run`
 [CAUTION]
 ====
-Don't start the application in "run" mode. The debug connection to the JVM running the application is needed for hotswapping to work.
+Don't start the application in “run” mode. The debug connection to the JVM running the application is needed for hotswapping to work.
 
-Don't launch the Maven `spring-boot:run` target as that forks another JVM process. The debug connection is then established only to the Maven process and not the actual application. Therefore, hotswapping won't work.
+Don't launch the Maven `spring-boot:run` target. That'll fork another JVM process. The debug connection is established only to the Maven process and not the actual application. Therefore, hotswapping won't work.
 ====
 
 
 == Efficiency
 
 By default, any change in the Java code causes the application to reload in the browser. This is convenient when you make changes to the initial layout, constructors, post construct methods or similar. However, if you're modifying the logic inside a listener, there's no need to do a page reload for the change to take effect. 
 
-You can turn off reloading in the Vaadin Copilot in the [guilabel]*Info* panel. It can be more efficient to disable live reload, and manually reload the browser when needed. This is especially recommended when editing code related to a dialog or some other UI part which isn't mapped directly to a URL.
+When using the Vaadin IntelliJ plugin, the Java file is compiled automatically on save. Otherwise, you might want to set IntelliJ to build the project when you save. You can do that through menu:Settings[Build, Execution, Deployment > Compiler > Build project automatically]. 
 
-IntelliJ doesn't by default compile a Java file when you save it. If your habit is to press the compile shortcut, hotswapping works fine. Otherwise, you might want to set IntelliJ to build the project when you save. You can do that through menu:Settings[Build, Execution, Deployment > Compiler > Build project automatically]. You'll also need to ensure that the build takes place when the application is running in debug mode. This is done through menu:Advanced Settings[Allow auto-make to start even if developed application is currently running]. Finally, through menu:Settings[Build, Execution, Deployment > Debugger > HotSwap], [guilabel]*Reload classes after compilation* should be set to [guilabel]*Always*.
+You'll also need to ensure that the build takes place when the application is running in debug mode. This is done through menu:Advanced Settings[Allow auto-make to start even if developed application is currently running]. Finally, through menu:Settings[Build, Execution, Deployment > Debugger > HotSwap], [guilabel]*Reload classes after compilation* should be set to [guilabel]*Always*.
 
 
 == Additional Considerations
 
-You should disable other reloading or hot swapping solutions. For example, disable the automatic restart in the Jetty Maven plugin if you're using it. Omit or set `<scanIntervalSeconds>` to a value of `0` or less.
+You should disable other reloading or hotswapping solutions. For example, disable the automatic restart in the Jetty Maven plugin if you're using it. Omit or set `<scanIntervalSeconds>` to a value of `0` or less.
 
-The live reload "quiet time" -- which is in milliseconds since the last Java change before refreshing the browser -- can be adjusted with the parameter `vaadin.liveReloadQuietTime` in the [filename]`hotswap-agent.properties` file. The default is 1000 ms. Increase this value if you notice the browser refreshing before modified Java files have been compiled fully.
+The live reload “quiet time” -- which is in milliseconds since the last Java change before refreshing the browser -- can be adjusted with the parameter `vaadin.liveReloadQuietTime` in the [filename]`hotswap-agent.properties` file. The default is 1000 ms. Increase this value if you notice the browser refreshing before modified Java files have been compiled fully.
 
 You should configure the Vaadin Hotswap plugin to watch only for application classes by setting the `vaadin.watched-packages` property in the [filename]`hotswap-agent.properties` file. This improves performance, and prevents unnecessary reloads by limiting the plugin's monitoring to relevant packages. The value given should be a comma-separated list of Java package names (e.g., `com.example.ui,com.example.endpoints`).
 
 Changes to some parts of the Java code, such application startup listeners, won't have any effect until the server is restarted and the startup listeners run again. For these, you need to restart the server.
 
-If you're using the <<{articles}/flow/advanced/preserving-state-on-refresh#,`@PreserveOnRefresh`>> annotation, the same view instance is reused when the browser is reloaded. That means changes aren't necessarily visible until the view is opened in another browser tab.
+If you're using the <</flow/advanced/preserving-state-on-refresh#,`@PreserveOnRefresh`>> annotation, the same view instance is reused when the browser is reloaded. That means changes aren't necessarily visible until the view is opened in another browser tab.
 
 [discussion-id]`403FEA6B-12A3-465C-9D6D-41DA902D9884`

articles/flow/configuration/live-reload/index.adoc

@@ -15,35 +15,43 @@ From a deployment and reloading point of view, there are two types of files in a
 
 Hot deploy and live reload are only used during development. They are disabled in production builds.
 
+
 == Frontend Changes
 
 Vaadin Flow uses a pre-built frontend bundle by default. The only frontend files that are handled by the fast live reload feature are the theme files in the `frontend/themes/<themename>` folder. Changes to these files are automatically picked up and the browser is reloaded. Changes to any other files inside the `frontend` folder cause a new frontend bundle to be built, a process which might take several minutes.
 
-If you need to actively develop the frontend files, you can enable the hot deploy mode (see <<{articles}/flow/configuration/properties#,Configuration Properties>>). In this mode all JavaScript, TypeScript, and CSS files inside the `frontend` folder are handled by the frontend build tool / bundler. Adding, modifying, or removing a file in this folder triggers a rebuild of the frontend resources and a browser reload.
+To develop the frontend files actively, you can enable the hot deploy mode (see <<{articles}/flow/configuration/properties#,Configuration Properties>>). In this mode, all JavaScript, TypeScript, and CSS files inside the `frontend` folder are handled by the frontend build tool and bundler. Adding, modifying, or removing a file in this folder triggers a rebuild of the frontend resources and a browser reload.
+
 
 == Java Changes
 
 Live reload handles Java classes and resources that are on the classpath.
 
-If you have a standard `war` project, and have resources in the `src/main/webapp` folder, then these files are typically updated and deployed automatically (they're copied inside the `target` folder) by your IDE when you change them. No automatic browser reload takes place when these files change.
+If you have a standard `war` project, and have resources in the `src/main/webapp` folder, these files are typically updated and deployed -- they're copied inside the `target` folder -- by your IDE when you change them. No automatic browser reload takes place when these files change.
 
 For changes to a Java class to be deployed, they need to be saved and compiled, typically by your IDE. After the IDE compiles the class and puts it inside the `target` folder, live reload kicks in. This can happen via Spring Boot Developer Tools (used by default in Vaadin starter projects), which restarts the server on classpath changes, or via JRebel or HotswapAgent, both of which replace the class on the fly without restarting the server. JRebel is a commercial product, while HotswapAgent is an open source solution.
 
 See the following sections for details on setting up the each of these options:
 
-** <<spring-boot#, Spring Boot Developer Tools>>
-** <<jrebel#, JRebel>>
-** <<hotswap-agent#, HotswapAgent>>
+- <<spring-boot#, Spring Boot Developer Tools>>
+- <<jrebel#, JRebel>>
+- <<hotswap-agent#, HotswapAgent>>
 
 Only one of these technologies should be configured in a project at a time. Otherwise you might experience slow reloads, no reloads, or multiple reloads. That said, Spring Boot Developer Tools is automatically disabled if JRebel or HotswapAgent is detected.
 
 In general, JRebel and HotswapAgent are faster as they only patch one class in memory, but some changes can't be hotswapped. This can be caused by, for example, global state which is created only on application startup and not updated when updating a single class. For most cases inside Vaadin where global state is handled, there are plugins to both JRebel and HotswapAgent so that hotswapping still works. There can still be cases which are not handled, either in Vaadin or in your application. For example, associating frontend resources to classes using `@JsModule` requires a server restart.
 
 The user session is also handled differently: as JRebel and HotswapAgent do not restart the server, the user session is preserved. With Spring Developer Tools, you lose the user session unless you ensure all parts are serializable and you turn on session serialization for development mode (see <<{articles}/flow/configuration/properties#,Configuration Properties>>).
 
+
 == Automatic Server Restart
 
 As an alternative to live reload, the Jetty and TomEE Maven plugins handle automatic server restart on Java class and resource changes. These plugins don't require you to install third-party tools, but server restarts are slower and the browser doesn't refresh automatically.
 
-** <<jetty#, Automatic Restart with Jetty Maven Plugin>>
-** <<cdi#, Automatic Restart with TomEE Maven Plugin>>
+- <<jetty#, Automatic Restart with Jetty Maven plugin>>
+- <<cdi#, Automatic Restart with TomEE Maven plugin>>
+
+
+== Vaadin Copilot & IDE Plugin
+
+Copilot provides the Development Workflow guide which helps to set up a development environment, including a hot swap solution.