-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Milestone 5 : React-Redux-Capstone-Project #1
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi @Gardimy,
Good job so far!
There are some issues that you still need to work on to go to the next project but you are almost there!
Highlights
- The App contains home and details pages 👍
- The project is using redux for data retrieved from the API 👍
- The App has been deployed successfully and it is working fine
Required Changes ♻️
Check the comments under the review.
Optional suggestions
Every comment with the [OPTIONAL] prefix is not crucial enough to stop the approval of this PR. However, I strongly recommend you to take them into account as they can make your code better.
Cheers and Happy coding!👏👏👏
Feel free to leave any questions or comments in the PR thread if something is not 100% clear.
Please, remember to tag me in your question so I can receive the notification.
Please, do not open a new Pull Request for re-reviews. You should use the same Pull Request submitted for the first review, either valid or invalid unless it is requested otherwise.
As described in the Code reviews limits policy you have a limited number of reviews per project (check the exact number in your Dashboard). If you think that the code review was not fair, you can request a second opinion using this form.
src/components/Homepage.js
Outdated
<div className="grid-container"> | ||
{categories.map((category) => ( | ||
<Link to={`/details/${category.mal_id}`} key={category.mal_id} onClick={() => dispatch({ type: 'SET_SELECTED_CATEGORY', payload: category.mal_id })}> | ||
<div className="category-item"> | ||
<img className="category-image" src={category.images.jpg.image_url} alt={category.image_url} /> | ||
<div className="category-title">{category.title}</div> | ||
</div> | ||
</Link> | ||
))} | ||
</div> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- Hi, you have done a nice job and your App is working fine. You need to work on the design and submit it for re-review. this is what the requirements say:
- You should follow the design guidelines including Layout: composition and space between elements.
NB: Pay attention to the blue marks in the pictures to understand what is missing in your design, and implement them if possible(Remove space in between pictures, also add those small arrows in each pictures) - Original
- Your design
import React from 'react'; | ||
import { render } from '@testing-library/react'; | ||
import { BrowserRouter as Router } from 'react-router-dom'; | ||
import Navbar from '../components/Navbar'; | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
-
Hi, I will advise you to test more components of the App, because the requirements say that the App must have unit tests for several components of the app.
-
Can you add integration tests using React Testing Library, it is the project requirement.
For this one, you can perform a mocking data fetching and Redux Store connection.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi @Gardimy,
♻️ Required Changes ♻️
Great work on making the changes requested by a previous reviewer 👏
You've done well implementing some of the requested changes, but there are still some which aren't addressed yet.
Highlights
- No linter errors ✔️
- Descriptive PR ✔️
- Correct Git flow ✔️
- All tests passed ✔️
- Good UI ✔️
Required Changes ♻️
Check the comments under the review.
Optional suggestions
Every comment with the [OPTIONAL] prefix won't stop the approval of this PR. However, I strongly recommend you to take them into account as they can make your code better. Some of them were simply missed by the previous reviewer and addressing them will really improve your application.
Cheers and Happy coding!👏👏👏
Feel free to leave any questions or comments in the PR thread if something is not 100% clear.
Please, remember to tag me in your question so I can receive the notification.
Please, do not open a new Pull Request for re-reviews. You should use the same Pull Request submitted for the first review, either valid or invalid unless it is requested otherwise.
As described in the Code reviews limits policy you have a limited number of reviews per project (check the exact number in your Dashboard). If you think that the code review was not fair, you can request a second opinion using this form.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- As requested by the previous CR please 🙏🏽 add several tests for the components, you have a test for the Navbar component, kindly add tests for DetailsPage and Homepage.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi @Gardimy,
In my opinion, your project is ready for the presentation! There is nothing else to say other than... it's time to merge it
Good luck! 🎉
Feel free to leave any questions or comments in the PR thread if something is not 100% clear.
In this milestone I introduce the React Capstone Project, which involves building a mobile web application using React and Redux. The project focuses on creating an application that allows users to check a list of metrics obtained from a selected API. The application consists of multiple pages, including a homepage with a list of items and a details page displaying specific data for each item. The project follows design guidelines and incorporates interactions for a seamless user experience.
Changes Made:
API: I use the Jikan API
Testing: