Add location
View Location and it's Details
Search Location and view it's Details

SudanFoodConnect: A Map-Based Food Donation and Distribution Platform

1. Inspiration

Food insecurity is one of the major humanitarian challenges facing Sudan, where ongoing conflict, economic instability, displacement, and disruptions to essential supply chains have made access to food increasingly difficult for many communities. At the same time, individuals, community kitchens, non-governmental organizations (NGOs), and local volunteers are willing to contribute food and resources to support people in need.

However, one of the challenges in coordinating humanitarian assistance is the lack of an accessible, centralized platform that connects food donors with nearby food collection and distribution points. Information about community kitchens, NGOs, and volunteer-run locations may be scattered across different sources, making it difficult for donors to identify where their contributions are needed.

This inspired us to develop SudanFoodConnect, a lightweight, map-based web application designed to simplify the process of discovering and sharing food drop-off locations. Our goal was to use accessible web technologies and location-based services to improve the visibility of community food distribution points and encourage collaboration between donors, volunteers, and humanitarian organizations.

2. What It Does

SudanFoodConnect provides a centralized, interactive map that helps users discover food drop-off locations and access relevant information about them. The platform is designed to make food donation coordination more accessible, transparent, and convenient.

Its key features include:

Interactive Map of Food Drop-Off Locations: The application displays food collection and distribution points on an interactive map using Leaflet.js and OpenStreetMap. Users can visually explore locations and identify potential drop-off points in different areas.
Detailed Location Information: Users can select a map marker to view available details about a location, including its name, address, contact information, and capacity. This helps donors understand where a location is situated and how to get in touch before contributing.
Community-Driven Location Submission: Users can submit new food drop-off locations through a dedicated form. This allows volunteers, community members, and organizations to contribute information and expand the platform's coverage.
Cloud-Based Data Storage: Firebase Firestore stores location information in a centralized database, allowing the application to retrieve and display submitted location data dynamically rather than relying on manually hardcoded map markers.
Dynamic Map Updates: The application connects stored location data with map markers so that available locations can be represented geographically as the dataset grows.
Lightweight and Accessible Interface: The frontend is designed to remain simple and easy to navigate, with a focus on reducing unnecessary complexity and keeping the experience practical for users who may have limited internet connectivity.

The broader objective is to help bridge the gap between people willing to donate food and the local organizations or community initiatives that can help distribute it.

3. How We Built It

We developed SudanFoodConnect using a frontend-focused architecture that combines web technologies, mapping services, and a cloud-hosted database.

Frontend Development

We used HTML to structure the application, CSS and Tailwind CSS to style the interface, and JavaScript to implement interactive functionality. The frontend focuses on presenting location information clearly and making the map and submission form straightforward to use.

Map Integration

We integrated Leaflet.js, an open-source JavaScript mapping library, with OpenStreetMap as the map data provider. Leaflet enables the application to render an interactive map, place markers at specified coordinates, and display information when users interact with those markers.

This approach provides a flexible mapping solution without requiring a proprietary mapping platform.

Database and Backend Services

We used Firebase Firestore as the cloud database for storing food drop-off location records. The application retrieves location information from Firestore and uses it to populate the map dynamically.

Each location record can contain information such as the location name, geographical coordinates, address, contact details, and capacity. This structure makes the data easier to retrieve and display in the application.

Firebase also reduces the need to build and maintain a separate custom backend for basic data storage and retrieval.

Hosting and Deployment

We used Firebase Hosting to deploy the web application. This provides a straightforward way to publish the frontend and make the platform accessible through a web browser.

The combination of Firebase Hosting and Firestore creates a cloud-based foundation that can support future improvements as the platform expands.

Overall Technology Stack

Frontend: HTML, CSS, Tailwind CSS, JavaScript
Mapping: Leaflet.js, OpenStreetMap
Database: Firebase Firestore
Hosting: Firebase Hosting

4. Challenges We Ran Into

During development, we encountered several technical and design challenges that helped us understand how to build an interactive, data-driven web application.

Integrating Leaflet.js with Firebase Firestore

One of our primary challenges was connecting geographical data stored in Firestore to the Leaflet map. Unlike static maps with predefined markers, our application needed to retrieve location records dynamically and convert their coordinates into map markers.

This required us to understand how database queries, asynchronous JavaScript operations, and map rendering work together.

Managing Dynamic Map Markers

Another challenge was ensuring that location markers corresponded to the available database records. We needed to consider how new locations submitted through the form would be stored and subsequently represented on the map, while avoiding inconsistencies between the displayed markers and the underlying data.

Handling User-Submitted Data

Allowing users to submit new locations introduced questions about data validation, completeness, and security. We explored Firebase security rules and the importance of controlling how users read and write database records.

For a humanitarian platform, these considerations are particularly important because incorrect contact details or misleading location information could prevent people from finding an appropriate distribution point.

Balancing Simplicity and Functionality

We wanted the application to be visually clean without sacrificing essential functionality. Designing an interface that combines a map, location details, and a submission form required careful consideration of information hierarchy, navigation, and usability.

Designing for Low-Bandwidth Environments

Because the platform is intended to support communities that may experience unreliable internet connectivity, we aimed to keep the application lightweight and minimize unnecessary dependencies. This reinforced the importance of performance-conscious web development and simple user interfaces.

5. Accomplishments We're Proud Of

One of our main accomplishments was building a functional prototype that combines interactive mapping, cloud-based data storage, and community-driven location submission in a single web application.

We are particularly proud of the following:

Built an interactive mapping experience: Integrated Leaflet.js and OpenStreetMap to display food drop-off locations geographically.
Connected the frontend to a cloud database: Used Firebase Firestore to store and retrieve location information dynamically.
Implemented location submission: Created a form through which users can contribute additional food drop-off locations.
Developed a deployable web application: Used Firebase Hosting to make the application accessible online.
Focused on a real-world humanitarian challenge: Applied web development and geospatial technologies to a problem involving food access, community coordination, and humanitarian assistance.

Beyond the technical implementation, the project helped us explore how relatively simple web technologies can be combined to support a meaningful social-impact initiative.

6. What We Learned

Developing SudanFoodConnect gave us practical experience in full-stack concepts and the application of web technologies to a humanitarian use case.

Technical Learning

We learned how to integrate Firebase Firestore into a JavaScript-based application, structure and retrieve cloud-hosted records, and connect dynamic database content to an interactive map.

We also gained experience working with Leaflet.js, handling geographical coordinates, rendering markers, and displaying contextual information through map interactions.

Additionally, the project improved our understanding of Firebase Hosting, database security rules, asynchronous JavaScript, and the relationship between frontend interfaces and cloud services.

Design and Problem-Solving

The project taught us that building a useful application involves more than implementing features. We had to consider how users would discover locations, interpret the information presented, submit new records, and navigate the application with minimal effort.

We also learned the importance of designing with the target environment in mind, particularly when connectivity, accessibility, and the reliability of information can affect the usefulness of a service.

Most importantly, we learned how to translate a humanitarian problem into a practical technical solution with clear opportunities for future improvement.

7. What's Next for SudanFoodConnect?

We envision expanding SudanFoodConnect from a basic location-discovery platform into a more reliable community food coordination system.

Arabic Language Support and Right-to-Left Layout

We plan to introduce Arabic language support and a right-to-left (RTL) interface to make the application more accessible to Arabic-speaking users. This would involve adapting navigation, text alignment, forms, and other interface elements to support Arabic naturally.

Verified Organizations and Location Moderation

We aim to introduce user authentication and dedicated accounts for trusted NGOs, community kitchens, and authorized volunteers. A moderation workflow could allow these organizations to review submitted locations, approve new entries, and update existing records.

This would help improve the quality and trustworthiness of the information available on the platform.

Ratings, Comments, and Location Status

We plan to explore a feedback system through which users can report whether a location is active, provide updates, or share relevant information. These features could help identify outdated records and improve the reliability of location listings.

To reduce misinformation, feedback and location-status changes would need appropriate validation and moderation.

Search, Filters, and Nearby Locations

Future versions could include search functionality and filters for location type, available capacity, and other relevant characteristics. Geographical search could help users identify nearby food drop-off points more efficiently.

Improved Data Quality and Reliability

We would also like to introduce better validation for submitted coordinates and contact details, duplicate-location detection, and timestamps showing when a location was last updated. These improvements would help users distinguish recently maintained information from potentially outdated listings.

Low-Bandwidth and Mobile Improvements

We plan to further optimize map loading, reduce unnecessary network requests, and improve the mobile experience. Where practical, we could investigate caching essential location information to help users access previously loaded data during temporary connectivity interruptions.

Future Humanitarian Coordination Features

In the longer term, SudanFoodConnect could explore ways to communicate donation needs, indicate the types of food or supplies accepted at each location, and help organizations coordinate collection and distribution efforts.

Any expansion would prioritize data reliability, user privacy, responsible information sharing, and the safety of vulnerable communities.

8. Conclusion

SudanFoodConnect demonstrates how interactive mapping, cloud databases, and lightweight web development can be combined to address a humanitarian coordination challenge.

By bringing food drop-off locations into one map-based interface and allowing community members to contribute location information, the project aims to make food donation opportunities easier to discover and support.

Although further work is needed to establish verified listings, maintain accurate information, and introduce more advanced coordination features, the project provides a foundation for a more accessible and community-driven food distribution directory.

Our long-term vision is to make SudanFoodConnect a useful digital resource that connects donors, volunteers, NGOs, and community initiatives while supporting efforts to improve access to food across Sudan.