Contributor

Project Setup

If you want to preview the changes locally, you will need to setup the project locally. Adding or editing a new member doesn't require setting up the project locally, simply modify markdown files in content/1.members directory.

You will need to install nodejs and run the project with a package manager. Nodejs comes with npm, you can use it. But I recommend bun as it's much faster.

bun

bun install     # install dependenciesbun dev         # start dev serverbun generate    # generate static files

Add A New Member

Go to content/1.members directory, based on the member's role, add a new markdown file in the corresponding directory. For example, if you want to add a new faculty member, you should add a new markdown file in content/1.members/faculty directory. The markdown file should have the following format:

---name: Huakun Shendescription: Master Studentavatar: https://github.com/HuakunShen.png# website: https://huakunshen.comwebsite: /members/grad-student/huakun-shenemail: huakun.shen@huakunshen.comyear: 2023 # necessary for an alumni---Anything about yourself.

Only name field is necessary, other fields are all optional.

For alumnis, year field is necessary as it will be used to sort alumnis by year.

Avatar

It can be a remote image, or a local image. If it's a local image, you should put it in public/avatar directory, and use the relative path as the value of avatar field. For example, if you put the image in public/avatar/shen.png, then the value of avatar field should be /avatar/shen.png.

Website

If you include the website field, clicking on your avatar will link to the website you specified.

Otherwise it by default will link to your profile on this website. For example, for me it will link to /members/grad-student/huakun-shen If you include the website field, clicking on your avatar will link to the website you specified. Otherwise it by default will link to your profile on this website. For example, for me it will link to /members/grad-student/huakun-shen.

More Details

For the website field, you can put a complete url that start with https://, or use a relative path to link to your profile on this website in case you don't have a website yet.

For example, if you want to link to https://huakunshen.com, you can put https://huakunshen.com or /members/grad-student/huakun-shen as the value of website field.

The relative path is just the file path of your markdown file relative to the content folder (but without the numbers, the numbers is only for sorting). For example, if your markdown file is at content/1.members/3.grad-student/Huakun-Shen.md, then the relative path is /members/grad-student/huakun-shen.

However, the website has been configured to auto link to your profile on this website if a website field is not specified. So you can just leave it blank if you don't have a website yet.

Content

You can add more details about yourself in the markdown file if you want. Standard markdown syntax is fully supported.

This site is built with @nuxt/content and docus theme, which gives you more flexibility to customize the content and styling. In markdown, you can write html and css. TailwindCSS is supported to make styling easier.

For example <span class="bg-red-300">Hello World</span> gives you Hello World.

Read https://docus.dev/api/components for built-in components you can use. Read author's example at content/1.members/3.grad-student/Huakun-Shen.md.

Editing Your Content

Simple content modification can be done fully in browser without a dev environment. In the documentation page, there is a "Edit this page" button at the bottom of the page. Click it to edit the markdown file of the current page.