DEV Community: Dominik Rusac

Modern desk setup for developers in 2020

Dominik Rusac — Wed, 25 Nov 2020 12:36:29 +0000

I spent a lot of time looking at different pieces of IT equipment and how to connect them most efficiently for everyday use. Every developer prefers their own type of desk setup. Some developers find one laptop enough while others like a multi-monitor setup with laptop or desktop PC. I prefer a laptop with two extra monitors while I work in the office because I find that as my perfect desk setup.

You are asking why this is my perfect setup? On two big screens, I can do the main work while I am using the 3rd screen (laptop) as an additional helping screen. I use my main screen in the middle and that’s where I write the code while my second screen on the left is showing the result of the code I wrote on my main screen. Also I use my left screen for browsing the internet and reading the documentation.

The laptop is on my right and depending on what I'm doing at the moment, there is usually Slack, Insomnia or Chrome DevTools opened if I am doing some JavaScript. Sometimes I think it would be nice to have a 4th screen for browsing MySQL database in phpmyadmin but I’m fine for now. 😄

What would be the best way to connect every piece of hardware to a laptop?

Content:

Efficient connection with peripherals
Today's laptops...
Why Type-C?
How? What are the requirements?
What about the second monitor?
Possible problems and solutions
Which monitor and how many?
Laptop specifications?
Keyboard and mouse
Conclusion

Efficient connection with peripherals

For sure, there also must be a headset, separate keyboard and mouse connected to my laptop. All of that must be connected with the minimum number of cables. The desk needs to be as clean as possible with the ability to quickly connect and start working.

When I need to take my laptop to a meeting, I don’t want to have to disconnect a lot of cables from my laptop, and when I get back on my desk reconnect all the cables back. That’s inefficient and annoying. I needed to come up with the perfect solution on how to connect all peripherals and two extra monitors to a laptop using as few cables as possible.

A lot of questions came up, but the final, perfect solution was found. Connect everything together using a single Thunderbolt 3 / Type-C cable. Type-C is the perfect solution for my problem and probably for yours too. When I get back to my desk after the meeting, plugging in one cable instantly connects the headset, keyboard, mouse, two monitors and power to my laptop and my desk is usable in a second! Isn’t that nice? I love it. To achieve that level of connectivity, your equipment must support it.

Today's laptops...

Many modern laptops have fewer connectivity options than older laptops. Few years ago, laptops had VGA, HDMI and Display port built-in, so you could easily connect multiple monitors using a few cables. Today that's not the case. For example, the new Apple Macbook has only 4 ports and they are all the same - Type-C/Thunderbolt which means no VGA, HDMI or Display port connectivity.

I found out that's also the case with other brands, the more expensive the laptop is the fewer ports it has. That’s a little bit odd, don’t you think? It is, but the premium laptop has premium connectivity ports, and the premium connectivity port today is Type-C / Thunderbolt port.

Why Type-C?

On cheap laptops, you’ll hardly find a Type-C/Thunderbolt port. Cheaper non-premium laptops still have some ports for connecting to external displays, most common today are HDMI and DisplayPort. Connecting through these you can get video and audio to your monitor, but you still need to connect the keyboard and mouse to your laptop via USB. And also you need your laptop charger plugged in. That’s like 4 cables already connected to a laptop which is really messy. So how can we fix that? Type-C to the rescue!

Type-C can do all that through one cable. Yes, you read that correctly. To achieve that, it is required to have a Type-C supported monitor. Once your laptop is connected to your monitor via Type-C cable, you can connect all of your peripherals to that monitor. Through the monitor everything is connected to a laptop via single Type-C cable. Boy, that’s clean!

How? What are the requirements?

To be able to connect your setup this way, your hardware must support it. For sure, you must have Type-C/Thunderbolt port on your laptop and at least one Type-C external monitor.

When you buy a Type-C monitor you should also get a Type-C cable in the box, at least that’s the case with Dell’s monitors. You should use that cable to connect your laptop to the monitor. Once connected, since the monitor has a 3.5 audio jack and multiple USB ports, you can easily connect your headset, mouse, keyboard, smartphone and all other devices you use to your monitor. All of that is instantly connected to your laptop through the single Type-C cable.

Another great thing about Type-C is that you don’t need to use your laptop charger because the monitor provides power to your laptop through the same Type-C cable. Single Type-C cable carries power, data, display and audio all at once. How awesome is that?

What about the second monitor?

Now we have connected one monitor, keyboard, mouse and headset to our laptop using only one cable. How to connect the second monitor to our setup? It’s pretty simple as long as your monitor supports MST (Multi-Stream Transport), also known as Daisy Chaining. If your monitor has one display port input (DP IN) and one display port output (DP OUT) that means your monitor supports MST/Daisy Chain, but to be sure take a closer look into monitor specifications.

The first monitor your laptop is connected to via Type-C cable should support MST/Daisy Chain. You simply use a display port cable to connect the first monitor to your second monitor. In the first monitor (the one connected to laptop via Type-C), plug your display port cable in DP OUT and on the second monitor plug that same display port cable in DP IN port. You got two monitors connected to your laptop all together with all of your peripherals that go into your laptop through one single Type-C cable. Let me repeat, ONE cable!

Possible problems and solutions

If you don’t get a picture on some of your monitors, first make sure the proper input source is set up in the monitor settings. The first monitor input source must be set on “Type-C” while the second monitor input source must be set on “Display port”.

Also, MST must be turned on in your first monitor settings so you are able to get a picture on the second display. If you still have problems after that make sure you are using DP v1.2 cable or newer. If you don’t get a picture even on the first monitor, try to use higher quality Type-C cable. Not every Type-C cable is gonna work, but the cable that comes in a box with a monitor should always work.

Which monitor and how many?

The number of monitors mostly depends on what you prefer and how you work. The more monitors you have, the more space you have to work on without minimizing the windows all the time. That way it’s faster and easier to work and because of that you are more efficient and you make more money! 💵

While choosing the new monitor, make sure it supports MST/Daisy Chaining and Type-C connectivity. Dell has a lot of nice Type-C monitors, for example, U2419HC is the one that supports everything you need to connect to the laptop the way I described. Look for letter “C” in the model name to be sure it supports Type-C connectivity. Also make sure that monitor has sufficient USB ports on the back and audio jack for connecting headphones.

I wouldn’t recommend a monitor sized under 24-inches, if possible go with a 27-inch with a 2K resolution. Full HD is fine on a 24-inch, but on a 27-inch monitor it’s not that good. IPS panel type would probably be the best, also VA is fine except for some lower viewing angles, as long as you sit in front of it, it will be fine and will probably have a better contrast.

Laptop specifications

Always look for the best laptop your money can buy. Don’t buy the first laptop you see, do your research. I recommend a configuration with at least 12 GB RAM (don’t go under 8 GB) and Intel i5 CPU. A dedicated GPU is a plus but not required. SSD is a must with a capacity of 250/500 GB. Make sure it has at least one Type-C/Thunderbolt port, other ports like USB Type A and audio jack are welcome.

The ideal screen size for a laptop would be 14” because it’s in the perfect middle of 13” and 15” laptop screens. I left out 17” laptops because they are too big and heavy to carry around. I wouldn’t mind a 13” laptop as long as I am using two external monitors with it. Still, 14” seems ideal with of course Full HD resolution or better.

A bigger battery means longer battery life and battery life is important. Look for around 50-60 Wh battery which should get you through the day. High quality keyboard and touchpad is also a thing you should worry about - you don't want laggy touchpad or squeaky keyboard. Overall laptop build quality is better the more money you spend. Also, you will pay more for a thinner and lighter laptop.

Keyboard and mouse

This mostly depends on your preferences and budget. Whether you want classic, mechanical, small size (tenkeyless) or a full size keyboard. I currently use Logitech K280 wired keyboard which is fine but... I am looking at you Logitech MX keys.

I use Logitech G502 wired mouse and I find it almost perfect, it has all the extra buttons I need. There is also an even better G502 Lightspeed which is practically identical but wireless. You could pair your wireless mouse with wireless charging mousepad so you don't need to worry about the battery.

Choose what suits you best and go wireless for an even cleaner desk setup!

Conclusion

A desk that makes you comfortable and suits your needs is a productive desk. Make sure you organize it the way you want as this will lead you to grow and become a better and more efficient developer!

Happy coding everyone!

Thank you for reading this! If you've found this interesting, consider leaving a ❤️, 🦄, and of course, share and comment your thoughts!

Lloyds is available for partnerships and open for new projects. If you want to know more about us, click here.

Also, don’t forget to follow us on Instagram and Facebook!

How to make your web server better and more stable

Dominik Rusac — Fri, 04 Sep 2020 14:01:38 +0000

Welcome to the second part of the "Serving website from home" serie. In this one we'll talk about making our web server more useful and complete. We'll talk about buying a domain name, pointing it to our server and then creating subdomains so we could host multiple websites from a single server instance. After that, to make websites more secure, we'll go through the installation of the SSL certificates.

Finally, we'll set up some cron jobs to make our server more stable and I will leave you with some ideas on how to achieve 99% of your home server uptime. Stay tuned!

Content:

Get your domain name
Point domain to your server
Creating subdomains
Configure Apache base domain
Configure Apache subdomain
Installing SSL certificates
Improve server uptime using Cron jobs
Improve server uptime - ideas
Conclusion

Following through my previous blog you should have your basic website up and running from your home. Now it's time to level up your web server. Let's start by getting your domain name.

Get your domain name

You can buy a domain name from numerous different sites. For example, some of them are Namecheap, GoDaddy, AWS Route 53. I personally use Namecheap and it works fine for me. I recommend using Namecheap if you still aren't registered with some other domain provider because it will be easier for you to follow along. If you use some other provider, there shouldn't be any drastic differences in steps, so you'll probably be fine.

Go to the chosen provider site and search for a domain name you like. If the domain name is already taken, try to think of something similar of your liking. Once you found your domain name, add it to cart. You will probably be offered some extra stuff that goes with your domain, for example you could add an SSL certificate to your domain for extra $3 or $4 per year, but you don't need any of that, the domain name itself is enough, we will install the SSL certificate for free by using Let's Encrypt.

Once you bought your chosen domain name, you should see it on the domain list in your account. There you can manage your domain names, which takes us to pointing the domain to our web server.

Point a domain to your server

Pointing the domain names to your web server is a fairly simple thing to do. I use Namecheap but any other provider should have the same settings within a different user interface.

In your domain names list, click "Manage" button to access details of a certain domain name and then go to tab "Advanced DNS". There you can simply point domain or subdomain name to your network public IP address. The most simple way to find your public IP address is to visit icanhazip.com from any device connected to the same network as your web server.

Now we are ready to point domain names to our network IP address. In my case, domain name that I bought is "rusac.dev". Follow the picture below.

First Type A record with a host value of "@" represents where to point "rusac.dev" domain name. IP address value for every Type A record should be your network public IP address (address of your web server), and TTL set to automatic.

Time to live (TTL) is the amount of time your old DNS record could still show up the old value after you change your DNS record. For example, if you set a TTL value to 30 minutes, that means that the DNS servers around the world could still be showing the old value from their cache for up to 30 minutes after the change.

When creating a new DNS record, keep in mind that it can take a while to propagate all over the world. Usually, it takes a few minutes, you can use whatsmydns.net to check your propagation status. Just enter domain name you want to check and select "A" type from dropdown menu and click search. You will get a list of countries and IP address you see should be your network public IP address.

If you get a green check that means it's propagated in that country and it points to listed IP address - the public IP address of your network/web server which means domain pointing is properly done. Good job!

Creating subdomains

Second Type A record with host value of (in my case) "photos" should also point to network public IP address. By creating Type A record with a "photos" value we actually created a subdomain "photos.rusac.dev" and pointed it to our server address. I also have a third Type A record with "projects" host value which means I have another subdomain "photos.rusac.dev" - you get the idea.

This way you can create as many subdomains as you like and point them all to your web server. Once a web request comes to our web server, our Apache server will serve the appropriate website to the user. That will happen, of course, when we configure it to do so.

You may have noticed, apart from three Type A records, there are also three CNAME records. First one has a host value of "www" which means we are talking about "www.rusac.dev" domain with a value of "rusac.dev". That means "www.rusac.dev" points to "rusac.dev" and "rusac.dev" using Type A record points to our server IP address. This way we will get to "rusac.dev" website no matter if we enter "www.rusac.dev" or "rusac.dev" in our web browser.

You can check this using the whatsmydns.net, enter subdomain name, select CNAME type from dropdown list and click search. You should get a similar result as shown on the picture below.

Second CNAME record with a host value of "www.photos" refers to "www.photos.rusac.dev" domain and points to "photos.rusac.dev" domain which via Type A record points to our server IP address. Same goes for the third CNAME record. Creating CNAME records is not required, but is recommended because this way subdomains will be accessible starting with a "www" subdomain/prefix.

To summarize, my main domain name which I bought is "rusac.dev". Under my main domain I have three subdomains: "www.rusac.dev", "photos.rusac.dev" and "projects.rusac.dev". We can observe "www" subdomain the same way as "photos" or "projects" subdomains. It's as simple as that. Now that we have our subdomain DNS records created, it's time to configure our Apache server to serve requested website to the user.

Configure Apache base domain

I'll explain how I set up "rusac.dev" domain and "projects.rusac.dev" subdomain names. This way it will be easy for you to follow up using your preferred domain names.

First of all, create your website folder. You can name it however you want but good practice would be naming it the same way your domain name is except for using hyphen instead of a period, because it's cleaner.

sudo mkdir /var/www/rusac-dev       // Create website folder

After creating website folder you can git clone your website inside or you can simply create basic "index.html" file with some example HTML markup.

sudo nano /var/www/rusac-dev/index.html    // Create index.html file

Example HTML markup:

<html>
    <head>
        <title>Hello World!</title>
    </head>
    <body>
        <h1>Welcome to my personal website!</h1>
    </body>
</html>

Our website is ready and the next thing to do is to create Apache configuration file. Use the following command to create .conf file.

sudo nano /etc/apache2/sites-available/rusac.dev.conf

Inside "your.domain.name.conf" file paste the following configuration.

 <VirtualHost *:80>
    ServerAdmin dominik@lloyds.design
    ServerName rusac.dev
    ServerAlias www.rusac.dev
    DocumentRoot /var/www/rusac-dev

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Make sure you replace ServerAdmin, ServerName, ServerAlias and DocumentRoot with your corresponding values. ServerAdmin value should be your email address, ServerName should be your domain name (Type A record) while ServerAlias should be your subdomain (CNAME record) which points to Type A record of the domain. Finally, DocumentRoot is a path to the website which you want to serve on the specified domains.

Now we have our website and configuration ready, awesome! We are almost there. All there is to do now is to test configuration, enable our website and restart Apache server. Use the following commands:

sudo apache2ctl configtest    // Should return Syntax OK message
sudo a2ensite rusac.dev.conf    // Enable website
sudo systemctl restart apache2    // Restart Apache server

Your Apache server should now serve your website globally! If you were following my setup, you can access it with or without "www" subdomain/prefix. So in my case, Apache serves the same website to both "rusac.dev" and "www.rusac.dev" domains.

NOTE: If you bought .dev domain like me, your website will not work until you install an SSL certificate because .dev domains require SSL certificate by default. You will get "Your connection is not private" message. So our next step is obtaining a free SSL certificate using Let's Encrypt.

Before installing an SSL certificate, let's quickly set up a website for "projects.rusac.dev" subdomain. Process is almost the same as for the base "rusac.dev" domain.

Configure Apache subdomain

Create website folder and "index.html" file inside with example HTML markup.

sudo mkdir /var/www/projects-rusac-dev       // Create website folder
sudo nano /var/www/projects-rusac-dev/index.html    // Create index.html file

Example HTML markup:

<html>
    <head>
        <title>Hello World!</title>
    </head>
    <body>
        <h1>Welcome to my projects website!</h1>
    </body>
</html>

Create configuration file:

sudo nano /etc/apache2/sites-available/projects.rusac.dev.conf

Fill it with your subdomain values and DocumentRoot:

<VirtualHost *:80>
    ServerAdmin dominik@lloyds.design
    ServerName projects.rusac.dev
    ServerAlias www.projects.rusac.dev
    DocumentRoot /var/www/projects-rusac-dev

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Check for errors, enable site and finally restart Apache server.

sudo apache2ctl configtest    // Should return Syntax OK message
sudo a2ensite projects.rusac.dev.conf    // Enable website
sudo systemctl restart apache2    // Restart Apache server

Our website on "projects.rusac.dev" subdomain is now online and accessible with or without "www" subdomain/prefix. Let's proceed to installing SSL certificates on our domains.

Installing SSL certificates

I will install SSL certificates for "www.projects.rusac.dev" and "projects.rusac.dev" domain names. Process is the same for any other domain. Before continuing, make sure your "Apache Full" firewall profile is active and allows traffic through port 80 and 443 (SSL). Check that using the following command and allow "Apache Full" if needed:

sudo ufw status    // Check firewall status
sudo ufw allow 'Apache Full'    // Run if profile is not active

Find and follow certbot instructions to install certbot on your server. Certbot will help you to easily install SSL certificates on your websites. Once installed, run it using this command:

sudo certbot --apache

You will get a numbered list of your Apache enabled sites. Choose sites for which you want to obtain SSL certificate by entering numbers separated by commas or spaces, then press enter. I entered numbers of "projects.rusac.dev" and "www.projects.rusac.dev" domain names.

Certificates will start obtaining and you will be asked whether or not to redirect HTTP traffic to HTTPS. Enter number 2 because we want all traffic going through secure HTTPS with removing non-secure HTTP access. See the picture below.

If everything goes well, you'll get congratulations message and SSL certificates installed. That's it! Also you'll get links where you can go to test your SSL configuration.

Improve server uptime using Cron jobs

If you happen to have a dynamic IP address like I do then you have a problem. Every time your IP address changes, your websites will be down because your domains will point to your old IP address. To fix this, you would need to update your DNS records at least once a day, which is really frustrating and we wanna automate that. Fortunately, Namecheap offers a solution.

You can set up a cron job on your server which sends out request to Namecheap every X minutes and update your DNS records with your current server public IP address. For example, if you send out a request from your server every 15 minutes that means your maximum server downtime per IP change would be less than 15 minutes. If you send out a request every minute, then you'll get much better server uptime. I chose to send request every 15 minutes which works fine for me.

Check Namecheap instructions on how to build URL for updating your domain DNS records. You will need your Dynamic DNS password which could be found in advanced DNS settings of your domain.

If you are not using Namecheap, check if your domain provider offers this or similar possibility. I will explain my cron job example for updating DNS records of "projects.rusac.dev" domain.

Open cron tasks using command:

crontab -e

At the bottom of the file add the following line, then save and exit:

*/15 * * * * curl "https://dynamicdns.park-your-domain.com/update?host=projects&domain=rusac.dev&password=your_namecheap_dyndns_password" > /home/dominik/projects.rusac.dev.log

The "curl" command will run every 15 minutes and will make a request to the specified URL. In this case, sending a request will update the DNS records for "projects.rusac.dev" domain and will save the result to "projects.rusac.dev.log" file. You can create as many cron jobs as you need. Create a cron job for each domain/subdomain whose DNS records must be updated regularly.

Created cron job will be updating our DNS records every 15 minutes, so if your website is down, wait for up to 15 minutes and your website will be back online, of course that is if everything else is set up properly.

There are a lot of crontab generators online which can help you create your cron job the way you want it. For example check out Crontab Generator.

Improve server uptime - ideas

No matter how good your server configuration setup is, your server uptime will mostly be defined by your internet connection. Since quality of your internet connection isn't up to you, there is not much you can do about it. You can look up the offers from different internet providers in your area and maybe even consider switching to 4G internet. I recently switched to 4G internet and got 3x faster download speed and 10x faster upload speed which came very nice since I'm hosting websites from home.

Besides bad internet connection, other thing that can affect your server uptime is the bad weather. What if the power goes out due to thunderstorm? No power means our server is down! What can we do about it?

Well we could invest in uninterruptible power supply (UPS) unit which will keep our server and 4G router running for some time when the main power goes out. You can think of it as a powerbank for a server. This way bad weather will be having a hard time bringing our server down. 💪

Conclusion

Having a server configured as described in the blog with UPS connected, stable internet connection and cron jobs set up to update DNS records every minute or two, we could achieve 99% of our server uptime in theory. 🎉

This is more than good enough for serving a personal website like rusac.dev which can afford some downtime without consequences. Of course, you could also deploy a production website or application but I wouldn't recommend doing so because the downtime in production environment is not acceptable.

Setting up your own server comes in handy for testing websites if you are into web development and also it's very educational.

Thank you for reading this! If you've found this interesting, consider leaving a ❤️ or 🦄, and of course, share and comment your thoughts!

Lloyds is available for partnership and open for new projects. If you want to know more about us, click here.

Also, don’t forget to follow us on Instagram and Facebook!

How you can host websites from home

Dominik Rusac — Tue, 09 Jun 2020 07:06:05 +0000

Have an old PC or laptop that you are not using anymore? Well, guess what? You can turn it into a web server and host your website from your home network to the whole world! If you happen to have a Raspberry Pi, that’s even better because Pi is silent and very low on power consumption.
However, any computer that can run Ubuntu or similar OS will do just fine!

We will talk about network setup, firewall, Apache, virtual hosts, dynamic IP problem and more. Go make yourself a cup of coffee and dive into building your own web server at home!

Requirements:

PC/Laptop/Raspberry Pi with Ubuntu/Ubuntu Server OS installed
Username and password for accessing router settings

We’ll talk about:

Port forwarding
Initial server and firewall configuration
Installing Apache web server on Ubuntu
Setting up Apache virtual hosts
Useful commands
Dynamic IP problem
Conclusion

For setting up web server I will use Raspberry Pi 3 with Ubuntu 18.04 LTS installed. Always look for LTS (Long Term Support) version of Ubuntu when downloading it from the official website. If you are confident with terminal, you can also use Ubuntu Server. At the time of writing this blog, the latest Ubuntu LTS version is 20.04 and is supported until April 2025.

Port forwarding

Once you have your Ubuntu up and running, the first thing I recommend doing is to configure port forwarding on your home network. We are doing this to enable access to our web server over the internet. You can do this using any computer that is connected to your home network.

To access your router settings, you need default gateway IP address. To get it use Command Prompt/Terminal and enter one of three commands, depending on which OS you are currently using. Default gateway IP address is usually 192.168.1.1 or similar.

    ipconfig | findstr /i "Gateway"       // Windows - Command Prompt
    ip r | grep default                   // Ubuntu - Terminal
    route get default | grep gateway      // Mac OS

Once you find your default gateway IP address, enter it in your web browser. You will need to enter the username and password to log in and get access to router settings. Those credentials could often be found at the bottom of a router, usually on a small sticker. If not, you can look online to find out the default credentials for your router model.

When you successfully log in, look for “Port forwarding” or “Virtual Servers Setup”. Different routers can name the same settings differently. You need to add two new entries to allow traffic through ports 22 for SSH and 80 for web server.

To do that correctly, you need the local IP address of the computer which will be used as a web server. In my case it’s Raspberry Pi which is on Ubuntu so to get Raspberry Pi local IP address all I have to do is open Terminal and enter this command:

    hostname -I
    // 192.168.1.22

Raspberry Pi local IP address is similar but for sure different from default gateway IP address. We need to point incoming requests to our local server address and we’ll do that through ports 22 and 80, that’s why we need our local server IP address.

So, in your router settings, you need to add those two ports to allow traffic through them to your local server IP address. When adding port 22 you can name it “SSH”, under “Server IP Address” enter your local server IP (in my case it’s 192.168.1.22) and under “External/Internal Port Start/End” enter “22”. Use TCP protocol. Do the same for port 80 and name it “Apache”.

Ok, now you have these ports configured on the router side. Go to canyouseeme.org and check if ports 22 and 80 are opened. There are two fields, “Your IP” which shows you your public IP address and “Port to check”. Simply enter port number 22 or 80 and click “Check Port”.

Don’t worry if you get an “Error: I could not see your service on your_ip on your_port”, that’s perfectly fine. That’s because the firewall on your server is doing a good job blocking all disallowed connections. We will get to that.

Initial server and firewall configuration

On a freshly installed Ubuntu, it’s a good idea to do some basic server configuration so the server is ready for future use. To start configuring, open Terminal on your server (in my case Raspberry Pi) and follow along.

First of all, we'll create a new user which we’ll use to log in into the server over SSH, both inside and outside of our home network (local and external). Also, we will set a new user as “superuser” which means it will have root privileges.

This allows our new user to run commands with administrative privileges by putting the word “sudo” before each command. When creating a new user you will have to enter a password and some basic user info.

    sudo adduser john                  // create new user john
    sudo usermod -aG sudo john         // add user john to sudo group

Our new Ubuntu user should now be ready, but before we can log in over SSH, we need to configure a firewall. We need to allow port 22 through the firewall so we can log in with our new user over SSH, both locally and externally.

    sudo ufw status numbered          // check current firewall status
    sudo ufw allow OpenSSH            // allow port 22 through firewall
    sudo ufw enable                   // enable firewall

By enabling firewall and allowing port 22 through, now it’s possible to connect to our server using SSH. You should be able to connect to the server from any computer connected to your local network, and also if you have done port forwarding right you should be able to connect from anywhere in the world.

To connect to your server simply use Command Prompt or Terminal and enter the command:

    ssh john@192.168.1.22             // local connection - use your local server IP
    ssh john@xxx.xxx.xxx.xxx          // external connection - use your public IP

If you want to connect externally, outside your local network, you can find your public IP at canyouseeme.org and also if you now check if port 22 is opened, you should get “Success: I can see your service on your_ip on port 22”. That means port forwarding and initial server setup are properly done. Good job!

Install Apache web server on Ubuntu

Apache web server is one of the most popular web servers and it’s fairly simple to install.

    sudo apt-get update               // update available software list
    sudo apt install apache2          // install apache2 package

Apache is now installed and to make it work it’s necessary to modify firewall settings to allow external access to Apache web server.

Earlier we opened port 22 for connecting over SSH, now we need to open port 80 for Apache. If you are planning to install an SSL certificate on your website I recommend using the “Apache Full” profile which opens both 80 and 443. For non-SSL website “Apache” profile which opens only port 80 will do just fine.

    sudo ufw app list                 // list ufw application profiles
    // Available applications:
    //   Apache
    //   Apache Full
    //   Apache Secure
    //   OpenSSH

    sudo ufw allow 'Apache'           // opens port 80
    sudo ufw allow 'Apache Full'      // opens port 80 and 443
    sudo ufw allow 'Apache Secure'    // opens port 443

If you check your current firewall status, you should get a similar output. A firewall is now allowing traffic through port 80 if you used the “Apache" profile, and also through port 443 if you used the “Apache Full” profile.

    sudo ufw status                   // current firewall status
    // Status: active

    // To                         Action      From
    // --                         ------      ----
    // Apache Full                ALLOW       Anywhere
    // OpenSSH                    ALLOW       Anywhere
    // Apache Full (v6)           ALLOW       Anywhere (v6)
    // OpenSSH (v6)               ALLOW       Anywhere (v6)

Go on canyouseeme.org and check if port 80 is opened. If you get “Success: I can see your service on your_ip on port 80” that means your server is accessible from the internet. Awesome!

Setting up Apache virtual hosts

Before configuring Apache to serve your own website, if you check Apache status you should get “active (running)”. To check if your website works locally enter local IP server address in your internet browser (in my case that’s 192.168.1.22).

For checking if your website is available on the internet I suggest using your smartphone. Turn off your Wi-Fi and use the mobile internet (3G/4G). Open your internet browser and enter the public IP address of your home network. If you get to default Apache landing page you can be sure your server is up and running!

    sudo systemctl status apache2   // check apache status
    hostname -I                  // get local server IP address like 192.168.1.22
    curl -4 icanhazip.com        // get public IP address of your home network

Apache by default serves documents from the /var/www/html directory. We’ll leave this directory as is and create our new directory which we’ll use to serve our website from.

    sudo mkdir /var/www/mywebsite
    sudo nano /var/www/mywebsite/index.html

Inside “mywebsite” directory, we’ll create an “index.html” file and paste some basic HTML markup, save and close the file.

    <html>
        <head>
            <title>Hello World!</title>
        </head>
        <body>
            <h1>My website is live!</h1>
        </body>
    </html>

In order for Apache to serve this website, it’s necessary to create a new virtual host (.conf) file. The default configuration file is located at /etc/apache2/sites-available/000-default.conf and we’ll also leave this file as is and create our new mywebsite.conf file.

    sudo nano /etc/apache2/sites-available/mywebsite.conf

Inside mywebsite.conf file paste following configuration which is similar to the default one, but updated with your ServerAdmin, ServerName and DocumentRoot.

    <VirtualHost *:80>
        ServerAdmin your@email.com             // your email
        ServerName xxx.xxx.xxx.xxx             // your public IP address
        DocumentRoot /var/www/mywebsite        // document root of your website
        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined
    </VirtualHost>

At this point, we need to enable created website using a2ensite command.

    sudo a2ensite mywebsite.conf         // enable mywebsite

Don’t forget to disable Apache default website using a2dissite.

    sudo a2dissite 000-default.conf      // disable default Apache website

Run test for configuration errors. You should get a “Syntax OK” message.

    sudo apache2ctl configtest
    // Syntax OK

Finally, restart the Apache server for the changes to take effect.

    sudo systemctl restart apache2

On your smartphone, open your web browser and type in your public IP address and hit enter. If you see “My website is live!” text, you have successfully configured your Apache web server, congratulations!

Useful commands

Here are some commands that you might find useful while configuring your server.

    // UFW Firewall commands
    sudo ufw allow OpenSSH
    sudo ufw allow Apache
    sudo ufw status numbered
    sudo ufw delete X

    // SSH server commands
    sudo systemctl status ssh
    sudo systemctl stop ssh
    sudo systemctl start ssh
    sudo systemctl disable ssh
    sudo systemctl enable ssh

    // Apache server commands
    sudo systemctl start apache2
    sudo systemctl stop apache2
    sudo systemctl restart apache2
    sudo systemctl reload apache2
    sudo systemctl disable apache2
    sudo systemctl enable apache2

Dynamic IP problem

In most cases for home networks, the public IP address changes every 24 hours. Also if your router gets disconnected from the internet you will automatically get a new IP address when reconnected.

That’s a problem because every time your IP changes, to access your website you need to use the current public IP address of your network and also you need to update Apache config file. If you have a static public IP address then you are fine. Usually, ISP charges extra for static IPs.

There is a solution for this without having to pay for static IP. You can use free dynamic DNS service like no-ip.com where you can choose a free domain name and point it to your public IP address. You also need to add that domain name and your no-ip.com account credentials in your dynamic DNS router settings.

After you do that, your router and dynamic DNS service will work together and update your public IP address as it changes. This way, to access your website, you can always use the same domain name chosen on your dynamic DNS service as it always points to your current, up to date public IP address.

Conclusion

You should now have a basic understanding of how the web server works. Setting up your own web server at home is a good way to train your server administration skills. Having knowledge of setting up a server at home, you shouldn’t have problems administrating one on AWS, DigitalOcean or similar services.

Where to go from here? Well, you could buy your own domain name like mydomain.com and point it to your server IP address. After that, you can create any number of subdomains like subdomain.mydomain.com and host multiple different sites, all from one Apache instance. Also, it’s a good idea to install an SSL certificate on your website. But more on that later, I need to leave some content for my next blog. 😉