Web Application that works as a Calculator, my first React project.

Overview

Math Magicians React

This project is about creating a web aplication that works as a calculator, project created with the purpose of learning React.

Built With

  • JavaScript, CSS
  • React, Bootstrap
  • Webpack

Live Demo (if available)

Live Demo Link

Getting Started

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

Prerequisites

You need to be able to use Node Package Manager, or also called, the npm command. If you dont have it, install it with these commands in the CLI (for Linux):

curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -

sudo apt install nodejs

Then, run this command in the CLI:

npm --version

If the previous command prints a single line with a version number on screen, npm was installed.

Install

First you need to clone the repository into the folder of your choice with this command:

git clone https://github.com/Yothu/math-magicians-react.git

Then go inside the repository foler with this command:

cd math-magicians-react

After you are inside, download the npm dependecies with this command:

npm install

Finally, show the project through the browser with this command:

npm start

Usage

So far the project has no functionalities.

Author

👤 David Vergaray

📝 License

This project is MIT licensed.

Show your support

Give a ⭐️ if you like this project!

Comments
  • Create full website

    Create full website

    Description

    This pull request is about switching from a class-based component to a functional component, using Hooks.

    Project Requirements

    • [x] Create a website consisting of 3 pages: Home, Calculator, and Quote.
    • [x] Create a route for every page, using React Route.
    • [x] The navigation links for all 3 routes must be displayed on each page.
    • [x] Style the pages to your liking, using React basic styling.

    References

    For a more detailed description of the project's instructions check this page.

    Usage

    To know how to install and use this project check the README.md file!.

    enhancement 
    opened by Yothu 1
  • Refactor class component to functional component using Hooks

    Refactor class component to functional component using Hooks

    Description

    This pull request is about switching from a class-based component to a functional component, using Hooks.

    Project Requirements

    • [x] the Calculator component from a class-based component to a functional component with hooks.
    • [x] The app should be able to perform math operations in the browser.

    References

    For a more detailed description of the project's instructions check this page.

    Usage

    To know how to install and use this project check the README.md file!.

    enhancement 
    opened by Yothu 0
  • Add events, and logic

    Add events, and logic

    Description

    This pull request is about adding events to the React components, and logic to the calculator. So that the calculator finally works as a calculator.

    Project Requirements

    • [x] Copy the calculate.js and operate.js files into a logic folder.
    • [x] Import the files into the Calculator component.
    • [x] Implement the event handlers needed to use the math logic from calculate.js and operate.js.
    • [x] The app should be able to perform math operations in the browser.

    References

    For a more detailed description of the project's instructions check this page.

    Usage

    To know how to install and use this project check the README.md file!.

    enhancement 
    opened by Yothu 0
  • Add components

    Add components

    Description

    This pull request is about creating a calculator UI using React's components.

    Project Requirements

    • [x] In Calculator.js, create a React component that matches this design.
    • [x] Use class-based components.
    • [x] Once the Calculator is ready, import it and use it in your main component (App.js).

    References

    For a more detailed description of the project's instructions check this page.

    Usage

    To know how to install and use this project check the README.md file!.

    enhancement 
    opened by Yothu 0
  • Set-up react

    Set-up react

    Description

    This pull request is about setting up React for a project for the first time.

    Project requirements

    • [x] Create a React application is using Create React App (CRA).
    • [x] The application should run in the browser without errors.

    References

    For a more detailed description of the project's instructions check this page.

    React was set up using this page as reference.

    Additional content

    Linters for React were installed following the instructions of this page.

    Set up 
    opened by Yothu 0
  • Add react linters locally

    Add react linters locally

    Description

    Added linters for React from this page, to check the project's coding errors, as instructed in this page. Linter validation will be shown during all future pull requests.

    linters 
    opened by Yothu 0
  • Add react linters

    Add react linters

    Description

    Added linters for React from this page, to check the project's coding errors, as instructed in this page. Linter validation will be shown during all future pull requests.

    linters 
    opened by Yothu 0
Owner
David Vergaray
Full-Stack Developer and Certified computing engineer, currently studying at Microverse, | HTML | CSS | Python | JavaScript | Java | Open for Hire!
David Vergaray
Calculator - a modern style app which provides a standard calculator functionality written in ReactJS

Calculator ReactJs/Hooks/Typescript/Jest This Calculator is a modern style app which provides a standard calculator functionality, it is written in Re

Jose 1 Apr 3, 2022
A Calculator App using React Single Page Application using React Virtual DOM manipulation

Math Magicians This project contains a Calculator App using React. The project is structured as a Single Page Application using React Virtual DOM mani

David Vera Castillo 6 Jul 22, 2022
This is a calculator web app bootstraped with React

Math Magicians Math Magicians is a website for all fans of mathematics. Single Page App that allows users: Make simple calculations. Read a random mat

Daniel J 5 Aug 23, 2021
Math Magicians is a react web app that has a feature of simple calculator and also generates a random math related quotes

Math Magicians is a react web app that has a feature of simple calculator and also generates a random math related quotes

Sebastian Daniel Solis Fenger 3 May 26, 2022
Calculator Web App build with React Components.

Math Magicians(Calculator) In this project I build a calculator Web App using React stateful components. Built With React Live Demo Calculator Link...

Williams Colmenares 9 Dec 17, 2022
Calculator Web App build with React Components.

Math Magicians(Calculator) In this project I build a calculator Web App using React stateful components. Built With React Live Demo Calculator Link...

Williams Colmenares 9 Dec 17, 2022
My first react project. This is a very simple to-do-list.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

ARSHID DIYAN TE 2 Jan 7, 2022
Lingo3D a web-first 3d game development library with React integration

What is Lingo3D? Lingo3D is a web-first 3d game development library with React integration. Playable Examples github codesandbox github codesandbox gi

null 2.2k Dec 27, 2022
React calculator - made with react hooks

Clone e rode o repo com 'npm start' Organização -> O projeto foi componentizado e feito a base de funções, o componente 'calculator' é o principal, te

Var_dumb 2 Jun 23, 2022
⚡️Clone of macOS calculator built with react.

Clone of macOS calculator built with react Purpose of this project to learn basic React. Checkout the demo ⚡️ PWA ready with offline support. How to r

Chamoda Pandithage 42 Dec 18, 2022
A simple calculator built with ReactJs. The purpose is to use React Class Component without hooks in order to get familiar with legacy code.

Simple Calculator This is a simple calculator built with ReactJs. The purpose is to use React Class Component without hooks in order to get familiar w

Emanuel Okello 7 Aug 8, 2021
A calculator app to be built using the React Library for JavaScript

React Calculator A calculator app to be built using the React Library for JavaScript Built With React JS Library HTML CSS Getting Started To set up a

Akshay 4 Jul 22, 2021
Uniswap V3 Fee Calculator created with React & Typescript

?? UniswapCalculator Uniswap V3 Fee Calculator created with React & Typescript, Visit: uniswapv3.thechun.dev Disclaimer: please do your own research,

Chun Rapeepat 129 Dec 27, 2022
A Math Magicians Calculator built with React.

Math Magicians Calculator This is a Calculator I built with React employing hooks and best practices, such as lift state, destructuring, and passing p

Arturo Alvarez 3 Aug 23, 2021
Simple Calculator app created with React.js

About Simple Calculator app created with React.js Live Demo https://dycodes.github.io/calculator-reactjs/ Screenshot Available Scripts In the project

Yusuf Daudu 24 Oct 31, 2022
React Calculator App

React Calculator App

Tran Anh Tuat 15 Dec 10, 2022
Simple calculator to get used to React

Calculator Description Just an ugly calculator to get used to working with react :) View the current build at: https://patrickbethmann.github.io/calcu

Patrick Bethmann 2 Dec 13, 2021
Calculator app challenge built with react.js

Frontend Mentor - Calculator app solution This is a solution to the Calculator app challenge on Frontend Mentor. Frontend Mentor challenges help you i

Dulranga Dhawanitha 10 Apr 25, 2022
Tip calculator app built using react.js

Tip calculator app Live verzia Tip calculator app Ďalšie projekty: GitHub Popis funkcii: function checkInput() funkcia kontroluje či je vyplenený inpu

null 1 Feb 12, 2022