{"id":31977366,"url":"https://github.com/open-source-chandigarh/atmos","last_synced_at":"2026-01-20T18:06:29.625Z","repository":{"id":318460861,"uuid":"1066387293","full_name":"Open-Source-Chandigarh/Atmos","owner":"Open-Source-Chandigarh","description":"Modern React news aggregator with multi-country support, real-time weather, session caching, and beautiful gradient UI. Powered by NewsAPI \u0026 OpenWeatherMap.","archived":false,"fork":false,"pushed_at":"2025-10-07T09:17:51.000Z","size":4110,"stargazers_count":0,"open_issues_count":4,"forks_count":3,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-10-07T11:31:53.120Z","etag":null,"topics":["hactoberfest-accepted","javascript","newsapi","newsapp","react","react-redux","responsive","rest-api","statemanagement","weather-app"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Open-Source-Chandigarh.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-09-29T12:17:18.000Z","updated_at":"2025-10-07T09:30:02.000Z","dependencies_parsed_at":"2025-10-07T11:34:01.835Z","dependency_job_id":"cbafabad-a9f7-40c2-8552-84726f96b01e","html_url":"https://github.com/Open-Source-Chandigarh/Atmos","commit_stats":null,"previous_names":["open-source-chandigarh/atmos"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/Open-Source-Chandigarh/Atmos","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Open-Source-Chandigarh%2FAtmos","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Open-Source-Chandigarh%2FAtmos/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Open-Source-Chandigarh%2FAtmos/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Open-Source-Chandigarh%2FAtmos/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Open-Source-Chandigarh","download_url":"https://codeload.github.com/Open-Source-Chandigarh/Atmos/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Open-Source-Chandigarh%2FAtmos/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279021376,"owners_count":26087023,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-14T02:00:06.444Z","response_time":60,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hactoberfest-accepted","javascript","newsapi","newsapp","react","react-redux","responsive","rest-api","statemanagement","weather-app"],"created_at":"2025-10-14T21:46:33.829Z","updated_at":"2025-10-14T21:46:39.333Z","avatar_url":"https://github.com/Open-Source-Chandigarh.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"#  Atmos - Modern News Application\n\n\u003cdiv align=\"center\"\u003e\n\n![NewsHub Logo](./src/assets/Atmos_Logo-removebg-preview.png)\n\n**Stay Informed with Real-Time News from Around the World**\n\n\n[![License](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)\n[![React](https://img.shields.io/badge/react-18.x-61dafb.svg)](https://reactjs.org/)\n[![Redux](https://img.shields.io/badge/redux-4.x-764abc.svg)](https://redux.js.org/)\n\n• [Report Bug](https://github.com/Open-Source-Chandigarh/Atmos) • [Request Feature](https://github.com/Open-Source-Chandigarh/Atmos)\n\n\u003c/div\u003e\n\n---\n\n## 📸 Screenshots\n\n### Homepage\n![Homepage Screenshot](./Screenshots/HomePage.png)\n*Modern dashboard with top stories and weather widget*\n\n### Category News\n![Category Page Screenshot](./Screenshots/Category.png)\n*Browse news by categories with beautiful card layouts*\n\n### Mobile Responsive\n![Mobile View](./Screenshots/MobileView.png)\n*Fully responsive design for all devices*\n\n---\n\n## ✨ Features\n\n- 🌍 **Multi-Country Support** - News from USA, UK, India, Canada\n- 📂 **Multiple Categories** - Business, Technology, Sports, Health, Science, Entertainment, General\n- 🔍 **Search Functionality** - Find news articles by keywords\n- 🌤️ **Weather Widget** - Real-time weather with city search\n- 📱 **Fully Responsive** - Works perfectly on desktop, tablet, and mobile\n- 🎨 **Modern UI/UX** - Beautiful gradient design with smooth animations\n- 🔐 **Secure** - Environment variables for API keys\n- ♿ **Accessible** - WCAG compliant design\n\n---\n\n## 🚀 Quick Start\n\n### Prerequisites\n\nBefore you begin, ensure you have:\n- Node.js (v14 or higher)\n- npm or yarn\n- Git\n\n### Installation\n\n1. **Clone the repository**\n   ```bash\n   git clone https://github.com/Open-Source-Chandigarh/Atmos\n   cd news-app\n   ```\n\n2. **Install dependencies**\n   ```bash\n   npm install\n   ```\n\n3. **Set up environment variables**\n   \n   Create a `.env` file in the root directory:\n   ```env\n   VITE_NEWS_API_KEY=your_news_api_key_here\n   VITE_WEATHER_API_KEY=your_weather_api_key_here\n   ```\n\n4. **Get your API keys**\n\n   **News API:**\n   - Visit [NewsAPI.org](https://newsapi.org/register)\n   - Sign up for a free account\n   - Copy your API key\n   - Free tier: 100 requests/day\n\n   **Weather API:**\n   - Visit [OpenWeatherMap](https://openweathermap.org/api)\n   - Sign up for a free account\n   - Copy your API key\n   - Free tier: 1,000 requests/day\n\n5. **Start the development server**\n   ```bash\n   npm start\n   ```\n\n6. **Open your browser**\n   \n   Navigate to [http://localhost:3000](http://localhost:3000)\n\n---\n\n## 🛠️ Built With\n\n| Technology | Purpose |\n|------------|---------|\n| [React](https://reactjs.org/) | Frontend framework |\n| [Redux](https://redux.js.org/) | State management |\n| [React Router](https://reactrouter.com/) | Navigation |\n| [NewsAPI](https://newsapi.org/) | News data source |\n| [OpenWeatherMap API](https://openweathermap.org/) | Weather data |\n| [Vite](https://vitejs.dev/) | Build tool |\n\n---\n\n## 📁 Project Structure\n\n```\nnews-app/\n├── public/\n│   └── index.html\n├── src/\n│   ├── CSS/\n│   │   ├── Header.css\n│   │   ├── HomePage.css\n│   │   ├── HomepageNews.css\n│   │   ├── FeaturedNews.css\n│   │   ├── NewsBar.css\n│   │   ├── NewsItem.css\n│   │   ├── Weather.css\n│   │   └── Footer.css\n│   ├── Store/\n│   │   ├── Action-creator/\n│   │   │   └── index.js\n│   │   ├── reducer/\n│   │   │   ├── countryReducer.js\n│   │   │   └── index.js\n│   │   ├── store.js\n│   │   └── index.js\n│   ├── assets/\n│   │   └── Atmos_Logo-removebg-preview.png\n│   ├── App.css\n│   ├── App.jsx\n│   ├── Header.jsx\n│   ├── Footer.jsx\n│   ├── HomePage.jsx\n│   ├── HomepageNews.jsx\n│   ├── FeaturedNews.jsx\n│   ├── NewsBar.jsx\n│   ├── NewsItem.jsx\n│   ├── Weather.jsx\n│   ├── index.css\n│   └── main.jsx\n├── .env.example\n├── .gitignore\n├── package.json\n├── vite.config.js\n└── README.md\n```\n\n---\n\n## 🎯 Usage\n\n### Browsing News\n1. **Homepage** - View top stories and weather\n2. **Categories** - Click navigation links to browse by category\n3. **Countries** - Use flag buttons to switch between countries\n4. **Articles** - Click any article card to read full story\n\n### Weather Widget\n1. Enter any city name in the search box\n2. Press Enter or click the search button\n3. View current temperature, conditions, and details\n\n### Search News\n1. Use the search bar on homepage\n2. Enter keywords (e.g., \"technology\", \"bitcoin\")\n3. View filtered results\n\n---\n\n## 🔐 Environment Variables\n\nCreate a `.env` file in the root directory:\n\n```env\n# News API Key\nVITE_NEWS_API_KEY=your_news_api_key_here\n\n# Weather API Key\nVITE_WEATHER_API_KEY=your_weather_api_key_here\n```\n\n⚠️ **Important:** Never commit your `.env` file to Git. It's already in `.gitignore`.\n\n---\n\n## 🚀 Deployment\n\n### Deploy to Vercel (Recommended)\n\n1. Push your code to GitHub\n2. Go to [Vercel](https://vercel.com)\n3. Click \"New Project\"\n4. Import your repository\n5. Add environment variables:\n   - `VITE_NEWS_API_KEY`\n   - `VITE_WEATHER_API_KEY`\n6. Click \"Deploy\"\n\nYour app will be live in ~2 minutes!\n\n### Deploy to Netlify\n\n1. Build your project:\n   ```bash\n   npm run build\n   ```\n2. Go to [Netlify](https://netlify.com)\n3. Drag and drop the `build` folder\n4. Add environment variables in site settings\n\n### Deploy to GitHub Pages\n\n1. Install gh-pages:\n   ```bash\n   npm install gh-pages --save-dev\n   ```\n\n2. Add to `package.json`:\n   ```json\n   \"homepage\": \"https://yourusername.github.io/news-app\",\n   \"scripts\": {\n     \"predeploy\": \"npm run build\",\n     \"deploy\": \"gh-pages -d build\"\n   }\n   ```\n\n3. Deploy:\n   ```bash\n   npm run deploy\n   ```\n\n---\n\n## 🎨 Color Palette\n\n```css\nPrimary Gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%)\nBackground: linear-gradient(135deg, #1e1e2e 0%, #2d1b4e 50%, #1e1e2e 100%)\nCard Background: rgba(255, 255, 255, 0.05)\nText Primary: #ffffff\nText Secondary: rgba(255, 255, 255, 0.7)\n```\n\n---\n\n\n\n## 🤝 Contributing\n\nContributions are welcome! Here's how you can help:\n\n1. Fork the project\n2. Create your feature branch\n   ```bash\n   git checkout -b feature/AmazingFeature\n   ```\n3. Commit your changes\n   ```bash\n   git commit -m 'Add some AmazingFeature'\n   ```\n4. Push to the branch\n   ```bash\n   git push origin feature/AmazingFeature\n   ```\n5. Open a Pull Request\n\n### Development Guidelines\n- Follow existing code style\n- Test thoroughly before submitting PR\n- Update README if adding new features\n- Don't commit API keys or `.env` file\n\n---\n\n## 🐛 Known Issues\n\n- NewsAPI free tier has rate limits (100 requests/day)\n- Some news sources may not have images\n- Weather API coordinates may vary for cities with same names\n\n---\n\n## 🔮 Future Features\n\n- [ ] Bookmarks/Save articles\n- [ ] Dark/Light mode toggle\n- [ ] AI news summarizer\n- [ ] Push notifications\n- [ ] Social media sharing\n- [ ] Reading history\n- [ ] Personalized news feed\n- [ ] Multi-language support\n- [ ] Voice commands\n- [ ] Offline mode (PWA)\n\n---\n\n## 📝 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n---\n\n## 👨‍💻 Author\n\n**Your Name**\n- GitHub: [150202-Pratham](https://github.com/150202-Pratham)\n- LinkedIn: [Pratham Garg](www.linkedin.com/in/pratham-garg-11a945231)\n- Email: prathamgarg1502@gmail.com\n\n---\n\n## 🙏 Acknowledgments\n\n- [NewsAPI](https://newsapi.org) for providing news data\n- [OpenWeatherMap](https://openweathermap.org) for weather data\n- [React](https://reactjs.org) team for amazing framework\n- [Redux](https://redux.js.org) for state management\n- All contributors who help improve this project\n\n---\n\n## 📞 Support\n\nIf you have any questions or issues:\n- Open an [Issue](https://github.com/Open-Source-Chandigarh/Atmos)\n- Contact me on [LinkedIn](www.linkedin.com/in/pratham-garg-11a945231)\n- Email: prathamgarg1502@gmail.com\n\n---\n\n## ⭐ Show Your Support\n\nGive a ⭐ if this project helped you!\n\n---\n\n\u003cdiv align=\"center\"\u003e\n\n**Made with ❤️ by [Pratham](https://github.com/150202-Pratham)**\n\n[⬆ Back to Top](#-ATMOS---modern-news-application)\n\n\u003c/div\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopen-source-chandigarh%2Fatmos","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fopen-source-chandigarh%2Fatmos","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopen-source-chandigarh%2Fatmos/lists"}