first Web1.0 update

web4x · Oct 18, 2023 · 8d582c0 · 8d582c0
1 parent 7cffc0e
commit 8d582c0
Show file tree

Hide file tree

Showing 14 changed files with 476 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -7,5 +7,32 @@ Start reading on the [Web4.x Wiki](https://github.com/web4x/codingWeb4/wiki/Web-
 
 ## GitHub Pages
 
+* [Configuring a publishing source for your GitHub Pages site](https://docs.github.com/en/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site)
+* GitHub Pages [REST API](https://docs.github.com/en/free-pro-team@latest/rest/pages/pages?apiVersion=2022-11-28#get-a-github-pages-site)
+
+
+### Web 1.0
 * [See your first Web 1.0 static web page](https://web4x.github.io/codingWeb4/Web1/static/)
+  * [Open the code](https://github.com/web4x/codingWeb4/blob/main/Web4university/Web1/static/index.htm)
 * See the deployment process under [Actions](https://github.com/web4x/codingWeb4/actions/)
+* See the [deployment process](https://github.com/web4x/codingWeb4/deployments/)
+
+### Web 2.0
+* [See your first Web 2.0 dynamic web page](https://web4x.github.io/codingWeb4/Web2/00.InTheBeginning/static)
+  * Inspect the page
+    * Chrome Devtools
+      * Elements Tab
+      * Source Tab
+        * [The HTML Page](https://web4x.github.io/codingWeb4/Web2/00.InTheBeginning/static/)
+        * [The JavaScriptCode](https://web4x.github.io/codingWeb4/Web2/00.InTheBeginning/js/jhwhScript.js)
+          * Add Breakpoints
+            * debugger; statement in Line 12
+            * Line 18
+
+
+## The magic of GitHub: press the "."-key
+
+and open "Visual Studio Code" just here in the your browser...
+opening this repository for editing.
+
+Looks already like Web4.x bu is still Web 2.x
diff --git a/Web4university/Web1/localhost/browser b/Web4university/Web1/localhost/browser
@@ -0,0 +1 @@
+../static/
diff --git a/Web4university/Web1/localhost/terminal/executable/interpreter b/Web4university/Web1/localhost/terminal/executable/interpreter
diff --git a/Web4university/Web1/localhost/terminal/shell/sh/first.sh b/Web4university/Web1/localhost/terminal/shell/sh/first.sh
@@ -0,0 +1 @@
+echo "a terminal message from your first.sh script"
diff --git a/Web4university/Web1/localhost/terminal/shell/sh/second.sh b/Web4university/Web1/localhost/terminal/shell/sh/second.sh
@@ -0,0 +1,56 @@
+#!/bin/sh
+
+echo "the so called shebang line assures that the script is run by the sh shell"
+echo "
+this is a multiline comment:
+it only ends with the next \"-charackter
+to prevent the comment to end above you need to quote the \"-character with a \-character
+
+otherwise the multilen terminal message will end"
+echo "
+
+that makes the terminal output much more readable.
+"
+
+echo "
+
+to print the current SETTINGS we have to check the shells ENVIONMENT VARIABLES.
+
+this can be done with the command: env
+
+it will printout all environment variables, that are currently set in the shell.
+================================================================================
+"
+
+env
+
+echo "
+================================================================================
+As you see they are not sorted and therefroe hard to read.
+
+to sort the variables we can use the command: sort
+
+and we have to PIPE the output of the env command to the sort command.
+This is done like this:
+
+    env | sort
+================================================================================
+"
+
+env | sort
+
+echo "
+================================================================================
+The script: third.sh 
+
+will ensure that the script is run in a clean environment withouth any environment variables set in the current shell.
+to call the script you have to type:
+
+    ./th [TAB]-key
+    
+then it should be completed to: 
+    
+    ./third.sh
+
+================================================================================
+"
diff --git a/Web4university/Web1/localhost/terminal/shell/sh/third.sh b/Web4university/Web1/localhost/terminal/shell/sh/third.sh
@@ -0,0 +1,42 @@
+#!/usr/bin/env -i /bin/sh
+
+echo "the so called shebang line assures that the script is run by the sh shell"
+echo "  the env -i ensures that the script is run in a clean environment"
+echo "     whatever environment variables are set in the current shell are not passed to this script"
+echo "
+this is a multiline comment:
+it only ends with the next \"-charackter
+to prevent the comment to end above you need to quote the \"-character with a \-character
+
+otherwise the multilen terminal message will end"
+echo "
+
+that makes the terminal output much more readable.
+"
+
+echo "
+
+to print the current SETTINGS we have to check the shells ENVIONMENT VARIABLES.
+
+this can be done with the command: env
+
+it will printout all environment variables, that are currently set in the shell.
+================================================================================
+"
+
+env
+
+echo "
+================================================================================
+As you see they are not sorted and therefroe hard to read.
+
+to sort the variables we can use the command: sort
+
+and we have to PIPE the output of the env command to the sort command.
+This is done like this:
+
+    env | sort
+================================================================================
+"
+
+env | sort
diff --git a/Web4university/Web1/static/01.elements/01.media/index.htm b/Web4university/Web1/static/01.elements/01.media/index.htm
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>learn HTML media usage</title>
+    <meta charset="utf-8">
+    <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <style type="text/css">
+
+    </style>
+</head>
+
+<body>
+
+        <h3>This section will show you multimedia</h3>
+        <p>HTML5 introduced a number of new elements for multimedia. 
+            The audio element is used for audio content. 
+            The video element is used for video content. 
+            The source element is used to specify the URL of the audio or video file. 
+            The track element is used to specify subtitles for the audio or video file.</p>
+        <audio controls>
+            <source src="https://www.w3schools.com/html/horse.ogg" type="audio/ogg">
+            <source src="https://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
+            Your browser does not support the audio element.
+        </audio>
+        <video controls>
+            <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
+            <source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
+            Your browser does not support the video element.
+        </video>
+        <h3>This section will show you iframes</h3>
+
+</body>
+
+</html>
diff --git a/Web4university/Web1/static/01.elements/02.forms/index.htm b/Web4university/Web1/static/01.elements/02.forms/index.htm
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>learn HTML Forms</title>
+    <meta charset="utf-8">
+    <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <style type="text/css">
+
+    </style>
+</head>
+
+<body>
+
+        <h3>This section will show you forms</h3>
+        <p>Forms are created with the form element. 
+            The action attribute is the URL of the page that will process the form. 
+            The method attribute is either get or post. 
+            The get method is used for forms that don't change anything on the server, 
+            for example a search form. 
+            The post method is used for forms that do change something on the server, 
+            for example a login form.</p>
+        <form action="https://www.google.com/search" method="get">
+            <input type="text" name="q">
+            <input type="submit" value="Search">
+        </form>
+
+        <h3>This section will show you forms with post method</h3>
+        The post method is used for forms that do change something on the server,
+        but in this case we will produce an error 405 because 
+        the server does not accept post requests.
+        <form action="https://www.google.com/search" method="post">
+            <input type="text" name="q">
+            <input type="submit" value="Search">
+        </form>
+
+</body>
+
+</html>
diff --git a/Web4university/Web1/static/01.elements/index.htm b/Web4university/Web1/static/01.elements/index.htm
@@ -0,0 +1 @@
+../learn.htm
diff --git a/Web4university/Web1/static/02.semanticStructure/index.htm b/Web4university/Web1/static/02.semanticStructure/index.htm
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>learn HTML semantics</title>
+    <meta charset="utf-8">
+    <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <style type="text/css">
+
+    </style>
+</head>
+
+<body>
+
+        <h3>This section will show you semantic elements</h3>
+        <p>HTML5 introduced a number of new elements that have a semantic meaning. 
+            Semantic elements are elements that have a meaning to the browser, 
+            and to screen readers for blind users. 
+            They are also useful for search engines to understand the structure of a page.</p>
+        <p>The header element is used for the header of a page or section.
+            The nav element is used for the navigation menu of a page.
+            The main element is used for the main content of a page.
+            The section element is used for a section of a page.
+            The article element is used for an article on a page.
+            The aside element is used for content that is not directly related to the main content of a page.
+            The footer element is used for the footer of a page or section.</p>
+        <header>
+            <h1>Header</h1>
+        </header>
+        <nav>
+            <h1>Navigation</h1>
+            <ul>
+                <li>Item 1</li>
+                <ul>
+                    <li>Item 1</li>
+                    <li>Item 2</li>
+                    <li>Item 3</li>
+                </ul>
+                <li>Item 2</li>
+                <ul>
+                    <li>Item 1</li>
+                    <li>Item 2</li>
+                    <ul>
+                        <li>Item 1</li>
+                        <li>Item 2</li>
+                        <li>Item 3</li>
+                    </ul>
+                    <li>Item 3</li>
+                </ul>
+                <li>Item 3</li>
+            </ul>
+        </nav>
+        <main>
+            <h1>Main content</h1>
+            <p>Without the appropiate styling, 
+                the semantic elements will not look any different from the headline elements.
+            </p>
+        </main>
+        <section>
+            <h1>Section</h1>
+        </section>
+        <article>
+            <h1>Article</h1>
+            write some nice story here
+        </article>
+
+        <footer>
+            <h1>Footer</h1>
+            Without the appropiate styling,
+            the will not be always at the end of the page...
+            <br>
+            Its just semantics...
+        </footer>
+
+        <aside>
+            <h1>Aside</h1>
+            Without the appropiate styling,
+            aside will not be aside the page...
+        </aside>
+
+
+
+</body>
+
+</html>
diff --git a/Web4university/Web1/static/index.htm b/Web4university/Web1/static/index.htm
@@ -1,6 +1,5 @@
 <!DOCTYPE html>
-<html onload="">
-    <script src="/EAMD.ucp/Components/tla/EAM/layer1/Thinglish/Once/2.3.2/src/js/Once.class.js" type="text/javascript"></script>
+<html>
 
 <head>
     <title>Your first Web 1.0 static page</title>
@@ -13,9 +12,12 @@
 <body>
     <h1>Hello my Friend!</h1>
     Nice to have you here...
-    <!--
-    <div class="center-bold">Drag and Drop Component to Load</div>
-    -->
+
+    <p>
+        Here you can <a href="learn.htm">learn</a> more HTML
+    </p>
+
+
 </body>
 
 </html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		echo "a terminal message from your first.sh script"