Creating your personal website using Quarto

Week 0

Friday September 27th, 2024

A schematic representing the numerous supported languages (R, Python, Observable, Julia), which Quarto supports for writing a variety of file types (html, PDF, Word docs, and more)

Artwork by Allison Horst

Anticipated deliverable(s)

By the end of today’s class, you should have:

  • the scaffolding of a basic Quarto website built and deployed using GitHub Pages
  • a neatly-arranged landing page with your professional headshot and your chosen bio / info

Pre-class Prep

Please be sure to complete the following before class:

A. Install software / Create accounts

MEDS students should already have the following installed / created from summer session (but it’s worth double-checking!):

  • R & RStudio installed
  • Quarto installed – Quarto is now included with RStudio v2022.07.1+ i.e. no need for a separate download / install if you have the latest version of RStudio
  • A GitHub account
  • Git installed / configured

Please refer to the MEDS Installation Guide for detailed setup instructions.

B. Gather materials to add to your website’s landing page

During this session, you’ll have the opportunity to add some personal information to your website’s landing page. It’ll help to have an idea of what you might want to include (at least as a starting point – your website’s content will most certainly evolve over time). Consider the following before attending class:

  1. Have your professional headshot handy. Your Bren photo is a great option here! Save your photo to your Desktop (or somewhere you can easily find again) for now.
  2. Consider which landing page template to use. We’ll be applying one of Quarto’s five available built-in templates when we create our website’s landing page. Take a peek at the template previews and identify which one(s) you like most (e.g. I’m currently a fan of jolla, but used trestles for a long while). Consider how you’d like to arrange your personal bio / info given the layout of your top choice template.
  3. Draft your personal bio / blurb. Consider reusing parts of your Bren bio, or even drafting a shortened, catchy version of it for your landing page (and make note of the tips, below!). Save your text in a place you can quickly copy from during class (e.g. a Google Doc).
  • Adjust your bio to fit your chosen landing page template. For example, jolla works well with short bios or even taglines, while trestles might be a better choice if you’re looking to add longer and / or multiple sections.
  • Check out a few example websites for bio inspiration. Here are just a small handful fo websites, each with a slightly different approach to their landing page bios:
  1. Gather your important public profile links. Your personal website is an excellent place to link out to your other public profiles in one, organized place. Bookmark / save the links you’d like to include (e.g. LinkedIn, GitHub, even your preferred email address)

Lecture Materials

We’ll walk through the steps of building and deploying our personal websites together in class, but you can find step-by-step instructions below, should you need to reference them at any point:

Quarto website instructions

What should I continue working on?

  1. Build your personal branding guide. Next class, you’ll learn how to customize your website so that it better reflects you and your goals, motivations, values, and interests. To do so effectively, you’ll first want to spend some time thinking intentionally about your personal brand. See the next pre-class prep for detailed instructions on how to prepare your personal branding guide.

(Optional) Lunch with an NCEAS Data Scientist

Please see the fall lunch schedule for details on today’s NCEAS guests!