Math magicians is a website for all fans of mathematics

Last update: Apr 17, 2022

Related tags

Overview

Math Magicians

"Math magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations and read a random math-related quote.

Live Demo

Check out this project live, click here

Built With

Major languages: JavaScript, HTML, CSS
Frameworks: React
Technologies used: Webpack

Getting Started

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

Setup

Clone this repo into your local device by running the following command on your Terminal:

git clone https://github.com/eduardosancho/math_magicians.git

That will create a folder with the project inside it. Navigate into it to access the files.

Also remember to run:

npm install

This will update the dependencies and download necessary files.

Usage

Before you begin testing and experimenting, remember to use the Terminal to create a branch by running: git checkout -b

Alternatively, if you use GitFlow, you can run the following command to create a new branch: git flow feature start

After that you should be ready to go.

Run tests

Before pushing changes to your branch, I would recommend opening this file:

/.github/workflows/linters.yml

install and run stylelint, and eslint

These linters will help you fit your code to this repo's syntax standard.

Notice on development tests

To keep consistency during the development of the app, we prepared some unit tests for its core functionality. To run these tests, you just need to type npm test in your terminal (After installation using npm install). Tests are configured to run in watch mode so you can keep track of them during the development of the app. If you need to update the snapshots, document the reason properly both in the project and your PR.

Deployment

Once you're done with your changes, remember to git pull before doing git push. This will update your local copy of the project if someone else made changes to the repo while you worked on your part.

Author

👤 Eduardo Sancho Solano

GitHub: @eduardosancho
Twitter: @sanchitobless
LinkedIn: Eduardo

Contributors

👤 Andrés Felipe Arroyave Naranjo

GitHub: @JohnFTitor
Twitter: @johnftitor
LinkedIn: Andres

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

Hat tip to anyone whose code was used
Inspiration
etc

📝 License

This project is MIT licensed.

Comments

Feature/components
What was done in this PR: 🇨🇷

[x] Delete all boiler plate from CRA 🌷

[x] Create src/Components/Calculator.js 🔢

[x] Develop the UI of the calculator 🥨

[x] Use class based components 😎

[x] Renders in the browser without problems 🌞
opened by eduardosancho 1
Feature/testing
What was done in this PR: 💣

[x] Use Jest to test the functionality of the functions and if-statements inside calculate.js and operate.js. 👍

[x] Use Jest snapshots to test the App.js component and Routes in its navbar. 🏃

[x] Use React Testing Library (fireEvent) to simulate user interaction. 🤖

[x] All tests pass ✔️

enhancement
opened by eduardosancho 0
Feature/router
What was done in this PR: 😄

[x] Separate the math magicians website into 3 pages: Home, Calculator, and Quote. 🎓

[x] Follow the design guidelines 🎨

[x] Used React basic styling on every page. ⚾

[x] All navigation links are displayed on each page. ⚡

[x] Use React Router to make 'the routes between sections' work. 🔄
opened by eduardosancho 0
Feature/refactor-with-hooks
What was done in this PR: ✌️

Refactor the Calculator.js component, from a class-based component to a functional component with hooks

[x] Replace the constructor(props) for an object with the same declared variables (total, next, operation). 👷

[x] Import {useState} hook to dynamically update the variables mentioned in the last bullet point. ⬆️⬆️⬆️

[x] Refactor handleClick function to adapt to the current functional component format. 🕐
opened by eduardosancho 0
Feature/events
What was done in this PR: ✌️

[x] Create a logic folder and copy calculate.js and operate.js (provided by Microverse). 🔮

[x] Use state and setState to dynamically update the Calculator's Screen's content. 💡

[x] Create a single click handler and applied it to all buttons of the Calculator. ✋

[x] Use the provided scripts to return truthful math results. 🤓
opened by eduardosancho 0
Feature/setup
What was done in this PR: 🥇

- Created an app template using react

[x] Followed the guidelines of this document

[x] The application runs on the browser without errors.
opened by eduardosancho 0

Math magicians is a website for all fans of mathematics

Related tags

Overview

Math Magicians

Live Demo

Built With

Getting Started

Setup

Usage

Run tests

Notice on development tests

Deployment

Author

Contributors

🤝 Contributing

Show your support

Acknowledgments

📝 License

Comments

Feature/components

What was done in this PR: 🇨🇷

Feature/testing

What was done in this PR: 💣

Feature/router

What was done in this PR: 😄

Feature/refactor-with-hooks

What was done in this PR: ✌️

Refactor the Calculator.js component, from a class-based component to a functional component with hooks

Feature/events

What was done in this PR: ✌️

Feature/setup

What was done in this PR: 🥇

- Created an app template using react

Owner

eduardosancho

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make simple calculations and read a random math-related quote. Build with React.js

"Math magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations. Read a random math-related quote.

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations. Read a random math-related quote.

"Math magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make simple calculations and read random math-related quotes. Its built using react

Module 03 project: Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to Make simple calculations and Read a random math-related quote.

Math magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations and Read a random math-related quote.

"Math magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations. Read a random math-related quote.

"Math magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make simple calculations and read a random math-related quote.

Math magicians is a website for all fans of mathematics

Math magicians is a website for all fans of mathematics

"Math Magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations. Read a random maths-related quote.

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to Make simple calculation.

Math Magicians is a website for all fans of mathematics.

Mathemagician is a web app for all fans of mathematics.

Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Kurs-repo för kursen Webbserver och Databaser

It is a simple Math Sprint Game in which the user must agree or disagree with the answers to math problems in the quickest time possible.

Self-rendering and distributable mathematics chalkboards

Refactor the `Calculator.js` component, from a class-based component to a functional component with hooks