Engineering
 Challenge

Creating a web-based news feed

Submitted by 
August 6, 2023
Requirements
Read challenge brief
Allow users to search for articles related to a specific topic
Hired through SkillsRobin
Show a feed of recent news articles
Hired through SkillsRobin

What I Built

Introducing News App - News App is an online news platform that sources news articles around the world from the Internet. Users can enter their interested topics in the search bar to find specific news on demand.

Additionally, News App allows its users to find related articles and updates based on another article of interest. Furthermore, the platform learns the user's preferences based on their liked articles. Therefore, future search results will include more personalised topics and content.

How I Built It

Introduction

The web application is built with an Python backend and an HTML frontend. The main underlying framework is Flask that handles web requests and their corresponding response including the rendering of corresponding webpage (HTML).

The frontend layout is based on an online template with my personal adjustments that tailor to the project functionality. The decision to deploy an template entails that the emphasis of the project is to demonstrate my skills in backend development, specifically in Python.

Programming Paradigm

The development takes an object-oriented approach that transforms each of the news articles into a collection of News objects. These news objects are then managed by another master object, News_Manager.

Operation

The creation of the content on the platform involves multiple API calls. It facilitates the Bing News API to source news articles on the Internet based on given queries. As soon as the backend receives a response, it turns news articles into objects managed by the News_Manager object. The list of objects are then sent to the frontend and parsed into news feeds with a title, description, link to the news website and thumbnail. The News_Manager is responsible for news object creation based on the news given and several other auxiliary class methods outlined in the previous section.

The project also utilises the One AI language model, accessed through API calls. When the user likes an article, the article's title and description are sent to the model to produce keywords and a summary. Subsequently, the backend tokenises the strings and calculate the term frequency for each word. The words are ranked based on their frequency of being used with the top two being the preferred keywords that will be automatically included in the future queries.

Another use case of the language model is that when the user chooses to view more related content and updates based on another article (reference article), the reference article's title is summarised and used to query the Bing News API.

All API calls are done with the Python requests module.

class News:
def __init__(self, title: str, description: str, url: str, date: str, category: str, img_url: str = "https://cdn-icons-png.flaticon.com/512/81/81460.png") -> None:
self.title: str = title
self.description: str = description
self.url: str = url
self.img_url: str = img_url
self.date = date
self.category = category
class News_Manager:
def __init__(self, query: str, time: str) -> None:
self.query: str = query
self.time: str = time
self.all_news = self.get_news(query, time)
def get_news(self, query: str, time: str) -> List[News]:
...
def get_term_frequency(tf: Dict[str, int], description: str):
...
def get_term_frequency(tf: Dict[str, int], description: str) -> Dict[str, int]:
...
def common_noun_only(text: str, tokens: tuple) -> bool:
...

Why I Built It This Way

Design Aspect

The specification involves a pain point where 'it can be difficult to filter through the news to find things you’re interested in'. Therefore, the project is designed to enable users to search a topic of interest, learn about their interests through article keywords and establish a method for them to read more related content based on an article of interest.

Technical Aspect

Object-oriented Decision

The object oriented approach maximises the simplicity and organisation of the development process as classes reduces the need for repetitive code while many elements share the same set of attributes and functions. This also makes the access and modification of an element (represented by an object) more efficient and organised.

Additionally, in terms of the scalability, the object-oriented structure allows the expansion on features and functionality with more flexibility as elements are 'modularised' into objects that isolate the scope of a bigger problem and increase the reusability of the code.

Using Flask and HTML

The purpose of this project is to mainly showcase the skills in backend development. Therefore, the Flask framework allows frontend development to be simplified. This is because with an existing HTML template as the base, the frontend design only involves sending requests into the backend and passing parameters back into the frontend.

What Would I Do Differently

Scalability

In terms of the long-term scalability, deploying a React frontend may be an optimal solution. This is because React supports reusable frontend elements, making the expansion more flexible and efficient though the current preliminary solution fulfils all the desired functionality.

Preference Learning

The current model of preference learning is based on the simple term frequency ranking with stop word filtering and keyword finding. Nevertheless, the system does not make meaning of the keywords and nor does it understand the semantics. As a result, the improve in the current preliminary solution could include a more robust natural language processing to find not only the keywords themselves, but also the other associated keywords to build keyword clusters.

Interactive demo

Recorded Demo

Challenge completed by:
Junior developer passionate about project building and solution ideating with data analytics and programming expertise.
Actively looking
Looking for sidehustle
$
 /year
$
 /hour
Based in: 
Sydney
SkillsRobinID: 
Saltnet
View profile
Connect
Get their LinkedIn profile, real name, contact details and portfolio on connection
Submissions from other candidates