Welcome to Inbox Zing! 🎉 This React-based application is designed to bring you the latest news and updates from various media outlets, all in one place. Enjoy a sleek, intuitive interface with easy navigation options to set your preferences, customize your experience, and stay informed.
-
🔒 Authentication Page: The entry point of the app provides options to Sign Up or Login to access your personalized news feed. Start by creating an account or logging into an existing one.
-
📰 News Feed: Once logged in, you’ll be welcomed with a clean, card-based news feed with the latest articles. Each card contains:
- Headline and source for quick identification.
- Short snippet for a preview of the article.
- Option to dismiss unwanted articles to keep your feed tidy.
-
🔄 Preferences Setup:
- Media Outlets Selection: Choose from a range of popular media outlets (e.g., Axios, Bloomberg, Reuters, etc.) to filter the sources for your news feed.
- Location and Language: Tailor the content based on your Country and Language for a more localized news experience.
- News Delivery Preferences: Select your preferred news update frequency (e.g., every 12 hours) and summary style (e.g., brief or in-depth) to stay up-to-date in a way that suits your schedule.
-
🗑️ Account Management:
- Delete Account: If you wish to unsubscribe from the service, the app provides an option to delete your account permanently.
-
🌐 Responsive Design: Built to look great on desktop, tablet, and mobile devices for a seamless experience across any device.
Before you begin, make sure you have the following installed:
- Node.js (v14 or later) & npm (Node Package Manager)
To set up Inbox Zing locally, follow these steps:
- Clone the Repository:
git clone https://github.com/rohanv32/InboxZingFrontend.git
- Navigate to the Project Directory:
cd InboxZingFrontend - Install Dependencies:
npm install
After the setup is complete, you’re ready to launch Inbox Zing!
- Start the Development Server:
This will launch the app on
npm start
http://localhost:3000. Open this link in your browser to start using Inbox Zing.
Here are some key pages in the Inbox Zing app:
- Sign Up or Login to get started.
- A curated feed with the latest articles from selected sources.
- Dismiss articles you’re not interested in.
- Choose media outlets, country, and language to personalize your experience.
- Set your news delivery frequency and summary style.
- Easily delete your account if you no longer wish to use the service.
- Sign Up / Login: Access the app by signing up for a new account or logging into an existing one.
- Customize Preferences: Choose your preferred news sources, language, location, and frequency of updates.
- View and Manage Feed: Stay updated with the latest news in a format and frequency that suit your preferences.
- Delete Account: Remove your account anytime through the Delete Account page.
- Frontend: React, JavaScript, HTML, CSS
- Styling: Styled-components / CSS Modules —
Stay informed with tailored news, and enjoy a seamless, user-friendly experience. Feedback and suggestions are always welcome to help us improve!