An experimental project using micro frontend architecture, cross-app communication, and hand-crafted landing pages for some of Taylor Swift's most recent albums. Explore the albums, find artists that contributed to that album and collect their work by adding it to your Jukebox!
- Micro frontend functionality and client side routing supplied by single-spa.
- Built using ReactJS and Svelte.
- Communication between apps using custom browser events.
- Fluid animations and transitions powered by Framer Motion.
- Performance optimized through CDN caching (thanks B2 + Cloudflare) and image preloading.
- Root micro frontend app deployed with Vercel (child app bundles load through the CDN).
- Deduplicated dependencies (
react
,react-dom
, andframer-motion
) for less redundant JS downloading. - Shared
components
andutils
with fully functional Typescript types and autocomplete. - Browser sessionStorage for hiding splash screens and persisting user selections.
Clone the project
git clone https://github.com/ansonlichtfuss/swiftory
Go to the project directory
cd swiftory
Install dependencies
npm install
Start the server
npm run start
The above command can be run in the root directory to execute all services simultaneously as well.