4  Quarto

This chapter gives a brief introduction of communicative programming using Quarto. The idea is to incorporate data programming elements into a publishable document. Formats including PDF and HTML.

Quarto is an open-source scientific and technical publishing system built on a document converter called Pandoc. It is multilingual (R, Python, Julia and Observable) and can be used for creating a wide variety of documents using simple plain text markdown (e.g. R Markdown). Examples include website (static), academic reports, presentations, blogs. It can accommodate LaTeX for scientific equations and more advanced features such as blogs and conversion to pdf, html and MS Word.

Think of Quarto a platform with programming tools using R Markdown for:

4.1 Website

This session is extracted from this online notebook Building Personal Website on GitHub.


  1. Creation of website files using Quarto

  2. Create a New Project (top right Project link in RStudio)

  3. Choose New Directory and Quarto Website

  4. Give the name of directory “username.github.io” with your GitHub username (e.g. karlho.github.io)

  5. Editing website files using Quarto

First edit the _quarto.yml then other qmd files, which are Markdown files.

The _quarto.yml controls the style of the website:

  type: website

  title: "karlho.github.io"
      - href: index.qmd
        text: Home
      - about.qmd

    theme: cosmo
    css: styles.css
    toc: true

editor: visual

In the website section, rename the title to your name (e.g. Karl Ho). The navbar controls the top navigation bar starting from the left. You can add other pages such as research, personal, etc.

The format part control document output. In this case, it exports into html with the choice of theme, which is from Bootstrap 3. The cosmo theme is used here but choose your favorite theme from the Bootstrap website (e.g. united, sandpaper).

Then, the index.qmd file. This file is the front page (will be converted to index.html), so it is recommended to use this to introduce yourself or the latest developments (e.g. presentations, projects, etc.). You can replace with the following sample text:

title: "John Doe"

I am a doctoral student studying the political economy of East Asia and US.  My research topic is on rent-seeking behaviors in last two decades

### More Information


  * Data Science 
  * Time series modeling

### Contact me



The rest will be just edit the pages (qmd) you want to post on your website (i.e. research.qmd, teach.qmd, etc)

title: "About"

More about this website.

Once all files are ready, click on the Render button. The rendering process converts the .qmd files into html files under the _site folder.

Now your website is ready locally. You can check the links and make sure they all work and that related files (e.g. CV) are in the same _site folder. The next part is to deploy to your host, which is GitHub.

4.2 Blog

4.3 Academic paper

4.4 Presentation


Quarto Website

Quarto Blog

Quarto Presentations

Quarto Journal Articles