https://github.com/opticsquid/breakingbad

A website for Breaking Bad lovers
https://github.com/opticsquid/breakingbad

express full-stack gdsc-tmsl hacktoberfest mern-stack nodejs reactjs

Last synced: 12 days ago
JSON representation

A website for Breaking Bad lovers

• Host: GitHub
• URL: https://github.com/opticsquid/breakingbad
• Owner: opticSquid
• License: bsd-3-clause
• Created: 2022-01-19T09:55:32.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2023-02-27T06:10:10.000Z (almost 2 years ago)
• Last Synced: 2023-03-05T21:03:28.225Z (almost 2 years ago)
• Topics: express, full-stack, gdsc-tmsl, hacktoberfest, mern-stack, nodejs, reactjs
• Language: JavaScript
• Homepage: https://breakingbad22012001.herokuapp.com/
• Size: 1.91 MB
• Stars: 1
• Watchers: 0
• Forks: 2
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# Breaking Bad App

## Works on consuming Breaking Bad API created by: [@timbiles](https://github.com/timbiles)

API URL: [Breaking Bad API](https://breakingbadapi.com/)

## Features

- Caching API responses to speed up the app

- Ability to search for a character by name

- Ability to search for **Breaking Bad** or **Better Call Saul** Series Characters Catagorically

- Ability to see the quotes of all the characters seperately.

- Good User Accessbile UI follows Material Design Guidelines

- Optimized Code Design for performance. Priority has been given to keep bundle size minimum by reusuing existing components whereever possible

- Uses Redis Cache to store API responses which gives a snappy experience.

## Design Goals

### 1. First Page

[x] Listing of all the breaking bad characters on home page - List of all characters.

[x] Each item in the list has

- Name

- Occupation

- DOB

- Status of character

[x] Each item in this list is a clickable link that directs to the second page. (See point 2) - List have pagination, a page has a maximum of 10 characters.

[x] One is able to apply filter on the list based on to Category of character. (Breaking Bad or/and Better Call Saul)

[x] One is able to search the name of any character in the list.

### 2. Second Page

A second page which shows more details about the character that user clicked on home page. Details that includes:

- Name and Image of the character

- Date of Birth

- Occupation.

- Status (Dead or Alive)

- Nickname (if any)

- Actor who portrays the character.

- Season in which the character has appeared.

- All quotes by the character

### Points to be noted

1. If website URL is like *www.example.com* then by going to *www.example.com/`character_id`* takes directly to that characters page.

2. Website is responsive