Merge branch 'main' of github.com:graduta/webui-workshop into solutio…

…n/frontend-backend-development
graduta · Nov 21, 2023 · 929f4da · 929f4da
2 parents 5cefa53 + 9ebcfc3
commit 929f4da
Show file tree

Hide file tree

Showing 11 changed files with 28 additions and 214 deletions.
diff --git a/0-Introductory-Exercises/index.js b/0-Introductory-Exercises/index.js
diff --git a/2-3-4-Exercises/public/index.html b/2-3-4-Exercises/public/index.html
@@ -1,31 +1,9 @@
 <!doctype html>
-<title>WebUI Workshop - 2020</title>
+<script src="./index.js" type="module"></script>
+
+<title>WebUI Workshop - 2023</title>
 <meta name="description" content="Control interface of Alice O2">
+
 <link rel="stylesheet" href="/css/src/bootstrap.css">
 <link rel="stylesheet" href="/app.css">
-<script src="/js/src/compatibility.js"></script>
-
-<!-- Load the session service, parses variables provided by server in the query -->
-<script type="module">
-import sessionService from '/js/src/sessionService.js';
-sessionService.loadAndHideParameters();
-
-// Expose sessionService to interact with it the browser's console
-window.sessionService = sessionService;
-</script>
-
-<!-- Main application controller -->
-<script type="module">
-// Import MVC
-import {mount} from '/js/src/index.js';
-import view from './view.js';
-import Model from './Model.js';
-
-// Start application
-const model = new Model();
-const debug = true; // shows when redraw is done
-mount(document.body, view, model, debug);
 
-// Expose model to interact with it the browser's console
-window.model = model;
-</script>
diff --git a/2-3-4-Exercises/public/index.js b/2-3-4-Exercises/public/index.js
@@ -0,0 +1,15 @@
+import sessionService from '/js/src/sessionService.js';
+import {mount} from '/js/src/index.js';
+import view from './view.js';
+import Model from './Model.js';
+
+sessionService.loadAndHideParameters();
+window.sessionService = sessionService;
+
+// Start application
+const model = new Model();
+const debug = true; // shows when redraw is done
+mount(document.body, view, model, debug);
+
+// Expose model to interact with it the browser's console
+window.model = model;
diff --git a/2-3-4-Exercises/public/view.js b/2-3-4-Exercises/public/view.js
@@ -1,6 +1,7 @@
 import {h, switchCase} from '/js/src/index.js';
 import homeContent from './home/homePage.js';
 import aboutContent from './about/aboutPage.js';
+
 /**
  * Main view layout
  * @param {object} model - representing current application state

diff --git a/README.md b/README.md
@@ -54,6 +54,8 @@ All applications are built as SPAs (Single Page Applications). A single-page app
 * [Scaling your application](https://github.com/AliceO2Group/WebUi/blob/dev/Framework/docs/guide/scale-app.md)
 * Set of [CSS](https://aliceo2group.github.io/WebUi/Framework/docs/reference/frontend-css.html) Components built in accordance with ALICE Standards. 
 
+Before starting the exercises, fork the repository and clone your fork locally.
+
 ## 1. [Introductory NodeJS Exercises](./docs/INTRODUCTORY_EXERCISES.md)
 ## 2. [Setting up the project template locally](./docs/SETUP_WEBUI_TEMPLATE.md)
 ## 3. [Front-End Exercises](docs/WORKSHOP_FRONTEND.md)

diff --git a/docs/INTRODUCTORY_EXERCISES.md b/docs/INTRODUCTORY_EXERCISES.md
@@ -1,10 +1,14 @@
 # Introductory NodeJS exercises
 
-### 0. Helpful links
+### 0. Setup and Helpful links
 - https://github.com/AliceO2Group/WebUi/tree/dev/Framework#backend-guide
 - https://expressjs.com/en/api.html#req
 - https://expressjs.com/en/api.html#res
 
+1. Fork the repository and clone your forked version locally.
+2. Go to the directory of the project: `cd webui-workshop/0-Introductory-Exercises`
+3. Install the project dependencies via: `npm ci`. More dependencies will be installed during the exercises
+
 ### 1. Deploy a WebUI HTTP Server
 By making use of `@aliceo2/webui` library, use the provided HTTP server to deploy a:
 - static `Hello World` HTML page.

diff --git a/docs/SETUP_WEBUI_TEMPLATE.md b/docs/SETUP_WEBUI_TEMPLATE.md
@@ -1,6 +1,5 @@
-1. Clone the repository via HTTPS/SSH (https://github.com/graduta/webui-workshop)
+1. Fork the repository and clone your forked version locally.
 2. Go to the directory of the project: `cd webui-workshop`
-3. Create your own branch: `git checkout -b <your-username/branch-name>`
 4. Install the project dependencies via: `npm ci`. More dependencies will be installed during the exercises
 5. Copy the configuration file: `cp config-default.js config.js`
 6. Run: `node index.js`

diff --git a/index.js b/index.js
diff --git a/package.json b/package.json
diff --git a/public/Model.js b/public/Model.js
diff --git a/public/view.js b/public/view.js