Skip to content

Interactive site to post your happy thoughts and liking others. Tech: React, JSX, CSS, API POST/GET

Notifications You must be signed in to change notification settings

technigo-20-21/11-20-happy-thoughts

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

43 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Happy Thoughts

The happy thoughts project was a practice in how to use APIs in React. It was also a practice in working with an API which you both send and recieve data from.

The problem

I started with fetching the thoughts from the API and list them in the browser to get a clearer view of the data at hand. Then I made a simple sketch of the components and how to structure them before returning to VSCode. When the logic was in place, I moved on to the styling.

My biggest challenge this week was with JSX and map-function. I ended up with infinite loops a few times due to rendering a parent-component inside the map-function. It took me quite some time to figure out what was wrong.

If I'd had more time I would have implemented a character limit on the form input and paired it with a count that updates as the user types and shows number of characters remains.

Learning objectives

  • Lifecycle of a component in React
  • Firing requests within useEffect
  • Call APIs and put the data into state
  • POST data from a form to an API

Tech

  • React
  • JSX
  • CSS
  • HTML5

View it live

https://happiest-happy-thoughts.netlify.app/

About

Interactive site to post your happy thoughts and liking others. Tech: React, JSX, CSS, API POST/GET

Topics

Resources

Stars

Watchers

Forks

Languages

  • JavaScript 64.3%
  • CSS 30.9%
  • HTML 4.8%