Community Connection News Application

About this Project

This project is the frontend application of my news article website, created using React.js, HTML and CSS. It is designed to display data using the API I built in my backend project. This app features a range of functionality from viewing lists of articles, to voting and commenting on individual articles.

This project is still under development and is continuously being improved.

Project Links

Frontend APP: https://frontend-news-article-project.netlify.app/
Frontend Repo: https://github.com/christianaao/frontend-news-article-project

Backend API: https://news-article-project.onrender.com/
Backend Repo: https://github.com/christianaao/backend-news-article-project

Please refer to the Backend Repo on guidance for using the Backend API

Features of this Project

This project was created as a CRUD (Create, Read, Update, Delete) application, providing users with an engaging experience for browsing and interacting with the news articles available on the site.

Site features include:

• a list of articles to browse through, with details about the article such as author, date of creation, and vote and comment counts

• functionality to filter articles by topic

• functionality to sort topics by different queries, such as date, author, vote count, comment count. This can also be set to ascending or descending order

• a list of topics to browse through, which will redirect to a filtered page of the chosen topic

• individual articles that can be viewed and read

• a voting section for each individual article

• a comments section for each individual article

• functionality to add and delete comments

• error handling functionality, such as error messages for incorrect inputs, missing fields, or non-existing pages

and more features to come!

Setup

In order to run this server locally:

1. Clone or fork this repo.

2. In your terminal, locate the directory you would like to save the code to and type git clone followed by the cloned/forked repo link.

3. In the cloned directory, type npm install in your terminal to install all dependencies.

4. Type npm run dev and the application will become available on the following URL: http://localhost:3000.

☺ I hope you enjoy browsing through my website ☺

Software Requirements

Node version: 18 required or higher

---

This portfolio project was created as part of a Digital Skills Bootcamp in Software Engineering provided by Northcoders