All solutions

Hello everyone 👋🏽

I have completed this challenge using simple HTML and CSS. I have tried to achieve perfection with the design. However, there might be some inconsistencies for which I would like your feedback.

If you have something on any aspect of my solution, please share. I would like to get feedback from my peers and use it for betterment and improvement.

At present, I have only worked out the Desktop design for the challenge. I am still to implement the Mobile design.

Please let me know about your thoughts! NT

Hey everyone!

This was a nice project to build. I have used ReactJS to build the solution. Although, there wasn't much React required for the output but using it has helped me to fasten the progress. Managing state and efficiently looping through the data to reuse components has been greatly facilitated by React.

For the Theme Switcher, I have made use of Local Storage as it allows to persist theme on refresh. I have also changed the icon between light-mode and dark-mode.

On the filter, I have added a 'Remove' button that can be used to remove the applied filter. Although, this wasn't in the design but I thought it would be an essential aspect to implement.

Lastly, I have also added pagination to the project and used alphabets to categorize the items. This allows us to travel to the required page in an efficient way.

Any feedback, comments, suggestions are welcomed!

Thanks, Nikhil Tanwar

Hi everyone!

This was a great refresher for building simple and plain layout. I really liked the color pallete that was provided for the task.

Simple and minimalistic!

If you have any suggestions for improvements! Let me know!

Thanks, NT

Hey everyone!

This was a nice challenge to perform.

Firstly, I planned to use plain HTML and CSS but I observed that the layout of 3-cards is highly similar. To avoid any repetition of code, I leveraged React. I created a JSON and stored the repeating values.

I, then, created the card template and used map to fetch and display all the values.

Please, let me know what I can improve in the code or overall output!

NT

Hey everyone!

This was a nice challenge and I have tried to keep the overall output similar to the design.

There is some issue with the mobile layout. When I access this app in Safari, the border radius is not shown. But, in Chrome, it is all correct. This is a critical issue I am facing.

As always, I am open to suggestions to help me improve the code.

Keep Coding!

NT

Hey everyone!

This was a nice challenge and I have tried to keep the overall output similar to the design.

There is some issue with the mobile layout. When I access this app in Safari, the border radius is not shown. But, in Chrome, it is all correct. This is a critical issue I am facing.

As always, I am open to suggestions to help me improve the code.

Keep Coding!

NT

Hey everyone!

It was a simple yet interesting challenge. It took me a few minutes to figure out the background image and make it similar to the provided image.

I have completed this project using plain HTML and CSS.

I am open to suggestion on anything that needs to be improved.

Peace. Keep Coding.

NT

Hey everyone!

This was a fun one! I enjoyed coding this. I completed this challenge within an hour and I might have made some mistakes.

I would be really happy if you could point out these mistakes as this would ultimately help me to be a better developer.

Keep coding. Peace ✌🏽

-- NT

Hi everyone!

I am open to any suggestions and recommendations which can help to improve the overall code structure and the final output.

Thanks!

Hey everyone!

I have started a challenge where I have aimed to complete all FrontEnd Mentor challenges. I have started from Newbie Challenges and will ultimately move to Guru.

This challenge was a great starter project as it helped to refresh basic concepts of markup and styling.

I am open to any and all kind of suggestions related to code quality, the final build, or literally, anything related to the project.

Peace.

Keep Coding ✌🏽

Hey everyone!

I hope you are coding with the utmost enthusiasm!

I just completed this challenge and it was great to work on this. I solved this using React and used useState to manage the button clicks and render appropriate output. It might seem simple at first, but it will take you a few minutes to get sorted out.

I have also added a very minor animation to enhance the smooth behaviour on modal open.

I am open to any feedback and suggestions. Please visit the code repo and live site to propose any changes or improvements.

Thanks!

Hi everyone!

This project is great for anyone who wants to understand the concept of fetching data from external API. This would allow us to build a strong understanding of making API calls, preparing us for executing complex calls.

TIP

To change the image based on screen size, we can leverage the <picture> tag. This is a highly straightforward and elegant solution for rendering relevant images.

Read more about it here - https://www.w3schools.com/tags/tag_picture.asp

Let's connect on Twitter - https://twitter.com/FE_Mechanix

Subscribe on YouTube - https://www.youtube.com/@frontendmechanix

Keep Coding ✌🏽

Hi everyone!

I just completed this challenge and it was quite interesting. We need to take multiple factors into account while working with dates. Validation of form while ensuring appropriate error is being shown - is a challenge in itself.

I loved this challenge as it provided a platform to test out design and development skills in one go.

Will do more Frontend Mentor challenges. These are really helpful.

Also, if there's any improvement in the code - please let me know. I aim to improve myself.

Thanks!

Keep Coding!

Hi everyone!

This was an exciting project. Although it was simple but there were some elements that made me think. I believe I have made the solution close to the specified design.

Please let me know what you think about me and most importantly, if there are any improvements or suggestions - please do provide them. I'll be happy to learn about my mistakes and identify the scope for improvement.

Thanks!

Hey everyone,

It was a simple project and I did not face any potential difficulty in executing this. I am trying to gradually upscale the difficulty level and ultimately reach GURU.

Please let me know how I did.

Thanks!