Add text to home datacenter project.

Populated the page with information about the project.
This commit is contained in:
Xander Bazzi 2024-03-12 19:12:03 -06:00
parent 53aaafa6fa
commit ea2a4a1379
4 changed files with 53 additions and 19 deletions

View File

@ -44,7 +44,10 @@ body {
} }
.blog-image { .blog-image {
width: 50%; width: 30%;
display: block;
margin: 0 auto;
} }
.topbar { .topbar {
@ -66,6 +69,7 @@ p.blog {
display: block; /* Ensures the image does not have inline whitespace below it */ display: block; /* Ensures the image does not have inline whitespace below it */
max-width: 20%; /* Ensures the image is responsive and fits its container */ max-width: 20%; /* Ensures the image is responsive and fits its container */
height: auto; /* Maintains aspect ratio */ height: auto; /* Maintains aspect ratio */
margin-top: 10px;
} }
#container, #container,

View File

@ -2,7 +2,15 @@
All notable changes to this site will be documented in this file. All notable changes to this site will be documented in this file.
The format is based on [Semantic Versioning](https://semver.org/). The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/) and the versioning is consistent with [Semantic Versioning](https://semver.org/).
## [0.2.0] - 2024-03-12
### Added
- Text to the home datacenter project with more information.
### Fixed
- Broken URLs to GitHub and LinkedIn.
## [0.1.0] - 2024-02-26 ## [0.1.0] - 2024-02-26
### Added ### Added

View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Monkey Town</title> <title>xbazzi.com</title>
<meta property="og:image" <meta property="og:image"
content="https://sadgrl.online/images/og/homepage.png"> content="https://sadgrl.online/images/og/homepage.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
@ -24,27 +24,49 @@
Home datacenter project Home datacenter project
</div> </div>
<div class="content"> <div class="content">
A home datacenter is what most Americans need, but don't deserve. What first started as a project to play around with declarative deployments and container orchestration has now grown into a server stack that runs critical services for my day to day life.
<br> <br>
<img src="assets/img/dc1.JPG" class="blog-image"> <br>
The hyper-converged infrastructure consists of 3 physical servers, all running Proxmox Virtual Environment as a hypervisor.
One of these machines has a 6-slot HDD bay, which is where the TrueNAS instance is virtualized. Another server runs an OPNsense appliance for firewalling and routing.
All servers run k3s master/worker Debian nodes, declaratively provisioned with Ansible and a gitops workflow through flux. Every server is equipped with 10gbps SFP+ NICs, and
the Juniper EX3300 L3 switch also comes with 4 SFP+ 10gbps slots, allowing for relatively fast data transfer speeds on LAN.
<br>
<br>
All these virtualized environments and containerized applications need space for persistent storage, which is where TrueNAS comes in. It's a FreeBSD-based NAS system that runs on top of ZFS, which allows
for the creation of highly available and fault tolerant networked file systems. It currently consists of 2 x 6 TB HDDs configured in a mirrored pool, with a 500 GB NVMe SSD as an L2 cache, and 64 GB of RAM as L1 cache.
Because of the layered approach to caching frequently accessed data, we are able to saturate the 10gbps line when doing large-file data transfers (i.e. restoring backups).
<br> <br>
Here is the logical diagram of my homelab setup.
<br> <br>
<img src="assets/img/homelab_logical.png" class="blog-image" style="width: 100%"> <a href="assets/img/dc1.JPG"><img src="assets/img/dc1.JPG" class="blog-image"></a>
<br>
<br>
The diagram below depics the logical topology of the network and the connections to external services, namely Cloudflare and AWS.
<br> <br>
Had to fit some of the ultra-small form factor PCs with SFP+ NICs to enable 10gbps transfer speeds on LAN.
<br> <br>
<img src="assets/img/dc2.JPG" class="blog-image"> <a href="assets/img/homelab_logical.png"><img src="assets/img/homelab_logical.png" class="blog-image"></a>
<br>
<br>
Two of the servers are ultra small form factor PCs, which made installing the massive 10gbps NICs extremely fun.
<br> <br>
<br>
<a href="assets/img/dc2.JPG"><img src="assets/img/dc2.JPG" class="blog-image"></a>
<br>
<br>
Accessing the main server BMC webUI through the IPMI interface via Ethernet, bypassing any need to output video into a monitor. Accessing the main server BMC webUI through the IPMI interface via Ethernet, bypassing any need to output video into a monitor.
<br> <br>
<img src="assets/img/mb1.JPG" class="blog-image"> <br>
<a href="assets/img/mb1.JPG"><img src="assets/img/mb1.JPG" class="blog-image"></a>
<br>
<br>
A home datacenter is what most Americans deserve, but don't need.
</p> </p>
</div> </div>
</div> </div>

View File

@ -36,12 +36,12 @@
<div class="title"><span class="fa-solid fa-lightbulb"></span> projects </div> <div class="title"><span class="fa-solid fa-lightbulb"></span> projects </div>
<div class="content flex"> <div class="content flex">
<img src="assets/img/dc1.JPG" alt="Datacenter preview" class="project-image"> <a href="./homenetwork.html"><img src="assets/img/dc1.JPG" alt="Datacenter preview" class="project-image"></a>
<p class="blog"><a href='./homenetwork.html'> <p class="blog"><a href='./homenetwork.html'>
Home datacenter Home datacenter
</a> </a>
</p> </p>
<img src="assets/img/website.png" alt="Website preview" class="project-image"> <a href=""><img src="assets/img/website.png" alt="Website preview" class="project-image"></a>
<p class="blog"><a href='./website.html'> <p class="blog"><a href='./website.html'>
This website This website
</a> </a>
@ -61,12 +61,12 @@
</ul> </ul>
<ul> <ul>
<li> <li>
<a href="github.com/alexbazzi"><span class="fa-brands fa-github"></span>GitHub</a> <a href="https://github.com/alexbazzi" target="_blank"><span class="fa-brands fa-github"></span>GitHub</a>
</li> </li>
</ul> </ul>
<ul> <ul>
<li> <li>
<a href="linkedin.com/in/alexbazzi"><span class="fa-brands fa-linkedin"></span>LinkedIn</a> <a href="https://linkedin.com/in/alexbazzi" target="_blank"><span class="fa-brands fa-linkedin"></span>LinkedIn</a>
</li> </li>
</ul> </ul>
<a target='_blank' rel='noreferrer noopener' <a target='_blank' rel='noreferrer noopener'