https://github.com/vikpires/front_calculator-vue

Calculator app built using Vue.js and TypeScript.
https://github.com/vikpires/front_calculator-vue

calculator calculator-app front-end-development frontend tailwind-css tailwindcss typescript vue3 vuejs

Last synced: 3 months ago
JSON representation

Calculator app built using Vue.js and TypeScript.

• Host: GitHub
• URL: https://github.com/vikpires/front_calculator-vue
• Owner: vikpires
• Created: 2024-06-10T18:23:44.000Z (about 2 years ago)
• Default Branch: develop
• Last Pushed: 2024-12-13T19:39:43.000Z (over 1 year ago)
• Last Synced: 2025-04-12T02:51:22.525Z (about 1 year ago)
• Topics: calculator, calculator-app, front-end-development, frontend, tailwind-css, tailwindcss, typescript, vue3, vuejs
• Language: TypeScript
• Homepage: https://calculator-vue-s97g.onrender.com/
• Size: 836 KB
• Stars: 0
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Calculator Vue



     





    Calculator Visual Interface



## Description

>A responsive and interactive calculator built using Vue.js, TypeScript, and TailwindCSS. This project was developed as part of the TIC 12 Technological Residency Program (RESTIC 12).

## Table of Contents

- [Objective](#objective)

- [Features](#features)

- [Tools](#tools)

- [Project Structure](#project-structure)

- [Demo](#demo)

- [Developers](#developers)

---

## Objective

- Build a fully functional calculator using Vue.Js and TypeScript.

 

## Features

- Standard calculator functionality with basic arithmetic operations.

- Emphasis on usability and user-friendly design.

- Robust error handling and input validation.

- Support for scientific notation for large numbers.

## Tools

![VueJS](https://img.shields.io/badge/Vue%20js-35495E?style=for-the-badge&logo=vuedotjs&logoColor=4FC08D)

![TypeScript](https://img.shields.io/badge/typescript-%23007ACC.svg?style=for-the-badge&logo=typescript&logoColor=white)

![TailwindCSS](https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?style=for-the-badge&logo=tailwind-css&logoColor=white)

![Vite](https://img.shields.io/badge/Vite-B73BFE?style=for-the-badge&logo=vite&logoColor=FFD62E)

![Git](https://img.shields.io/badge/git-%23F05033.svg?style=for-the-badge&logo=git&logoColor=white)

![GitHub](https://img.shields.io/badge/GitHub-100000?style=for-the-badge&logo=github&logoColor=white)

## Project Structure 

```

📁 src/                 # Directory containing all project files

│

├───📁 assets/          # Contains static files such as images, fonts, and icons.

│

├───📁 components/      # Stores reusable UI components for the calculator.

│

├───📁 controllers/     # Contains the logic for controlling the calculator's behavior.

│

├───📁 models/          # Defines interfaces and types for the application data

│

├───📁 modules/         # Groups related functionality and components globally.

│

├───📁 styles/          # Contains style files (CSS) used in the project.

│

├───📁 view/            # Stores the application's view

│

├───📄 App.vue          # The root component of the application.

│

├───📄 main.ts          # The entry file that sets up and initializes Vue.

```

## Demo 



     





    Demonstration of Calculator Functionalities






You can test the calculator live [here](https://calculator-vue-s97g.onrender.com/).

## Developers 

[Beatriz Monteiro](https://github.com/thebiatriz)


[Vitor Pires](https://github.com/vikpires)