How to set it up from scratch?

Set up a remote server to host simple static websites from scratch.

Why?

I could use out of the box options, but building something from scratch helps me better understand and wrap my head around how web servers work.

Which hosting service?

vultr.com

Heard about it from sive.rs. Reserved a server with them, and got to work.

Soundtrack: https://open.spotify.com/playlist/2lrw8XWJtmhq5SCDbc4VLn?si=3042d3e6c02a489e

Set up SSH via vultr UI. ssh-ed in via iterm. Here we go.

![[Screenshot 2022-12-24 at 16.13.00.png]]

Goals

• Goal 1: transfer local index.html file from local computer to remote server.
• Goal 2: run index.html locally via a web server
• Goal 3: host index.html on achao.io
• Goal 4: redirect and host arcpartnering.com on my remote server with Apache Virtual Hosts
• Goal 5: Set up TLS/SSL Certificates
• Goal 6: Apply a consistent header to all pages via header.html
• Goal 7: Remove file extensions from end of URLs (e.g. .html, .php)
• Goal 8: Add subscribe functionality to website
• Goal 9: Add website analytics (Google?)

Created a ~/workspaces/achao.io directory to house my personal website files. Of note, I had already reserverd achao.io via Google Domains.

![[Screenshot 2022-12-24 at 16.13.37.png]]

Goal 1

Transfer local index.html file from local computer to remote server.

On local machine:

> sftp root@207.XXX.XXX.XXX
Connected to 207.XXX.XXX.XXX.

sftp> put /Users/anthony/Workspaces/achao.io/index.html /root
Uploading /Users/anthony/Workspaces/achao.io/index.html to /root/index.html
index.html                                    100%  627    23.8KB/s   00:00

On remote machine:

root@achaovultr1:~# ls
index.html  workspaces

Success!

Reference(s):

• https://www.hostinger.com/tutorials/how-to-use-sftp-to-safely-transfer-files/

Goal 2

Run index.html locally in the remote server

Get the static page running on the remote server

Step 0: Initial Server Setup with Debian 11 (source)

Step 1: Install Appache HTTP Server on Debian 11 (https://httpd.apache.org/)

![[Screenshot 2022-12-24 at 17.35.13.png]]

Hell yeah! Apache Web Server installed successfully :)

![[Screenshot 2022-12-24 at 17.38.19.png]]

Set up an apache virtual host in /var/www/achao.io. It's alive!!!

![[Screenshot 2022-12-24 at 17.53.56.png]]

Questions

What is a web server?

• There are different types of servers: file servers, database servers, mail servers, and web servers. Each of these applications can access files stored on a physical server and use them for various purposes.
• The job of a web server is to serve websites on the internet. To do this, the web server acts as a middleman between client machine(s) and the server machine(s). The web server serves content from the server for each user request and delivers it to the web.
• Said another way, a web server is a tool responsbile for server-client communication. And Apache uses the [[TCP]]/IP protocol to communicate over networks from client to server.
• Most popular Web Servers. It can listen on different ports for requests, e.g. domain1.com listening on port 80, domain2.com on port 8080 and domain3.com on port 443 using HTTPS all on Apache.
  1. Apache HTTP Server
  2. Microsoft Internet Information Services
  3. Lighttpd
  4. Nginx Web Server
  5. Sun Java System Web Server

What is the LAMP Web Application Architecture?

• Linux is the operating system that handles the operations of the application.
• Appache is the web server that processes the requests and serves web assets and content via HTTP.
• MySQL is the database that stores all your information in an easily queryable format.
• PHP is the language that works with Apache to help create dynamic web content.
• This is the base architecture, it is common to expand upon this architecture with Load Balancers, Content Delivery Networks (CDNs), Database Servers, Firewalls, etc.
  • Firewalls: help protect the web application from external threats and internal vulnerabilities depending on how the firewal lis configured.
  • Load Balancers: help distribute traffic across web servers which handle HTTP(S) requests (where Apache comes in) and application servers (servers that handle functionality and workload of the web app.)
  • Database Servers: handle storage and backups.
    • Database and Application server can live on same server, but generally recommended to keep them separate.

Reference(s):

• https://www.digitalocean.com/community/tutorials/how-to-install-the-apache-web-server-on-debian-11
• https://medium.com/@sanchit0496/what-is-a-web-server-different-types-of-web-servers-c0bd1a1b4b43
• https://www.hostitsmart.com/blog/types-of-web-server/
• https://www.hostinger.com/tutorials/what-is-apache
• https://www.digitalocean.com/community/tutorials/initial-server-setup-with-debian-11
• https://www.sumologic.com/blog/apache-web-server-introduction/

Goal 3

Connect/host index.html on achao.io

Intermediate goal, get the "LAMP" stack set up to enable my server to host dynamic websites and web apps. (Linux, Apache, MariaDB, PHP)

Installed mariaDB and PHP.

![[Screenshot 2022-12-24 at 18.20.21.png]]

Next intermediate goal, how to link my two domains, achao.io and arcpartnering.com to my http://207.XXX.XXX.XXX/ server?

https://www.namecheap.com/support/knowledgebase/article.aspx/9837/46/how-to-connect-a-domain-to-a-server-or-hosting/#viaip

![[Screenshot 2022-12-24 at 18.52.38.png]]

Updated Advanced DNS settings for my domain at namecheap.com.

Goal 4

Redirect and host arcpartnering.com on my remote server with Apache Virtual Hosts

https://www.howtogeek.com/devops/how-to-host-multiple-websites-with-one-apache-server/

Magical. It works.

![[Screenshot 2022-12-25 at 00.18.09.png]]

Goal 5

Set up TLS/SSL Certificates

https://www.digitalocean.com/community/tutorials/how-to-secure-apache-with-let-s-encrypt-on-debian-11

What are TLS/SSL Certificates?

https://www.digitalocean.com/community/tutorials/openssl-essentials-working-with-ssl-certificates-private-keys-and-csrs

sudo certbot --apache -d arcpartnering.com -d www.arcpartnering.com

sudo certbot --apache -d achao.io -d www.achao.io

Secure :)Ï

![[Screenshot 2022-12-25 at 00.42.07.png]] ![[Screenshot 2022-12-25 at 00.41.55.png]]

How to enable XBitHack on Apache Web Server

So you can use SSI (S)

https://unix.stackexchange.com/questions/627020/how-to-enable-xbithack-on-apache2-web-server-debian

Goal 6

Apply a consistent header to all pages via header.html

I didn't want to duplicate <header> code in all my different pages, so I was trying to understand the simplest way to implement this.

This article describes what I'm trying to do pretty well.

DRY, Don't Repeat Yourself.

So, I found Apache SSI (Server Side Includes), which is super cool - it provides a way to add dynamic content to existing HTML documents.

With newer versions of Apache, the main server configuration file lives at /etc/apache2/apache2.conf

How do you check your Apache version?

anthony@achaovultr1:~$ sudo apache2 -v
Server version: Apache/2.4.54 (Debian)
Server built:   2022-06-09T04:26:43

How do you enable SSI for your Apache server?

https://httpd.apache.org/docs/2.4/howto/ssi.html

Once XBitHack is on, how do you enable it? XBitHack tells Apache to parse files for SSI directives. If the files have the execute bit set, SSI will work.

anthony@achaovultr1:/var/www/achao.io/pages$ ls -lh
total 28K
-rw-r--r-- 1 anthony anthony 502 Jan  1 06:49 about-me.html
-rw-r--r-- 1 anthony anthony 455 Jan  1 06:49 books.html
-rw-r--r-- 1 anthony anthony 423 Jan  1 06:34 header.html
-rw-r--r-- 1 anthony anthony 389 Jan  1 06:49 now.html
-rw-r--r-- 1 anthony anthony 416 Jan  1 06:49 posts.html
-rw-r--r-- 1 anthony anthony 422 Jan  1 06:49 projects.html
-rw-r--r-- 1 anthony anthony 482 Jan  1 06:49 setup.html
anthony@achaovultr1:/var/www/achao.io/pages$ chmod +x *.html
anthony@achaovultr1:/var/www/achao.io/pages$ ls -lh
total 28K
-rwxr-xr-x 1 anthony anthony 502 Jan  1 06:49 about-me.html
-rwxr-xr-x 1 anthony anthony 455 Jan  1 06:49 books.html
-rwxr-xr-x 1 anthony anthony 423 Jan  1 06:34 header.html
-rwxr-xr-x 1 anthony anthony 389 Jan  1 06:49 now.html
-rwxr-xr-x 1 anthony anthony 416 Jan  1 06:49 posts.html
-rwxr-xr-x 1 anthony anthony 422 Jan  1 06:49 projects.html
-rwxr-xr-x 1 anthony anthony 482 Jan  1 06:49 setup.html
anthony@achaovultr1:/var/www/achao.io/pages$

Goal 7

Remove file extensions from end of URLs (e.g. .html, .php)

https://httpd.apache.org/docs/2.4/mod/mod_rewrite.html https://code.tutsplus.com/tutorials/an-in-depth-guide-to-mod_rewrite-for-apache--net-6708 https://cheatography.com/davechild/cheat-sheets/mod-rewrite/