Alongside the realtime dashboards and collaboration experiences categories that the Ably Realtime Hackathon participants were challenged with, there was a bonus prize category for projects built using React and other React ecosystem tools such as NextJS!
We’ve made several updates to our React offering recently here at Ably, including releasing support for React Hooks within our Ably JavaScript SDK and extending React Hooks support to our latest product, Ably Spaces.
To see our newly created React Hooks for channels and Spaces get used a lot in the hackathon was fantastic, the quality of submissions was impressive and we're looking forward to receiving more feedback as more and more people take advantage of them.
Meet the winners: Ionic and CodeABLy
Ionic
About Ionic
Ionic, made by Shruti Gupta and Aakash Shrivastava, is a realtime collaborative science experiment project which allows users to collaborate with their peers in a virtual lab environment. The pair’s app, which also won the Collaborative Experiences Runner-Up prize, enables users to learn in a fresh virtual setting including conducting chemistry experiments and exploring physics phenomena. Built using React, Ably SDKs, Figma, and Netlify, the team behind Ionic included features like live chat, live avatars, and live cursors.
Why did Ionic win?
The Ionic project showcases an exceptional use of ReactJS to create an engaging and interactive virtual laboratory. This innovative application, designed with Figma and hosted on Netlify, leverages the Ably SDKs for realtime collaborative experiments, demonstrating the transformative potential of Ably in educational technology.
CodeABLy
About CodeABLy
CODEABLy, made by Puja Agarwal and Sandeep Srivastava, is an educational coding platform that allows users to provide peer-to-peer assistance in realtime to help solve coding questions. The pair said the goal for this project was to bridge the gap between solo coding and collaborative learning, providing a dynamic space for individuals to improve their coding skills while helping others. Built using NodeJS, ReactJS, WebRTC, MongoDB and Ably, the team behind CodeABLy included video calls, audio calls, live cursor tracking, member location identification, and component locking functionality.
Why did CodeABLy win?
The Codeably project transforms coding education and collaboration. Utilizing ReactJS, NodeJS, and Ably, Codeably excels in connecting users for live coding sessions, enriched with features like video calls and live cursor tracking. Through its clean and simple UI the app aims to nurture a community for coders of all levels to learn and grow together, highlighting React's and Ably’s capability in creating powerful collaborative applications.
Submissions
There were many great submissions in the React category, we’re sharing a couple below and will be sharing many more in the next few weeks.
Mood Tracker and Support Chat
Mood Tracker and Support Chat, made by Samarasam Sadasivam, is an app that can track a patient’s current mood and provide instant health tips which are generated by OpenAI. Built using NodeJS, Prisma, SQLite, and Ably, the app includes a patient dashboard with a health form and support chat functionality.
Cheat Inspector
Cheat Inspector, made by Shubham Shankaram, Karandeep Singh, Smit Gor, and Yash Kumar Verma, is designed to monitor online hackathons and competitions to keep them fair. Built using NodeJS, Go, Redis, and Ably, the group’s project provides realtime project analysis, using algorithms to calculate project entropy and snapshots of participants' projects, it then visualizes the results as a live graph for organizers.
All four of the entries mentioned in this blog post impressed us with their focus on building an application that provides a positive contribution to society in different ways. Through edtech, anti-cheating, and mental health support, we’ve been delighted to see the demonstrated ability to build for social good.
These winning submissions, and all of the entries, included in the project gallery are great examples of what you can do using Ably. We will be sharing more entries on our blog and social channels in the coming weeks - so stay tuned on X (Twitter), LinkedIn and Discord.
And if you've been inspired to build something with Ably yourself, you can sign up for free and get:
- 6M Monthly messages
- 200 Peak concurrent channels
- 200 Peak concurrent connections
