DEV Community

loading...
Cover image for #5 of 100DaysOfCode

#5 of 100DaysOfCode

icecoffee profile image atulit023 ・2 min read

Fifth Day,
Today I feel great. I made another react app and I installed create-react-app to use React locally, pretty cool. 😁

Anyway, my today's learnings are:

  • What's the importance of key attributes.
  • How do onClick work?
    • Each function inside the onClick closes over its parent element and gives us access to its props. - Guess what am I talking about ???
    • Read more
  • More about different hooks in React
    • React.useState(initialValue) ---> [stateVariable, setStateVariable]
    • React.useEffect(callback)
  • Importance of the function that is returned by callback of useEffect
  • How should we clean stray side effects created by the useEffect().
  • 'key' attribute and mounting and unmounting dom elements with its help.
  • Division of responsibilities within the Component and its state manager.
  • custom hooks in React and the fact that we should prepend their names with 'use' to give hints to linters.
  • 1st Rule of Hooks - Never wrap them in conditional code blocks of any sort like loops and if-else. Because even if you do it won't work.
  • Creating my very first react app locally by using the create-react-app tool.
> yarn create-react-app my-first-app
Enter fullscreen mode Exit fullscreen mode

But I don't know why did

> npx create-react-app my-first-app
Enter fullscreen mode Exit fullscreen mode

gave me some sort of unable to resolve dependency tree error.

But that doesn't matter anymore yarn saved the day.

This is my today's code,
A simple game where you just have to pick 1 or more numbers that sum up to the number of stars.
It's pretty long so here is a link to Github Repository.

👉 Star Game App

Try it out....

I don't know much but till now the best part that I have absolutely loved in React is that how component that small can render so much code that too combined with the power of functions like map and filter.⚡

Thanks for reading this.😀
If there are any mistakes or suggestions, please let me know.🙂
Have a wonderful day.🌹

Discussion (3)

pic
Editor guide
Collapse
icecoffee profile image
atulit023 Author • Edited

@mmeurer00 Thanks for all the appreciation that you gave since the very beginning.
I'm really grateful. 😄

Collapse
mmeurer00 profile image
Maxine Meurer • Edited

Always! It's nice to see this through another newer perspective, plus you're motivating me to start typing and do some more posts of my own.

Collapse
icecoffee profile image
atulit023 Author • Edited

😀 Happy to have you here. Tysm
I admire you.