🤔 Inspiration

The inspiration for this project was to provide users with a more convenient and seamless way to perform basic calculations while browsing the web. We wanted to create a tool that would eliminate the need for users to switch between windows or open a separate calculator app and instead have a calculator readily accessible within their web browser. By creating an extension in the browser's top-right corner, we aimed to provide users with a user-friendly and customizable experience to enhance their web browsing productivity.

🔢 What it does

The Roaming Calculator is a convenient web extension that provides users a simple and efficient way to perform basic calculations while browsing the web. Instead of switching between windows or opening a separate calculator app, the extension pops up in the top-right corner of the user's web browser, making it easily accessible and always within reach. The Roaming Calculator is user-friendly and comes with a light and dark mode, making it customizable to the user's preference. The extension can perform various calculations, including basic arithmetic operators, log functions, trig functions, exponential functions, and factorial functions, making it a versatile tool for various mathematical tasks. The Roaming Calculator allows users to perform calculations easily without disrupting their web browsing experience.

➕ How we built it

We used HTML, CSS, and JavaScript to create this calculator web extension. HTML is responsible for structuring the webpage and creating the various elements required for the calculator, such as the display and the buttons. CSS then styles the elements, providing visual design, such as font size and color. Finally, JavaScript adds functionality to each button, enabling them to perform their calculations when clicked. Also, It helps each key functions work.

➗ Challenges we ran into

Our main challenge was ensuring the code fell within Chrome's web extension guidelines. It involved modifying the initial code to guarantee the extension would function seamlessly within the Chrome browser. However, the process was time-consuming and complicated, and the team had to pay attention to detail to ensure everything was clear and consistent. In addition to adhering to the guidelines, the team had to contend with bugs and errors that surfaced during the development process. Nonetheless, the team's commitment to the project enabled them to overcome these challenges and deliver a functional calculator web extension.

😎 Accomplishments that we're proud of

We are most proud of working as a team to complete this project. Our team collaborated effectively, combining our strengths and using our respective technologies to create a calculator web extension. We held weekly meetings at the library to develop the project together. Developing in this environment has also allowed us to learn from each other, exchange ideas, and develop new technologies.

🟰 What we learned

We learned Chrome's web extension guidelines and requirements and applied our HTML, CSS, and JavaScript knowledge to create this calculator. Through research and experimentation, we were able to ensure that our code aligned with the specifications set out by Chrome while still providing the necessary functionality for the calculator. This experience gave us a deeper understanding of web development and expanded our skills in creating browser extensions that meet industry standards.

☑️ What's Next for Roaming Calculator

Publishing on the Chrome App Store is next for Roaming Calculator. It will involve completing the necessary submission process and meeting the guidelines set out by the store. By having our extension available on the store, users can easily access and download it, increasing its visibility and reach. We are excited to take on this challenge, and publishing on the store will provide us with valuable experience in promoting and distributing our web development projects.

Built With

Share this project:

Updates