Cracking Good Gifts is a online gift store run by my parents. They make cards, stained glass, and other gifts to raise money for Dana-Farber Cancer Institute.

I stuck to JAMstack for this project as I am familiar with it, and I already had a lot to learn to build out my first e-commerce site. I learned and used Next.js in combination with Sanity CMS to pull in content on build for faster page speeds. Next.js also introduced me to styled components with css modules, and hosting on Vercel.

The cart and checkout flows were built mostly by hand, leaning on basin for form submissions. There is no in-site payment as of now, since all proceeds go to the Dana-Farber Boston Marathon fundraiser page. Once the fundraiser is complete, we will look at taking payments in-site using Snipcart.

Everything was build to be scalable, performant, and accessible. As the site and business continue to grow, I will look for more opportunities to automate content, share common ui pieces, and improve user experience. This site is still in its early days, I have lots of things on the roadmap that I am excited to develop and learn from.

  • HTML
  • CSS
  • Typescript
  • React
  • Next.js
  • Sanity CMS
  • Styled Components