dereck quock

๐Ÿ‘จโ€๐Ÿ’ป Projects

Personal

โค๏ธ Harana Events

My wife and a couple of her friends really enjoy event planning and they've experienced how much goes into wedding coordination and planning, so they decided to give it a try. I helped them out and built them a website so they can market to couples and try to acquire clients.

Tech


๐Ÿˆ Fantasy Football Helper

I needed a way to help my fantasy football league know what keepers they can select for the next season. Keepers are players on a fantasy manager's roster that they can keep for another year. Our league has custom rules for keeping players, so it was easier for me to just build it myself using Sleeper's API.

I also used the API to get roster scores and calculate the highest scoring roster and the highest scoring bench for each week. We pay out bonuses for these highest scores, so I wanted an easy way to be able to know which manager to pay. I also supported putting in the league ID and getting those leagues' scores. This way my wife, who also plays, can pay out her league as well.

Tech


๐Ÿ’ Wedding Website

Wedding website

Wedding website built for mobile with Gatsby that showed wedding information, displayed our engagement photos and allowed guests to RSVP.

Tech

  • Gatsby - gatsby-source-google-sheets to use Google Sheets as a database for RSVP data

  • Reach UI - Netlify Forms for RSVP submissions

    Handling RSVP submissions was fairly difficult because of the variable amount of people that could RSVP for a certain group. For example, some of our friends are single and didn't have a plus-one and some of our family members had kids that were also attending.

    I had to fetch the people that were associated with the person that was RSVPing and based on the form input, I would reduce the data down into an object that tells me if a specific person was going to attend and their protein preference:

    function getRsvpData(data) {
      return data.reduce((formData, { guest, isGoing, protein }) => {
        return {
          ...formData,
          [`${guest} Is Going`]: isGoing,
          [`${guest} Protein`]: protein,
        };
      }, {});
    }
    

    I wish that Netlify Functions were available at the time because I would have definitely used that ๐Ÿ˜…

  • React Context for having a fun dark mode

    Kent's post about how to use React Context effectively really helped me execute this easily ๐Ÿ”ฅ


Echo.Church

๐Ÿ“ฑ Echo App

Echo App

App is built with React Native and allows people to be able to interact with the Church.

Tech


Hackathons

๐Ÿ“ฑ React Native app that enables automatic expense reporting

This was a hacked version of the PayPal app that allows a user to automatically create an expense report from a transaction.

Tech

  • React Native
  • OCR using python (teammate built this) to parse an uploaded receipt
  • wit.ai for using NLP to categorize items on the receipt

๐Ÿงพ Invoicing app that uses image processing to prefill invoice data

App that used an item image to prefill the form used to create an invoice. After filling out the invoice data, the seller is presented with different outputs for sending an invoice: email the invoice, share an invoice link, scan a QR code, or share in Facebook Messenger. This allowed the seller to create and send the invoice in whatever specific context that they were in, creating less friction when selling something.

Tech