DE | EN

SSH Connection and Website Creation

Ports and Their Availability

SSH connection is typically made through TCP port 22 by default. This port is often blocked by network administrators in public or insecure networks like Eduroam WiFi to minimize security risks. To bypass these restrictions and establish a secure SSH connection, you can use a connection via the pre-installed iMacs in our labs, which are configured for such connections.

Eduroam and similar networks often implement strict firewall settings that block unauthorized traffic, including the default SSH ports. This is a security measure to prevent unwanted access to the network and associated systems. Alternatively, you can establish a connection via a VPN to another network or through using your smartphone as a hotspot to bypass these restrictions.

Establishing an SSH Connection

To establish an SSH connection to our server, use the Terminal on macOS or Linux, or PuTTY on Windows. The username for the connection is the team name assigned to you by Mr. Franke or Mr. Müller. Here are the steps for both methods:

Connection with Terminal (macOS/Linux)

Shell 
ssh teamname@89.58.62.146

Make sure your private key is stored in the directory ~/.ssh/ on your local computer to establish the connection.

Connection with PuTTY (Windows)

Open PuTTY, enter the server IP '89.58.62.146', and the username corresponding to your team name. Make sure your private key is correctly loaded by loading it in PuTTY under 'SSH' -> 'Auth' -> 'Private key file for authentication'.

Navigation and File Management on the Server

After successfully connecting via SSH, you can use the command ls -a to get an overview of all files and directories in the current directory. This also displays hidden files (those starting with a dot), which is useful for viewing configuration files.

Shell 
ls -a

Now navigate to the web directory assigned to your team. In this example, the directory /var/www/isa1 is used:

Shell 
cd /var/www/isa1

Creating a File with Nano

Use the Nano editor to create an HTML file. Open a new file named index.html by entering the following command:

Shell 
nano index.html

In the index.html file, you can now insert the basic HTML code:

Shell 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Welcome to Our Landing Page</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>Welcome to our new website!</h1>
    <p>This page is an example of a simple landing page.</p>
    <script src="script.js"></script>
</body>
</html>

Save and close the file by pressing CTRL+O, followed by Enter, and then CTRL+X to exit Nano.

Task: Creating an Appealing Landing Page

After creating the main file index.html, your next task is to design an appealing landing page. This is to be done by adding two more files: style.css for styling and script.js for functionality.

1. Creating the CSS file: Use the command below to open the file style.css. Design the appearance of your webpage according to your preferences.

Shell 
nano style.css

2. Creating the JavaScript file: Open the file script.js with the following command and implement basic interactivity or dynamic elements to enhance your landing page.

Shell 
nano script.js

Use the resources available to you to create these files. Experiment with different designs and functionalities to develop a unique and appealing landing page.

Task: Introduction to Ubuntu Server, NGINX, and SSL

Briefly acquire a basic understanding of the Linux distribution Ubuntu Server, the web server NGINX, and SSL encryption. Ubuntu Server is a widely used Linux distribution for server environments, while NGINX serves as an efficient web server and reverse proxy. SSL (Secure Sockets Layer) secures internet connections through encryption.

Your tasks:

  1. Research what a Linux distribution is and why Ubuntu Server is particularly suitable for server environments.
  2. Learn more about the functions of NGINX and its role as a web server and reverse proxy.
  3. Explore the significance and mechanics of SSL for securing web communications.

Next Exercise Sheet