What inspired us
In a medical emergency, every single second counts. When you or someone you love needs urgent care, the last thing you want to be doing is digging through a wallet for an insurance card or trying to remember your exact blood type while frantically searching for the nearest clinic. We realized there was a critical gap between secure medical identity storage and instant location tracking. We built Avela to bridge that gap, giving users peace of mind by securely vaulting their vital data and instantly routing them to care when they need it most.
How we built it
We utilized a decoupled PERN-stack (PostgreSQL, Express, React, Node) architecture to ensure separation of concerns and high scalability. Our development process followed an Agile methodology, allowing us to rapidly iterate on the frontend UI while simultaneously hardening the backend.
- Frontend (Client): Built with React and Vite for a blazing-fast, modern user interface. We integrated Clerk for robust, secure user authentication without rolling our own password hashes.
- Mapping: The core navigation relies on the Google Maps API (Places and Geocoding) to instantly translate the user's geolocation coordinates into real-world addresses and nearby healthcare facilities.
- Backend (Server & Database): We engineered a custom Node.js/Express RESTful API running on a separate port. This backend communicates securely with a Supabase PostgreSQL database using the Supabase client, ensuring that sensitive user data (like policy numbers and blood types) are securely vaulted and easily retrieved upon login.
Challenges we ran into
Our biggest hurdle wasn't just the logic; it was navigating the constraints of our tools and infrastructure. We initially began development using MongoDB, but we quickly ran into persistent configuration issues and connection problems that slowed down our progress during the early hours of the hackathon. Recognizing that we needed a more streamlined approach to get our data pipeline moving, we made the strategic decision to pivot to Supabase.
However, the transition brought its own set of challenges. During intense bug testing and rapid development, we frequently hit API key rate limits, forcing us to become much more disciplined with how we handled requests and managed our development environment. We had to implement more efficient data-fetching strategies and carefully monitor our usage to ensure we didn't lock ourselves out mid-sprint.
What we learned
Building Avela was a masterclass in full-stack architecture. We learned:
- Decoupled Systems: How to build a true Client-Server architecture where the React frontend and Node backend run completely independently.
- Network Triage: How to read the browser's Network tab, understand HTTP status codes, and bypass institutional firewall restrictions.
- Secure Auth Flows: How to pass secure
userIdtokens from Clerk into our Supabase database to ensure users only see their own medical data using Row Level Security.
What's next for Avela
Currently, Avela is a highly functional web application, but in an emergency, mobile is king. Our next step is porting the frontend to React Native so users can carry their medical vault in their pocket. We also plan to integrate live wait-time APIs for nearby emergency rooms, ensuring users are routed not just to the closest hospital, but to the one that can treat them the fastest.
Built With
- clerk
- css3
- express.js
- google-maps
- html5
- javascript
- node.js
- places-api
- react.js
- vite
Log in or sign up for Devpost to join the conversation.