Making this Website

Hello! Yes, it’s me, Ricky, and I’m here to share my crippling thoughts and struggles of making things into the void.

There’s a common saying in software development that things will always take longer than you think and involve more complexities than you imagine, so it’s best to organize projects early on to prevent technical debt, like how I really should’ve started this sentence with a better structure. Oh well.

I was opposed to the idea of creating a personal website at first (tacky, much?), but I think it is valuable for a couple of reasons. The first annoying practical reason is that it provides a more concrete showcase of many projects I’ve done that is easy to parse by recruiters/evaluators who spend 30 seconds skimming each applicant. The second is that it encourages reflection on past projects, highlighting one’s progress and the utility of each when laid out together.

Thirdly, it provides an opportunity to learn about deploying a website. I have previously helped deploy the newest Florida Resource Map release during my time at FCI, but unlike traditional React apps, this was built with Vite, written in TypeScript, and needed to be deployed from scratch. Looking back at old projects and university education as a whole, many early creations are done in the safely contained world of the IDE without regards for code maintenance, user-friendly interaction, scaling, or any real-world concerns. People can embellish their contained experiences all they want, but it’s a world of difference to the messy, convoluted stack of real-world software.

Ok, let’s not get too pompous here as an inexperienced college student, and focus on the deployment process.

Most of the website itself was fairly straightforward, though I wasn’t able to port some project executables to run in the browser. I started the process using Heroku, but ran into errors during the production build with an import not being satisfied, and soon realized that linking GitHub Pages to the domain would be sufficient.

First, I needed to integrate Prettier with ESLint, which mandates the specific code styling. It was particularly annoying when Prettier would impose different guidelines every time I saved a file, thereby introducing ESLint errors such as using or excluding semicolons (though the auto-fix option made it relatively quick). So, I finally updated the project to integrate Prettier into ESLint so that saving would always style the file as desired.

Next, I needed to move my images from a custom ‘assets’ folder to the existing ‘public’ folder, which Vite serves from automatically in static builds (rookie mistake). This was necessary because the root would be specified at this location during deployment, not relative to the file, like in local builds.

Lastly, I needed to configure gh-pages and link the domain properly. With some help from a peer, I navigated several complications and was finally able to run npm run deploy and link both the www subdomain and the root domain to the page.

There will always be more to do, but that completed my first website deployment, if only a prototype. Seeing the redundant Home and About pages, I decided to start this blog at the spur of the moment, hopefully adding a bit of humanity to my portfolio and giving me an avenue to rant/reflect on annoying roadblocks.

Toodaloo!