Luka 2 'Trick Shot' Storefront

Responsive storefront for Luka 2 'Trick Shot' basketball shoes. Ads on social media will link to this, so customers can learn more about the product, get excited, and purchase it seamlessly.

Link to the App

How it's Made

Tech Used: React, Material UI, TailwindCSS, TypeScript, Vite, React Router

• Tested this web app with mobile, tablet, laptop, and desktop screens while developing using Chrome DevTools
• MUI's Material UI was used for styling because of its wealth of reusable components to reduce the need to produce an MVP
• This application does not need to appear high in search results, so time to first paint is less of a concern
• Vite was chosen to decrease server start times.

Optimizations

• Move global styles in the index.css to the CSSBaseline element in App.tsx to avoid naming conflicts
• Use this guide to better integrate TailwindCSS and MUI to avoid style overrides that are hard to troubleshoot

Lessons Learned

• Inspecting similar web apps to the one you want to build in Chrome DevTools is a great way to learn how to build them.

See More

• Reusable Spring Boot App Workflows
• simpleParallax.js Quickstart Guide
• Personal Site