Merge pull request #473 from hpehl/WFLY-18428

WFLY-18428: Add get started page

_data/projectfooter.yml

@@ -7,6 +7,8 @@ links:
         url: /downloads
       - page: Docs
         url: https://docs.wildfly.org
+      - page: Get Started
+        url: /get-started
       - page: Github
         url: https://github.com/wildfly/wildfly
   - title: Contribute

_includes/header.html

@@ -6,12 +6,6 @@
     <nav>
       <div class="nav-mobile"><a id="nav-toggle" href="#!"><span></span></a></div>
       <ul class="nav-list">
-        <li>
-          <a href="{{site.baseurl}}/" class="{% if page.url == '/' %}active{% endif %}">Home</a>
-        </li>
-        <li>
-          <a href="{{site.baseurl}}/downloads/" class="{% if page.url contains '/downloads/' %}active{% endif %}">Downloads</a>
-        </li>
         <li>
           <a href="{{site.baseurl}}/news/" class="{% if page.url contains '/news/' %}active{% endif %}">News</a>
         </li>
@@ -24,11 +18,17 @@
         <li>
             <a target="_blank" href="https://docs.wildfly.org">Docs</a>
         </li>
+        <li>
+          <a href="{{site.baseurl}}/downloads/" class="{% if page.url contains '/downloads/' %}active{% endif %}">Downloads</a>
+        </li>
         <li>
           <a href="{{site.baseurl}}/security/" class="{% if page.url contains '/security/' %}active{% endif %}">CVE Reporting</a>
         </li>
         <li>
-          <a class="button-cta secondary" href="https://github.com/wildfly/wildfly/fork" target="_blank">Fork</a>
+          <a href="https://github.com/wildfly/wildfly/fork" target="_blank">Fork</a>
+        </li>
+        <li>
+          <a class="button-cta secondary {% if page.url contains '/get-started/' %}active{% endif %}" href="{{site.baseurl}}/get-started/">Get Started</a>
         </li>
       </ul>
     </nav>

_layouts/getstarted.html

@@ -0,0 +1,17 @@
+---
+layout: base
+---
+
+<div class="grid-wrapper getstarted-page">
+    <div class="grid__item width-12-12 width-12-12-mobile">
+        <h1 class="text-caps">{{page.title}} {{page.docversion}}</h1>
+    </div>
+    <div class="grid__item width-12-12 width-12-12-mobile">
+        <div>
+            {{ content }}
+        </div>
+    </div>
+    <div class="grid__item width-12-12 width-12-12-mobile">
+        <div>&lt; <a href="{{ site.baseurl }}/">Home</a></div>
+    </div>
+</div>

_layouts/index.html

@@ -6,12 +6,13 @@
   <div class="grid__item width-12-12 home-section">
 
     {% assign latestRelease = site.data.releases[site.current_release_index] %}
-    <h1>Wild<strong>Fly</strong> {{latestRelease.version_shortname}} is now available</h1>
+    <h1>Wild<strong>Fly</strong></h1>
+    <h2>A powerful, modular, & lightweight application server that helps you build amazing applications.</h2>
+    <h3>Now available: <span style="font-weight: 100;">Wild</span><strong>Fly</strong> {{latestRelease.version_shortname}}</h3>
     <div class="home-ctas">
-
+      <a href="{{site.baseurl}}/downloads/" class="button-cta secondary">Download Wild<strong>Fly</strong></a>
+      <a href="{{site.baseurl}}/get-started/" class="button-cta">Get Started</a>
       <a href="https://github.com/wildfly/wildfly/releases/download/{{latestRelease.version}}/wildfly-preview-{{latestRelease.version}}.zip" class="button-cta secondary">Try WildFly Preview</a>
-      <a href="https://github.com/wildfly/wildfly/releases/download/{{latestRelease.version}}/wildfly-{{latestRelease.version}}.zip" class="button-cta">Download the zip</a>
-      <a href="{{site.baseurl}}/downloads/" class="button-cta secondary">Other Versions</a>
     </div>
 
   </div>
@@ -26,8 +27,6 @@ <h1>Wild<strong>Fly</strong> {{latestRelease.version_shortname}} is now availabl
 
   <div class="grid__item width-12-12 home-section">
     <img class="home-img" src="{{site.baseurl}}/assets/img/homepage/homepage-screenshot.png">
-    <h2>Wild<strong>Fly</strong> is a powerful, modular, & lightweight application server that helps you
-build amazing applications.</h2>
   </div>
 
   <div class="grid__item width-12-12 home-section">

_sass/layouts/getstarted.scss

@@ -0,0 +1,3 @@
+.getstarted-page {
+  padding-bottom: 3rem;
+}

assets/css/main.scss

@@ -23,5 +23,6 @@ $content-width: 1000px;
 @import "layouts/news";
 @import "layouts/error-page";
 @import "layouts/contribute";
+@import "layouts/getstarted";
 @import "layouts/about";
 @import "layouts/post";

getstarted.adoc

@@ -0,0 +1,92 @@
+---
+layout: getstarted
+title: Get Started with WildFly
+permalink: /get-started/
+---
+:page-liquid:
+
+== Build and run a Jakarta EE application with WildFly in a few minutes.
+
+=== Step 0. Install Java & Maven
+
+You need Java (at least version `11`, and preferably `17`) and Maven installed on your machine to create a Maven project that contains the source code of the Jakarta EE application.
+
+You can verify they are installed by executing the commands:
+
+[source,bash]
+----
+java -version
+mvn -version
+----
+
+=== Step 1. Create the Application
+
+You can create the Jakarta EE application as a Maven project by executing the commands:
+
+[source,bash]
+----
+mvn archetype:generate \
+    -DarchetypeGroupId=org.wildfly.archetype \
+    -DarchetypeArtifactId=wildfly-getting-started-archetype
+----
+
+The `getting-started` project that is generated contains a simple "Hello World" application that
+exposes a HTTP endpoint with the Jakarta-RS API.
+
+The Maven project is configured to "provision" (install and configure)
+the WildFly that hosts your application.
+
+=== Step 2. Build the Application
+
+You can build the application by executing the commands:
+
+[source,bash]
+----
+cd getting-started
+mvn package verify
+----
+
+This Maven command compiles the Jakarta EE application, provisions WildFly, deploys the application into WildFly and
+runs integration tests against it.
+When this command is finished, you have a fully functional, tested application running on  WildFly.
+
+=== Step 3. Run the Application
+
+The `target/server` contains a fully functional WildFly server with your application. You start it by executing the command:
+
+[source,bash]
+----
+./target/server/bin/standalone.sh
+----
+
+The application is accessible at http://localhost:8080/.
+
+To stop the application, type `Ctrl + C` in the terminal where you started  WildFly.
+
+=== Step 4. Continuous Development
+
+You can develop your application and see the updates in the running application immediately by using the `wildfly:dev` goal from the root
+of your project:
+
+[source,bash]
+----
+mvn clean wildfly:dev
+----
+
+The application is accessible at http://localhost:8080 and will be continuously updated when its code changes.
+
+Open your favorite code editor and change the `hello` method in the `GettingStartedService.java` file:
+
+[source,java]
+----
+public String hello(String name) {
+  return String.format("Hello '%s'.", name.toUpperCase());
+}
+----
+
+Save the file and the application will be recompiled and updated in WildFly. If you access the application at http://localhost:8080,
+it will now return the name in upper case.
+
+== Next Steps
+
+To learn more about WildFly, you can read its https://docs.wildfly.org[documentation,window=_blank].