Notes on creating a personal site using Astro
2024-12-20
Written by: Cristián Valencia
Building a personal website is a common milestone for professionals in our field, particularly for PhD students preparing to enter the job market. In fact, it has become almost mandatory at this stage of one’s academic journey. With this in mind, I knew I needed to start this project at some point.
Initially, I began building my website using Hugo and, more specifically, the Mierzejewski’s Console Theme. However, my limited understanding of Hugo’s and Go’s syntax and structure eventually led me to migrate this theme to Astro.
Why choose Astro, especially as a PhD student in Economics? One key advantage is its comprehensive tutorial, which guides users through creating a personal blog from scratch. The tutorial also covers deployment using Netlify, whose free version is more than sufficient for a student’s needs. This combination of user-friendly resources and powerful features made Astro the ideal choice for my project.
After choosing Astro as your tool, here are the steps to build your personal website:
Create a GitHub Account
Sign up for a GitHub account and create a repository for your website. This repository will store all the files and code for your project.
Complete the Astro Tutorial
Go through the Astro tutorial to gain a solid understanding of the framework and the basic structure of your website. While prior knowledge of JavaScript is not mandatory, it will be highly beneficial.
Choose a Theme
Instead of designing all the aesthetics from scratch, explore Astro’s Themes. These themes provide excellent examples of website layouts and functionalities. Many are free to use, and you can download their GitHub repositories to incorporate the entire structure or specific elements into your website.
Set Up a Netlify Account
Create an account on Netlify. This platform will be used for deploying your website.
Deploy Your Website
Link your GitHub repository to your Netlify account. Netlify’s free plan allows you to host one site with ample bandwidth for academic purposes.
Automatic Updates
Each time you update your GitHub repository, Netlify will automatically generate a new version of your website.
Domain Name
You don’t need to own a custom domain (e.g., yourname.com) initially. Netlify provides a default subdomain that you can use temporarily. Later, you can purchase a custom domain through Netlify or another provider and link it to your website.