
Show HN: Academic research group website template (React/Bootstrap) - philipmjohnson
https://github.com/csdl/csdl.github.io
======
philipmjohnson
Most academic research groups need a website that provides information about
the group's research activities, publications, members, recent news, and so
forth. Many of us accomplish this by adapting a WordPress template. This is
really simple to set up, but time consuming to maintain. For example, what if
you want a page listing all of the group's publications, but you also want to
list relevant publications on the page for an individual research project?

As part of my pandemic stress reduction activities, I decided to play around
with React and Bootstrap in order to design a new version of my research
group's website. My goals were:

* A static site deployed using GitHub pages. No more WordPress. No backend database.

* A SPA (Single Page Application). Just one page. Because that's what the cool kids do. More seriously, I wanted to enable the viewers to get a decent overview of my research group just by scrolling and without any clicking.

* Very mobile friendly. My goal is little to no usability cost for using your phone's browser.

* Easy to maintain. For example, to add a new publication, just update your .bib file (which you have anyway), run a script, and information about the new publication appears in multiple locations throughout the site.

These goals produced some interesting design choices, such as the use of what
I call "horizontal" and "vertical" drill downs. I'll let you be the judge of
whether and how well it succeeds. That said, I am quite certain the current
site is much better than the WordPress site it replaced.

It occurs to me that others might be interested in how I did it, and
potentially using my code as a basis for their own academic research group
website, so I've set up the source repo as a template with an MIT License.

Rendered version here:

[http://csdl.ics.hawaii.edu](http://csdl.ics.hawaii.edu)

