Syntax - Tasty Web Development Treats
934: We Built a Real-Time, Local-Data, Competitive Coding Game
· Summarized
Key takeaways
- The tech stack for SynHax is innovative and efficient, leveraging modern tools like SvelteKit and Zero Sync.
- The unique real-time coding experience sets SynHax apart from traditional coding platforms, encouraging audience engagement during battles.
- Future iterations of SynHax aim to enhance usability and functionality based on user feedback and testing.
- The importance of planning and structuring code effectively was emphasized, particularly in the context of Scott's development process.
Summary
Introduction to SynHax
The episode kicks off with Scott discussing his Hackweek project, SynHax, a competitive coding platform designed for real-time CSS and UI battles. He emphasizes the efficiency of the tech stack used, which he believes will change how apps are built in the future.
Exploring the Tech Stack
Scott introduces the tech stack behind SynHax, including SvelteKit, PostgreSQL, Drizzle ORM, Zero Sync for local data management, and Better Auth for authentication. Each component plays a vital role in achieving the app's functionality and performance.
How SynHax Works
The podcast details how SynHax operates, focusing on creating battles, the real-time coding experience, and how participants interact during the coding duels. Key highlights include the referee's role, live audience engagement, and how changes are instantly reflected in the app.
Battle Experience and Features
The hosts dive into the user experience during battles, emphasizing audience participation through voting and the dynamic display of coding in real-time. Scott shares insights into the battle mechanics, including how judges can score and provide feedback.
Admin Dashboards and Future Improvements
Discussions turn towards the admin side of the platform where new battles can be created, targets defined, and features for improving the user experience are considered. Scott mentions future ambitions for refining the app and adding more functionalities.
Sponsors
- Sentry · Sentry is the perfect place to track all of your errors, build fun things, and make sure your stuff's working. They're producing all kinds of great features, including a new CIR feature that uses AI for problem-solving.
Show notes
Scott, Wes, and CJ dive into SynHax, Scott’s Hackweek project for code battles. They discuss live coding duels, referee controls, and the surprisingly simple tech stack that delivers instant updates and audience engagement.
Show Notes
00:00 Welcome to Syntax!
01:50 Brought to you by Sentry.io
02:30 What is SynHax?
This Button Broke Our Brains (CSS Challenge)
04:21 The Stack
SvelteKit
Postgres
Drizzle
Zero Sync
Better Auth
Syntax 931: How to make good choices when starting a coding project
07:39 How it works
15:03 The battle experience
28:28 Fun details
34:12 Creating new battles & the admin dashboard
Hit us up on Socials!
Syntax: X Instagram Tiktok LinkedIn Threads
Wes: X Instagram Tiktok LinkedIn Threads
Scott: X Instagram Tiktok LinkedIn Threads
Randy: X Instagram YouTube Threads
Follow this show on AudioBrevity and new episodes get summarized for you. Create a free account