Portfolio

A mix of projects past and present.

Cartoon of a man using a computer and thinking
All React Vue D3 Tailwind CSS DevEd WordPress GreenSock Small Projects
Thumbnail for the eudaimonia machine video: a bust of aristotle and a machine outputting happy emojis

Eudaimonia Machine Videos

A series of two videos that I made on the Eudaimonia Machine – a concept that I was introduced to in Cal Newport’s book “Deep Work.”

The videos were made with Remotion – a library that allows you to create videos with React. These videos use different CSS and JavaScript tricks – mostly CSS animations and transforms.

Development / Design

GitHub icon
Education Cannot Wait 2021 Annual Results Report Microsite

Education Cannot Wait 2021 Annual Results Report

Developed using TailwindCSS, JavaScript, CountUp.js, GreenSock, and ScrollTrigger. Features SVG animations & single page menus (mobile + desktop).

Design credit: büro svenja

Development

Robinhood dashboard clone screenshot

Robinhood Dashboard Clone: Vue 3, D3, Firebase, & Tailwind CSS

Partial clone of Robinhood’s desktop app. Made with Vue 3 (including Vuex and Vue Router), Firebase Cloud Firestore, Firebase Authentication, and Tailwind CSS. Allows you to search for stocks, view an intraday price chart, and view stock news and company info. You can also add lists (title and emoji), edit lists, delete lists, and add stocks to existing lists.

Stock chart made with D3 and emoji picker made with Emoji Button npm package. Also features dark mode toggle button. Stock data retrieved using a Google Cloud Function and the IEX Cloud API. Shows Robinhood’s stock on dashboard home.

View sample dashboard

Sign up to create account (real e-mail not required)

Development

GitHub icon
Robinhood site screenshot

Robinhood Homepage Clone: Vue 3 & Tailwind CSS

Fully responsive clone of Robinhood’s homepage, sign up page, login page, and free stock page. Made with Vue 3, Tailwind CSS, and modern JavaScript. Includes responsive navigation, modals, and sliders, including an infinitely looping slider, and enter/leave transitions.  Uses the Fetch API and async / await to get stock prices using the IEX Cloud API.

Homepage

Sign Up Page

Login Page

Free Stock Page

Development

GitHub icon
Educatiion Cannot Wait 2020 Annual Report Homepage screenshot

Education Cannot Wait 2020 Annual Results Report Microsite

Developed using TailwindCSS, JavaScript, CountUp.js, GreenSock, and ScrollTrigger. Features SVG animations, interactive SVG map, single page menus (mobile + desktop).

Design credit: büro svenja

Development