Web API using transformation for the purpose to dynamic web app.

1. z News Web App using
News API for web
platform to enhancing
user experiences
PRESENTATION ON :

2. z
Presentation
Outline
Introduction
Objectives
Technology Platform Overview
Web Feature Overview
Implementation
Web Snapshots

3. z
Introduction
 Online News Sites play a significant role in educating and
informing Mass with the newest updates, current happenings
around the globe. People don’t have far more time to read the
Printed newspaper with yesterday’s happening so that they
always follow web portals or Electronic Media for getting latest
News.
 Basically what our website do to offer the news to the Health,
Science, Entertainment, sports, Technology, Business etc.
Getting Instant & latest news from all over the world. You can
find on your interest based news.

4. z
Objectives of the Project
 The prime objective of "News For Us" is to develop a full fledged web
application which could be showing interest based news.
 Significantly reduce the showing non-interest based news.
 This help the user to decrease screen time to reading non important
news

5. z
Academic
Objectives
Learn the process of the Frontend Development
Understand how Website works , their life cycle
method.
Design and develop User friendly useful web
applications.
Learn React to make single and fast page
applications.
Using API to fetching News data and categories on
different sections.
Using Bootstrap for some styling.

6. z
Technology
Platform
 Web Platform : Frontend Development
 Web Development FrameWork : React Js
 Developing Language : Javascript
 Version Control : Github
 API : News API

7. z
Reason for
Choosing
React
 React Js. is one of the most popular front-end JavaScript
libraries for building Web applications.
 It is known to be fast, scalable, simple, and highly
advantageous to be used to create large web applications
where we can change data without reloading the page.
 Its based on principle of write once, learn anywhere.
 SEO friendly.

8. z
Web Snapshots: This is how our website look like

9. z
Creating Categories

10. z
z
Install React Router Package

11. z
Changing the
title Dynamically
 And passing to
the header tag

12. z
Installing react-infinite-
scroll-component
 Creating fetchMoreData Function

13. z
z
Adding a top loading bar

14. z
Hiding API Key by Adding Custom Environment Variables

15. z
z
THANK
YOU