CSV Parser

  • CSV Parser where users can upload CSV files to be parsed and analyzed. Files are stored locally once uploaded and data analytics are shown to user. Built using React and Node.js.
  • Front end React client handles file uploads, fetching data from back end API, and showing API results to user
  • Back end Express API stores CSV files locally, parses CSV files, and returns data analytics to client

URL Shortener

  • URL shortener where users can input a URL and receive a shortened link, taking the user to the original URL inputted. Currently this application works when running locally.
  • Front end React client handles user input, fetching data from API, and showing shortened URLs to user
  • Back end Express API validates user input, stores shortened URLs in SQLite database, and fetches shortened URLs for client upon API calls
  • Redirects used for shortened URLs and ID iterators used for generating unique shortened URLs in SQLite database

Impeccable Wraps Site

Impeccable Wraps Site
  • E-Commerce site built for freelance client using Shopify
  • Responsive design implemented so site works across multiple devices and browsers
  • Built custom UI elements using Liquid, JavaScript, HTML, and CSS
  • Square Appointments embed used on site for online booking of business services
  • Collaborated with client to define requirements, establish timelines, and estimate costs
  • Met with client bi-weekly presenting visual demos along with project updates

React WPM Test

React WPM Test site
  • React app which tests user's WPM typing speed
  • Words for test fetched from third-party REST API using Fetch API and JSON
  • React Hooks used for tracking state
  • useEffect() hook used for updating components as state changes or whenever components mount / unmount from the virtual DOM
  • Test checks accuracy of user's typing while handling timers

Hydration Station

  • Electron app which tracks water consumption entered in by user
  • Unit tests using Jest written; integrated with Travis CI and GitHub for continuous integration
  • Scrum methodology practiced to follow agile development lifecycle
  • Technologies used include Electron, JavaScript, HTML, CSS, and Bootstrap
  • Met with customer weekly to receive feedback on demos and clarify requirements

Tiger Boards

Tiger Boards site
  • Web app which shows space availability for students at University of the Pacific
  • Front-end uses React.js and Material UI
  • RESTful API built using Flask which connects to PostgreSQL database
  • Front-end handles asynchronous data fetching and live UI updates
  • Google Oauth authentication implemented for user account features
  • Administrative access restricts modification of database data

To Do App

To Do app site
  • Yes, I made a To-Do app. Every developer has to make one, right?
  • Made using vanilla JavaScript
  • Add your own to-do items
  • Delete items from the list
  • Add items from a third-party API, in case you don't want to type words :/
  • Search for items within your list

Portfolio Site

  • This portfolio site was built completely by myself
  • Built using Gatsby, React.js, HTML, and CSS
  • All styling and animations use vanilla CSS