Solution challenge Platzi Master Frontend 🔥

[HajdukSanchez]

Hello, I´m Jozek ✌

There is my solution to this challenge. I appreciate for gave us this exercise, because personally, I think if I don't pass to Platzi Master, this was a great opportunity to challenge myself to do something different, something new; because I had to learn the basics of React in 6 hours for making it 😵.

Personally, I have not seen yet a lot of courses about REACT. But when I saw that the challenge needed to be created on React I saw one course of React in Platzi (with Sparragus). This course helped me to understand how React works in some specific aspects and with this basic knowledge create my solution. I think it is an acceptable solution but is not the best of course, but this is why I'm here sending my challenge...for learning 😉💻

I appreciate it if you can give me feedback about my solution because no matters the final result of the selection of Platzi Master. I want to know the topics that I need to improve in my career like developers to upgrade my skills and in the worse of cases, to try the next time to be accepted.

Ok, let's go to the challenge...

My steps for the solution:

1. Create project components ✔

   • I created the components proposed in the APP.JSX file.
   • But also, I created other childes components to divide the components and subcomponents created dynamically.

2. Add styles ✔

   • I added the styles based on the image mockup that the teacher sends us in the challenge.
   • I also added my own style in the child components in each one of the sections.
   • I spent literally 1 hour trying to search for a font that I liked, and I think my choice was correct ✒.

3. Create getData.js function ✔

   • In this particular item I had problems with an error that I did not handle before.
   • I decided to search the error and managed it import them into this class. Honestly, I don't use that import for anything. But the time was running out and this was the only solution that I found.

4. Integrate the API ✔

   • I integrate the API with my components in the case that I needed it.
   • In this case, I get data from the API with the componentDidMount() method. In this method, I called another one and in this other one, I fetch the data and put it into a data "state" variable.

5. Personalized API ✔

   • I put my data into the .json file
   • I added additional information and I deleted some information that I don't think was necessary to add.

6. Documentation ✔

   • I did specific documentation in some parts of the APP that I considered needed it.

In the test aspects and for doing my local commits I commented on the line of .huskyrc, because I never handled tests before. The tests don't work...Sorry for that ❌

Pictures of the solution

Thank you for the opportunity. I will be waiting for the response 🤙