Posts

A new blog, and an attitude shift

It’s been a minute since I actually wrote a post for this blog; let alone something of substance. So here we go!

The Reconstruction

For the past 4-5 years of this blog’s existence, it’s been hosted on Hashnode. I originally started using that platform because it was super easy to write content and manage assets using their WYSIWYG editor.

To understand why I moved, we need to discuss my history as a web dev first. When I started, I was big into React & Next.js, which is what the first versions of my portfolio website and projects were built with. Relatedly, I also used Vercel for basically all hosting.

Building a sub-$200 4TB NAS

Recently, I finished putting together my first NAS. A lot of the inspiration for this build came from Serve The Home, Jeff Geerling, & Hardware Haven. As the title says, I managed to get everything I need for less than $200 (pricing breakdown at the end). Here, I’ll be digging into the how I found my parts, specs of my system, and benefits of this approach.

Disclaimer: If you are looking to build a known reliable NAS, anything for a commercial application, or anything otherwise mission critical, this is not the right approach. I am a homelabber at heart and this post is about building on the cheap as a means of learning new tools and technologies.

How to set up an xRC game server on Ubuntu v20+

What is xRC?

You’re probably familiar with what it is if you’re here, but for those who are unaware: xRC is a simulator for FIRST Robotics Competition, FIRST Tech Challenge, and Vex Robotics Competition games.

To play multiplayer remotely, you must use one of the servers set up by others (of which there are not many) or you have to set up your own server, which is what we’re gonna do today. xRC does have its guide for AWS, but it’s very specific to AWS and doesn’t provide much background for other cloud providers.

Use NextAuth to authenticate API requests

NextAuth is a great way to authenticate users for your Next.js app. However, Next.js API Routes are not a good substitute for a full backend framework. In this article, we’ll address all the setup required to use NextAuth’s cookies to authenticate against a separate backend. While I am using NestJS as my backend framework, the general logic/flow is portable to almost any backend framework.

**Important Note: ** You can avoid a lot of this by proxying your API requests through Next.js. This tutorial is specifically for an API server on a separate, subdomain.

Deploying Prisma Migrations via Github Actions

Do you use Prisma? Do you want to engage in proper practices? Well here’s a post for you! In this post, we will discuss how to automatically deploy Prisma migrations with Github Actions.

Why would this be necessary?

Generally speaking, it’s not a great idea to use a single database in production and development. However, with relational databases, this becomes tricky: How do we make sure that the schema matches what the program expects in any given environment? Prisma alone is a great help in this regard with the prisma migrate command which assures that schema migrations are safely performed. There is still a remaining issue though: When we change the schema and perform a migration, we also want that migration to be executed on the production database when the app is updated. Github Actions provides a perfect solution to this: we can create an action which runs on any given event when the folder prisma/migrations changes. This action can then run the prisma migrate deploy command to update the database.

My List of VSCode Extensions.

Like millions of other developers, I use VSCode. It’s not particularly remarkable, but I decided to make a personal list of my favorite extensions. Many of these are plenty well known in the community, but when I started, it look me some time to find out about some of my current favorites. I figured I’d create a central list for beginners to find and that I can send to beginners. This list is separated by language/application/library; ie: Git, Markdown, etc. I will not be including language tooling or Intellisense extensions. If you are reading this and know of an extension you think I’d like, please leave a comment!

Building My Website: Part 2 Electric Boogaloo

At this point, we’ve established that I have paired React and Next.js with TypeScript to make my website. The next challenge is: How am I going to style it?
I knew from the beginning that I didn’t want raw dog the whole thing with plain old CSS. This also meant that I wouldn’t be taking advantage of Next.js’ built in support for CSS Modules. These days, I think there are more efficient ways to do things.

Building My Website: Part One

[!WARNING]
Information in this post may not be accurate and links may be dead.

:::warning

Some content with Markdown syntax. Check this api.

:::

First off: Why not just use HTML & Vanilla JS?

Yes, I know that there is an inherent speed benefit to using HTML. There are a couple reasons why I chose to go with a JS framework. The main reason is Reusable Components. This is a feature of all JS frameworks that are worth learning. I know that I will have multiple pages that will need to have a similar layout and this is the way to go. The other reason is that I find it significantly easier to integrate features when using a framework. Take React for example: the useState hook is super useful.