I loved Reddit's r/place experiment, and wanted to see if I could create something like it using the Laravel and Vue frameworks. It's definitely not an exact recreation, but the basic feature is still there: drawing collaboratively on a pixel grid in real-time.
In under an hour we:
- Create a new Laravel application with Breeze
- Seed and store thousands of data points in Redis
- Use a canvas element with Vue for interactivity
- Fire off websockets events for real-time updates
- 0:00 Intro
- 00:55 Installing Laravel
- 04:58 Seeding data
- 12:03 Setting up the frontend
- 21:43 Adding interactivity
- 37:42 Real-time events
- 49:16 Where to go from here
Follow me on Twitter! / aschmelyun
Join my newsletter, where I send out new information twice each month in the PHP, JavaScript, and Docker worlds: aschmelyun.substack.com
7 июл 2024