If you think I'm a good fit for an open position or you just want to say hello, send a message! I look forward to hearing from you.
View Project
Purpose and Goal
The original proposal for the site was developed by members of the Open Source Software Intiative (OSSI) at the Howard Hughes Medical Institute’s Janelia Research Campus (Janelia) who wanted to make open source software developed at Janelia more easily discoverable for both internal and external scientific audiences.
Core requirements
1. Open source the site content - any Janelia software developer or collaborator should be able to edit the site via a GitHub pull request.
2. Support exploration of the software catalogue – include functionality for filtering by one or more tags and a keyword search that can be optionally combined with filters.
3. Convey Janelia’s technical excellence with a modern website design.
Spotlight: Filtering the project card display by one or more tags
Implementing this core feature required overcoming several technical hurdles:
Astro islands and state management
AstroJS strips the JavaScript out of all components of the site except for “island” components. This means the parent of React island components, like my interactive filter menu and project cards, does not have access to the React framework library to use state management hooks. To overcome this, I initially made the project cards and filter menu both children of one giant React component rendered on the projects route layout. This allowed me to manage state with the familiar useState hook. However, it also resulted in a prop-drilling and hid the specifics of the route layout behind one component. I ultimately refactored the layout to make the filter menu and project cards direct children components of the static projects route. This meant implementing the Nano Stores library, recommended by Astro, for state management.
Linting of tags via GitHub actions
Due to the site being open source, I needed to add a means of ensuring all the tags added by contributors matched those allowed on the site. I decided to add a GitHub action to automate this process and ensure higher accuracy than human review. When a pull request is opened against the main branch of the site, the action checks for any modified Markdown files and then lints the tag categories included in the file frontmatter. If invalid tags are found, the action returns a message to the pull request with the invalid tags and in which files they were found. The developer can then push changes to the pull request prior to it being accepted for merging.
Current status
The site is currently deployed as the home page for the Janelia Open Source Science Initiative (OSSI). Users have shared positive feedback, for example stating that the site "is both beautiful and so useful."
