For information on my journey to becoming a Software Engineer, check out my Medium article on Codeburst.
bun install
bun start # dev server
bun test # run tests
bun run build # production build
bun run deploy # build + deploy to Firebase- 🦀 bun for fast development, build times, and building all assets
- 📧 EmailJS for serverless contact form submissions direct to my inbox
- 🔥 Firebase for painless deployment and realtime data storage/display
- ⚛️ React for speed, scalability, and simplicity
- ️⚒️ RTK Query for cleaner Firebase queries and built-in caching
- 🧪️ @testing-library/react and msw for robust frontend testing
The frontend starts in main.js. The root of the React app is in App.jsx.
Styles are written as CSS Modules, scoped per component.
Google Chrome's Lighthouse is a great tool that has many audit categories. By following their tips, upon visiting my page, there is a service worker registered, which caches the root and all styles. It's also fun to see scores of 💯
Tracked in #395 (bundle optimization) and #422 (Lighthouse scores). Several optimizations have been made to improve load times and reduce bundle size:
- Lazy-loaded routes (About, Uses) and code splitting for smaller initial chunks
- Scoped
GoogleReCaptchaProviderto the Contact route only - Switched to
firestore/litefor a lighter Firebase footprint - Replaced third-party animation, icon, and spinner libraries with CSS keyframes, react-icons, and an inline SVG — eliminating heavy dependencies
- Google Fonts loaded asynchronously to unblock FCP; navbar logo optimized for LCP
- Firestore data prefetched on nav hover to eliminate loading spinners
I have implemented a form on /contact that sends submissions directly to my
inbox using emailjs. The Google ReCAPTCHA library helps verify a human's
(online) humanity to prevent bots from submitting the form. It uses ReCAPTCHA
v3, which is invisible.
Submissions are also filtered against a blocklist of known SEO spam domains and message patterns, so junk never reaches my inbox.