All solutions

Hi everyone,

Project finished in OOP & vanilla javascript. User data (input) are stored in an object which makes dynamic display much easier. Subscription plan data, subscription prices, addons etc are also stored in an object which makes modification easier. Very good project. I'm waiting for your feedback!

Hello everyone,

Project is over today! somes features added to spice things up🌶️ :

• Cross filtering between input and dropdown list
• The API request is pulled once when the index.html load.
• Work with local storage to improve performance and reduce the number of API requests
• The regions in the dropdow filter are displayed dynamically according to the data from the API
• Countries Pagination, 12 countries are displayed per page by default to improve performance and UX (dynamic with filtering)
• Button pagination (5 buttons displayed by default) to improve UX/UI
• Possibility to go to the first or last page in one click via pagination
• Possibility to go to the next or previous page via pagination
• Numbers formatting with comma
• The countries names too long are truncated in the buttons (country page) to keep a clean UI
• Toggle the color scheme between light and dark mode

Your feedbacks are welcome ✌️

Hello everyone,

I wanted to make this product page as dynamic as possible so I added some features to the challenge:

1.Display one or more products dynamically 2.Modify the products data by the data.js file 3.Calculate the height of the cart dynamically according to the number of items 4.Open the cart after adding a product 5.Close the cart after a certain time after adding a product 6.Application works the same way with one or more products

to make it simple, the data of the products and the number of displayed products can be modified from the data.js file without changing the functionality.

Let me know your opinion!

Hello everyone,

Always very useful to know to make this type of component.

Hello everyone,

Nice challenge to practice CSS Grid!

Hello everyone,

Great project to implement a lot of small concepts in javascript.

I added some features that I found useful and fun:

-localStorage to save current & previous value -counter & progressBar animation -security on input -error messages when value is invalid

Feedbacks are welcome!

Hello,

Do you have best practices to make a dropdown menu? In this case i toggle a class with javascript to add the height on my dropdown.

thank you, feedbacks are welcome!

Hello,

Very complete challenge! the CSS part is a good exercise. for the logic/javascript part I use a bunch of if statements, what do you advise to use instead to simplify the code?

thank you !

Hello everyone,

in order to display the bar dynamically, it's preferable to use px units or % on the height ? I use px for this project because of the flexbox (card, bar and day), i'm not able to set the height on 100% (otherwise i need to restructure the HTML code). So, i need to use max-height with a specific value in px to determine the 100% of my bar. But i think that isn't a good practice because if i want to change the height of the bar in the CSS, i need to change this hard coded value in the JS..

thanks for your feedback!

Hello everyone,

Really enjoyed the filtering part! do you have any recommandation and best practices to improve the logic for the filtering ?

thanks

Hello everyone,

Any best practices to display this kind of error on a form with Javascript ? What do you think about this simple solution?

thanks!

Hello everyone,

Just a fun challenge! Not very difficult but feel free to leave any feedback to improve this solution.

thanks!

Hello everyone,

I have some problems to display the image on a certain height while keeping the ratio. I can't set a fixed height because otherwise when I enlarge my viewport the image gets distorted. How do you fix this without using media queries? I only let the image take 100% of the height for the moment but it's not perfectly the requested design. I could eventually make the mobile design unresponsive to the desktop breakpoint but I don't think that's a good solution. Your help and suggestions are welcome!

thanks !

hello everyone,

I've tried with this challenge to write more semantic HTML code and use BEM Methodology.

Feel free to give me a feedback.

thanks!

Hello world,

For this challenge I tried to make the component responsive with grid to switch from mobile to desktop design, I'm not sure it's the right way or rather in the best practices even if it works.

thanks !

Hello world,

I've used the BEM Methodology to name my classes. Let me know if it's incomplete, messy and how i can improve it.

thanks !

Hello world,

Give me your opinion! i like pixel perfect and even if it's certainly not 100% perfect, critics are welcome to become better!

thanks

Hello world,

The challenge is not difficult but still a very good exercise. what would you advise me as a good practice?

thank you

Hello world,

I am quite satisfied with my work on this challenge knowing that 2 months ago I would not have been able to do it! As I never do anything like everyone else, I learned javascript before HTML and CSS. I have a little more experience in JavaScript so... What do you think of the javascript part on this project ? Improvement to do ?

Feedback welcome! Thanks

Hi everyone, This is my very first front end mentor project. Is the html structure good? How can i improve and simplify my css code? Is using min-width and max-width a good option?

Thanks!