Update Live reload configuration page to include Copilot

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

@@ -12,36 +12,50 @@ JetBrains Runtime offers hotswapping of any type of Java changes into a running
 
 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
+
+Depending on your project and the IDE used, Copilot can download the proper version of JDK and suggest a Vaadin plugin for your IDE.
+
+When debugging applications using *Debug using HotSwap Agent* from Vaadin IDE, the plugin checks if you're using the proper JDK, if HotSwap Agent is available, and applies additional required JVM arguments.
+
+Vaadin IDE Plugin also provides a *Compile on save* option, which can be enabled in the IDE settings. This may differ depending on your IDE.
+
+
+== 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.
 
+All of the above can be done automatically using Vaadin Copilot together with Vaadin IDE Plugin.
+
 
-== 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 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 the application, you'll need to 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 would launch the application by running the `main()` method of your application class. After you've launched it once, you'll have a run the configuration. You can edit it first 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, you'll 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`.
 
 If you have another type of application, you'll need to pass the JVM options in the appropriate way.
 
@@ -55,24 +69,24 @@ HOTSWAP AGENT: 10:19:01.802 INFO (org.hotswap.agent.HotswapAgent) - Loading Hots
 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 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 forks 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 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

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.