Projects

Projects 🛠️

A list of all the things I have been a part of. All of these projects are open source so you can check them out on GitHub.

FAIRshare

Screenshot of FAIRshare

FAIRshare is an application created to help researchers submit datasets and other releated research data while complying with the relevant FAIR data standards. It uses a Vue 3 and Tailwind CSS based frontend within an Electron container to handle the user facing portion of the application. The backend is handled by a custom Flask instance that is shipped within the application. Google Analytics is used to track the usage of the application.

Vue 3
Flask
Electron
Python
Tailwind CSS
Histoire
Vite
Google Analytics

SODA for SPARC

Screenshot of FAIRshare

SODA is an Electron based application to help researchers of the NIH SPARC program comply with the rules for data sharing to the SPARC data portal. It used native html, js and css alongside a python based backend to achieve this goal. Google Analytics is used to track the usage of the application.

Electron
Javascript
Python
Storybook
Google Analytics

fairdataihub.org

Screenshot of FAIRshare

A Next.js website created for the FAIR Data Innovations Hub organization. This site uses Vercel serverless functions for contact forms with custom email responses. A custom markdown based blog has been integrated for news and updates. End-to-end testing is handled via Cypress.

Next.js
Typescript
React
Tailwind CSS
Cypress

FAIRshare Documentation

Screenshot of FAIRshare

A documentation site for the FAIRshare application. This site is built with the Docusaurus framework. Custom React components are used to handle the feedback from each page of the docs platform. These results are recorded via serverless functions and stored in Google Analytics.

Docusaurus
Tailwind CSS
React
Google Analytics

FAIRshare Authentication

Screenshot of FAIRshare

Since FAIRshare integrates with external data repositories, an external browser based authentication system was created to allow users to log into their data sources and archival platforms. This system is built with Next.js and uses a custom API to handle the authentication process. Custom protocols are used to handle communication between the browser and the FAIRshare Electron application.

Next.js
Typescript
React
Tailwind CSS

SPARClink

Screenshot of FAIRshare

A hackathon project that uses data from the SPARC portal to create graph-based visualizations about the reuse of data from SPARC experiments. A custom Flask backend is used to handle some minor data manipulation and machine learning features on the gathered data.

Vue 3
Tailwind CSS
Flask
Python

Developer Documentation

Screenshot of FAIRshare

A Vitepress based site to handle all developer documentaion for the FAIR Data Innovations Hub organization.

Vite
Vue 3

Everything else...

Occasionally I work on projects that are born out of curiosity. The following list includes components, libraries, demos, starter templates and anything else that piqued my interest. All of these projects are open source so you can check them out on GitHub.

Vue 3 Lottie

Screenshot of FAIRshare

Vue 3 Lottie is a component that allows you to add Lottie animations to Vue applications. Vue 3 Lottie is a vue wrapper around the lottie-web library with a few additional features.

badgebadgebadge
Vue 3
Vite

Vue 3 Marquee

Screenshot of FAIRshare

Vue 3 Marquee is a simple marquee component for Vue 3 that creates customizable marquees. This library was born from an internal need for a quick and easy marquee component that I wanted to use in our website homepage. Many of the component libraries that I found were either unmaintained, complex or not compatible with Vue 3. So I decided to create my own.

badgebadgebadge
Vue 3
Vite

GitHub Zenodo release action

Screenshot of FAIRshare

This is a Github action to update your 'codemeta.json', 'CITATION.cff' and '.zenodo.json' files with the release information and then upload your release to Zenodo. This action is primarily created for use for documentation releases at the FAIR Data Innovations Hub but can be used by anyone for any Github repository.

badge
Javascript

Electron Vue 3 Flask Starter

Screenshot of FAIRshare

This is a template that creates an Electron application with a Flask backend and uses Vue3 and TailwindCSS (optional) for the frontend. Your backend api will be using Flask-RESTX for easier API development and automatic Swagger documentation.

badge
Vue 3
Electron
Flask
Tailwind CSS