Table of Contents

24.6.2.1 Project 1

If you create a new Gambas project as a Gambas web application, for example with the project name 'webapp1', then select the project type “Web application” based on the class 'Webpage'. This has the advantage for getting started that the (HTML) file Main.webpage already provides you with a sample webpage for initial experiments.

Note: When you create a new webpage file, an empty (Gambas class) file with the same name but with the extension 'class' is automatically created. To see this class in the IDE, you must first activate the display of classes with 'Show form classes' [C] in the menu above the project structure. You can then view the class by clicking on the '>' symbol and display the content by clicking on the class name.

You can freely select the (parent) directory for the project in the home directory.

In the editor in the IDE, the insertion of Gambas source code into the HTML source code according to the webpage syntax described in chapter '24.6.2.0 Webpage class' is clearly recognisable because it is highlighted in bright yellow.

24.6.2.1.1 HTML source text

You should change the original content of the Main.webpage file in the `webapp1` project as follows 

<!-- The declaration of Gambas variables must be done before the output of HTML! -->
<%
'-- Definition of the variable (name,type)
    Dim sEnvironment As String
%>
<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8">
    <title>Umgebungsvariablen</title>
  </head>
  <!-- Option: Structure the following HTML source code -->
  <body>
    <h1>Gambas Web-Applikation</h1>
    <table>
      <tr>
        <th>Umgebungsvariable</th>
        <th>Wert</th>
      </tr>
      <%For Each sEnvironment In Env%>
        <tr>
          <td><%=sEnvironment%></td>
          <td><%=Env[sEnvironment]%></td>
        </tr>
      <%Next%>
    </table>
  </body>
</html>

You should note a few special features:

24.6.2.1.2 Displaying the generated HTML source text

After starting in the IDE with F5, the Render() method is called internally. The complete HTML of the web page is displayed in the console of the IDE (!). The values of the system's environment variables are displayed here in a table with 2 columns.

Here is an excerpt from the text in the console of the IDE at the author: 

<html>
  <body>
    <h1>Gambas Web-Applikation</h1>
    <table>
      <tr>
        <th>Umgebungsvariable</th>
        <th>Wert</th>
      </tr>
      <tr>
        <td>LANGUAGE</td>
        <td>de_DE.UTF-8</td>
      </tr>
      ...
      <tr>
        <td>DESKTOP_SESSION</td>
        <td>cinnamon</td>
      </tr>
      ...
    </table>
  </body>
</html>

You can save this complete HTML source text with the Webpage.ToString() function in a variable, for example, or save it in an HTML file.

Download

Project


Project 1 - `webapp1`

Download