rorycawley / wp-demo

Table of Contents

• About the Project
  • Built With
  • Tested With
  • Project Structure
• Getting Started
  • Installation

About the Project

These are the user stories that I derived from the problem exercise:

• as a user, I want to enter a subreddit, so that I can view the the most recent posts in that subreddit
• as a user, while looking at a page of 10 subreddit posts I want to be able to view the previous 10 posts
• as a user, while looking at a page of 10 subreddit posts I want to be able to view the next 10 posts

Built With

The project was build with these libraries:

• Yarn
• TypeScript
• Parcel
• React
• Material UI

Tested With

• Jest
• React Testing Library
• Mock Service Worker (used to help test components that use API)

Project Structure

The project has 3 core components.

• [ Root ] - the top level container, provides a Context wrapper holding a global state for the currentlychosen subreddit
• [ SearchBar ] - this holds the Autocomplete functionality, it uses the useDataAPI hook to fetch list of subreddits
• [ SubRedditPosts ] - it uses the useDataAPI hook to fetch a list of posts when the subreddit changes or the page changes

Getting Started

To get a local copy up and running follow these simple example steps.

Installation

1. Unzip the code

unzip wp-demo.zip

2. Change into the new directory

cd wp-demo

3. Install NPM packages

yarn install

4. Build the application and run it on http://localhost:3000

yarn watch

5. Test the application

yarn test
yarn test:watch

6. Build the application for distribution, uses dist/release folder

yarn build