Are you interested in building a next level and attractive EMI Calculator? If so, you're in luck. Through this tutorial, we'll explore how to creat...
For further actions, you may consider blocking this person and/or reporting abuse
wow, this is dope, very dope
Thank you sir for valuable feedback.
Please excuse my question. Your "toolset" is quite heavy, but the result is fairly static. So, why did you use a "reactive" framework for this?
React.js and Next.js are best frameworks for the single page (static) application.
I can build the same thing with just HTML/CSS/JavaScript. But it will become complex to maintain the codebase. I will have to write the same code of UI at multiple places. It will create problems when it’s needed to upgrade the UI. Because of code duplication. For the helper functions, I will have to import the entire helper.js file where it’s needed.
On Other Side, Using these frameworks, I can easily manage the codebase. I can make reusable components and import specific helper function anywhere, instead of entire helpers file.
I also take care of codebase by following some coding standards, it will help beginners with their own projects.
With my each projects/tutorials, I have showed different ways to do the state management.
So my audience can learn these state management techniques for their projects. We have just started so making basic tools with these frameworks. In future, I will do complex projects as well.
We will go from basic to advanced eventually. It’s always good to just start with basic and simple things to learn something new. It will be helpful with the more complex projects.
I hope it’s clear now. Thank you 🙏 for reading my article. Feel free to ask me anything..
Hy, I was just curious to see, how the app peforms without all this tools, so I rebuilt the EMI-calculator from scratch without much toolilng. I´ts just a singe file app now. .
I´m pretty sure that for larger apps you need to rely on all of this tools. But for smaller apps, that - like the EMI calculator - can run inside your browser, this might be a very big hammer to drill a small hole in some cases.
You can run the app from here also
Great, I appreciate your efforts to create a replica of my app.
Answer to above:
There are countless ways we can built this app using different technologies. Each will show different load performance.
I have used recharts library in my app to break down the payments, and it's missing in your app. Plus take a look at the UI design of mine and yours. Mine looks more cleaner than yours. Means more styling. So definitely, there will major differences with the load performance of both the apps.
And mine codebase is divided into small components and helpers in relative files and folders. So it's easy for anyone to understand it and make the modifications. Clean and scalable code is the key for any app.
Another thing is, I can build the same app only using HTML/CSS/JavaScript as other YouTubers are building. But I use more stacks such as React.js, Next.js, Tailwind CSS, Recharts, Recoil etc.. Main reason is "Example".
With my small and single page app, I have showed basics of recoil library in Next.js. So others can take it as reference or example and they can utilize it with their large scale apps on the basis of project needs.
I have used Recharts library, to show the example of it for others to take it as reference.
Mine EMI Calculator is just a middle man for me to showcase the usage of several stacks in one app. That's it..
My audience can see these stacks in action (in real time) with my apps.
I always do the experiments with my projects to present something different and useful for others.
Sure there are some differences, an app built from scratch in an afternoon will not include all the nut´s and bolts included in a library like tailwind. And about Recharts, i simply had no time to find out how to use it. But the app works and does it´s job, just with a very small footprint and a minimal overhead. It even does not need a server to run, its just a single HTML file you can run on flems.io.
There are countless things the web is used to today, from large web shops to simple but useful tools. It is perfectly welcome to showcase all the tools you can use. But we should not forget, that different tasks might need different tools.
Yes right but my case/purpose is different.
This project is so cool, where did you find so much inspiration?
Thank you for always supporting us. Mostly I have built tools that we’re using in our life.
I built Ovulation calculator because of my wife. Earlier, she was using an online tool. One day she helped me to understand the concept of ovulation calculator. And suddenly I decided build our own calculator. And I did it for her..
I built EMI calculator mainly for my personal use. Earlier I was using an Excel sheet (Shared by a YouTuber, Asset Yogi) to track my home loan payments. I checked the fundamentals of that sheet, formulas as well this week. And I built my own loan tracker app.
Crypto Pricer Tracker App:
Built for my personal use to track the price of some major cryptocurrencies.
CPM Calculator and Profit Margin Calculator Apps:
I had built these kind of tools for learning purposes 3-4 years ago in HTML/CSS/JavaScript/CodeIgniter
For my YouTube channel, I built the revised version of it using Frontend tools such React, Next.js and Vite.js
This is great, this is the best way for develop something, is when you actually need to fix your own pain.