https://github.com/ttibbs/nc-news

Full stack news aggregate app created as part of a Digital Skills Bootcamp in Software Engineering provided by Northcoders.
https://github.com/ttibbs/nc-news

axios context crud-operation error-handling form-validation javascript react react-hooks react-router realtime-database restful-api state-management vite

Last synced: 3 months ago
JSON representation

Full stack news aggregate app created as part of a Digital Skills Bootcamp in Software Engineering provided by Northcoders.

• Host: GitHub
• URL: https://github.com/ttibbs/nc-news
• Owner: TTibbs
• Created: 2024-11-04T12:03:04.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2025-01-02T21:15:11.000Z (over 1 year ago)
• Last Synced: 2025-02-04T13:23:14.418Z (over 1 year ago)
• Topics: axios, context, crud-operation, error-handling, form-validation, javascript, react, react-hooks, react-router, realtime-database, restful-api, state-management, vite
• Language: JavaScript
• Homepage: https://nc-news-ten.vercel.app
• Size: 34.5 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          


  

  



# NC News FE Project

Welcome to N(c)ews! This is a React app built with Vite.js to display news articles from a backend server. It was created as part of the frontend phase of the Northcoders bootcamp.

## Table of Contents

- [Live View](#live-view)

- [About The App](#about-the-app)

- [Tech Stack](#tech-stack)

- [Screenshots](#screenshots)

- [Backend Repo](#backend-repo)

- [Requirements](#requirements)

- [Installation](#installation)

## Live View

View the live version [here](https://nc-news-ten.vercel.app/)

## Features to Explore:

- Browse articles by topic.

- Read detailed articles.

- Post comments and vote on articles.

- Sign up and log in to interact with content (e.g., post or delete comments and articles).

## About the App

NC News is a news aggregation and interaction app where users can:

- Browse news articles by topic.

- Read individual articles with detailed views.

- Post comments on articles and interact via voting.

- Create an account and log in for enhanced functionality (e.g., posting or deleting articles/comments).

This project was designed to practice frontend development principles, including routing, API integration, and dynamic user interfaces.

## Tech Stack



  

  

  

  

  



  

    


      Screenshots

    

  


  


    Mobile

  


  


    

    

    

    

    

  


  


    Tablet

  


  


    

    

    

    

    

  


  


    Laptop

  


  


    

    

    

    

    

  


## Backend Repo

If you are interested in viewing the backend repo and investigating the server, you can go [here](https://github.com/TTibbs/be-nc-news)

And if you are interested in viewing the API endpoints you can see them [here](https://be-nc-news-92aj.onrender.com/api)

## Requirements

### Node Version

To run this project, you need Node.js v22.5.1 or higher.

To check your version of Node, open your terminal and use the following command:

```bash

node --version

```

## Installation

Follow these steps to set up the project on your machine:

### 1. Clone the Repository

```bash

git clone https://github.com/your-username/nc-news.git

```

### 2. Navigate to the Project Directory

```bash

cd nc-news

```

### 3. Install Dependencies

```bash

npm install

```

### 4. Start the Development Server

```bash

npm run dev

```

The app should now be running on http://localhost:5173 by default

---

This portfolio project was created as part of a Digital Skills Bootcamp in Software Engineering provided by [Northcoders](https://northcoders.com/)