You are browsing as a guest. Sign up (or log in) to start making projects!

React Calculator (My First React Project)

  • 1 Devlogs
  • 15 Total hours

My web development low-key sucks so I'm trying to learn react. This is my first React project, built after finishing a tutorial. It is a simple calculator with basic arithmetic operations such as addition, subtraction, multiplication, division, and parentheses. It also has an about page and 404 handling. I will be using this YouTube tutorial to learn: https://youtu.be/TtPXvEcE11E?si=ufshzGMUwjvQkgBp

Ship #1 Pending review

For this project, I made a React Calculator. But when I started, I didn’t know React so I had to learn it. I followed a nice tutorial that was very helpful and useful. It’s linked in the project description if you want to follow it but the code exercises from that tutorial were so hard lol. I spent a long time solving them but I’m glad I did because I understand React better. This calculator is a basic representation of all that I learned from it. It includes many features but here’s a quick rundown.

  • Basic arithmetic operations
  • Keyboard support
  • Simple responsive UI
  • Small screen and large screen support
  • Multiple Pages
  • 404 Handling
  • Sound Effects
  • 1 devlog
  • 15h
Try project → See source code →
Open comments for this post

15h 29m 49s logged

I lowkey forgot I was in stardance so that’s why everything is in only one devlog. I have documented things in my README though so atleast I have a timeline.

I have my code in two repos, one repo for my tutorial’s exercises and the other for the actual calculator.
Exercise Repo: https://github.com/Arpan-Shah-102/learning-react
Calculator Repo: https://github.com/Arpan-Shah-102/react-calculator

The calculator includes a multitude of features. Here are the ones listed below:

  • Basic arithmetic operations
  • Keyboard support
  • Simple responsive UI
  • Small screen and large screen support
  • Multiple Pages
  • 404 Handling
  • Sound Effects

Here is a timeline of what I did on the tutorial and how far I got into it.

Day 5 - 6/22/2026

  • Rest of Lesson 7
  • Lesson 7 Exercises 7a - 7o
  • 8 :01 :00

Day 4 - 6/21/2026

  • Part of Lesson 7
  • 7:03:57

Day 3 - 6/20/2026

  • Lesson 5
  • Lesson 5 Exercises 5a - 5k
  • Lesson 6
  • Lesson 6 Exercises 6a - 6k
  • 6 :09 :56

Day 2 - 6/19/2026

  • Lesson 3
  • Lesson 3 Exercises 3a - 3m
  • Lesson 4
  • Lesson 4 Exercises 4a - 4l
  • 3:48:50

Day 1 - 6/18/2026

  • Lesson 1
  • Lesson 1 Exercises 1a - 1j
  • Lesson 2
  • Lesson 2 Exercises 2a - 2j
  • 1:36:50
0
0
13

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…