Skip to content

Atos20/communiK

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Contributors Forks Issues Starred

deployed Page

Contributors

Project Directions

CommuniK

Overview

ComuniK aims to keep you informed with all the headlines and tops stories from around the US. News are fun specially in the times we live in. CommuniK allows you as a user to browse over more that 20 different categories and also the abilty to save the stories that you might be interested on but don't have the time to read at the moment.

Do you want to find a top stories by date?, don't worry!. CommuniK allows you also to search stories by date and save them too.

Did you have the time to read all your saved stories or just one?, you can also delete them as you go or remove them all at the same time.

Enjoy it and stay informed.

Context

CommuniK is a project built in five days. This is the last solo project of the third Module of Turing School Software and Design that aims to solidify the use of React, Router and Asynchronomus JavaScript. The main goal in this project were the ability to request information from an API, manipulate the data and display it using React.

Technologies used:

  • React
  • Express
  • SCSS
  • Git
  • GitHub
  • local storage

Challenges

  • Manipulating state using objects
  • File organizations
  • Compoenents arquitecture
  • Testing with jest

Wins

  • Unit testing
  • Integration testing
  • Mocking an API request
  • Saving data to local storage

Future Goals

  • Resolve bugs listed on the project board
  • Add more styling
  • Add more granuluar integration testing
  • Build a local server using Express
  • Add the ability to submit you own article
  • Find more information using other APIS such as NewsAPI

In Action

Take 1

  • Introduction

  • When the user first interacts with the application, the app renders a welcoming message. The user can see on the left-hand side all the categories vailable to choose from.

  • The user can interact and browse the applcation's content from all the available categories. As of this moment there are 26 categgories that the user can select.

The user can interact and browse the applcation's content from all the available categories. As of this moment there are 26 categgories that the user can select.

Take 2

  • Searching by category

  • Over the navigation bar, the user can select a category and fill out the search bar to look for mre stories.

    Over the navigation bar, the user can select a category and fill out the search bar to look for mre stories.

Take 3

  • Search by date

There is another way for the user to find stories.This can be accomplised by using the search-by-date bar. The user should write a date in the following formats, MM-DDYYYY or MM-DD-YYYY.

There is another way for the user to find more stories, the user can write the date and click on search

Take 4

  • Saving stories to read for later

  • When the user has found an article to read but does not have the time to engage with the story, it the user can select the story and read it later. The stories should persist even if the user reloads the page.

When the user has found an article to read but does not have the time to engage with the story, it the user can select the story and read it later. The stories should persist even if the user reloads the page.

Set up

  • On the top right corner of this page, click the Fork button.
  • Clone the repository to your computer git clone <URL>
    • When you run git clone - git clone [remote-address] [what you want to name the repo] replace the [...] with the terminal command arguments): git clone [remote-address] [what you want to name the repo]
  • cd into the repository with the following command cd <repo-name>
  • Run npm install to install all required dependencies
  • By running npm start the application should run on http://localhost:3000/

Contribute

  • Create a new branch with git checkout -b <new branch name>
  • Open your text editor and add or remove functionalities to the site.
  • git add and git commit -m "<your commit meessage>" to save the changes to your local repository
  • git push your changes
  • Make use a PR template whe creating a new pull requests

Project Managers

About

An app to keep me informed of the latest news

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published