Building Research Portfolio with Hugo
Authors
This course provides a hands-on introduction to building and publishing a personal portfolio website for showcasing scientific work. It covers HTML and Markdown for structuring web pages, templating systems for creating consistent layouts, and the Bootstrap CSS framework for producing clean, professional designs without writing raw CSS. The course also addresses the creation of portfolio and blog sections, the integration of analyses from Jupyter notebooks into web-friendly formats, and the free deployment of a complete website using GitHub Pages. By the end of the course, you will have a live, professional-looking personal website to present your research, CV, and publications.
Credits
Installation
To run the course materials on your own machine:
- Install VSCode as your editor
- Install pixi or alternatively conda to create virtual Python environments (see the lessons on environment and package management)
- Download the materials for a lesson using the "Download Materials" button
- Extract the zip file and open the notebook in VSCode
- In VSCode, open a new terminal and install the environment:
pixi installconda env create -f environment.yml
conda activate webbyCourse Contents
Building Single Page Portfolio
A Single-Page Portfolio (using Beautiful Hugo theme)
Building a research portfolio in a single page using Hugo themes
Organizing Portfolio Content with External Resources
Adding images, videos, and documents to the single page portfolio
Building and Deploying Multi-Page Portfolio
Building Multi-Page Portfolio
Create multiple pages and adding navigation from Homepage
Deploying Your Portfolio for Free on GitHub Pages
Deployment of Hugo site
Creating Custom Layouts
Base Templates, Partials, and Lookup Order
Building reusable template structures
Custom Layouts and Template Variables
Building homepage with pure HTML
Custom Layouts and Template Variables
Building homepage with pure HTML