News Service - CodersCamp JavaScript project

Build Status Coverage Status

Table of contents

General info

News Service is a service where You can find all newest, most relevant information You need. Additionally, if You are willing to code with our team and enhance our project You are welcome to collaborate! ;)

Technologies

For this project we used Vanilla JS, pure CSS and html. Each created subpage uses external REST API to get all needed data. Also, each contributor tried to cover as much code with test as it was possible.

Setup


To run this project, install it locally:

  • Use git clone to clone this repository
  • install all needed dependencies using npm install
  • build your project and start a server by npm run start:dev The app will be hosted on localhost:8765/index.html

Project testing

  • Use npm run test command
  • tests with coverage raport - npm run test:cov

Content

Project was divided into 6 main parts:

  • homepage (developed by Rafał),
  • sportpage (developed by Jakub),
  • foodpage (developed by Kacper),
  • weatherpage (developed by Karolina),
  • newspage (developed by Adam),
  • cryptocurrencypage (developed by Mateusz).

Each page was supervised by Jakub.

Homepage

  • Uses carousel which serves as menu
  • Displays calendar with current date
  • Footer and nav-menu for other pages

    Homepage screenshot

Sportpage

  • Fetching data with scores from last round
  • Future games with team logs

    Sportpage screenshot

Foodpage

  • Searching recipes by nutrients
  • Displaying random recipe
  • Displaying most popular recipes
  • Displaying details of ingredient
  • Similar functionalities are available with vines

    Foodpage screenshot

Weatherpage

  • Current weather in selected city
  • Weather alerts
  • Weather forecast for next 8 days
  • Air pollution info

    Weather screenshot

Newspage

  • News from world: 5 news per day
  • News from Poland
  • Health events

    Newspage screenshot

Cryptocurrencypage

  • Displaying list of all cryptocurrencies (with pagination)
  • After click on selected coin - display a modal window with data based on coin
  • In the modal window: exchange coins to USD

    Cryptocurrencypage screenshot

Sources

Design inspiration Behance

Other

Webpage was developed using "Mobile first" principle which means that we start the product design from the mobile end which has more restrictions, then expand its features to create a tablet or desktop version. No bootstrap was used during development.

Contributors