ReactJS Tutorial - Build a Calculator App from Scratch

แชร์
ฝัง

ความคิดเห็น • 56

  • @okumuoriaro4994
    @okumuoriaro4994 3 ปีที่แล้ว +4

    This is by far the best tutorial I've seen on the calculator in React, thank you!!!

    • @software-sage
      @software-sage  3 ปีที่แล้ว

      Awesome glad that you liked it

  • @atod2572
    @atod2572 3 ปีที่แล้ว +4

    thanks a lot. great explanation, crystal clear and simple.
    Just 1 suggestion: keep your font size big enough so that students can watch on mobile device and type on pc

  • @nuralyamaisarah2295
    @nuralyamaisarah2295 ปีที่แล้ว

    This is a great tutorial, easy to understand! I was hoping for you to do more tutorials in web3 cause I would like to learn it from you. Thanks, David!

    • @software-sage
      @software-sage  ปีที่แล้ว

      More to come! What topics would you suggest?

    • @nuralyamaisarah2295
      @nuralyamaisarah2295 ปีที่แล้ว

      @@software-sage I would suggest you to share a video of building the first blockchain App Using Ethereum 🤗. That is what I want to learn and I believe it will be easy to learn from your video. Tqsm

  • @huyhoang6368_M
    @huyhoang6368_M ปีที่แล้ว +1

    it has problem if we press 7 and 5 it means 75 + "..." error will happen, can't we calculate numbers greater than tens or more?

  • @miskuu3251
    @miskuu3251 3 ปีที่แล้ว +2

    The videos is good, but you could increase your font size of maximize your vscode, so that we can see the code properly. I have a mac and the screen is really small to follow along.

    • @software-sage
      @software-sage  3 ปีที่แล้ว

      Yes thanks for the feedback. Noted.

  • @kirtisoni6076
    @kirtisoni6076 3 ปีที่แล้ว +1

    Nicely explained, but I want to implement the function that only one decimal will be there, like we are only allowed to enter ' . ' only once then how can we do it?

    • @software-sage
      @software-sage  3 ปีที่แล้ว +2

      Once a decimal is entered, block further input of decimals. I’m sure there is a way to do it. Google “prevent multiple decimal points JavaScript” or something like that

  • @JuNe-rm6pk
    @JuNe-rm6pk 2 ปีที่แล้ว

    Thanks for the tutorial! But why is not working for numbers above/ over 10? Could this be a limitation on mathjs?

    • @software-sage
      @software-sage  2 ปีที่แล้ว

      Can you please provide an example?

    • @JuNe-rm6pk
      @JuNe-rm6pk 2 ปีที่แล้ว

      @@software-sage This calculator can't calculate the numbers from/above 10... It can only calculate the numbers under 10 and show the sum. e.g. 10+20 or 100*21 etc. This is not possoble to calculate...😔

    • @dendy984
      @dendy984 2 ปีที่แล้ว +2

      @@JuNe-rm6pk instead of: setText((text) => [...text, val + " "]) change the line to: setText((text) => [...text, val]) and it will work fine, mathjs will not calculate with spaces in between numbers.

    • @samueligwe3858
      @samueligwe3858 2 ปีที่แล้ว

      @@dendy984 this didnt work either, got another solution?

    • @marcoantiligando6307
      @marcoantiligando6307 ปีที่แล้ว

      @@samueligwe3858 it did work. "setText((text) => [...text, val]);"

  • @kameal96
    @kameal96 2 ปีที่แล้ว

    Do You actually prevent user from adding + sign 2 times in a row? Etc?

    • @software-sage
      @software-sage  2 ปีที่แล้ว

      No, you would have to build off of what I provided in this tutorial. It’s a good starting point

  • @ZahidHussain-hj2dk
    @ZahidHussain-hj2dk 3 ปีที่แล้ว +2

    Thank u very much it was really helpful and easy to understand

  • @URIELWERNECKDEALCANTARA
    @URIELWERNECKDEALCANTARA 4 หลายเดือนก่อน

    To avoid errors during evaluation, inside the calculateResult() function, instead of *"const input = text.join("")"* use *"const input = text.join("").replace(/ +/ g , "")"*

  • @paramgandhi5768
    @paramgandhi5768 3 ปีที่แล้ว

    i have a doubt,in the end when we are adding handleclick equals to result's function it will pass it as a prop but in button's component's onclick function we have written onclick={()=>handle(symbol)} so how is this working?

    • @software-sage
      @software-sage  3 ปีที่แล้ว

      Can you comment the exact timestamp you are referring to?

  • @ayeshask7536
    @ayeshask7536 2 ปีที่แล้ว

    Make video on chat app, portfolio and more in react js

  • @marinos_htz2305
    @marinos_htz2305 ปีที่แล้ว

    What happens if you press the "=" without any input? also what happens if you press it again after calculating the input?

    • @software-sage
      @software-sage  ปีที่แล้ว

      Try it for yourself. If it is not what you want, you can modify the program. This is just a starter project that can be expanded on.

  • @aadarshvenu9705
    @aadarshvenu9705 3 ปีที่แล้ว +1

    Is this working for calculating double digits??

  • @MohamadMeerasa
    @MohamadMeerasa ปีที่แล้ว

    single number works fine like 5+5 but 55+55 is not working why ?

    • @software-sage
      @software-sage  ปีที่แล้ว

      I’m not sure why. It should be working. It could be an issue with how the input is being read in. If you come up with a solution, you can make a pull request in the GitHub repo and I can take a look at it!

    • @MohamadMeerasa
      @MohamadMeerasa ปีที่แล้ว

      @@software-sage did you try whether it works for you ?

  • @akshitgupta4749
    @akshitgupta4749 2 ปีที่แล้ว

    Best tutorial on calci in react!

  • @emilykamiti5950
    @emilykamiti5950 ปีที่แล้ว

    The decimal point doesn't work?
    Thanks for the tutorial though, found it helpful

  • @saminabegum6874
    @saminabegum6874 ปีที่แล้ว

    i am tryind to do this calculator but it is not working ,i think you miss some steps .

    • @software-sage
      @software-sage  ปีที่แล้ว

      It’s been working for other people. Maybe try again from the beginning?

  • @nikolaykolev683
    @nikolaykolev683 2 ปีที่แล้ว +3

    Nice tutorial :)
    to make it work with two and more digit numbers it should be setText(text=>[...text, val + ''
    not ' '

    • @rojamanepalli3068
      @rojamanepalli3068 2 ปีที่แล้ว

      when I used " " nothing worked for me. Instead I used this setText(text=>[...text, val ]

    • @adekoyadayo4698
      @adekoyadayo4698 ปีที่แล้ว

      It also worked for me as I took out the space from “”

  • @souravchatterjee5931
    @souravchatterjee5931 10 หลายเดือนก่อน

    Unexpected operator .

  • @elgabo82ec
    @elgabo82ec 3 ปีที่แล้ว

    Great tutorial...

  • @sourabhajoshi2129
    @sourabhajoshi2129 2 ปีที่แล้ว

    Thank you very much

  • @davidbalyan
    @davidbalyan 3 ปีที่แล้ว

    Hey, what is the name of the following "technique" you used? I don't really understand it and I would like to look into it some more. setText((text) => [...text, val + " "]);

    • @software-sage
      @software-sage  3 ปีที่แล้ว

      "Using the State Hook"
      reactjs.org/docs/hooks-state.html
      th-cam.com/video/O6P86uwfdR0/w-d-xo.html

    • @davidbalyan
      @davidbalyan 3 ปีที่แล้ว

      @@software-sage Thanks! I realized it's the state hook, but I was talking about the code between the square brackets. The one with the three dots. By the way, I just saw your last name, are you of Georgian descent?

    • @kinstar
      @kinstar 3 ปีที่แล้ว

      @@davidbalyan thats a spread operator

    • @paramgandhi5768
      @paramgandhi5768 3 ปีที่แล้ว

      @@kinstar why cant we write it as setText({...text, text:val + " "});

  • @ambilibalan3118
    @ambilibalan3118 2 ปีที่แล้ว

    Thank you sir

  • @nigelpallatt
    @nigelpallatt 2 ปีที่แล้ว

    Not Expo