1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
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>
|
