iBOTS
–
Showcase Your Research Online: Building a Personal Portfolio Website with HTML, CSS, and Hugo
Starts at
2 sessions
An introduction to Notebook-Driven Development using Jupyter Notebooks
Prerequisites
Expected and helpful background knowledge for joining an event on this topic.
Prior Topics
Background
- Expected: Comfort using a text editor and a file explorer
- Helpful: Familiarity with Git and collaborative repository platforms
- Not required: Experience with web development
A personal research website can bring together projects, publications, a CV, blog posts, figures, and other scientific outputs. Separating this content from the site layout makes the website easier to update and maintain as the work develops.
Why This Matters
Research websites can do more than list publications. They can make methods easier to find, document software for collaborators, share teaching materials, and connect notebooks or figures to the story behind a project. This topic emphasizes websites that can be maintained with ordinary research tools: Markdown, Git, reusable templates, and static hosting.
Hugo, HTML, and CSS Approach
In this topic, you will use HTML and Markdown to structure content, Hugo templates to create reusable layouts, and Bootstrap to style pages consistently. You will build portfolio and blog sections, convert analyses from Jupyter notebooks into web-friendly formats, and use Git and GitHub Pages to publish the finished website.
Questions We Can Explore Together
- How can I turn project notes, figures, or notebooks into pages that others can browse?
- What structure makes a personal or lab website easy to update over time?
- How can I publish documentation for a small research software project?
- How do GitHub Pages and Hugo fit into an open-science workflow?
- What should a research portfolio include so collaborators can quickly understand my work?
Events
Explore upcoming dates and details from previous events.
Technology Radar
Our view of the tools and practices relevant to this topic. Recommendation and teaching availability are separate.
Provisional positions are editorial proposals awaiting group review.
Recommendation rings
- Recommend
A recommended choice for relevant research work. - Explore
Promising or used internally; suitability or teaching integration is still developing. - Assess
Worth investigating before trying or recommending.
Kinds of item
- Libraries
- Languages & frameworks
- Tools & platforms
- Practices
- Data formats
Select a point or an item below to read our view.
Items in this view
No items match this view.
Recommend
Distributed version control system for tracking changes in source code
Recommend
Provisional
Tools & platforms · Teaching
5 topics with recorded teaching · 20 recorded and scheduled offerings
Our View
Git is the industry standard for version control, enabling researchers to track changes, collaborate effectively, and maintain a complete history of their work. It's essential for reproducible research and collaboration.
Recorded in topic offerings; consult the dated event links for availability.
19 past offerings · 1 upcoming offerings
Related themes: Scientific Computing
Related topics: AI-Assisted Software DevelopmentArrays and Numerical ComputingAutomating Research WorkflowsDeveloper EnvironmentRobust and Reusable SoftwareWebsite Development
Interactive computing environment combining code, visualizations, and narrative text
Recommend
Provisional
Tools & platforms · Teaching
6 topics with recorded teaching · 17 recorded and scheduled offerings
Our View
Jupyter notebooks allow you to combine code, results, and explanations in a single document. This makes them perfect for exploratory data analysis, teaching, and creating reproducible research workflows. You can iterate quickly, visualize results inline, and document your thought process as you work.
Recorded in topic offerings; consult the dated event links for availability.
15 past offerings · 2 upcoming offerings
Related themes: Scientific Computing
Related topics: Arrays and Numerical ComputingAutomating Research WorkflowsDataframes and StatisticsDeveloper EnvironmentMachine LearningRobust and Reusable SoftwareWebsite Development
Lightweight markup language for writing readable documentation, notes, and web content.
Recommend
Provisional
Languages & frameworks · Teaching
1 topics with recorded teaching · 1 recorded and scheduled offerings
Our View
Markdown keeps writing close to plain text while still supporting structured pages, links, code snippets, and publication workflows.
Recorded in topic offerings; consult the dated event links for availability.
1 past offerings · 0 upcoming offerings
Related themes: Scientific Computing
Related topics: AI-Assisted Software DevelopmentDeveloper EnvironmentWebsite Development
Explore
CSS framework for building responsive web interfaces with reusable components.
Explore
Provisional
Languages & frameworks · Teaching
1 topics with recorded teaching · 1 recorded and scheduled offerings
Our View
Bootstrap gives researchers practical building blocks for creating clean web pages without starting every layout from scratch.
Recorded in topic offerings; consult the dated event links for availability.
1 past offerings · 0 upcoming offerings
Related themes: Scientific Computing
Related topics: Website Development
The style language used to control layout, typography, and visual presentation on the web.
Explore
Provisional
Languages & frameworks · Teaching
1 topics with recorded teaching · 1 recorded and scheduled offerings
Our View
CSS lets researchers turn structured content into readable, responsive, and polished web pages.
Recorded in topic offerings; consult the dated event links for availability.
1 past offerings · 0 upcoming offerings
Related themes: Scientific Computing
Related topics: AI-Assisted Software DevelopmentWebsite Development
Web-based platform for hosting and collaborating on Git repositories
Explore
Provisional
Tools & platforms · Teaching
5 topics with recorded teaching · 18 recorded and scheduled offerings
Our View
GitHub is the de facto standard for sharing and collaborating on code. It provides excellent tools for code review, issue tracking, and project management. Most scientific software is hosted on GitHub, making it essential for reproducible research.
Recorded in topic offerings; consult the dated event links for availability.
18 past offerings · 0 upcoming offerings
Related themes: Scientific Computing
Related topics: AI-Assisted Software DevelopmentArrays and Numerical ComputingAutomating Research WorkflowsDeveloper EnvironmentRobust and Reusable SoftwareWebsite Development
Git-based collaboration platform for repositories, issues, reviews, project boards, and automation.
Explore
Provisional
Tools & platforms · Teaching
1 topics with recorded teaching · 1 recorded and scheduled offerings
Our View
GitLab combines code hosting, project coordination, and CI/CD in one place, making it useful for research groups that need transparent collaboration around shared software.
Recorded in topic offerings; consult the dated event links for availability.
0 past offerings · 1 upcoming offerings
Related themes: Scientific Computing
Related topics: Automating Research WorkflowsDeveloper EnvironmentRobust and Reusable SoftwareWebsite Development
The markup language used to structure web pages and documents.
Explore
Provisional
Languages & frameworks · Teaching
1 topics with recorded teaching · 1 recorded and scheduled offerings
Our View
HTML is the foundation for publishing readable, structured research pages on the web.
Recorded in topic offerings; consult the dated event links for availability.
1 past offerings · 0 upcoming offerings
Related themes: Scientific Computing
Related topics: AI-Assisted Software DevelopmentWebsite Development
Fast static site generator for building documentation and research websites
Explore
Provisional
Tools & platforms · Teaching
1 topics with recorded teaching · 1 recorded and scheduled offerings
Our View
Hugo enables researchers to create fast, maintainable websites for documentation, lab pages, and project sites. Its speed, simplicity, and Markdown-based workflow integrate naturally with research workflows, making it easy to document methods, share results, and maintain online presence.
Recorded in topic offerings; consult the dated event links for availability.
1 past offerings · 0 upcoming offerings
Related themes: Scientific Computing
Related topics: AI-Assisted Software DevelopmentWebsite Development
Let's get in touch
For tutoring, collaboration, or follow-up support, contact the team. We are happy to help you connect workshop ideas with your own research practice.
