TyphoNet

Inspiration ## What it does Recently, Hong Kong experienced the severe impact of Super Typhoon Ragasa, which led to widespread disruption—transport shutdowns, flooding, landslides, power outages, and flight cancellations. This incident underscored the urgent need for a unified platform that aggregates diverse real-time data sources, including Typhoon & Weather updates, Public Transport Status, Aviation updates, and Government & Social Alerts. Recognizing the potential to enhance public safety and improve situational awareness, we were inspired to create a centralized dashboard that brings together all this vital information in real time, ensuring that Hong Kong residents are well-informed during emergencies.

How we built it We developed the Hong Kong Typhoon & Emergency Info Aggregator with a focus on integrating various real-time data streams from official Hong Kong government APIs and feeds. The backend system fetches, normalizes, and consolidates data related to typhoon and weather conditions, public transport statuses, and alerts about flooding, landslides, aviation disruptions, and government announcements into a cohesive JSON response. The system is designed to handle endpoint failures gracefully, marking missing data as null and providing user-friendly error messages.

A significant contributor to our development process was the Amazon Q Developer, which played a crucial role in streamlining our backend architecture. By utilizing Amazon's cloud services, we enhanced our data processing capabilities and ensured reliable performance during peak usage times. The integration of Amazon Q's tools allowed us to efficiently manage the data flows and ensure that the platform remains responsive and scalable.

On the frontend, we created a fully responsive, user-centric interface that visualizes this information in real time. The UI features interactive maps, color-coded severity indicators, and scrollable lists for incident reports and service requests. By enabling user location permissions, we provide localized transport availability and traffic condition displays. The layout employs a two-column design for efficient navigation and detail viewing.

Using standard web technologies—HTML, CSS (for a responsive grid/calendar), and JavaScript with asynchronous AJAX fetching—we incorporated GIS overlays for map data. The system refreshes data periodically at configurable intervals to ensure performance without compromising timeliness. Comprehensive error handling is implemented to maintain a smooth user experience even during data outages.

We documented setup and deployment instructions for both GitHub Pages and Netlify static hosting. Our full-stack approach integrates robust real-time data aggregation with an intuitive web interface designed to keep Hong Kong residents informed, safe, and connected during emergency events.

Challenges we ran into We faced challenges such as managing inconsistent data formats, handling API failures, optimizing real-time data refresh rates without degrading performance, and designing an intuitive interface that meets the needs of diverse users during emergencies.

Accomplishments that we're proud of We take pride in successfully unifying a wide range of real-time data from various official Hong Kong government sources into a reliable emergency information platform. Our system consolidates datasets covering typhoon and weather updates, transport statuses, road and traffic alerts, power outages, community services, flood and landslide warnings, aviation disruptions, and government announcements—refreshing this information in real time while gracefully managing data source failures.

Additionally, we developed an intuitive, fully responsive website that visualizes complex information through interactive maps, severity color codes, and user-friendly reporting interfaces. Our platform fosters community engagement with features for incident reporting and transportation service requests, enhancing awareness and coordination during emergencies.

Our work adheres to global best practices in disaster risk management and contributes to Hong Kong’s reputation as a resilient city prepared for extreme weather events. The successful integration of multiple live feeds into a seamless user experience during challenging typhoon conditions—like the recent T10—highlights the platform's practical value and technical robustness. We are especially proud that our platform empowers residents to make informed decisions and stay safe amid crisis scenarios.

What we learned We enhanced our skills in API integration, real-time data handling, responsive web design, and the importance of user-centric design in critical information systems.

What's next for the Hong Kong Typhoon & Emergency Info Aggregator Future plans include expanding data sources, enhancing predictive analytics, improving mobile accessibility, and incorporating AI-driven insights to further empower Hong Kong residents in emergency preparedness and response. Leveraging the capabilities of Amazon Q Developer will continue to play a pivotal role in scaling our platform and enhancing its functionalities as we grow.