diff options
Diffstat (limited to 'projects/peten-ca.html')
| -rw-r--r-- | projects/peten-ca.html | 115 |
1 files changed, 115 insertions, 0 deletions
diff --git a/projects/peten-ca.html b/projects/peten-ca.html new file mode 100644 index 0000000..1a05fd0 --- /dev/null +++ b/projects/peten-ca.html @@ -0,0 +1,115 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <!-- PAGE SETUP--> + <title>peten.ca | blog posts</title> + <link rel="icon" type="image/x-icon" href="/images/petemcgeenobg.png"> + <meta charset="utf-8"> + <meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;' name='viewport' /> + <meta name="viewport" content="width=device-width" /> + + <!-- CSS --> + <link href="/css/blog-post.css" rel="stylesheet"> + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" + integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"> + + <!-- JS --> + <script src="https://code.jquery.com/jquery-3.7.1.js" + integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script> + <script src="/scripts/peten.js"></script> + <script src="https://unpkg.com/typed.js@2.1.0/dist/typed.umd.js"></script> + + <!-- FONTS --> + <link rel="preconnect" href="https://fonts.googleapis.com"> + <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> + <link + href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Ubuntu+Sans:ital,wght@0,100..800;1,100..800&display=swap" + rel="stylesheet"> + +</head> + +<body class="font-montserrat fade-in"> + <header> + + + <div class="header text-dark"> + <a href="/projects.html">← PROJECTS</a> + <span class="date"> + JANUARY, 2025 + </span> + </div> + </header> + + <main class="project-post"> + <h1>peten.ca</h1> + <h2>or: running ethernet cable in my basement's drop ceiling at 1:00AM</h2> + <p> + <i>NGINX on Debian, purchasing a domain on porkbun, and the making of this site (special hatred + reserved for CSS) + </i> + <br> <br> + One fateful day, I decided that I should put my old computer to use. The thing was, and still is, pretty + junky - but it's definitely enough to host these pages, maybe have a little NAS, stuff like that. It's got a + Core i3 2100, RX460, 8gb of DDR3... you can see where I'm going with this. It wasn't good when I built it in + 2017, but it served me well and I figured that it deserved a second life. + <br> <br> + On a whim, I set it up on a table in my basement, with the monitor I originally had bought (cost me 40$ in + 2017 - 4:3 aspect ratio, 1280x1024, not exactly "premium"). I remembered live-booting Linux Mint back in + like 2018, and so tried to make some installation media for Debian assuming that I pretty much knew all the + steps to burn the ISO onto a flash drive and boot into it. It was not that easy. + <br> <br> + To spare you from the pain that I had to endure, just know that I tried a million different things with no + success for like 3 hours until I had the bright idea to disconnect the machine's 250gb hard drive's SATA + cable, force the BIOS into the "machine failed to boot - drive not detected menu," insert the flash drive, + and then press enter as if I had attached a bootable drive. I tried literally every option in the boot from + media menu, changed boot orders in the BIOS, remade the boot media a million times - I tried lots. Once I + got everything set up, all was looking okay. + <br> <br> + The next day, I made a very foolish mistake. You know, because you're alright, I'll admit to it. I + accidentally typed rm /* into the terminal. I THOUGHT that it wouldn't do anything, because I didn't add the + -r tag to remove things recursively, but I guess I was wrong. Regardless, I had to reinstall Debian. Image + below for your enjoyment. + </p> + <img src="/images/projects/screenshot.png"> + <p> + After that was all good, I purchased a domain on porkbun.com, got NGINX set up on the Linux machine, and + started work on the HTML and CSS for this site. If you'd like some advice, here you go: + <br> <br> + If you need help, you can use ChatGPT. Nobody will rat you out. When I was making a page on Github sites way + back when, I remember being VERY confused as to how to center a div, or align text. Nowadays, you can ask a + machine to do it for you. Holy robots! + <br> <br> + You should probably use some CSS framework like Tailwind, Bootstrap, etc. for your work. I have Bootstrap on + here, but I rarely use it. Take the time to read the docs, and use it. If you want to be good - yeah, it's a + shortcut. You need to understand the "box model" for sure, but for the layman, most of the work is already + done for you. + Just add the classes to your stuff and move on with your life. + <br> <br> + If you are making something more than a static site, then use JS and a JS framework (React, Vue, Svelte, + whatever man). I am not trying to flash my webdev skills with this site, but if I was, it would be one of + those awesome one-pagers with a bunch of animations and transitions and it'd be hideously + resource-intensive. + <br> <br> + Anyways, I'm getting tired of writing this. Call it a working project post. + <br> <br> + All the best. + <br> <br> + Peter + </p> + </main> + + + </div> + + <footer class="footer"> + Copyright Peter Nguyen <span id="copyright-year"></span>. All rights reserved. + </footer> + + <!-- BOOTSTAP JS --> + <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" + integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" + crossorigin="anonymous"></script> +</body> + +</html>
\ No newline at end of file |