Code Monkey home page Code Monkey logo

ajax-project's Introduction

New York Times Book Application

New York Times Book Application is a simple platform designed for displaying to users the New York Times Top Selling books.

Link

New York Times Book Application

Features

  • User can view a list of the top 10 New York Times Best selling Books for the present week.
  • User can favorite A book.
  • User can remove a favorited book from their favorited book list.
  • User can view the details for a single book.
  • User can choose which type of book search they want to search for.
  • User will be provided with feedback if they do not provide valid search criterion or NYT API does not have any books for provided criterion.

Future Additions

  • Implement Opening Modal articulating how user should interact with application.

Programming Langauges

  • JavaScript
  • HTML5
  • CSS3

Local environment set up.

This application does not require any dependencies to get started.

Quick Gif.

NY Times Book App

ajax-project's People

Contributors

smith-steve avatar

Watchers

 avatar

ajax-project's Issues

Feature: User can can remove 'favorited' book from list of favorited books.

โš™๏ธ Feature

What capability will users have when this feature is merged?

User can 'remove' favorited book from list of favorited books.

๐Ÿ“ Functionality

A description of how the application will work from the perspective of the user.

๐Ÿ–ผ๏ธ Wireframes

Wireframe screenshot(s) of what the app should look like when it is complete.

โœ… Task List

Commit checklist for tasks needed to complete the feature.
  • User can remove 'favorited' book from list of favorited books.
  • [ ]
  • [ ]
  • [ ]
  • Clean Up
    • Remove all buttons and placeholders that do not serve the functionality of the feature.
    • Remove all console logs.
    • Remove all commented out code.
    • Remove all CSS properties that have no effect.
    • Check all code for proper formatting and indentation.
    • Confirm that there are no errors in the console while using the application.
    • Confirm that all previous functionality still works without errors.
    • Confirm that the user interface looks natural on both mobile and desktop screens.
    • Create GIFs of the feature being used on both mobile and desktop screen sizes for inclusion in Pull Request.

Feature: User can interact with a carousel.

โš™๏ธ Feature

What capability will users have when this feature is merged?

User can interact with a carousel

๐Ÿ“ Functionality

A description of how the application will work from the perspective of the user.

๐Ÿ–ผ๏ธ Wireframes

Wireframe screenshot(s) of what the app should look like when it is complete.

โœ… Task List

Commit checklist for tasks needed to complete the feature.
  • User can interact with a carousel.
  • [ ]
  • [ ]
  • [ ]
  • Clean Up
    • Remove all buttons and placeholders that do not serve the functionality of the feature.
    • Remove all console logs.
    • Remove all commented out code.
    • Remove all CSS properties that have no effect.
    • Check all code for proper formatting and indentation.
    • Confirm that there are no errors in the console while using the application.
    • Confirm that all previous functionality still works without errors.
    • Confirm that the user interface looks natural on both mobile and desktop screens.
    • Create GIFs of the feature being used on both mobile and desktop screen sizes for inclusion in Pull Request.

Feature: User can choose which type of search they want to search for books

โš™๏ธ Feature

What capability will users have when this feature is merged?

๐Ÿ“ Functionality

A description of how the application will work from the perspective of the user.

๐Ÿ–ผ๏ธ Wireframes

Wireframe screenshot(s) of what the app should look like when it is complete.

โœ… Task List

Commit checklist for tasks needed to complete the feature.
  • User can choose which type of search they want to search for books.
    - [ ] By Category
    - [ ] By Author
  • A CSS Selector will be set up that will allow for the concealment of the homepage.
  • A function will be set up, upon the selection of the button, that will trigger this CSS functionality.
  • HTML will be set up to support a search bar
  • The Author Results cards will be cleared from the author results container when the user returns to the home page.
  • The Category Results will be cleared from the category Results container when the user returns to the home page.
  • There will ideally be one function that does this.
  • There will be a function set up to support the functionality to pivot between the searching by author, and searching by category.
  • These functions will simultaneously re-fire the functionality for the home page, so that once the search bar has employed, the search functionality will be triggered.
  • There will be a function that manages the 'search' results for Author, so that the various parts of the search provided by the user can be interpolated into the search string.
  • There will be a function that manages the 'search' results for Category, so that the various parts of the search provided by the user can be interpolated into the search string.
  • Clean Up
    • Remove all buttons and placeholders that do not serve the functionality of the feature.
    • Remove all console logs.
    • Remove all commented out code.
    • Remove all CSS properties that have no effect.
    • Check all code for proper formatting and indentation.
    • Confirm that there are no errors in the console while using the application.
    • Confirm that all previous functionality still works without errors.
    • Confirm that the user interface looks natural on both mobile and desktop screens.
    • Create GIFs of the feature being used on both mobile and desktop screen sizes for inclusion in Pull Request.

Feature: User can view a book details for a single book

โš™๏ธ Feature

What capability will users have when this feature is merged?

๐Ÿ“ Functionality

A description of how the application will work from the perspective of the user.

๐Ÿ–ผ๏ธ Wireframes

Wireframe screenshot(s) of what the app should look like when it is complete.

โœ… Task List

Commit checklist for tasks needed to complete the feature.
  • User can view book details for a single book
  • The detail data shown will be
    • Age Group
    • Author
    • ISBN
    • Price
    • Publisher
    • Title
    • Photo
    • Number of weeks the book has been on the top sellers list.
  • Clean Up
    • Remove all buttons and placeholders that do not serve the functionality of the feature.
    • Remove all console logs.
    • Remove all commented out code.
    • Remove all CSS properties that have no effect.
    • Check all code for proper formatting and indentation.
    • Confirm that there are no errors in the console while using the application.
    • Confirm that all previous functionality still works without errors.
    • Confirm that the user interface looks natural on both mobile and desktop screens.
    • Create GIFs of the feature being used on both mobile and desktop screen sizes for inclusion in Pull Request.

Feature: User can favorite a book

โš™๏ธ Feature

What capability will users have when this feature is merged?

User Can Favorite a book

๐Ÿ“ Functionality

A description of how the application will work from the perspective of the user.

The user will click a heart icon on the main page. As the user circulates through the application, it will allow they will be able to return to the main page and see which books they favorited.

๐Ÿ–ผ๏ธ Wireframes

Wireframe screenshot(s) of what the app should look like when it is complete.

feature_3_photo

โœ… Task List

Commit checklist for tasks needed to complete the feature.
  • User can favorite a book on the main page.
  • Consequently, EVERY book on the main page where the icon has been clicked, the icon shall be filled, and the book shall be stored in favorites.
  • The storage object shall be a list, from which the title can be added or removed directly. (The functionality pivoting around a bool was not employed, due to the title being the only criterion from which the books could be uniquely identified. An array was adopted instead. Values were simply added or removed from the array as required.)
    • A function will be set up around swapping the hearts 'on' and 'off'
    • There will be a function that adds the book to the list of favorited books.
    • It will do this on the basis of title.
    • There will be a function that removes the books from the favorited list.
    • This function will absorb the index of the title of the book from the data.entries array, and will splice the book out of the array on that basis.
    • It is only by clicking on the ICON itself, the heart ICON itself and TO THE EXCLUSION OF ALL OTHER SURFACES OF THE CARD, page or any area whatever, that a book can be favorited.
      Clean Up
    • Remove all buttons and placeholders that do not serve the functionality of the feature.
    • Remove all console logs.
    • Remove all commented out code.
    • Remove all CSS properties that have no effect.
    • Check all code for proper formatting and indentation.
    • Confirm that there are no errors in the console while using the application.
    • Confirm that all previous functionality still works without errors.
    • Confirm that the user interface looks natural on both mobile and desktop screens.
    • Create GIFs of the feature being used on both mobile and desktop screen sizes for inclusion in Pull Request.

Feature: User can view a list of the top 10 selling books for a given week.

โš™๏ธ Feature

What capability will users have when this feature is merged?

The user can view a list of the top 10 selling books for a given week.

๐Ÿ“ Functionality

A description of how the application will work from the perspective of the user.

When the user opens the application, they will view a list of the top 10 selling books.

๐Ÿ–ผ๏ธ Wireframes

Wireframe screenshot(s) of what the app should look like when it is complete.

image

image

โœ… Task List

Commit checklist for tasks needed to complete the feature.
  • The user can view a list of the top ten selling books for a given week.
    • Each card will be built out through a javascript function (the Dom-Creation exercise can be reviewed for this)
      • Each Card will contain the following items pertaining to the book they pertain to.
      • Book Title.
      • Book Author.
      • Current Rank - For the Given Week.
      • Book Cover
    • It will consist of the following elements. (At Least)
      • A Div
      • H2
      • Paragraph
    • There will be a header bar.
      • The header bar will be inside a special header container.
      • A row will be written inside the header.
      • A column will be written into the row.
      • Adequate CSS will be written to manage all of these.
        • The layout style page will be written into to manage these.
        • .row, .container, .container-header
      • There will be a 'search' button.
      • This button will be situated within its' own row.
      • This button will be situated within its' own column.
      • The functionality of this button, for the present story, will not be set up.
      • The Main Page Will Display 10 Cards.
      • All Media Break-Points Will be set up.
      • For one card the flex-basis will be 100% (500px)
      • For 5 cards the flex basis will be a function (760px)
  • Clean Up
    • Remove all console logs.
    • Remove all commented out code.
    • Remove all CSS properties that have no effect.
    • Confirm that there are no errors in the console while using the application.
    • Confirm that all previous functionality still works without errors.
    • Confirm that the user interface looks natural on both mobile and desktop screens.
    • Create GIFs of the feature being used on both mobile and desktop screen sizes for inclusion in Pull Request.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.