Website

Author

Matthew DeHaven

Due

April 1, 2024

Modified

March 31, 2024

1 Submission for the Website

  • Submit the URL for your website on Canvas

2 Website Task

Every academic should have a website for displaying their contanct information and work. It is especially important for the job market when potential employeers will look for your website as a way to see the latest version of your job market paper. It is also better to have an older website than a younger one, as you want your personal wesbite to come up first when someone searches “[your name] economics”.

With that in mind, this assignment asks you to make an academic website on GitHub.

Note

If you already have a personal academic website, you have two options:

  1. If that website is hosted using GitHub Pages, you may update it and add something new and submit it.
  2. Otherwise, you may instead make a website for your final project for this class.

I want everyone to use Github Pages for this assignment.

Your website should include:

  • your email
  • links to your GitHub
  • A brief description of your interests
  • An “About Me” page with a longer description
  • A research or publications page

3 Making a Website

You will be hosting it on GitHub Pages.

Templates

There are many different options for making a website, but I have made two templates to make things easier:

This template is written entirely in static html files and uses Bootstrap for formatting on desktops and mobiles. It requires editing messy html files, but does not require any compiling or rendering of the site—because it is html already.

This template uses Quarto to build a website. This requires rendering quarto markdown documents into html. The benefits are that the quarto markdown documents are much cleaner to edit and that Quarto has a lot of features for making a more complicated site without having to learn any html.

Other Website Options

I want to highlight a few other options for making sites on GitHub pages.

You are free to use either of these as templates for your site. Jekyll and Hugo are both similar to Quarto in that they allow you to write your content in markdown and easy-to-read formats and then render those into html without having to write html yourself. Jekyll has the added benefit that GitHub Pages will render the site for you.

4 Using the Templates

Once you have chosen a template,

  • Click “Use this template” and “Create a new repository”
Important

If you are making a personal website on GitHub, name your new repository “<yourgithubusername>.github.io”. This will make it the default website for your GitHub account. If you are making a website for a project, you can name it whatever you would like.

Once you have created the repository,

  • Open “Settings”, then “Pages” from the menu

Then, depending on the template you chose,

  • For the Boostrap template, set the Branch to “main” and leave the folder as “root”
  • For the Quarto template, set the Branch to “main” and the folder to “docs/”
  • Hit “Save”

GitHub will now launch an Action that builds the site. It may take a few minutes, but then refresh the page and you should see a link for your site at the top of the GitHub Pages Settings page.

Editing the Templates

You will want to edit these templates with your own information.

  • Clone the repository to your machine

  • Edit the files

  • If you are using Quarto, render the project using quarto render in the terminal

  • Push the changes back to GitHub

It will take a couple of minutes for GitHub to then rebuild the site with the changes.

5 Optional: Adding a Custom URL

By default, GitHub will host your site at the URL “https://<yourusername>.github.io/”.

If you want a custom URL, like “yourname.com”, you will have to purchase it from a domain registrar. This shouldn’t be very expensive, for instance I currently pay $12 a year for my domain.

I used Squarespace Domains. If you search for “domain registrar” you will find many other options. It does not really matter where you purchase one from.

Once you have purchased a domain name, you will want to forward it to your GitHub website. Here’s the complete GitHub Guide on doing so, look for “Configuring an Apex Domain”.

Using a Custom Domain

Domain Registrar Settings

You will need to add two records to your domain registry, which will be done through the settings of whatever site you used to purchase your custom domain.

www CNAME <username>.github.io
    A     [ipaddresses]

There will be 4 IP addresses to add to the second record, which all point to the GitHub Pages server. See here in the GitHub documentation for the correct addresses, look for “Configuring an apex domain” > Step 5 > “A” records.

GitHub Pages Settings

Go to the GitHub Pages Settings for your website’s repository, and enter “yourcustomdomain” into the “Custom domain” field. Don’t include “www.”. Hit save.

This should automatically add a “CNAME” file to your repository, either in the “root” or “docs” folder. This file just contains your new cutsom domain as text. Make sure the file exists, if it doesn’t for some reason, add it.

CNAME
yourcustom.domain

You should be all set now.