VitePress-powered academic website for the KohlbacherLab group at the University of Tubingen. Built with Vue.js and deployed to kohlbacherlab.org via GitHub Pages.
Table of Contents
Note
This project uses a fork-based workflow. See the Contributing section for how to fork, clone, and submit changes.
Prerequisites: Node.js >= 20.0.0
- Install dependencies
npm ci- Start the dev server (with hot module replacement)
npm run dev| Command | Description |
|---|---|
npm run dev |
Start local dev server with HMR |
npm run build |
Build the static site |
npm run typecheck |
Run type checking with vue-tsc |
npm run lint |
Lint source files with ESLint |
npm run lint:fix |
Lint and auto-fix source files |
The following recipes help you create and manage content on the homepage. For general page editing, refer to the VitePress documentation.
To add a new person, create a file in src/.vitepress/data/persons/ following the naming pattern <lastname>-<firstname>.mjs.
Use existing person files as reference. A minimal example:
import { definePerson } from '../../index.ts';
export default definePerson({
name: 'Peter Placzek',
role: 'Researcher',
avatar: 'https://www.github.com/tada5hi.png',
email: 'peter.placzek@medizin.uni-tuebingen.de',
phone: '+49 7071 29 84309',
address: 'Sand 14, Room A301, Tubingen, 72076',
team: 'tbi',
socialLinks: [
{ icon: 'github', link: 'https://github.com/tada5hi' },
{ icon: 'linkedin', link: 'https://www.linkedin.com/in/peter-placzek-047a74210/' },
],
interests: [
'Personalized Medicine',
'Privacy',
'Security',
],
education: [
{
year: [2002, 2006],
value: 'Grundschule Pliezhausen',
},
],
awards: [
{
year: 2020,
value: 'xxx',
},
],
biography: [
{
year: [2000, 2005],
value: 'xxx',
},
],
});Since person data files are processed at build time, the dev server must be restarted after changes.
Person
/**
* Represents a team member with their personal and professional information.
*/
interface Person {
/** The full name of the person. */
name: string;
/** The professional role (e.g., 'Researcher', 'Professor'). */
role?: string;
/** URL to the person's avatar image. Can be absolute or relative. */
avatar?: string;
/** A short description or bio of the person. */
description?: string;
/** A list of the person's social media links. */
socialLinks?: SocialLink[];
/** The person's address. Can be a string or an array for multiple addresses. */
address?: string | string[];
/** The person's email address. */
email?: string;
/** The person's phone number. Can be a string or an array for multiple numbers. */
phone?: string | string[];
/** The team or teams the person is part of (e.g., 'tbi', 'abi'). */
team: string | string[];
/** The person's educational background. */
education?: HistoryEntry[];
/** Awards or recognitions the person has received. */
awards?: HistoryEntry[];
/** A detailed biography of the person. */
biography?: HistoryEntry[];
/** A list of the person's professional or personal interests. */
interests?: string[];
/** URL to the person's sponsor page. */
sponsor?: string;
/** Custom text for the sponsor action button. */
actionText?: string;
}HistoryEntry
/**
* Represents a chronological entry (e.g., education, award, biography item).
*/
type HistoryEntry = {
/** The year or year range (e.g., 2020 or [2018, 2022]). */
year: number | [number, number];
/** A description of the entry. */
value: string;
};SocialLink
/**
* Represents a social media or external profile link.
*/
type SocialLink = {
/** The icon identifier for the social platform (e.g., 'github', 'linkedin'). */
icon: string;
/** The URL to the social profile. */
link: string;
/** Accessible label for screen readers. */
ariaLabel?: string;
};Before starting to work on a pull request, please review the guidelines for contributing and the code of conduct.
-
Fork the repository on GitHub (click the Fork button on the repo page). This creates a personal copy under
https://github.com/<your-username>/homepage. -
Clone your fork locally:
git clone https://github.com/<your-username>/homepage
cd homepage- Add the upstream remote. This points to the original repository so you can pull in new changes later. You only need to do this once:
git remote add upstream https://github.com/KohlbacherLab/homepage.gitYou can verify the remotes are set up correctly:
git remote -v
# origin https://github.com/<your-username>/homepage.git (fetch)
# origin https://github.com/<your-username>/homepage.git (push)
# upstream https://github.com/KohlbacherLab/homepage.git (fetch)
# upstream https://github.com/KohlbacherLab/homepage.git (push)origin— your fork (you push here)upstream— the original repository (you pull from here)
- Install dependencies and start developing:
npm ci
npm run dev- Create a feature branch off master:
git checkout -b my-feature- Make your changes, then commit:
git add .
git commit -m "feat: describe your change"- Push your branch to your fork:
git push -u origin my-feature- Open a pull request on GitHub from your fork's branch to
KohlbacherLab/homepage:master.
Update your local master with the latest upstream changes:
git checkout master
git fetch upstream
git merge upstream/master
git push origin masterSync your feature branch with the updated master:
git checkout my-feature
git rebase masterIf there are conflicts, resolve them in the affected files, then:
git add .
git rebase --continueAfter rebasing, force-push your branch:
git push --force-with-leaseMade with 💚
Published under MIT.