Code Monkey home page Code Monkey logo

api-project's Introduction

api-project

This is a project I'm working on for the Devslopes Academy. We are to implement an API using only HTML, CSS, & vanilla JavaScript. I will update this document further as needed.

I will be using only what I know at this point in time to accomplish the objectives below. I will eventually receive feedback from a mentor.

Here are the project requirements:

  1. Fetch data from an API (resource provided below) and display up to 30 items from that request in your HTML.
  • In your HTML you will display the array of data you get back (i.e. if it was an array of movies, you would display the list of movies).
  • Display a minimum of 3 values from the object in the array of data you get back for each item. (i.e. movie name, movie description, cover image).
  1. HTML for each item should be created programmatically. This means the html is created based on the data received from the API
  • if 10 items are fetched, 10 blocks of HTML are created to display the data, etc.
  1. Build a function to add selected items from the array of data to a "favorites" list. i.e.:
  • You fetch a list of 30 movies from an API and display it in a "collection" in your HTML.
  • When a user selects an item(s) from the "collection" to add to the "favorites" list, the item(s) are removed from the collection and added to the "favorites" list.
  1. Build a function to remove an item from the "favorites" list.
  • When a user removes an item from the "favorites" list, the item is added back to the "collection" of items.
  1. Build a toggle function that sorts the items in the collection and "favorites" list alphabetically (A-Z) and vice versa (Z-A).
  2. You must display the total sum of some piece of data from the list. (i.e. if you had a list of pokemon, you could total the number of common, rare and legendary pokemon in the list). You cannot total the number of items in the array, it must be a value from the data object.
  3. The website must be built with pure HTML, CSS and JavaScript (no third party css or js libraries).
  4. The items retrieved from the API must be displayed in styled HTML. (i.e. if you were working with the pokeAPI you could display the data in a "card" design with the image, attack, hitpoints, etc).
  5. The website must be mobile responsive across desktop, ipad/tablet and mobile phones.

api-project's People

Contributors

egroene avatar ronknight avatar

Watchers

 avatar

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.