https://github.com/akasharojee/math-magicians
https://github.com/akasharojee/math-magicians
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/akasharojee/math-magicians
- Owner: AkashaRojee
- Created: 2021-08-10T11:46:33.000Z (almost 4 years ago)
- Default Branch: develop
- Last Pushed: 2021-08-23T09:51:20.000Z (almost 4 years ago)
- Last Synced: 2025-02-02T10:44:54.423Z (4 months ago)
- Language: JavaScript
- Size: 2.08 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Math Magicians
> Calculator SPA
This project is a calculator app built as an SPA using React, as part of Microverse projects.
It allows users to make simple calculations and read a random math-related quote.
Things done so far:
### 1. Setup
- Set up Git flow
- Set up React
- Set up linters
- Configure deploy
### 2. Create components
- Create components based on identified hierarchy
```
Calculator
- Display
- Keyboard
- Key(s)
```
- Use Grid to for structure styling
- Implement conditional attributes
### 3. Implement event handlers
- Use provided logic files for calculator functions
- Implement event handler for Key
- Lift state up to Calculator
- Pass state as props to Display
### 4. Refactor with hooks
- Convert class components to functional components
- Implement state and memo hooks
### 5. Add multi-pages and implement routing
- Implement routing with React Router
- Create components for based on identified hierarchy for full website:
```
- Header
- WebsiteTitle
- NavigationBar
- Route: Home
- PageHeading
- TextBody
- Route: Calculator
- Display
- Keyboard
- Key(s)
- Route: Quote
- TextBody
```
- Add styling with React basic styling
## Built With
- Major languages: JS, SCSS
- Others: JSX
- Libraries used: React
## Live Demo
[Live Demo Link](https://AkashaRojee.github.io/math-magicians)
## Getting Started
To get a local copy up and running, follow the steps below in your terminal.
### Prerequisites
- Node.js
- npm
_For more information, view the section **Installation** in this guide about Node.js and npm._
### Setup
Clone the project:
```
git clone https://github.com/AkashaRojee/math-magicians.git
```
### Install
Install dependencies:
```
npm install
```
### Usage
The assets are in the `src` directory.
The output is in the `build` directory.
### Deployment
**Note**: The content of the default output directory of React (`build`) is copied to `docs` upon build to facilitate publishing from GitHub Pages.
To build the website:
```
npm run build
```
To serve the website directly:
```
npm run start
```
## Author
👤 **Akasha Rojee**
- GitHub: [@AkashaRojee](https://github.com/AkashaRojee)
- Twitter: [@AkashaRojee](https://twitter.com/AkashaRojee)
- LinkedIn: [Akasha Rojee](https://linkedin.com/in/AkashaRojee)
## 🤝 Contributing
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](/../../../issues)
## Show your support
Give a ⭐️ if you like this project!
## 📝 License
This project is [MIT](./MIT.md) licensed.