diff --git a/README.md b/README.md new file mode 100644 index 0000000..2582ed6 --- /dev/null +++ b/README.md @@ -0,0 +1,135 @@ +# Aero Echo + +A real-time flight tracking application that displays live aircraft movements on an interactive map. + +![alt text](image.png) + +## 🚀 Features + +- **Real-Time Tracking**: Watch aircraft positions update instantly with WebSocket connections +- **Global Coverage**: Track flights worldwide with extensive ADS-B network coverage +- **Live Data**: Access comprehensive flight details including altitude, speed, and heading +- **Smart Filtering**: Flight data is filtered based on map zoom level and boundaries for optimal performance +- **Responsive Design**: Works seamlessly on desktop and mobile devices + +## 🛠️ Technologies Used + +### Frontend + +- **Next.js** - React framework for optimized performance and seamless navigation +- **Socket.IO Client** - WebSocket technology for real-time bidirectional communication +- **Tailwind CSS** - Utility-first CSS framework for styling +- **Lucide React** - Beautiful icon library + +### Backend + +- **Node.js** - JavaScript runtime environment +- **Express** - Web application framework for Node.js +- **Socket.IO** - Real-time event-based communication +- **ADSB.one API** - Real-time aircraft data streaming + +## 📋 Prerequisites + +Before you begin, ensure you have the following installed: + +- Node.js (v18 or higher) +- npm or yarn +- Git + +### 🔧 Installation + +## ⚙️ Configuration + +### Backend Configuration + +Create a `.env` file in the backend directory: + +```env +NODE_ENV=development +PORT=3001 +``` + +### Frontend Configuration + +Create a `.env.local` file in the frontend directory: + +```env +NEXT_PUBLIC_API_URL=http://localhost:3001/api/v1 +NEXT_PUBLIC_SOCKET_SERVER_URL=http://localhost:3001 +``` + +## 🚀 Running the Application + +```bash +npm run dev +``` + +## 📡 API Limitations + +This application uses the ADSB.one API with the following constraints: + +- **Coverage Radius**: Limited to 250 nautical miles from a specific location +- **Rate Limiting**: Maximum 1 request per second to the API +- **Data Caching**: Server-side global variable caching is implemented to optimize performance and respect rate limits +- **Smart Filtering**: Flight data is filtered based on map zoom level and boundaries to provide relevant information efficiently + +## 🏗️ Architecture + +### Data Flow + +1. Backend makes requests to ADSB.one API (max 1 req/sec) +2. Flight data is cached in a global variable on the server +3. Frontend connects to backend via Socket.IO +4. Backend filters and sends relevant data based on map boundaries +5. Frontend receives real-time updates and displays aircraft on the map + +### Caching Strategy + +To respect the API's 1 request/second limit, the backend: + +- Maintains a global cache of all aircraft data +- Updates the cache once per second +- Filters data based on client's map view +- Pushes only relevant data to connected clients + +## 🤝 Contributing + +Contributions are welcome! Please feel free to submit a Pull Request. + +1. Fork the project +2. Create your feature branch (`git checkout -b feature/AmazingFeature`) +3. Commit your changes (`git commit -m 'Add some AmazingFeature'`) +4. Push to the branch (`git push origin feature/AmazingFeature`) +5. Open a Pull Request + +## 📝 License + +This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details. + +## 🙏 Acknowledgments + +- [ADSB.one](https://api.adsb.one) for providing free aircraft tracking data +- [Socket.IO](https://socket.io/) for real-time communication +- [Next.js](https://nextjs.org/) for the amazing React framework +- [Tailwind CSS](https://tailwindcss.com/) for the utility-first CSS framework + +## 📞 Contact + +Your Name - [@yourtwitter](https://twitter.com/yourtwitter) + +Live Demo: [https://aeroecho.roozbehk.com/](https://aeroecho.roozbehk.com/) + +## 🐛 Known Issues + +- Coverage limited to 250nm radius from configured location +- API rate limiting may cause delays during high traffic +- Some aircraft may not appear if outside the coverage area + +## 🔮 Future Enhancements + +- [ ] Add flight path history +- [ ] Implement aircraft search functionality +- [ ] Add airport information overlays +- [ ] Create mobile app version +- [ ] Add weather layer integration +- [ ] Implement multiple location support diff --git a/frontend/README.md b/frontend/README.md deleted file mode 100644 index 09a8a4d..0000000 --- a/frontend/README.md +++ /dev/null @@ -1,36 +0,0 @@ -This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. diff --git a/frontend/image.png b/frontend/image.png new file mode 100644 index 0000000..3211c3c Binary files /dev/null and b/frontend/image.png differ diff --git a/image.png b/image.png new file mode 100644 index 0000000..f7342c3 Binary files /dev/null and b/image.png differ diff --git a/package-lock.json b/package-lock.json index 697efb0..ef04d5d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "aeroecho-fullstack", - "version": "1.0.0", + "version": "1.1.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "aeroecho-fullstack", - "version": "1.0.0", + "version": "1.1.1", "dependencies": { "leaflet-rotatedmarker": "^0.2.0" },