Coder Social home page Coder Social logo

amamenko / electric-bill-calculator Goto Github PK

View Code? Open in Web Editor NEW
1.0 3.0 0.0 856 KB

An electric bill calculator tool that helps users pick the cheapest rate based on a given home load profile.

Home Page: https://electric-bill-calculator.netlify.app

License: MIT License

HTML 10.95% CSS 5.54% JavaScript 83.51%
electric vehicle bill calculator money save green utility

electric-bill-calculator's Introduction

MIT License LinkedIn


Logo

Electric Bill Calculator

Electric Bill Calculator Tool for Electric Vehicles Based on a Given Load Profile

View Demo · Report Issue

Introduction

The Electric Bill Calculator was developed for ZappyRide to demonstrate the fundamentals of electric bill calculations. This calculator uses an example yearly load profile for a user's home as the baseline load profile.

This tool factors in an additional three components: which electric rate - a flat rate of $0.15/kWh or a time-of-use (TOU) rate of $0.20/kWh between noon and 6pm, and $0.08/kWh otherwise - the customer is currently on, how many miles the user plans to drive per year, and what hours of the day the user plans to charge their electric vehicle (presumably in their home's garage). The tool then calculates whether it makes more sense from a financial standpoint for the user to stay with their current chosen rate (either fixed or TOU) or switch to a different one.

This calculation is based on the impact of the electric vehicle on the electric bill. This is found by first finding the value of the initial electric bill without the electric vehicle factored in. The user's home load profile and the initial electric rate of the user are used to find this value.

Next, based on the user's inputs, the load profile added by the electric vehicle is calculated based on how much energy it uses and when it is being charged (an electric vehicle consumes about 0.3 kWh per mile driven).

The home load profile and the electric vehicle load profiles are added and the new bill is calculated based on both potential rates. The bill impact, therefore, is found by subtracting the new bill value from the initial bill value. A decision can be made at this point as to whether to swith rates or stay on the same one.

UX / UI


Electric Bill Calculator Screenshot

The calculator tool was built mainly by using React and Styled Components. A mobile-first design was used for the tool.

The modal feature uses the package react-responsive-modal and the slider feature for when a user selects the number of miles they plan to drive uses the package rc-slider.

This project was deployed to Netlify.

Local Development

To set up this project locally, you can follow the steps below.

Prerequisites

You will need to have the following software installed:

  • npm
  • Git
  • Node.js

Installation

  1. Clone the Github repository.
    git clone https://github.com/amamenko/electric-bill-calculator.git
  2. Install all NPM packages.
    npm install
  3. Start the local server.
    npm start
  4. Build for production.
    npm run build

License

Distributed under the MIT License. See LICENSE.txt for more information.

Contact

Avraham (Avi) Mamenko - [email protected]

Project Link: https://github.com/amamenko/electric-bill-calculator

Acknowledgements

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.