Back to projects
05 de jan. de 2024
4 min read

My Old Website

Personal website created from scratch with Jekyll and GitHub Pages, prioritizing performance, simplicity, and knowledge sharing.

Cover

🌐 About the project

This was my first personal website, developed entirely from scratch with the goal of:

  • Sharing learnings and technical content
  • Presenting my projects and skills as a developer
  • Building a public and versioned portfolio

It was a transformative experience, both technically and personally, as it taught me a lot about deployment, versioning, and web development best practices.


🛠️ How it was developed

The stack used was simple and efficient:

  • Jekyll as a static site generator
  • HTML5, CSS3, and Javascript for structure, style, and interactions
  • Markdown for content production
  • GitHub Pages for hosting
  • GitHub Actions for deployment automation
  • Custom domain, with DNS configuration

The site was fast, responsive, and fully automated.


💡 Technology choices

Despite the popularity of frameworks like React or Vue, I chose to use Jekyll for the following reasons:

  • Static sites are faster, safer, and more economical
  • Jekyll is simple, straightforward, and has an active community
  • Ideal for blogs and portfolios, without unnecessary overhead
  • Native integration with GitHub Pages, facilitating deployment

This choice allowed me to focus more on the content and structure of the site, without wasting time on complex configurations.


📚 Learnings

This project was essential for my technical growth. Some of the main learnings were:

  • Configuration and maintenance of a custom domain
  • Use of GitHub Actions for automated CI/CD
  • Complete control of structure and responsiveness
  • Creation of a blog with Markdown
  • Good practices for accessibility and performance

In addition, I faced (and solved) several challenges typical of building everything from scratch.


🧠 Development experience

This project was a mix of frustration, pride, and learning.

My initial goal was simple: “Have a site to present my projects, briefly tell my journey, and maybe publish some articles.” I achieved this, but soon felt the limitations of the stack: I wanted to include code snippets with highlighting, images with lazy-loading, paginated articles, support for multiple languages, among other features that would require disproportionate effort on a static site.

I literally did everything from scratch, from the index.html to the colors, animations, responsiveness, and every detail of the CSS. One of the biggest challenges was configuring and connecting the custom domain, as well as improving SEO, integrating with Google Analytics, and automating deployment with a pipeline in GitHub Actions.

I even created an integration with the Dev.to API to automatically publish articles, a learning experience that even led to an open source contribution (I wrote about it here).

Despite the progress, many ideas were left behind, as shown in this board:

board-image

I completed more than X tasks, left some in progress, and others remained only in the planning stage, due to pure exhaustion or the complexity involved.


🔁 Transition to the new site

Over time, I realized it made more sense to use a modern template and focus on content and backend, my true areas of interest. The new site, which you are visiting now, was created with the Astro Sphere template and adapted to my needs.

Today, my focus is on backend development and software architecture, and it no longer made sense to maintain a site 100% handmade just for aesthetics. If my goal was to pursue a career in UX/UI, perhaps it would be worth it. But at this point, being functional and scalable speaks louder.


🔮 Next steps

The old site still had several ideas in progress, which were controlled by the GitHub Projects tab. However, I decided to discontinue it to make way for this new space, more beautiful, functional, and with more freedom to write on my blog.


This project represents much more than lines of code: it was the beginning of my autonomy as a developer.

🚧 Comments section under construction 🚧