Suggested modification

milestones/MILESTONE_1.md

@@ -8,11 +8,18 @@ Every project has its beginning in setting up some basic structure and tooling.
 1. Use `create-react-app` to initialize a new React app
     - Documentation: [https://github.com/facebook/create-react-app](https://github.com/facebook/create-react-app)
 2. Delete any unnecessary file or asset
-3. Run the application with `npm start` and make sure that everything works correctly.
-4. Follow the instructions in `create-react-app-buildpack` to deploy the app to Heroku
-    - Initialize a git repo
-    - Create a Heroku app
-    - Commit and deploy to Heroku
-    - Make sure the Heroku app works correctly
-    - Push everything to Github
-    - Documentation: [https://github.com/mars/create-react-app-buildpack](https://github.com/mars/create-react-app-buildpack)
+3. Run the application with `npm start` or `yarn start` and make sure that everything works correctly.
+4. Choose one of these methods to deploy your app.
+
+   1. Follow instructions in `create-react-app-buildpack` to deploy the app to Heroku
+       - Initialize a git repo
+       - Create a Heroku app
+       - Commit and deploy to Heroku
+       - Make sure the Heroku app works correctly
+       - Push everything to Github
+       - Documentation: [https://github.com/mars/create-react-app-buildpack](https://github.com/mars/create-react-app-buildpack)
+
+   2. Follow these instructions for [netlify](https://www.netlify.com/)
+        - Connect Github account to your Netlify account
+        - Select the project to deploy
+        - Deploy project

milestones/MILESTONE_2.md

@@ -18,17 +18,21 @@ displaying the outcome of the calculations, and a **ButtonPanel** component whic
     - **REMEMBER!** JSX will not compile unless your render function returns a single element. Wrap the children components with a div tag and give it an appropriate ID.
 3. Implement the **Display** component
     - It should accept the result of the calculation as an incoming prop.
-    - The result prop should be a String.
+    - The result prop should be a String. Please use prop-types for this validation.
     - The default value of the result prop should be 0.
 4. Implement the **Button** component
     - It should accept a button name as a prop.
-    - The button name prop should be a String.
+    - The button name prop should be a String. Please use prop-types for this validation.
 5. Implement the **ButtonPanel** component
-    - It should render the calculator panel with all the buttons in the following groups: (use divs to divide buttons into groups)
+    - It should render the calculator panel with all the buttons. Do not repeat `Button` component.
+
+      **Hint:** You can divided in the following groups: (use nested array to divide buttons into groups and then you can use `map` function)
         - Group 1: AC, +/-, %, +
         - Group 2: 7, 8, 9, X
         - Group 3: 4, 5, 6, -
         - Group 4: 1, 2, 3, +
         - Group 5: 0, ., =
 
+        Or you can also use a simple array and then `map` function without grouping.
+
 If you fulfilled all requirements properly, you should see a pretty ugly page full of non-functional buttons. Don't worry, you will add some functionality in the next milestone!

milestones/MILESTONE_4.md

@@ -13,6 +13,8 @@ Let's put aside the React work for a moment. We will now focus on the heart of t
     - The `calculate` method should accept a calculator data object and a button name as arguments.
     - The calculator data object should contain three properties: `total`, `next` and `operation`.
     - This method should use the buttonName argument to mutate the calculator's data object and return its modified version. For instance if `buttonName == "+/-"`, it should multiply `total` and `next` by `-1` to make it negative or positive.
+    - Implement any number can not divided by zero calculation. It should return an error message which will display in the calculator.
+
 3. Implement the `operate.js` module
     - It should import the `big.js` module from the corresponding npm package.
     - It should implement one default function named `operate`.

milestones/MILESTONE_5.md

@@ -10,7 +10,7 @@ We are now very close to the final line. Your last task is to tie the calculatio
      properties: `total`, `next` and `operation`, just like in your `calculate.js` module. By default, they should all
      be set to `null`.
     - Implement the `handleClick` function which takes `buttonName` as an argument and changes the state based on the result of the `calculate` function.
-    - Pass the `total` or `next` value to **Display** to display the current result.
+    - Pass the `total` or `next` or `error` value to **Display** to display the current result.
     - Pass `handleClick` as a `clickHandler` property to **ButtonPanel**
 2. **ButtonPanel**
     - Implement the `handleClick` function which takes `buttonName` as an argument and returns `clickHandler` from props.