Merge pull request #12 from ghall89/dev

migrate from cosmicjs
2023-01-19 19:31:21 -05:00
parent 2554dadbc0 b25b6cb28b
commit d7d3c1775f
30 changed files with 517 additions and 100 deletions
@@ -1,10 +1 @@
-import { defineConfig } from 'astro/config';
+import { defineConfig } from "astro/config";
 // https://astro.build/config
 import netlify from "@astrojs/netlify/functions";
 // https://astro.build/config
 export default defineConfig({
  output: 'server',
  adapter: netlify()
 });
@@ -1,5 +1,6 @@
 ---
-import { formatInTimeZone } from "date-fns-tz";
+import { format, add } from "date-fns";
 import FormattedDate from "@components/FormattedDate.astro";
 interface Props {
  title: String;
@@ -12,6 +13,6 @@ const { title, date } = Astro.props;
 <div class="blog-header">
  <h2>{title}</h2>
  <h3 style={{ fontSize: "1.1rem" }}>
-    {`🗓️ ${formatInTimeZone(new Date(date), "America/New_York", "MMM do, y")}`}
+    🗓️ <FormattedDate date={date} />
  </h3>
 </div>
@@ -0,0 +1,11 @@
 ---
 import { format, add } from "date-fns";
 interface Props {
  date: String;
 }
 const { date } = Astro.props;
 ---
 <span>{format(add(new Date(date), { hours: 6 }), "MMM do, y")}</span>
@@ -2,7 +2,9 @@ My name is **Graham**, a web developer from Rhode Island.
 When I'm not writing code, I'm usually enjoying one of my other hobbies; video games, music, hiking, photography, art, the list goes on...
-I write about web development on [my other blog](https://ghall.dev/blog), but I wanted an outlet to write about some of my other interests. So, I put together this site to share whatever's on my mind about the world of tech, gaming, life, whatever strikes my fancy.
+I also like writing about stuff, so I put together this site to share whatever's on my mind about the world of tech, gaming, life, web development, and whatever else strikes my fancy.
 If your interested in checking out my web dev projects, check out [my portfolio](https://ghall.dev/blog).
 If you want to get in touch, I'm on [Mastodon](https://home.social/@ghalldev).
@@ -0,0 +1,18 @@
 ---
 import Layout from "@layouts/Layout.astro";
 import BlogHeader from "@components/BlogHeader.astro";
 const { title, pubDate } = Astro.props.frontmatter;
 ---
 <Layout title={title}>
  <BlogHeader title={title} date={pubDate} />
  <slot />
 </Layout>
 <style is:global>
  img {
    display: block;
    margin: auto;
  }
 </style>
@@ -1,8 +1,8 @@
 ---
-import "../styles/global.css";
+import "@styles/global.css";
-import Header from "../components/Header.astro";
+import Header from "@components/Header.astro";
-import Footer from "../components/Footer.astro";
+import Footer from "@components/Footer.astro";
 export interface Props {
  title: string;
@@ -1,6 +1,6 @@
 ---
 layout: ../layouts/Layout.astro
-title: "About"
+title: Page Not Found
 ---
 ## 404 - Page not found!
@@ -1,5 +1,5 @@
 ---
-import Layout from "../layouts/Layout.astro";
+import Layout from "@layouts/Layout.astro";
 import AboutText from "../content/about.md";
 const styles = {
@@ -0,0 +1,22 @@
 ---
 import { formatInTimeZone } from "date-fns-tz";
 import Layout from "@layouts/Layout.astro";
 import FormattedDate from "@components/FormattedDate.astro";
 const posts = await Astro.glob("./posts/*.md");
 posts.sort(
  (a, b) =>
    Date.parse(b.frontmatter.pubDate) - Date.parse(a.frontmatter.pubDate)
 );
 ---
 <Layout title="Blog Archive">
  {
    posts.map((post) => (
      <div>
        <a href={post.url}>{post.frontmatter.title}</a> -{" "}
        <FormattedDate date={post.frontmatter.pubDate} />
      </div>
    ))
  }
 </Layout>
@@ -1,37 +1,30 @@
 ---
 import { Markup } from "astro-remote";
-import Layout from "../layouts/Layout.astro";
+import Layout from "@layouts/Layout.astro";
-import BlogHeader from "../components/BlogHeader.astro";
+import BlogHeader from "@components/BlogHeader.astro";
-const response = await fetch(
+const posts = await Astro.glob("./posts/*.md");
-  `https://api.cosmicjs.com/v2/buckets/${
+posts.sort(
-    import.meta.env.BUCKET_SLUG
+  (a, b) =>
-  }/objects?pretty=true&query=%7B%22type%22%3A%22blog-posts%22%7D&read_key=${
+    Date.parse(b.frontmatter.pubDate) - Date.parse(a.frontmatter.pubDate)
    import.meta.env.BUCKET_READ_KEY
  }&limit=5`
 );
 const posts = await response.json();
 ---
 <Layout title="Home">
  {
-    posts.objects.map((post) => (
+    posts.slice(0, 5).map((post) => (
      <article class="post-preview">
        <div>
-          <BlogHeader title={post.title} date={post.published_at} />
+          <BlogHeader
-          <Markup content={`<p>${post.content.split("</p>")[0]}`} />
+            title={post.frontmatter.title}
-          <a href={`/posts/${post.slug}`}>Read More</a>
+            date={post.frontmatter.pubDate}
          />
          <Markup content={`<p>${post.compiledContent().split("</p>")[0]}`} />
          <a href={post.url}>Read More</a>
        </div>
      </article>
    ))
  }
-  {posts.objects.length < 5 ? null : <a href="/posts">All Posts</a>}
+  {posts.length < 5 ? null : <a href="/archive">All Posts</a>}
 </Layout>
 <!-- <style>
  blog-post {
    article
  }
 </style> -->
@@ -1,30 +0,0 @@
 ---
 import { format } from "date-fns";
 import { Markup } from "astro-remote";
 import Layout from "../../layouts/Layout.astro";
 import BlogHeader from "../../components/BlogHeader.astro";
 const { slug } = Astro.params;
 const response = await fetch(
  `https://api.cosmicjs.com/v2/buckets/${
    import.meta.env.BUCKET_SLUG
  }/objects?pretty=true&query=%7B%22type%22%3A%22blog-posts%22%7D&read_key=${
    import.meta.env.BUCKET_READ_KEY
  }&limit=5&query=%7B%22slug%22%3A%7B%22%24eq%22%3A%22${slug}%22%7D%7D`
 );
 const posts = await response.json();
 const post = posts.objects[0];
 ---
 <Layout title={post.title}>
  <article>
    <div>
      <BlogHeader title={post.title} date={post.published_at} />
      <Markup content={post.content} />
    </div>
  </article>
 </Layout>
@@ -0,0 +1,15 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "An Update on my AI Dating Profile"
 pubDate: 2023-01-14
 ---
 Back in early December I posted about [how I created a dating profile using AI](https://ghall.blog/posts/creating-a-dating-profile-with-ai). I haven't forgotten about my promise to follow up on the results from that very unscientific experiment. Though I stated I'd commit to using my AI profile for a week, I quickly realized that was not a reasonable amount of time. So a week, turned into 2, which turned into just over a month, and I finally reached a point where I feel like a follow up is warranted.
 Now, I wish I had some interesting stats to share. I wish I could say that my AI-assisted dating profile resulted in X% greater or fewer matches. The truth is there was nothing remarkable about my results. I got 5 matches in the first week-and-a-half, and zero after that.
 The only standout event was that I received a message from a woman saying she really liked my outlook on relationships, so thank you AI for so eloquently phrasing my thoughts and feelings.
 That was another thing I noticed in this experiment; it didn’t feel like I was presenting my authentic self. Yes, I vetted the text generated by the AI to ensure it wasn’t falsely representing me, but I still felt dirty. Like the few matches I did get weren’t matching with me, but with the AI. My profile may have been technically accurate to who I am as a person, but I felt somewhat removed from it.
 So, to answer the question I posed at the end of my previous post; did this turn my love-life around, or did it backfire? The truth is, neither. It was just an uncomfortably weird and disappointing experience, which is just par for the course when dating in a post-2020 world–at least in my experience. 🤷‍♂️
@@ -0,0 +1,27 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "Ask The Darn Question!"
 pubDate: 2022-11-05
 ---
 One of the areas I struggle with when it comes to working in a professional web development environment is asking questions. Whether it’s a problem I’m stuck on, or something about the codebase I don’t quite understand, I’m more likely to end up banging my head against the wall trying to find the answers myself than reach out and ask someone a question.
 It’s not out of pride, at least I don’t think it is. It’s more about insecurity. I’m afraid asking for help will somehow reveal to the more experienced devs that I actually have no idea what I’m doing. I will expose myself as a fraud who doesn’t know the first thing about development, and I don’t deserve to get paid for it.
 Of course, logically speaking, this is not true. It’s a story told with a combination of imposter syndrome, an anxiety disorder, and a copious amount of logical fallacies. I’m not a fraud, I’m just inexperienced. I can write code, and it may not be the best code ever written but it generally works, and there’s room for me to improve.
 All this to say, it’s ok to ask for help when you need it. I’m writing that as a reminder to myself as much as to you, the reader. No one person has all the answers, and in development there are a multitude of ways to solve a given problem. Consider this: you’re more competent than you give yourself credit for, but maybe you just need a fresh perspective.
 I had couple eye-opening experiences this week at work.
 Firstly, I was running into an issue where a particular set of values wasn’t getting passed through correctly in our beta environment even though everything was working perfectly when I tested locally on my machine. I was stumped. My boss took a look and suggested I get the values I needed from somewhere else. It worked like a charm! In retrospect, it seemed like the obvious solution, but its easy to get so caught up in looking at a problem in a particular way that you lose sight of other perspectives. In this case, it wasn’t that I didn’t understand what I was doing, I just needed another perspective.
 Secondly, earlier in the week I was struggling with trying to track down a particular issue in AWS. I couldn’t find the log I was looking for, and I was completely perplexed. I asked a co-worker, and he asked me if anyone showed me our naming convention for our serverless functions and how to navigate them in AWS. I said no, so he took about 10-15 minutes to show me the ropes. It was something I couldn’t have known, I’d had zero AWS experience before this job and I’m still in the process of getting to grips with our massive codebase. Nobody had taught me what I needed to know, and I had been too nervous to ask, so I just flat out didn’t know.
 So, if there’s one thing I hope we all can take away from this it’s that, if we’re truly stuck on something, there’s more harm in not asking questions. There will always be something you don’t know, and there will always be another way of looking at a problem you’re facing. As long as you’re not asking for help as a first resort, and you’re putting in the effort to try and solve the problem yourself, then just ask the darn question!
 And if you’re ever feeling any doubt, come back and read this post. I know I will.
 ---
 _This post was originally published on my (now defunct) blog on my portfolio site [ghall.dev](https://ghall.dev), and was republished here for archival purposes._
@@ -0,0 +1,45 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "Building ghall.dev 3.0"
 pubDate: 2022-10-16
 ---
 Welcome to my brand new website, the 3rd iteration of ghall.dev! For the last year-and-a-half this has simply been home to my portfolio, but for a while now I’ve wanted to expand from a simple, single-page site to a multi-page site with a blog (which you are of course reading right now).
 In the previous version of this site, I coded myself into a corner. I did a lot of little things I thought were cool, but maybe weren’t the best ideas design-wise, and put things together in such a way that I couldn’t simply tweak things very easily. One of the lessons I took from the experience of building and maintaining that site was to keep things simple, and not try to be too flashy for the sake of being flashy.
 Another lesson I took was to plan ahead for any changes. I didn’t really think about wanting to start a blog until after the site was up, and if I had made things a little easier by planning for future changes it probably wouldn’t have taken a “nuke-and-pave” to cleanly integrate a blog.
 I’m also a much better developer than I was when I built version 2. Not saying I’m amazing, I’ve only been at this since late 2020 after all, but I’ve learned a lot about coding, and organizing code in a way that makes sense. Of course, a year from now I’ll be wondering what the heck I was thinking when I originally wrote the code for this site.
 Anyway, the first step to any project like this is deciding on the tech stack. As this is a solo project, being my personal site and all, I had a bit of leeway to experiment with different pieces of that puzzle, but I decided on the following:
 ### Front-end Framework: Next.js
 I’m a relative newcomer to Next.js, as I’ve only been using it for about 2 months now. But the learning curve was really low coming from React, and I was able to pick it up pretty quickly when I started my current job.
 I prefer it to straight React in a few ways, one of the biggest being how easy it is to set up a multi-page site like this. While it’s definitely possible in React, Next.js makes it painfully simple. It was a no-brainer, and it got me rolling so fast I was able to built this website in a matter of days.
 [Check out Next.js](https://nextjs.org/)
 For styling, I went with good old Tailwind, which I also used on the previous iteration of my site. I’m a very visual person, and Tailwind makes it so easy for me to just built the designs I have in my head.
 [Check out Tailwind](https://tailwindcss.com/)
 ### Headless CMS: Cosmic
 On the previous iteration of my website, I had built a rudimentary CMS in the command line using M3O for a database, which I then served to the front-end through a small API I built. It was slow and clunky, but it was good enough for periodically updating my portfolio. But, when M3O changed their pricing model, this system became economically infeasible, so I switched to essentially hardcoding my portoflio into my sourcecode, which was something I wanted to avoid. Also, it made the fact I was building my front-end in React a little silly since I had eliminated the one bit of dynamic content on my website. But it was serving its purpose, so I left it.
 For this new iteration, since I wanted to not only go back to managing my portfolio on the back-end, but also build a blog, I knew the best thing to do was to find a pre-packaged solution so I could spend more time focusing on my strengths.
 [Check out Cosmic](https://www.cosmicjs.com/)
 ### Final Notes
 There are a couple little Node packages I’ve used to make things a little easier, such as [date-fns](https://date-fns.org/), [react-jsx-parser](https://github.com/TroyAlford/react-jsx-parser), and [Framer Motion](https://www.framer.com/motion/). I particularly had fun with Framer Motion, but I ended up really toning down some of the animations.
 Also, I ended up using the ever-popular VS Code as my text editor instead of my usual go-to, [Nova](https://nova.app/). I started using VS Code again for the first time since early 2021 because of work, and I quickly got spoiled by a lot of the autocomplete features, expecially automatic imports. There will definitly be a breakdown of my thoughts about VS Code vs Nova at some point in the future.
 ---
 _This post was originally published on my (now defunct) blog on my portfolio site [ghall.dev](https://ghall.dev), and was republished here for archival purposes._
@@ -0,0 +1,41 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "Coding With Depression"
 pubDate: 2022-11-05
 ---
 One of the reasons I started this blog, aside from wanting to share my thoughts and experiences as someone early in my web development career, was to write about mental illness as it relates to development. As you can imagine, it's not an easy topic by any means, as it's something that profoundly affects me personally on a daily basis.
 For a decent chunk of this past week, I've been struggling with a bit of a depressive episode. For me this manifests as lack of motivation, and especially "brain fog", which just kills my logical thinking and problem solving skills. Obviously this is not ideal for web development, but I've found ways to make it work and maintain some level of productivity, even if it's not my absolute best.
 ### Getting Motivated
 The first step to overcoming anything is showing up.
 Whether I'm laying in bed wishing I could just go back to sleep, or sitting at my computer struggling to make myself just open my code editor, I have to find a way to get myself motivated. When I'm hitting these low points, I've found it incredibly helpful to break things down into tiny pieces and just work through them a piece at a time.
 If I'm struggling to get out of bed, instead of trying to motivate myself to get up because I need to go to work, I focus on the process one step at a time. It's far easier to motivate myself to do a bunch of little things in sequence than it is to motivate myself to reach the end goal.
 This even applies to just tackling things throughout the day. Today I had a rather large task to complete, and I was simply not motivated to do it. I took it one step at a time, down to the most mundane steps like executing a CLI command, or opening a file. I didn't have to be motivated to finish the task as a whole, I just had to motivate myself to tackle each step until I finished.
 ### Navigating the Fog
 Brain fog is a complicated one. I first experienced the impact it has on coding when I was working on homework for boot camp. It's resulted in me blankly staring at a block of code and just totally forgetting how to read it, or just forgetting the name of a variable I defined less than a minute earlier.
 It's so unbelievably frustrating to experience. The knowledge required to understand the code, the ability needed to problem solve the issue, it's all in there somewhere but it feels like that particular brain function is out of scope.
 One of my bad habits to tackle this problem is coffee. I hate to admit it, but it does help take the edge of the fog.
 Firstly, I'd suggest some preventative measures like sleeping, getting some sun when you can, and using a light therapy lamp in the morning on those dark rainy mornings. It seems obvious, but it's worth mentioning these things help manage depression, and, by extension, brain fog.
 But if you're in the moment, the best thing you can do is just step away from the computer for a few minutes. Get up, stretch, walk around, do some jumping jacks, go outside, whatever you can do to just get away from the problem and get your body moving. It's good advice for anyone facing a programming problem, but it's especially good if you're struggling with a bit of brain fog.
 ### Be Kind to Yourself
 Through all this, the most important thing to remember is to be kind to yourself.
 I tend to be extremely self-critical on the best of days, but when I'm struggling and not producing my best work I am even more so. I have to remind myself that this isn't typical, I'm not lazy or dumb, I'm just having a rough time. It's ok to slip up here and there and not be at 100% peak productivity, because I'm doing my best and I'm getting stuff done despite the challenges.
 ---
 _This post was originally published on my (now defunct) blog on my portfolio site [ghall.dev](https://ghall.dev), and was republished here for archival purposes._
@@ -0,0 +1,55 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "Creating a Dating Profile With AI"
 pubDate: 2022-12-10
 ---
 I’ve been single for a few years now, and I haven’t had a whole lot of success in the dating game. I’m very introverted and socially anxious, so dating apps seemed like the way to go for me. Sadly, I’ve not had a lot of success, and since Covid it seems like the dating scene has only got worse. I’ve been feeling pretty down about it, but I decided to have a little fun and let an AI help me assemble a brand new profile.
 My goal is to, for an entire week, use my AI generated dating profile. That means my bio and prompts would be written by an AI and all my photos would be selected by an AI. Finally, as long as it doesn’t end in disaster, all my opening messages will be generated by an AI–all further responses will be written by me, because otherwise what would be the point?
 I decided to use [OpenAI](https://openai.com/) for the written portion, and [Everypixel](https://aesthetics.everypixel.com/) to select the pictures. For the dating app itself, the most important ingredient in this experiment, I decided to go with [Hinge](https://hinge.co/), mainly because I've never used it before.
 I decided against using AI generated images because, even though I’m letting an AI create a dating profile for me, I want it to be somewhat genuine. Also I’m not looking to catfish anybody with this image I generated just to see how good AI could make me look:
 <img src="/media/my-ai-portrait.jpg" width="260" alt="an AI-generated portrait of me" />
 Originally this was going to be one post I’d write over the course of a week, but as I was writing I decided I should split it into 2 parts: Part 1, this part, about setting up the dating profile, and part 2, coming at the end of the experiment, about the experience and how it went.
 My first step was to sign up for Hinge. I went through the sign up process, and got to photos. Hinge requires 6 photos to create a profile, so it was Everypixel’s time to shine! I collected up 42 photos from the last few years—I wasn’t aiming for 42 but, as that’s the answer to life, the universe, and everything, I decided to take it as a good omen—and proceeded to feed them through this AI (which I have no doubt added to some collection of images to train machine learning algorithms. Your welcome for the coming robot apocalypse!).
 My first photo didn’t go over very well, with a whopping 0.9% chance of being awesome. Oh well, 41 more pictures to go. After going through the first 5 photos, not a single one scored more than 8%. That’s when I noticed I could get more info about the result, and found this gem: “Surprised by the result? This service doesn't measure the coolness or beauty of a person or any object in a photo.”
 So really all I learned was that my selfies and family photos are garbage. Good to know.
 I had to go back to the drawing board. I came across [AttractivenessTest.com](http://AttractivenessTest.com) which admittedly seems more dubious than Everypixel, but sometimes we gotta make sacrifices. Anyways, it seemed to go pretty well, but there was one photo I had to disqualify because the AI kept zeroing in on someone else's face, and 3 that it absolutely refused to process, most likely because it couldn't zero in on my face.
 As I ran through the photos, I sorted them into folders based on the rating they got, from 1 to 10. I don’t mean to brag, but I got a couple 7’s. The problem though was I had 12 6’s, so I couldn’t simply combine these 2 categories so I decided to go back to our old friend Everypixel to pick the top 4 best photos of the ones rated 6. Within a few minutes I had my top 4, ranging from a 1.5% chance to 50% chance to be awesome. Quite a range, and not extremely encouraging but that’s the bed I’ve made for myself.
 Interesting note: what I consider the 2 best pictures of me with animals made it through the process and made it to the top 6.
 Next up was selecting and answering prompts. While not remotely AI, I decided it best to use a random number generator to help me select which prompts the AI should answer.
 This is where I ran into my first major roadblock. Through the magic of random numbers, for the first prompt I landed on, “Give me travel tips for…” The AI, predictably, gave me some admittedly useful travel tips, but I’m not sure that was in the spirit of the prompt. I decided it best to remove the random factor and hand-select 3 prompts I think the AI might be able to handle.
 My first selection was, “The hallmark of a good relationship is…” Boy did it deliver!
 > The hallmark of a good relationship is trust, respect, and open communication. When two people are in a relationship, they should be able to have honest and meaningful conversations, with enough understanding, patience, and empathy to make sure that both perspectives can be heard. A good relationship should also be based on mutual respect, with each person being able to express themselves and their feelings without feeling judged or belittled. Lastly, having a strong foundation of trust and honesty is essential for a healthy and fulfilling relationship.
 Sadly, it was a little long but with a little bit of trimming I got it to fit into the 220-character limit.
 Next up I picked, “The key to my heart is…” To which the AI responded, weirdly in context with the previous prompt, with the following:
 > No single "key" can unlock a person's heart. The best way forward is to build a relationship based on the qualities mentioned above.
 Finally, I picked, “My best dad joke.” The AI did not disappoint.
 > Q: What did the sea say to the beach?
 >
 > A: Nothing, it just waved!
 When I was experimenting with OpenAI initially, I had it prepare a short bio. Unfortunately, it seems that Hinge doesn’t have a field for a bio, but here it is anyway, for posterity.
 > I'm an introverted geek who loves all things tech, sci-fi, and fantasy. I enjoy staying inside watching movies, playing video games, and reading comics. I'm looking for someone who shares my interests and is up for some exciting nerd-related activities. I'm a reliable and loyal person who loves to make people laugh. I'm also an animal lover and I like to spend time with cats and dogs. If you think we could be a great match, let's get to know each other better!
 So, how well will this work? Will AI turn my love life around? Or will this backfire spectacularly? Nobody knows! But I’ll be sure to follow up in part 2. 🙂
@@ -0,0 +1,25 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "Getting Out of Your Comfort Zone"
 pubDate: 2022-12-10
 ---
 When it comes to frameworks, I’ve been firmly stuck in the React–and React-adjacent–world. Basically, my “coding comfort zone” has been vanilla JavaScript, React, and Next.js. The world of web development is much broader than that, but I’m going to be honest, I was a little scared to branch out.
 Despite my curiosity and eagerness to learn, I tend to stick to what’s comfortable, and I have to work a little harder to branch out. I’m comfortable with React, so my tendency is to learn everything I can about React. I’m comfortable with JavaScript, so it’s more natural for me to try to master that language.
 But there was a time I didn’t know how to do anything beyond a simple website with HTML and CSS (and I barely knew CSS). Heck, there was a time I was building websites with [iWeb.](https://en.wikipedia.org/wiki/IWeb) I wouldn't be anywhere near where I am as a web developer if I didn't get out of my comfort zone.
 So with that in mind, after a friend suggested I try out [Astro](https://astro.build/), I decided maybe it's time to branch out and try new things. I've also been wanting to build a blog site where I can write about my other interests outside of web development. So it all came together nicely.
 So, the other night I sat down on the couch with my laptop, opened up the Astro documentation, and got to work. Over the course of that evening I built a fully-functional blog site, learned the fundamentals of Astro in the process, and added another tool to my web developer tool belt.
 Through this experience, I proved to myself that learning new things isn’t as scary as it seems. Does this mean I’m going to go out and learn every framework? No, I don’t think that’s realistic or advisable for anybody to do. But it showed me how relatively easy it is to branch out, so I won’t be so nervous about stepping outside the comfort of the React world in the future.
 If you’re feeling like you’re stuck in your comfort zone, using whatever technologies and languages you’re used to using, try mixing things up. Find a project you want to build, and try tackling it with a tool you’ve never used before.
 Also, if you're curious, you can check out my Astro blog at [ghall.blog](http://ghall.blog).
 ---
 _This post was originally published on my (now defunct) blog on my portfolio site [ghall.dev](https://ghall.dev), and was republished here for archival purposes._
@@ -0,0 +1,23 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "Handheld Gaming"
 pubDate: 2023-01-07
 ---
 I don’t know if it’s the particular mood I’ve been in, the colder weather, or some combination of the 2, but something about cozying up with a handheld game console has been incredibly appealing lately. My PS5 sits under my TV, streaming the occasional movie or show, and begging me to jump into that Witcher 3 update, or continue playing Tales of Arise. Meanwhile, my Switch Lite is getting all the love.
 Generally speaking, I feel like I’ve logged most of the game time over the course of my life on a handheld of some kind, from my GameBoy Pocket, all the way up to the Switch Lite. The first console I ever bought with my own money was a GameBoy Advance SP. Portable gaming is in my blood! (Ok, maybe that’s a touch dramatic…)
 That’s not to say I didn’t ever play home consoles. I’ve had every Nintendo system since the SNES–yup, that includes the Wii U–and got into PlayStation around the mid-PS3 era.
 The thing is, my parents were divorced by the time I was into gaming, and the home consoles lived at my dad’s house. But I spent a majority of my childhood at my mom’s, and she didn’t want those things around, and I was only allowed to have my GameBoy. To this day, I’m not sure why that was. Maybe because she found it less annoying.
 Growing up, console games were a treat I got on the weekend, so most of my afternoons after school were spent playing Pokémon, Super Mario Land 2, Link’s Awakening, and others that I could take this whole blog post listing.
 I had some big gaming firsts on handhelds; My first RPG? Pokémon Red. My first Final Fantasy? Final Fantasy IV Advance. My first Zelda? The aforementioned Link’s Awakening. The first game I put 100+ hours into? Pokémon Silver.
 Handheld gaming even kept me sane during lockdown in 2020. Let’s not talk about how many hours I logged in Animal Crossing and Fire Emblem Three Houses I logged during that time. Yeah I played some console games–notably, I replayed and re-completed Horizon Zero Dawn–but I practically wore out my original Switch Lite that year.
 Maybe there’s something nostalgic about handheld gaming that draws me in when I just want to get cozy, even if I’m playing a newer game that I’m not necessarily nostalgic for. Maybe my brain gets tired of the flashy, blockbuster-level graphics of home consoles, and just longs for something simpler.
 Whatever the case, my biggest trivial fear in life is handheld gaming going away, because mobile games do not cut it at all.
@@ -0,0 +1,55 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "iLeopard - A Retrospective"
 pubDate: 2022-12-26
 ---
 I few months ago I rediscovered among some old project folders the source code and markdown files for an old blog I ran in the early 2010s. With nothing to do on the afternoon of Christmas Eve, which was a brisk 15°F, I decided I wanted to search through and try to find a rather lengthy retrospective I wrote on Star Trek: The Next Generation. Now that I’ve finally started up a new blog I thought it would be fun to touch it up and republish it, since I put so many hours worth of work into it back in the day. Upsettingly, it was not there.
 But I did find a rather salty post I wrote about a Mac theme I created back when I was a senior in high school. I thought it would be nice to go back and take a fresh look at the project, and how I feel about it now, being another 10 years removed from it.
 If you were around the Mac customization scene–specifically on the now-defunct MacThemes.net–around 2007, you probably remember a little project called iLeopard. Admittedly, the chance that you’re in that extremely specific niché is incredibly small. The best data I could find is this [Ars Technica article](https://arstechnica.com/gadgets/2007/03/7296/) from March 2007 saying the Mac hit about 6% marketshare. And only a tiny subset of those users even had the thought that customizing the look of Mac OS X was something they wanted to do.
 <img src="/media/mac-os-10-1.png" width="90%" alt="a screenshot of Mac OS X 10.1 with various apps open" />
 *Mac OS X 10.1 and the Aqua Interface, from* [_GUIdebook_](https://guidebookgallery.org/screenshots/macosx101)
 I was one of the few that had that had that idea pop into my head. I was super into finding and downloading cool themes, including one I distinctly remember that looked like Windows Vista for some reason. It was 2007, the Aqua Interface (the playful, plastic-looking interface style Apple used for about a decade) was already feeling a little passé to me. I wanted something new, and weirdly enough that new thing came from Apple, in the form of iTunes 7.
 <img src="/media/itunes-7.gif" width="80%" alt="a screenshot iTunes 7 with the iTunes Music Store open" />
 _iTunes 7 screenshot, from [AppleInsider](https://appleinsider.com/articles/06/09/12/apple_introduces_itunes_7_previews_itv_device)_
 In retrospect, and with the hindsight of 15 years of UI design evolution, it’s not exactly pretty, but I liked it at the time. It was classy, and simple, and I thought it was the future of the Mac OS X design language.
 Fast-forward to the release of Mac OS X Leopard, and I was disappointed to see that the bubbly, lick-able scrollbars and buttons were still quite prominent. Having dabbled in the Mac OS X theming scene already, I decided to take matters into my own hands.
 There was a small problem though. With the release of Leopard, Apple changed the format the system used for UI resources, and introduced a new framework to power it all, called CoreUI. The tools that had existed to make theming the OS relatively simple were useless.
 If you’re curious, [here’s a writeup](https://arstechnica.com/gadgets/2007/10/mac-os-x-10-5/10/) from John Siracusa’s Mac OS X Leopard review about CoreUI, which was, if I recall, what served as the starting point on the road to being able to even locate the system files I needed to crack open.
 Now, just as a heads up, most of what follows is based on memory and a fairly cringy blog post I wrote 10 years ago and found in the bowls of my digital archives. Also, my memory on the timeline is a bit fuzzy, but with some digging I found that this mostly takes place between April and June 2008.
 Basically, the main barrier to theming Mac OS X Leopard were 2 files; ArtFile.bin, and SArtFile.bin. This is where nearly all the UI resources were stored, aside from scroll bars, which were stored in a file called Extras.rsrc, a file that had been cracked ages before. If I recall–and I could be totally wrong so if anybody knows better feel free to tell me–Extras.rsrc, and its sister file Extras2.rsrc, still contained all the UI resources, but only the scrollbars were actually used by the system.
 I want to make it clear that I can’t take the credit for cracking open ArtFile.bin and SArtFile.bin. I believe it was someone on the MacThemes.net forum, and I wish I could remember or find their name–if you’re out there reading this, thank you! Those files were essentially encrypted ZIP files, and this genius of a human build a command line tool to decrypt and extract them. This was actually the experience that got me comfortable with the command line, and we’ll say indirectly led to my current career as a web developer, but I digress…
 Anyway, I knew where to find the files. I had the tool to decrypt the files. The only thing that stood in my way was the mass of nonsensical folder names filled with equally nonsensically named bitmap images that got extracted from the files.
 Being that I was a bored teenager in high school with way too much time on my hands, I decided to figure out exactly what every bitmap image was by methodically changing the graphics to the most garish colors I could, recreating the bin files–which if I recall was as easy as zipping them up and renaming them, but this was 15 years ago so I could definitely be misremembering–restarting my computer, and hunting down the various neon hues while taking notes.
 After dozens of restarts, and a couple corrupted OS installs, I had figured out a good chunk of the building blocks making up Leopard’s UI. Even still, after weeks of this, there was still so much to be done. Bear in mind, there was no documentation on any of this stuff. I was about to create, as far as I know, the first theme for Mac OS X Leopard.
 <img src="/media/ileopard-2-0-1.png" width="75%" alt="a screenshot of the Mac OS X Appearance preference pane showing off the modifications made by iLeopard" />
 _iLeopard 2.0.1 screenshot, from [AmazingHenry on MacRumors](https://forums.macrumors.com/threads/ileopard-theme.2045553/), released by fellow MacThemes.net user ‘gcamp' after I essentially handed off the project_
 I started pulling elements from iTunes, and, using a “totally legal, I swear” copy of Adobe PhotoShop, tweaked them to fit in their new home. I shared the very first version of the theme, which I called iLeopard, a portmanteau of iTunes and Leopard, on the MacThemes.net forum (thankfully archived [here](https://web.archive.org/web/20080702015727/http://macthemes2.net:80/forum/viewtopic.php?id=16785679&p=1) by the Wayback Machine!!), and it kind of took off more than I expected. By that, I mean people actually used it. Then it made the MacThemes.net front page. Yeah, it was all a bit overwhelming.
 At some point, I got an offer to help out with the theme from fellow forum user ‘gcamp’. This was probably the best possible thing to happen for the longevity of the theme. He initially started by contributing custom graphics, and ended up taking the reigns on the project after I graduated high school and lost my passion for the project. He kept the project alive, I believe until Apple effectively killed Mac theming for good a few releases later.
 The sad news is I lost all my original work on iLeopard, along with countless other digital relics from that era of my life, when my MacBook suffered a major hard drive crash in 2011. I had to go on a crazy archeological dig through the internet just to find the above screenshot, and it’s from after I handed off the project. I did reach out on Mastodon on the extremely off-chance that someone had some more screenshots, or even a pre-2.0 installer, but I haven't got back anything substantial as of this writing.
 What’s been interesting as I’ve written and researched this piece is the contrast between the Apple of 15+ years ago, and the Apple of today. It was a weird time, they had just completed transitioning the Mac from PowerPC to Intel–interestingly, we’re currently in the midst of a transition from Intel to Apple Silicon–and the first iPhone was brand new.
 Security on the Mac was pretty laissez-faire, to the point where a dorky high school kid could modify system files and create a simple tool to let other people install those modifications. These days, as a more security-conscious user, that idea horrifies me. But at the same time, I do miss being able to tinker with the little parts of software that weren’t made to be tinkered with.
@@ -1,29 +0,0 @@
 ---
 import { formatInTimeZone } from "date-fns-tz";
 import Layout from "../../layouts/Layout.astro";
 const response = await fetch(
  `https://api.cosmicjs.com/v2/buckets/${
    import.meta.env.BUCKET_SLUG
  }/objects?pretty=true&query=%7B%22type%22%3A%22blog-posts%22%7D&read_key=${
    import.meta.env.BUCKET_READ_KEY
  }&limit=25`
 );
 const posts = await response.json();
 ---
 <Layout title="Blog Archive">
  {
    posts.objects.map((post) => (
      <div>
        <a href={`/posts/${post.slug}`}>{post.title}</a> -{" "}
        {formatInTimeZone(
          new Date(post.published_at),
          "America/New_York",
          "MMM do, y"
        )}
      </div>
    ))
  }
 </Layout>
@@ -0,0 +1,47 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "My Favorite Little Apps"
 pubDate: 2022-11-28
 ---
 There are a lot of apps on my Macs that I use every day. There’s the big ones like Nova for coding, Brave for testing and dev tools, Craft for taking notes and keeping track of projects, and many more. But I wanted to pay special attention to the smaller apps that I use that just hang out in the menu bar or the background that make working in MacOS that much more seamless and enjoyable.
 ### Itsycal
 This is a cool little free that puts a calendar in your menubar. It’s a great way to get a quick glance at my day, and join Zoom/Google Meet calls without opening a full calendar app.
 [Download Here](https://www.mowglii.com/itsycal/)
 ### Tot
 A note pad that lives in your menu bar! I use it for jotting down notes during meetings, temporarily storing snippets of text and code, making quick lists, storing links for later…you get the idea.
 The Mac app is free, but you can also buy an iOS version.
 [Download Here](https://apps.apple.com/us/app/tot/id1491071483?mt=12)
 ### Rectangle Pro
 Snap, resize, and align windows with keyboard shortcuts, or by dragging then across the screen. It’s highly customizable, and I’m going to be honest I haven’t even scratched the surface of the variety of options the Pro version provides, I just bought it to support development.
 There are a lot of apps for Mac that do similar things, but this is, in my opinion, the best available.
 [Download/Buy Here](https://rectangleapp.com/)
 ### Velja
 Because I use Safari as my primary browser, but prefer to use Brave for development, this app saves me time and mouse clicks. Basically Velja routes links opened from any app to any browser you have installed. For example, I have it set up to open any ‘localhost’ URLs in Brave.
 It offers a variety of built-in filters that will even work with certain apps (like Apple Music, Discord, Zoom, etc).
 [Download Here](https://apps.apple.com/us/app/velja/id1607635845?mt=12)
 ### Contexts
 It’s the built-in command + tab app switcher on steroids! Instead of a row of icons, you get a list of every window that you can either tab through or even search by app or window title. It’s another app I feel lost with if I’m using a computer without it installed.
 [Buy Here](https://contexts.co/)
 ---
 _This post was originally published on my (now defunct) blog on my portfolio site [ghall.dev](https://ghall.dev), and was republished here for archival purposes._
@@ -0,0 +1,26 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "My MacOS Home Directory Overview"
 pubDate: 2022-12-23
 ---
 On [the latest episode of ATP](https://atp.fm/514), Casey, John, and Marco discussed MacOS home directories. After I was done cringing at John keeping his git clones in the root level of his home directory, I started thinking about how I use my own home folder, and how I keep it organized. I won’t go into the hidden items, because I don’t think either of us want that (with hidden items included, my home directory has 34 documents, and 47 folders 😅).
 Anyway, here’s my overview...
 - Applications - Honestly, all that’s in here are a handful of Shortcuts, and I’m not sure why because I never put them there.
 - Desktop - This is empty, because I don’t keep anything on my desktop.
 - Developer - Now this is where git clones go. Mostly web projects, a folder for all my work repos, and the [Playdate SDK](https://play.date/dev/) from when I was fiddling with that a couple months ago.
 - Documents - Basically just a folder where Divinity: Original Sin 2 keeps its saves, and where I keep various Pages documents and PDFs for some reason (I should probably sort through that at some point)
 - Downloads - Self-explainitory. I tend to keep this clean manually and with Hazel scripts, so there’s nothing of note in here at the moment.
 - Movies - Empty, except for my TV.app library.
 - Music - Same as above, except with my Music.app library.
 - Pictures - My Photos.app library, as well as a hodgepodge of scanned photos, drawings, desktop wallpapers, and GIFs I like. All sorted by folder, of course. I’m not a monster!
 - Postman - From when I tried Postman, and then immediatly switched back to Insomnia.
 - Public - I don’t think I’ve ever used this folder.
 - Sites - Same as above.
 - Sync - A synced folder, used by an app called Sync, that syncs little bits and bobs like shell scripts and Hazel rules between my 2 Macs.
 I didn’t bother listing my Library folder because there’s not much to say about that–it’s the same as it is on anyone else’s Mac.
 On an additional note, I would really like an iCloud Drive folder in the home directory. I could add one with an alias or symlink, but it just seems weird to me that it’s squirilled away in the Library folder, crytpically named ‘Mobile Documents’.
@@ -0,0 +1,31 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "My Top 3 Games of 2022"
 pubDate: 2022-12-09
 ---
 The Game Awards were last night, so I was inspired to take some time and write about my personal game of the year. But I couldn't narrow it down to just one, so I picked 3 games which were nominated for several awards but didn't get much, if any, recognition.
 ### Xenoblade Chronicles 3
 I'm not a huge JRPG fan, but with the original Xenoblade Chronicles being among the few I've finished, I had to check this out. It ended up being pretty much the only game I played for weeks.
 It scratches several RPG itches for me; a compelling cast of characters, a fun combat system that you can spend hours just experimenting with, and an intriguing world I still long to go back to even months later. This is definitely a game I will keep coming back to, between all the side content I still have left, and the DLC that's slowly rolling out.
 Is it a masterpiece? Probably not. But it stands among Persona 5 and Dragon Quest XI as another modern JRPG that I can not only stomach, but thoroughly enjoy. And to think, I almost skipped out on it because I thought Xenoblade Chronicles 2 was absolute cringe.
 ### Tunic
 I don't play as many indie games as I would like, and I finish even fewer. I love indie games, perhaps a little too much, because I'm always jumping around to the latest one that's grabbed my attention. Thankfully, Tunic is one I managed to finish.
 It came at just the right time, I had just wrapped up Xenoblade Chronicles 3, and I was in the modo for a light action-adventure game. I was ready to start another playthrough of Link's Awakening HD, but I happened to see that this adorable looking game starring a cute fox was about to drop on PS5 and Switch (it had been on Xbox since March I believe, but I don't have an Xbox).
 I was not prepared for the challenge this game posed, but it was just the right kind of challenging that made me go, "Ok, I need to show this game who's boss!" Beyond challenging bosses, the game mechanics are never tutorialized. Instead, you collect pages of the game's "manual" as you play, and have to figure things out from there. Even simple things like how to upgrade your stats isn't explained to you in plain terms.
 ### Horizon Forbidden West
 Horizon Zero Dawn launched in a crowded year for good games, but it stood out to me for its incredibly engrossing story, and its primary mechanic of fighting giant friggin' robots. I was captivated from the start, and was chomping at the bit for a sequel. That sequel finally came, and once again got buried by other games (yeah, I'm looking at you, Elden Ring). But I didn't care, I wanted to see the next chapter in Aloy's story.
 I will confess, the story didn't grab me as much as the first game's. It was a satisfying continuation for me, without a doubt, but part of the mystery that made the first game so compelling–namely; how the world ended up in the state it is in the game–was already solved.
 The gameplay in this sequel, however, was a _huge_ improvement. Melee combat, world traversal, side content, it was all so much better in this game, and showed that the developers took the feedback of the first game to heart. I couldn't put this game down, and once the new game plus patch dropped I jumped right back in. And I'm anxiously awaiting the Burning Shores DLC dropping next year!
@@ -0,0 +1,17 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "Next.js 13 and Exploring New Technologies"
 pubDate: 2022-10-28
 ---
 Next.js 13 was launched a few days ago ([More details here!](https://nextjs.org/blog/next-13)), and I’ve been slowly working my way through the new stuff. As a relative newcomer to the world of Next.js I’m very excited by what I see, but I also don’t want to get too bogged down in what’s new because I’m already feeling a little bombarded with new stuff at my day job. Besides, it might be a while before I get to use Next.js 13 in a professional setting.
 Yes I’m a tech nerd, and I become easily enamoured with the shiny new thing, perhaps to a fault, especially when that shiny new thing is a piece of software. I’m the guy who installs OS updates on day one—MacOS Ventura seems to be running fine so far, _knock on wood_—and I just want to just dive head-first into Next.js 13.
 But, when you’re as new to the industry as I am, there are already so many new tools and technologies to learn it can already seem overwhelming without throwing in trying to keep up with the latest in the ever-evolving world of web development.
 My attitude is embrace the curiosity, but focus on mastering the tools you’re currently using on a daily basis. Whether you’re using an entirely different set of frameworks,, or if you’re like me and just using an older version of Next.js, the new shiny stuff will still be there when you’re ready. And possibly, by the time you’re ready, an even newer, shinier technology will be around for you to check out.
 ---
 _This post was originally published on my (now defunct) blog on my portfolio site [ghall.dev](https://ghall.dev), and was republished here for archival purposes._
@@ -0,0 +1,23 @@
 ---
 layout: ../../layouts/BlogPost.astro
 title: "On Text Editors"
 pubDate: 2022-10-22
 ---
 Among the various types of software tools I use every day, the one I spend a majority of my time in is a text editor. If I’m going to be spending most of my working day using one of these tools, I want it to be something that I enjoy using, and helps me work the way I like to work.
 There are certainly no shortage of text editors out there. I’ve tried more than I can name, and I haven’t even scratched the surface of what’s out there. The most popular out there is Visual Studio Code, and it’s no mystery why. It’s absolutely packed with features, code completion is top notch, and there’s an extension for just about anything you could ever imagine.
 But I’m going to be honest, I’m a Mac user and a bit of a software snob. I do use good old VS Code when the mood strikes me, but I’ve come to far prefer Nova, a fantastic piece of software from the people at [Panic Inc.](https://www.panic.com/) It’s fast, it’s clean, and most importantly for me, it’s MacOS native.
 Nova has its drawbacks. It’s extension support is nowhere near VS Code’s. It’s also got some janky-ness when working with JSX files, at least in my experience. On the other hand, while some people might find its code completion leaves much to be desired, for me, outside of automatic imports, it’s a lot less frustrating.
 Basically, I still use VS Code from time to time. I turn to it when I’m working my day job, which involves working on a fairly large Next.js codebase, and I need to collaborate on something, or if I’m building out new components I need to import. I also built this website entirely in VS Code. Still, I far prefer using Nova.
 At the end of the day, the tool you use doesn’t really matter. Using a particular text editor isn’t going to make you a better developer. The only thing that really matters is you use the tool that you like. Don’t just use VS Code because it’s trendy, or Nova because I’m singing its praises. I know people who swear by Sublime Text, WebStorm, and BBEdit. The best tool for web development is the one that works for you.
 Even if that tool is vim. 😉
 ---
 _This post was originally published on my (now defunct) blog on my portfolio site [ghall.dev](https://ghall.dev), and was republished here for archival purposes._
@@ -1,3 +1,11 @@
 {
-  "extends": "astro/tsconfigs/base"
+  "extends": "astro/tsconfigs/base",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@components/*": ["src/components/*"],
      "@layouts/*": ["src/layouts/*"],
      "@styles/*": ["src/styles/*"]
    }
  }
 }