Welcome to a behind-the-scenes look at my new website, Alser.ca! Building it with Jekyll was a fun challenge, and I wanted to share the story of how this project came to life. We’ll dive into the helpful tools I used, some of the key lessons I picked up along the way, and what I’ve got planned for the future. Let’s get into it!

Development Tools

Here are the essential tools that made developing this site a smooth process:

  • Jekyll Documentation: The official documentation at https://jekyllrb.com/docs/ is the ultimate reference for installation, configuration, and troubleshooting.
  • Visual Studio Code: A powerful code editor with excellent extensions for Liquid syntax and an integrated terminal for running Jekyll commands, streamlining the entire coding process.
  • GitHub: Essential for both version control with Git and for effortless, free deployment. Pushing code to a repository automatically builds and hosts the site via GitHub Pages.
  • Gemini: A helpful AI assistant for generating code snippets, debugging errors, and accelerating content creation, from drafting posts to brainstorming ideas.

Implementation

My game plan was to keep it simple, so I started by wireframing a basic layout and the must-have content. For hosting, I went with IONOS Deploy Now since I’ve used it before. Instead of building from scratch, I found a Jekyll blog template on GitHub and forked it to get a head start. From there, I connected Deploy Now to my repo with a GitHub Action to create a sweet CI/CD workflow. After that, it was easy—I could just work on the site in VS Code, push my changes to GitHub, and watch the magic happen as it deployed automatically.

All the updates are reflected in CHANGELOG.md Overview and additional information are posted in README.md

My process was all about conitnous iteration and improvement. I have to be honest, a lot of “vibe coding” happened here, just tweaking things until they felt right. This is where a tool like Gemini really shined. I used it constantly to generate boilerplate code and to do quick grammar checks on my content, which saved a ton of time and let me focus on the bigger picture.

Future Plans

Here are some ideas for future improvements to a Jekyll site:

  • Add a comments section: Integrate a third-party comments service like Disqus or Commento.
  • Implement a search functionality: Use a service like Algolia or a simple JavaScript-based solution to add a search bar to your site.
  • Optimize for performance: Minify your CSS and JavaScript, and compress your images to make your site load faster.
  • Add a portfolio or gallery: Showcase your work with a dedicated portfolio or gallery section.

Lessons Learned

Here are my main takeaways from this project. One: Start with a simple theme. Customizing is way easier than building from scratch at first. Two: Learn the folder structure. It’ll save you a ton of time when you need to find or fix something. Three: Use Git. It’s a lifesaver for tracking changes and makes deploying your site a breeze. Four: Just play around! Experimenting is the fastest way to learn and make the site your own.