User Tools

Site Tools


webapps:hugo

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
webapps:hugo [2023/09/13 19:17] – [Nginx Server] lucidwebapps:hugo [2023/10/03 17:50] (current) – [Configure Nginx] lucid
Line 8: Line 8:
 Hugo itself is a static site generator, meaning it takes relatively simple input in the form of markup files and outputs working html code. The webserver, in this case nginx, will be used to host these files on the internet. Web hosting requires some understanding of how DNS works and a domain name, which I will not be going over in this guide, but will describe briefly, enough for most people to figure it out. Hugo itself is a static site generator, meaning it takes relatively simple input in the form of markup files and outputs working html code. The webserver, in this case nginx, will be used to host these files on the internet. Web hosting requires some understanding of how DNS works and a domain name, which I will not be going over in this guide, but will describe briefly, enough for most people to figure it out.
  
 +\\ 
 +\\ 
 +\\
 =====Hugo Server===== =====Hugo Server=====
 Dependencies Dependencies
  
-  sudo apt install git nginx golang+  sudo apt install git golang
  
  
Line 18: Line 20:
   sudo snap install hugo   sudo snap install hugo
  
-Initialize a new site with a name, cd into dir, initialize git, install and set theme.+Initialize a new site with a name, cd into dir, initialize git, install and set theme. The theme can be anything you want, in this case we are going with the default theme found in the Hugo documentation
   hugo new site <site_name>   hugo new site <site_name>
   cd /<site_name>   cd /<site_name>
Line 25: Line 27:
   echo "theme = 'ananke'" >> hugo.toml   echo "theme = 'ananke'" >> hugo.toml
  
 +\\
 +\\
 +\\
 =====Nginx Server===== =====Nginx Server=====
-There are some other basic things you should know about setting up a web server, you can read about those in another article.+There are some basic things you should know about setting up a web server.
  
  
-Dependencies+====Prerequisites==== 
 + 
 +First things first, install nginx.
  
   sudo apt install nginx   sudo apt install nginx
      
      
-Configure ufw +Uncomplicated FireWall or ufw needs to be configured, and started if it isn't already running. This will allow incoming connections on port 80, the default port for http traffic. If you want https, you can add that now, but it will be covered later. 
- +
   sudo ufw allow http   sudo ufw allow http
-  sudo ufw allow https 
   sudo ufw reload   sudo ufw reload
 +  sudo ufw enable
 +
 +====Configure Nginx====
  
 Remove default nginx config. This will cause issues if you don't remove it. Remove default nginx config. This will cause issues if you don't remove it.
Line 58: Line 67:
     listen 80;     listen 80;
     server_name subdomain.domain.tld;     server_name subdomain.domain.tld;
-    root /var/www/html+    root /var/www/html;
 } }
 </code> </code>
  
-With IP address instead.+With an IP address.
  
 <code> <code>
Line 68: Line 77:
     listen 80;     listen 80;
     server_name 192.168.1.4;     server_name 192.168.1.4;
-    root /var/www/html+    root /var/www/html;
 } }
 </code> </code>
  
-Test the config to make sure that everything works before you move on.+Test the config to make sure that everything works before you move on. If it throws any errors, it will tell you at which line(s) they occur in the config file.
  
-  sudo nginx -T+  sudo nginx -t
  
-Add a file to make sure that everything works in your web browser before moving the actual website to the server.+Add a file to the web root to make sure that everything works in your web browser before moving the actual website to the server.
  
-  sudo touch /var/www/html/index.html && echo "Hello World!" >> /var/www/html/index.html+  sudo touch /var/www/html/index.html && echo "Hello World!"/dev/null | sudo tee -a /var/www/html/index.html 
 +  sudo chown -R www-data:www-data /var/www/html
  
 Start/restart the nginx service. Start/restart the nginx service.
Line 85: Line 95:
  
 Navigate your web browser to your domain or IP address and it should produce a white background with Hello World in the top left corner. Navigate your web browser to your domain or IP address and it should produce a white background with Hello World in the top left corner.
 +\\
 +\\
 +\\
 +\\
 +=====Copying your Website to the Web Server=====
 +For this all you need to do is copy your published hugo website to the web server. To publish your website and generate the necessary html you need to run ''hugo server'' without any flags. This will tell hugo to build the published your site, only generating html for the pages which are not marked as draft. After that is done, you can continue on to move those files to the web server.
 +
 +
 +On the Hugo server, navigate to your site directory with your website configuration files and folders in it.
 +
 +  cd /<site_dir>
 +
 +From the hugo directory start an sftp connection to your web server and copy the publish folder to the web server using put with the R flag to copy recursively. When done exit.
 +
 +  sftp <user>@<web_server_IP>
 +  put -R /publish
 +  
 +Disconnect from the hugo server and ssh into the web server. The files that were just transferred to the web server need to be placed into the /var/www/html directory or any other directory of your choosing, just remember to change the web root in the nginx config to match.
 +
 +Move the files in the publish directory to /var/www/html and set the permissions
 +
 +  mv ./publish/* /var/www/html/
 +  chown -R www-data:www-data /var/www/html
 +
 +Restart nginx
 +
 +  sudo systemctl restart nginx
 +  
 +If everything went as expected, your hugo website should be available at your domain or IP, albeit without encryption.
webapps/hugo.1694632671.txt.gz · Last modified: 2023/09/13 19:17 by lucid