Realtime Calculator

This is a coding challenge. My directive was to implement a web app that record and report calculations from users in real-time.

Run the App

• This web app is live, you can check it out here
• This app supports and looks better on mobile devices.

Features

• Basic calculations of addition, subtraction, multiplication and division.
• All calculations will be logged onto the database.
• Each time a user log a calculation, it will be reported in real-time to other users who are connecting to the website.

Technologies Used

I decided to implement this web app in React because I recently learned React and I thought this is the perfect opportunity for me to apply what I have learned the past few weeks.

To reduce the amount of CSS I have to write to customize the look of the app, I decided to use React Bootstrap. This is the first time I got exposed to Bootstrap so there was a little bit of learning but I was able to use it properly in my application.

I deployed the app to Github using Github Pages. Github Pages provides free web hosting and they also have free SSL certificate so I decided to go with them.

The last technology that I used was Firebase Server. Firebase provides a real-time database and this is the perfect type of database for my web app.

Challenges

All of these technologies are still somewhat new to me. I only started making website a few weeks ago, and Firebase as well as Bootstrap are completely new to me. Thankfully, I am a fast learner so I was able to pull it off with no problem.

Future Developments

In the future, I plan to add more features to the web app such as integrating Wolfram API to do even more than just plain calculations. I would also add CSS animations to make the app looks more natural.

Source Code

The full source code of this project is available here.