Sulton88Mehron90 / news-reader

Home Page:https://news-reader-sable.vercel.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

News Reader 🗞️

Dive into a world of current events and stories with News Reader! This application is designed for those who seek to stay informed with the latest news in an engaging and interactive manner.

Description

News Reader is a simple app that lets you catch up on the latest headlines and articles in categories you care about. It aggregates articles from the News API, presenting users with the latest news articles including headlines, images, descriptions, and publishing dates. The app provides a detailed view for each article and a way to filter or search through the news feed.

image

Project Context

This project was developed as part of the Turing School of Software and Design curriculum. It serves as a take-home challenge simulating a real-world coding interview assignment. The task was to create a minimum viable product (MVP) that is user-friendly, clear in information presentation, and straightforward in navigation.

image

Live Demo

Stay updated with the happenings around the world. Explore News Reader.

image

Preview of App

News Reader App

image

Setup & Installation

Get News Reader running on your machine:

  1. Clone the repository: git clone git@github.com:Sulton88Mehron90/news-reader.git
  2. Move to the project directory: cd news-reader
  3. Install dependencies: npm install
  4. Start the app: npm start
image

Technologies:

News Reader is built using a blend of modern web technologies:

JavaScript HTML5 CSS3 Node.js Git React Cypress
image

Requirements

The application meets the following requirements:

  • Displays a list of articles, including headline, image, description (if available), and date.
  • Provides a detailed view of each article within the app, showcasing the headline, image, date, content, and source.
  • Includes internal navigation from the article list to the detailed article view.
  • Features the search functionality.
image

Additional Notes

  • To preserve API request limits during development, mock data was used to build the application before switching to live API requests for demonstration purposes.
  • The interface is designed to be responsive and accessible on desktop, tablet, and mobile devices.
image

Evaluation Criteria

The following aspects were emphasized in the development of News Reader:

  • Proficiency in React JS and front-end development best practices.
  • Ability to focus on MVP requirements and prioritize features accordingly.
  • Understanding of usability principles and adherence to web standards.
  • Clear information hierarchy and navigation within the app.
  • Clean and well-organized codebase.
image

Contributor

Meet the developer behind News Reader:

Parvin A. Sattorova LinkedIn || GitHub
GitHub Avatar
image

Reflections

Through this project, I've had a good practice understanding and improving my skills in state management, React hooks, and creating a responsive and interactive user experience with React Router. It's been a great exercise in building a practical, real-world application that demands efficiency and a good understanding of user interactions.

image

About

https://news-reader-sable.vercel.app/


Languages

Language:TypeScript 65.5%Language:CSS 29.9%Language:HTML 4.6%