📗 Table of Contents

• 📖 About the Project
  • 🛠 Built With
    • Tech Stack
    • Key Features
• 💻 Getting Started
  • Prerequisites
  • Setup
  • Install
  • Usage
  • Run tests
  • Deployment
• 👤 Author
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• ❓ FAQ
• 📝 License

📖 WattSmart

WattSmart is a responsive, and optimized web app for Tracking you electric device power consumption units(kWh) and shows the cost per min and hour of the device operations(in Kshs). This will enable one be aware of the cost of running the device and be able to make informed decisions on the usage of the device. This app also helps in making Insightful comparisons between two energy source(like it would cost less to heat with electric jug than heating the same amount with gas) This app is built using HTML5, CSS3, and JavaScript.

🛠 Built With

Tech Stack

Client

• HTML5
• CSS3
• JAVASCRIPT

Key Features

• Responsive Design.
• calculator app.
• optimized for mobile.
• optimized for desktop.
• optimized for tablet.
• optimized for all devices.

(back to top)

🚀 Live Demo

this is the link to my live demo of the WattSmart app here

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps.

Prerequisites

In order to run this project you need:

• A web browser to view output e.g Google Chrome.
• An IDE e.g Visual studio code.
• node should be installed in your local machine, node website.
• Install the npm package manager use this to install both node and npm.
• A terminal.

Setup

Clone this repository to your desired folder or download the Zip folder:

https://github.com/Ochiengsteven/WattSmart.git

• Navigate to the location of the folder in your machine:

you@your-Pc-name:~$ cd Portfolio

Install

To install all dependencies, run:

npm install

Usage

To run the project, follow these instructions:

• After Cloning this repo to your local machine.
• Open the index.html in your browser.

Run tests

To run tests, run the following command:

• Track HTML linter errors run:

npx hint .

• Track CSS linter errors run:

npx stylelint "**/*.{css,scss}"

• Track JavaScript linter errors run:

npx eslint .

Deployment

You can deploy this project using: GitHub Pages,

• I used GitHub Pages to deploy my website. (https://ochiengsteven.github.io/)
• For more information about publishing sources, see "About GitHub pages".

(back to top)

👤 Author

👤 Ochieng steven

• GitHub: @Ochiengsteven
• LinkedIn: steven ochieng

(back to top)

🔭 Future Features

• add the subsections contents in the navbar
• Add device history page.
• Add power statistics.

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

Give a ⭐️ if you like this project and how I managed to build it!

(back to top)

❓ FAQ

• Can I fork and reuse the repository

  • Yes please, feel free.

• Can I improve the repository, and my changes will be accepted if they are good?

  • Yes please, nice ideas are welcome, please.

(back to top)

📝 License

This project is MIT licensed.

(back to top)