DJLand migration
A new Next.js frontend for the campus radio station's DJ platform, running on the backend it already had.
Developer, CJSF Radio
Next.js, React, TypeScript, Laravel 5.1, Docker, GitHub Actions, Vercel
What it is
DJLand is the platform CJSF Radio's DJs and staff use to run the station. Its frontend was PHP and Laravel 5.1 from years back. I moved it to a Next.js frontend that runs on the existing backend and data, and set up the CI/CD and infrastructure around it.
How we migrated
The new Next.js frontend replaced pages a few at a time while the Laravel 5.1 backend and database kept running underneath, so the station never went offline for a cutover.
- client
- service
- database or storage
- scheduled job
- external
- bold outline = what I owned
- request
- async: event, message, webhook
- The browser hits Vercel's CDN, which serves static assets.
- Next.js renders the page, with caching.
- Next.js calls the existing Laravel API, now running in Docker.
- The API reads the same database as before.
What else changed
- I Dockerized the Laravel 5.1 backend, so a new developer can run it right away with a reproducible build.
- GitHub Actions builds and tests every change and deploys it to Vercel.
- Next.js renders pages on the server with caching, and static assets come from the CDN.
Results
- frontend
- Next.js, rendered + cached
- backend
- Laravel 5.1, unchanged, in Docker
- deploys
- GitHub Actions → Vercel
What I'd change
I'd write tests against the old API before starting. Knowing exactly what each endpoint returns would have saved me some surprises.