I embarked on an exciting journey to create my first website, following these detailed technical steps:

1. Set Up Proxmox Hypervisor: I installed Proxmox VE (Virtual Environment) on my server hardware. This provided a flexible virtualization layer to manage multiple VMs with high availability, snapshots, and resource allocation.

2. Install Windows Server 2022: I created a virtual machine within Proxmox and allocated 4 vCPUs and 8GB of RAM. Using an ISO image, I installed Windows Server 2022.

3. Configure IIS: After installation, I enabled the Web Server (IIS) role via Server Manager and configured application pools. I set the .NET version to 4.8 for compatibility with my web application, and I enabled features such as Static Content and URL Rewrite for better SEO and URL management.

4. Develop the Website: Using Visual Studio 2022, I developed my website with a focus on responsive design using HTML5, CSS3, and JavaScript ES6+. Colt Steele's Udemy course provided a solid foundation in best practices and advanced techniques.

5. Procure a Domain: I registered a domain with WHC (Web Hosting Canada), opting for a .ca extension for broader reach. I ensured that domain privacy was enabled to protect my personal information.

6. Redirect Domain to Public IP: I configured the DNS settings for my domain by creating an A record that pointed to my public IP address. This involved a TTL (Time to Live) setting of 14400 seconds for optimal propagation while ensuring quick updates.

7. Configure IP Binding: In IIS, I configured site bindings to ensure that incoming requests on port 80 (HTTP) and port 443 (HTTPS) were directed to the correct internal IP of my server. I also obtained an SSL certificate from Namecheap to enable HTTPS, ensuring secure communication.

8. Address Port Forwarding Issues: Initially, I faced significant challenges with port forwarding due to my ISP, Rogers, which blocked incoming traffic on ports 80 and 443. To resolve this, I used several methods and researched for solutions. I configured the server at a random static ip and then configured port forwarding on my rogers router. As my rogers router was automatically configuring the ip, After several tried i got them to match.

9. Bind SSL Certificate with IIS: Configured SSL for my website in IIS Manager by adding an HTTPS binding on port 443. Selected the appropriate SSL certificate from the store and confirmed the binding. Validated the configuration by accessing https://cloudwithpv.ca to ensure secure connections.

10. URL Rewrite from HTTP to HTTPS: Installed the URL Rewrite module in IIS and created a rewrite rule to enforce HTTPS. Configured conditions to identify HTTP requests and specified a permanent redirect action. Tested the implementation by accessing the site via HTTP to confirm successful redirection to https://cloudwithpv.ca.

11. Setup FTP Site: I set up an FTP site to easily manage and transfer files for my website updates and changes.

Throughout this project, I not only enhanced my technical skills but also developed a deeper understanding of networking, server management, and web application deployment. The experience taught me valuable problem-solving strategies and reinforced my commitment to continuous learning in web development. I am thrilled to have my website live and accessible globally, marking a significant milestone in my technical journey!

How I Set Up My NAS:

1. Setup Raspberry Pi OS Lite: I started by using the Raspberry Pi Imager to create a bootable USB drive with the Raspberry Pi OS Lite image. After booting up the Raspberry Pi from the USB, I connected it to my network and accessed it via SSH.

2. Update the System: Once logged in, I ran sudo apt update and sudo apt upgrade to ensure all packages were up-to-date, preparing the system for the installation of OpenMediaVault.

3. Install OpenMediaVault: I obtained the installation script from the OpenMediaVault website and executed it to install the software. This set up the server software I needed to manage file sharing on the network easily.

4. Configure SMB Share: After OpenMediaVault was installed, I accessed the web interface and created an SMB share. I defined the folder I wanted to share, set the access permissions, and enabled the share for network access.

5. Accessing the Share: Finally, I tested the SMB share from my Windows PC by mapping it as a network drive. I verified that I could access the shared files, making it easy to transfer and manage files on my network.

Setting up my NAS has significantly streamlined my file management and data backup processes. With centralized storage, I can easily access my files from multiple devices and share media across my network. This setup not only enhances my productivity but also ensures that my important data is safe and readily available whenever I need it.

How I hosted my website with Azure:

1. Clone the Repository: I started by cloning a repository from GitHub to my local machine. This gave me a copy of the project so I could make changes locally.

2. Create HTML, CSS, and JavaScript Files: I created three files index.html for the main page, style.css for styling, and script.js for JavaScript functions inside the cloned repository folder.

3. Make and Save Changes to Code: I edited the files to build my website, then saved my changes to each file.

4. Stage and Commit Changes: I staged my changes (prepared them for Git), then committed them with a message describing what I did, like Initial website setup.

5. Log into Azure Portal and Open Static Web Apps: I logged into my Azure portal, went to Static Web Apps, and clicked Create a Static Web App to set up hosting.

6. Configure the Static Web App: In the setup screen, I linked my GitHub account, selected my repository and branch (main), and specified / as both the app location and output location (since my files were in the root folder).

7. Review and Create the Static Web App: After filling out the details, I clicked Review + Create. Azure then created a GitHub Actions workflow to automatically build and deploy my site.

8. Automatic Deployment and Accessing My Site: Once everything was configured, Azure ran a build and deployment job. After it finished, my site was live on the URL Azure provided.

Issues I encountered:

1. Build Error Due to Missing package.json: I got an error during the build step because Azure's build system, Oryx, could not find a package.json file. This file helps guide the deployment process by providing commands, even if they are placeholders.

2. Fixing the Issue: I added a simple package.json file with a dummy build command like "build": "echo 'No build step needed'". This file allowed Azure to complete the build process and deploy my site without any issues.