dibakarimi / ft-test

FT-TEST

FT-TEST is a Node.js app for displaying headlines from Financial Times.

Table of Contents

1. About The Project
   • Data flow
   • Technologies
2. Getting Started
   • Installation
3. Usage
4. Contact
5. Sources
6. Task points
7. In future

About The Project

This project shows 15 headlines in every page.

• There is a search box for user to search for headlines containing specific words.
• The App has paginiation and user can to click on Next or Previous buttons to navigate between pages.
• Every headline has link to open the details page.

Data flow

1. The user requests the homepage (https://ft-test.herokuapp.com)
2. The server fetches the search results from the FT api and returns the rendered page to the client, caching the results for pagination
3. The headlines are sliced for the first page and calculate pages count based on per page count.
4. By clicking the "Next" or "Previous" button, display the next or last slice of headlines.
5. If the user enter words in the search box and click search icon, the steps 2 and 3 will run again.

(back to top)

Technologies

• HTML
• CSS
• JavaScript
• Node.js
• Express
• Handlebars
• Jest

(back to top)

Getting Started

Installation

1. Get FT APIs Key at https://developer.ft.com/portal/services

2. Clone the repo

   git clone https://github.com/DibaKarimi/FT-TEST

3. Install NPM packages

   npm install

4. env file would be

   const API_URL = 'ENTER YOUR API URL';

5. env file would be

   const API_KEY = 'ENTER YOUR API KEY';

(back to top)

Usage

After running the app in localhost, open 'localhost:3000'. You will see headlines on the main part of the page and pagination bar at the bottom of the headlines. It will show 15 headlines by default. Enter a specific words in search input box and then click on the search button, it will show the headlines related to the search keyword. If there are more than 15 headlines,they are divided in pages, you are be able change the page by clicking on the next or previous buttons.

(back to top)

Contact

Diba(somayeh) Karimi - [email protected]

Project Link: https://github.com/DibaKarimi/FT-TEST

Sources

• This project was inspired by
• https://github.com/ChristianHur/152-150-Web-Programming-2
• https://www.youtube.com/watch?v=ZX3qt0UWifc
• https://www.youtube.com/watch?v=FgnxcUQ5vho

(back to top)

Task points

The project has been built to

• Display headlines from the Financial Times
• Provide search box to search for headlines contaning specific words
• Be responsive
• Be accessible
• Have pagination
• Using Javascript and node.js
• Deployed on Heroku
• Have a similar look and feel as ft.com
• Have unit test

In future

• Use Origami components to design the page
• Work offline
• Progressively enhanced