docs: push docs on release (#468)

GauBen · web-flow · commit 5fe56ec831dd · 2025-09-02T14:37:07.000+02:00
diff --git a/.github/workflows/push-docs.yml b/.github/workflows/push-docs.yml
@@ -0,0 +1,17 @@
+on:
+  release:
+    types: [published]
+  workflow_dispatch:
+
+jobs:
+  push-docs:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - uses: Jahia/github-to-academy@v1
+        with:
+          files: docs/**/*.md
+          graphql-endpoint: ${{ secrets.ACADEMY_ENDPOINT }}
+          graphql-authorization: ${{ secrets.ACADEMY_AUTHORIZATION }}
diff --git a/README.md b/README.md
@@ -4,7 +4,7 @@
 
 # Javascript Modules
 
-You want to build a JavaScript Module? [Read the documentation 📖](docs/)
+You want to build a JavaScript Module? [Read the documentation 📖](https://academy.jahia.com/tutorials-get-started/frontend-developer/introduction)
 
 This project is designed to support Javascript developers working with _Jahia_. It consists of two components:
 
diff --git a/docs/1-getting-started/0-introduction/README.md b/docs/1-getting-started/0-introduction/README.md
@@ -0,0 +1,22 @@
+---
+page:
+  $path: /sites/academy/home/get-started/front-end-developer/introduction
+  jcr:title: Introduction
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
+
+Welcome to the JavaScript Modules documentation!
+
+Currently in Beta, this technology is actively developed and the first stable version (v1) is scheduled for release in Autumn 2025. We actively support this new technology, and we consider it ready for production: you can build a production-ready Jahia website with JavaScript and React.
+
+It is considered Beta as Jahia UI extensions and OSGi interactions can only be written in Java for now, these features are not yet available to JavaScript modules.
+
+![JavaScript Modules Hello World](./hello-world.png)
+
+Here is what you would get within minutes. The code is written in React/JSX and made interactive on the client; Jahia is the first Java CMS to support [partial hydration/island architecture](https://www.jahia.com/blog/leveraging-the-island-architecture-in-jahia-cms) on the market.
+
+This documentation is meant for self-learning, but we also offer workshops and training sessions with our team. If you are interested in that, please [contact us.](https://www.jahia.com/contact)
+
+If you're still reading this and want to get started—for real—[let's dive in!](/cms/{mode}/{lang}/sites/academy/home/get-started/front-end-developer/setting-up-your-dev-environment.html)
diff --git a/docs/1-getting-started/0-introduction/hello-world.png b/docs/1-getting-started/0-introduction/hello-world.png
diff --git a/docs/1-getting-started/1-dev-environment/README.md b/docs/1-getting-started/1-dev-environment/README.md
@@ -1,4 +1,11 @@
-# Setting Up Your Dev Environment
+---
+page:
+  $path: /sites/academy/home/get-started/front-end-developer/setting-up-your-dev-environment
+  jcr:title: Setting Up Your Dev Environment
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
 
 This tutorial will guide you through the setup of your development environment to start a local Jahia instance and create a new project. We assume you have some familiarity with JavaScript and React, if that's not the case, we recommend you to follow a few tutorials to learn the basics:
 
@@ -96,4 +103,4 @@ Now that your _template set_ (that's how we call a module that provides page tem
 
 Congratulations! You have successfully set up your development environment and created a new project in Jahia. In the next sections, we'll start building the project.
 
-Next: [Making a Hero Section](../2-making-a-hero-section/)
+Next: [Making a Hero Section](making-a-hero-section)
diff --git a/docs/1-getting-started/2-making-a-hero-section/README.md b/docs/1-getting-started/2-making-a-hero-section/README.md
@@ -1,4 +1,11 @@
-# Making a Hero Section
+---
+page:
+  $path: /sites/academy/home/get-started/front-end-developer/making-a-hero-section
+  jcr:title: Making a Hero Section
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
 
 In this section, we'll create a hero section for our website. A hero section is a large, full-width section at the top of a page. It usually contains a title, a subtitle, and a background image.
 
@@ -264,4 +271,4 @@ You can add as many CTAs as you want to your hero section. This is why we haven'
 > For instance, you should be able to find the content you created at the `sites/<site key>/home/main` path.
 > It can be useful to remove buggy nodes or to understand how your data is persisted.
 
-Next: [The "About Us" Page](../3-the-about-us-page/)
+Next: [The "About Us" Page](the-about-us-page)
diff --git a/docs/1-getting-started/3-the-about-us-page/README.md b/docs/1-getting-started/3-the-about-us-page/README.md
@@ -1,4 +1,11 @@
-# The "About Us" Page
+---
+page:
+  $path: /sites/academy/home/get-started/front-end-developer/the-about-us-page
+  jcr:title: The "About Us" Page
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
 
 Our homepage is based on a "basic" layout: take a look at `src/templates/Page/basic.server.tsx`. It's a single column layout defined by an `<Area>` without any constraints. If a user wants to place many Hero sections on the page, they can do it. Most websites have a slightly more controlled layout: a navbar, a title, a footer, optional sidebars, etc. In this section, we'll create a page layout that suits a typical "About Us" page.
 
@@ -263,4 +270,4 @@ Try adding a few links to the footer that should be created at the end of the `s
 
 If you create another page with **Single column**, you should be able to create a new Hero section, but the footer will be the same as the one on the "About Us" page.
 
-Next: [Making a Blog](../4-making-a-blog/)
+Next: [Making a Blog](making-a-blog)
diff --git a/docs/1-getting-started/4-making-a-blog/README.md b/docs/1-getting-started/4-making-a-blog/README.md
@@ -1,4 +1,11 @@
-# Making a Blog
+---
+page:
+  $path: /sites/academy/home/get-started/front-end-developer/making-a-blog
+  jcr:title: Making a Blog
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
 
 So far we only considered contributing pages visually, directly in Page Builder. This is great for individual, unique pages but it's not the best way to manage a blog. In a blog, you want all your articles to have the same structure and style, and you want to be able to manage them all in one place.
 
@@ -205,4 +212,4 @@ We used `currentResource.getLocale().toString()` to get the locale of the curren
 
 There are a lot of things to discover about JCR queries, as it allows you to query, filter, order and paginate contents in a tree-like structure. You can find more information in the [Jahia documentation](https://academy.jahia.com/documentation/jahia-cms/jahia-8.2/developer/leveraging-jahia-backend-capabilities/jcrsql2-query-cheat-sheet).
 
-Next: [View Content in Full Page](../5-view-content-in-full-page/)
+Next: [View Content in Full Page](view-content-in-full-page)
diff --git a/docs/1-getting-started/5-view-content-in-full-page/README.md b/docs/1-getting-started/5-view-content-in-full-page/README.md
@@ -1,4 +1,11 @@
-# View Content in Full Page
+---
+page:
+  $path: /sites/academy/home/get-started/front-end-developer/view-content-in-full-page
+  jcr:title: View Content in Full Page
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
 
 The goal of this section is to render a full-page view of a content node. We'll continue with our blog example, and instead of a 404 page, we'll create a page to display a single blog post.
 
@@ -141,4 +148,4 @@ In JCR, everything is a node, i.e. an entity of a tree designated by a path. The
 
 There is a lot more to learn about URL building and JCR exploration, and it's the topic of the next section.
 
-Next: [Building a Navigation Bar](../6-building-a-nav-bar/)
+Next: [Building a Navigation Bar](building-a-nav-bar)
diff --git a/docs/1-getting-started/6-building-a-nav-bar/README.md b/docs/1-getting-started/6-building-a-nav-bar/README.md
@@ -1,4 +1,11 @@
-# Building a Navigation Bar
+---
+page:
+  $path: /sites/academy/home/get-started/front-end-developer/building-a-navigation-bar
+  jcr:title: Building a Navigation Bar
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
 
 A navigation bar is a common component in web development. It allows users to navigate between different pages of a website. In this section, we will build a navigation bar for our blog site.
 
diff --git a/docs/1-getting-started/README.md b/docs/1-getting-started/README.md
diff --git a/docs/2-guides/1-building-a-feedback-form/README.md b/docs/2-guides/1-building-a-feedback-form/README.md
@@ -1,12 +1,19 @@
-# Building a Feedback Form
+---
+page:
+  $path: /sites/academy/home/documentation/jahia/8_2/developer/javascript-module-development/building-a-feedback-form
+  jcr:title: Building a Feedback Form
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
 
 The goal of this self-contained guide is to create a feedback form that uses client-side JavaScript to send data to a server. This first half will be about building the form, the second half about collecting the data on the server with jCustomer.
 
 We will build something very similar to the widget that can be found on many documentation websites:
 
 ![Sample Feedback Forms](./samples.png)
 
-This guide assumes you have followed the [Getting Started](../1-getting-started/1-dev-environment/) guide and have a working Jahia instance with a JavaScript Module running on it. If you haven't done so, please follow the instructions in that guide before continuing.
+This guide assumes you have followed the [Getting Started](/cms/{mode}/{lang}/sites/academy/home/get-started/front-end-developer/introduction.html) guide and have a working Jahia instance with a JavaScript Module running on it. If you haven't done so, please follow the instructions in that guide before continuing.
 
 ## Client-Side JavaScript
 
@@ -369,5 +376,3 @@ You will get a `.ndjson` file that contains the dashboard and all the visualizat
 Now, when your module is deployed, the dashboard will be automatically imported into Jahia. You can check that it works by deploying your module to a new Jahia instance and checking that the dashboard is available in the jExperience tab.
 
 This is it for this guide! We hope you enjoyed it and found it useful. If you have any questions or feedback, please let us know on [GitHub](https://github.com/Jahia/javascript-modules/issues/new?template=other.md).
-
-[Back to Guides](../..)
diff --git a/docs/2-guides/2-island-architecture/README.md b/docs/2-guides/2-island-architecture/README.md
@@ -1,6 +1,13 @@
-# Island Architecture
-
-Jahia JavaScript Modules offers a first-class support for this architectural pattern, allowing interactivity without compromising on performance.
+---
+page:
+  $path: /sites/academy/home/documentation/jahia/8_2/developer/javascript-module-development/client-side-javascript
+  jcr:title: Island Architure
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
+
+Jahia JavaScript Modules offers a first-class support for the Island Architecture pattern, allowing interactivity without compromising on performance.
 
 ## What is Island Architecture?
 
diff --git a/docs/2-guides/README.md b/docs/2-guides/README.md
diff --git a/docs/3-reference/1-cnd-format/README.md b/docs/3-reference/1-cnd-format/README.md
@@ -1,3 +1,5 @@
+<!-- too incomplete to publish on the academy -->
+
 # CND file format
 
 CND, which stands for "Compact Node Definition", is a file format used to define node types in Jackrabbit, the storage layer of Jahia. It is a simple and human-readable format that allows you to define node types and their properties, child nodes, and mixins.
diff --git a/docs/3-reference/2-naming-conventions/README.md b/docs/3-reference/2-naming-conventions/README.md
@@ -0,0 +1,7 @@
+# Naming Conventions
+
+The JavaScript Modules engine does not enforce any naming conventions, but we recommend you follow the following guidelines to ensure a maximum compatibility with the rest of the Jahia ecosystem:
+
+- .client.tsx files
+- .server.tsx files
+- fullPage view
diff --git a/docs/3-reference/README.md b/docs/3-reference/README.md
diff --git a/docs/README.md b/docs/README.md
@@ -1,61 +1,16 @@
-# JavaScript Modules documentation
-
-Welcome to this documentation!
-
-We are pleased to have you here; we have been working on JavaScript Modules for Jahia for a while now and we are thrilled to share them with the world. If you are reading this, chances are you want to **build a website in React, with Jahia.** In case this assumption is wrong, here are some other resources that might be more relevant to you:
-
-- If you are a Java developer, we have [a similar tutorial for you, but with Java and JSP.](https://academy.jahia.com/tutorials-get-started/java-developers/running-the-docker-image)
-- If you are not a developer at all, we have [an Editors-Marketers getting started guide.](https://academy.jahia.com/tutorials-get-started/editorsmarketers/adding-a-new-page)
-
-This documentation is meant for self-learning, but we also offer workshops and training sessions with our team. If you are interested in that, please [contact us.](https://www.jahia.com/contact)
-
-If you're still reading this and want to get started—for real—let's dive in!
-
-> [!IMPORTANT]
-> This documentation is still in writing and some parts might be incomplete or missing. We are working hard to provide you with the best possible content. If you have any feedback or suggestions, [please let us know!](https://github.com/Jahia/javascript-modules/issues/new?template=other.md)
-
-## Getting started
-
-The goal of this section is to help you create a Jahia website with React and JavaScript from scratch. This a learn-by-doing tutorial that guides you through the integration of a Jahia website.
-
-Start here: [Setting up your dev environment](./1-getting-started/1-dev-environment/)
-
-## Guides
-
-This section contains independent, self-contained guides that help you build specific features or solve specific problems. Each guide is a step-by-step tutorial that you can follow to achieve a specific goal.
-
-- [Building a Feedback Form](./2-guides/1-building-a-feedback-form/)
-- [Island Architecture](./2-guides/2-island-architecture/)
-
-<!-- Hidden until available:
-- [Accessibility and Performance](./2-guides/2-accessibility-and-performance/)
-- [Building a Menu and Sitemap](./2-guides/3-building-a-menu-and-sitemap/)
-- [Adding Icons](./2-guides/4-adding-icons/)
-- [Adding Tailwind](./2-guides/5-adding-tailwind/)
-- [Building for Production](./2-guides/6-building-for-production/)
-- [Rendering Markdown](./2-guides/7-rendering-markdown/)
-- [RSS Feed](./2-guides/8-rss-feed/)
-- [Debugging](./2-guides/9-debugging/)
-- [Using Web Components](./2-guides/A-using-web-components/)
-
--->
-
-More guides are coming soon, and contributions are welcome!
-
-## Reference
-
-This section is meant to give an exhaustive overview of the features and concepts of JavaScript Modules. It is a reference guide that you can use to look up specific information or deepen your understanding of a particular topic.
-
-- [CND format](./3-reference/1-cnd-format/)
-
-<!-- Hidden until available:
-- [Tools](./3-reference/2-tools/)
-- [JCR](./3-reference/3-jcr/)
-- [Mixins](./3-reference/4-mixins/)
-- [Children and Area](./3-reference/5-children-and-area/)
-- [Nav Builder](./3-reference/6-nav-builder/)
-- [UI Extensions](./3-reference/7-ui-extensions/)
-- [Single Directory Components and Resources](./3-reference/8-single-directory-components-and-resources/)
-- [Java Interoperability](./3-reference/9-java-interoperability/)
-- [SSR and Hydration](./3-reference/A-ssr-and-hydration/)
--->
+---
+page:
+  $path: /sites/academy/home/get-started/tutorials-home
+  jcr:title: Tutorials Home
+  j:templateName: documentation
+content:
+  $subpath: page-area/content
+---
+
+Depending on who you are, you'll get started with Jahia in different ways.
+
+- If you are a front-end developer, you can go straight to our [JavaScript modules guide.](/cms/{mode}/{lang}/sites/academy/home/get-started/front-end-developer/introduction.html) 
+- If you are a Java developer, we have [a tutorial for you, with Java and JSP.](/cms/{mode}/{lang}/sites/academy/home/get-started/java-developers/running-the-docker-image.html)
+- If you are not a developer at all, we have [an Editors-Marketers getting started guide.](/cms/{mode}/{lang}/sites/academy/home/get-started/editors-marketers/adding-a-new-page.html)
+
+This documentation is meant for self-learning, but we also offer workshops and training sessions with our team. If you are interested in that, please [contact us.](https://www.jahia.com/contact)
diff --git a/javascript-create-module/README.md b/javascript-create-module/README.md
@@ -12,4 +12,4 @@ npm init @jahia/module@latest <module-name>
 
 It creates a new JavaScript Module in a directory named `module-name` in the current working directory.
 
-See the [Getting Started guide](https://github.com/Jahia/javascript-modules/tree/main/docs/1-getting-started/1-dev-environment#create-a-new-project) for more information.
+See the [Getting Started guide](https://academy.jahia.com/tutorials-get-started/front-end-developer/setting-up-your-dev-environment#create-a-new-project) for more information.
diff --git a/javascript-create-module/templates/module/README.md b/javascript-create-module/templates/module/README.md
@@ -1,8 +1,8 @@
 # Welcome!
 
-Your JavaScript module was successfully created. If this is your first time creating a module, you may want to consult the [Getting Started guide](https://github.com/Jahia/javascript-modules/tree/main/docs/1-getting-started/1-dev-environment#create-a-new-project).
+Your JavaScript module was successfully created. If this is your first time creating a module, you may want to consult the [Getting Started guide](https://academy.jahia.com/tutorials-get-started/front-end-developer/setting-up-your-dev-environment#create-a-new-project).
 
-This README assumes you have a working development environment with Node.js, Yarn and Docker installed and configured. Please refer to the [Getting Started](https://github.com/Jahia/javascript-modules/tree/main/docs/1-getting-started/1-dev-environment#pre-requisites) guide if you need help setting up your environment.
+This README assumes you have a working development environment with Node.js, Yarn and Docker installed and configured. Please refer to the [Getting Started](https://academy.jahia.com/tutorials-get-started/front-end-developer/setting-up-your-dev-environment) guide if you need help setting up your environment.
 
 ## Getting Started
 
diff --git a/samples/README.md b/samples/README.md
@@ -1,10 +1,10 @@
 # Samples
 
-Hydrogen is a sample project that contains a JavaScript module with a pre-configured site. It is the result of the [Getting Started tutorial](https://github.com/Jahia/javascript-modules/tree/main/docs/1-getting-started).
+Hydrogen is a sample project that contains a JavaScript module with a pre-configured site. It is the result of the [Getting Started tutorial](https://academy.jahia.com/tutorials-get-started/front-end-developer/setting-up-your-dev-environment#create-a-new-project).
 
 You can test it by following those steps:
 
-1. Make sure you meet [the pre-requisites](https://github.com/Jahia/javascript-modules/tree/main/docs/1-getting-started/1-dev-environment#pre-requisites)
+1. Make sure you meet [the pre-requisites](https://academy.jahia.com/tutorials-get-started/front-end-developer/setting-up-your-dev-environment)
 2. Start a Jahia instance using Docker:
 
 ```
