categories

[bobbybaxter]

User Story

As a user, when the page loads, I should see category cards.

AC

Given a user navigates to the page Then they should see all categories from db/categories.json printed on the page as cards

Dev Notes

• in javascripts/helpers, create a new directory called data

• in javascripts/helpers/data, create categoriesData.js

  • categoriesData.js will create a function called loadCategories, which contains an axios call to .get() the data from categories.json, then will export the function

• in javascripts/components, create a new directory called categories, which contains the files categories.js and categories.scss

  - categories.js should:

  • import $ from jquery, categoriesData from categoriesData.js, util from util.js
  • contain the following functions:
  • initCategories, which calls categoriesData.loadCategories(), with:
    • .then() method that takes the parameter resp and calls in the body writeCategories(resp.data.categories)
    • .catch() method that will take the parameter err and will console.error('error from initCategories', err)
  • writeCategories() will build a domString to print the categories as cards to the page using util.printToDom('categories', domString)
  • export initCategories()

• in main.js:

  • import categories from categories.js
  • create a function called init that runs categories.initCategories
  • call init()

• in index.html:

  • remove the danger button