Skip to content

joshri/is-it-hot

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

27 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Is It Hot? Your Daily Guide.

  • My first ever API experiment. My first ever React project. I wanted to create an ironic daily advice/motivation column by linking together a lot of free API. In the end, it became more of a hub to practice and experiment with React. The main challenges I tackled were conditional rendering (on App.js, in the API call with error catching, and with the changeIt button using state with the music video), refreshing API call (and attempting to reuse a component) with the Button component, and refactoring my Display component from a class component into a function using React Hooks.

Wireframe

https://docs.google.com/document/d/1LoUIACK0nUY89c-B0Xb0zcydbzadaKdmbZmB_m5C5cE/edit?usp=sharing

API + Technologies

  • openweathermap.org/api
  • mercuryretrogradeapi.com
  • api.adviceslip.com
  • dog.ceo/dog-api/
  • lyricsovh.docs.apiary.io/#reference
  • pokeapi.co/
  • placekitten.com
  • React Player
  • Google Fonts

Future Goals

  • STYLING. Since the overall plan was constantly evolving and changing as I kept finding new React goodies to challenge myself with, the styling became a MAJOR afterthought. My continued work on this project will mainly be in learning how to use styled components like I did in the button component. This will not only make my CSS actually legible, but it will also increase the clarity of the JSX in my individual components, and really tie everything together in the way that React is meant to.

Original User Story Concepts

MVP

  • I want to know whether it is hot, or whether it is not. (Display hot or not based on location)
  • I want to know why I came to this site rather than just google the weather. (Add other fun API generated random goodies! Starting with random advice line, and random netflix recommendation. Also looking at horoscope, gif, joke, fashion(?!?!), and whatever else I can find).

Stretch

  • I want this page to help me escape from the deep sadness I feel every time I wake up in the morning. (Spa-like styling and calming animation using framer)