AirPollutionApp: A React Native App for Air Quality Monitoring

This project demonstrates the development of a React Native application that fetches and displays air quality data from the OpenWeatherMap API. The backend utilizes Express.js and Node.js to handle API requests and hide the OpenWeatherMap API key.

Untitled.mp4

Project Structure

Backend:

• Uses Express.js and Node.js to handle API requests.
• Fetches air quality data from the OpenWeatherMap API.
• Hides the OpenWeatherMap API key using environment variables.
• Returns appropriate responses based on API status codes.

Frontend:

• Uses React Native for cross-platform mobile development.
• Utilizes TypeScript for type safety and code maintainability.
• Implements a custom speedometer component using Skia for smooth animations.
• Fetches and displays air quality data from the backend API.
• Uses react-native-reanimated for smooth and performant animations.
• Implements a clean and user-friendly interface.

Key Features

Air Quality Data Visualization:

• The app displays air quality data in a visually appealing and informative way using a custom speedometer component.
• Real-time Data Updates: The app fetches and displays air quality data in real-time, providing users with up-to-date information.
• User Location Awareness: The app utilizes the device's location to fetch air quality data specific to the user's current location.
• Clean and Intuitive Interface: The app features a clean and intuitive interface that is easy to navigate and understand.
• Cross-platform Compatibility: The app is built with React Native, making it compatible with both iOS and Android devices.

Technologies Used

Backend:

• Express.js
• Node.js
• dotenv

Frontend:

• React Native
• TypeScript
• Expo
• Skia
• react-native-reanimated
• react-native-safe-area-context
• zod

Future Enhancements

• Map Integration: Integrate a map to visualize air quality data geographically.
• Historical Data Tracking: Allow users to track historical air quality data for their location.
• Air Quality Alerts: Implement air quality alerts to notify users when air quality levels exceed safe thresholds.
• Personalized Recommendations: Provide personalized recommendations based on air quality data and user preferences.