DHRIFT (Digital Humanities Research Infrastructure for Teaching) is a static site generator built using Next.js. It facilitates the creation and dissemination of digital humanities workshops, institutes, and educational materials. This repository contains the development framework for building static websites and resources for the DHRIFT initiative.
DHRIFT provides an infrastructure for teaching and learning in the digital humanities. It powers app.dhrift.org, a platform that dynamically pulls and displays workshops based on the repository specified in the URL query. The platform reads metadata from the config.yml file of the specified repository, allowing for dynamic loading of workshops and resources.
DHRIFT offers advanced interactive features through WebAssembly (WASM), allowing users to engage with code directly in the browser. This makes DHRIFT workshops not just static learning resources, but dynamic, interactive experiences where learners can execute and modify code in real-time.
Integrated Code Editors: DHRIFT provides in-browser code editors that allow users to write and execute code without needing any local setup. These editors support multiple programming languages and are embedded directly into the workshop content. Participants can edit code examples within the workshop itself and see live output, creating an immersive learning experience.
Simulated Command Line Interface:
For workshops that teach command-line skills, DHRIFT integrates a browser-based simulated command line. This allows users to practice common terminal commands like navigating directories, managing files, or using version control (e.g., git) directly in the browser.
ls, cd, echo, etc.Interactive Code Execution with WASM: Using WebAssembly, DHRIFT enables secure and fast in-browser execution of code blocks. This is particularly useful for running code snippets in languages like Python or JavaScript without requiring server-side execution. WASM ensures that the execution happens efficiently within the user's browser environment, providing an experience similar to using a local IDE.
Within a Python workshop, users might encounter code blocks like this:
# Example Python Code
print("Welcome to the Python workshop!")Users are able to open the code editor and run this code themselves within the browser.
Benefits of WASM Integration:
Deploying DHRIFT using GitHub Actions is simple. By forking the repository and enabling Actions, your workshop site can be automatically deployed. After enabling Actions, you will need to trigger the workflow by either running it manually or making a small change to the repository.
Fork the Repository:
Enable GitHub Actions:
Trigger the Deployment:
Automatic Deployment:
main branch will automatically trigger a rebuild and redeploy.When you deploy DHRIFT, it dynamically pulls content from a GitHub repository specified in the URL query. DHRIFT reads the config.yml file from the specified repository to gather metadata (e.g., site title, description) and locate the workshops repository.
DHRIFT generates a URL that pulls specific event and workshop content from a GitHub repository. Here’s how the URL is set up:
https://app.dhrift.org/inst?instUser={github_username}&instRepo={repository_name}Base URL: https://app.dhrift.org/inst – Directs to DHRIFT’s content loader.
Parameters:
instUser: The GitHub username or organization (e.g., dhri-curriculum).instRepo: Repository name containing a config.yml file with event info, such as date, location, and sessions (e.g., dhrift-site-template).For example, if your repository URL is:
https://app.dhrift.org/inst?instUser=dhri-curriculum&instRepo=dhrift-site-templateDHRIFT will pull the config.yml from https://github.com/DHRI-Curriculum/dhrift-site-template:
# Example config.yml
title: "DHRI Curriculum"
description: "A site for DHRI workshops"
workshopsuser: dhri-curriculum
workshopsrepo: workshops The workshopsuser and workshopsrepo keys point to the repository containing the Markdown workshop files.
The workshops repository must adhere to a specific structure for DHRIFT to correctly load and display the content. Here is an example of the structure based on the DHRI-Curriculum/workshops repository:
├── command-line.md # Markdown files for each workshop
├── data-literacies.md
├── git.md
│
└── images/ # Any images used in workshops
├── example.pngEach Markdown file represents a workshop. The files should follow a clear and consistent format, such as:
# Workshop Title
Introduction and objectives.
## Lesson 1: Getting Started
Explanation and tasks...
DHRIFT will use the structure defined in the config.yml and the content in the workshops repository to populate the site dynamically.
To add new workshops, update the workshops_repo in your config.yml file to point to a GitHub repository structured according to the example above. Ensure that each workshop is written in Markdown format and follows the proper structure for integration into the platform.
To set up a local development environment for DHRIFT, ensure you have the following:
git clone https://github.com/<your-username>/DHRIFT.git
cd DHRIFTnpm installTo start the development server, run:
npm run devVisit http://localhost:3000 to preview your changes.
We welcome contributions to DHRIFT! To contribute:
Be sure to follow the project's code style and conventions.
DHRIFT allows creators to host their own repositories of workshops and configure DHRIFT to dynamically pull and display content from those repositories.
Create a GitHub Repository:
Organize Your Repository:
Write Workshop Files:
Update the config.yml:
workshopsuser and workshopsrepo keys in the config.yml file of your institute repository.This project is licensed under the MIT License. See the LICENSE file for details.