I Create seamless UX and UI with creative but functional designs.. The primary motive of every designer should be presenting the limitless possibilities available in the new dawn of Web design and development
I’m currently learning...concurrency and asynchronous programming in java, handling Reactive programing with spring webflux instead of async
Latest solutions
newsletter-sign-up-with-success-message (vanilla js)
#accessibility#animationSubmitted almost 2 years ago
Latest comments
- @Dev-simeon-tech@ricoom
Hello @Osereme congratulations on completing this challenge. I have some few observations that I believe may help you improve your code. 1.make use of the JavaScript Validation API to avoid reinventing the wheel and get the best from html5. the API has methods that enable you to not only check for input errors but also give you ready messages to display to client. you can achieve this by adding a span to the input. input.checkValidtiy() is one of the useFul methods that come in handy in this challenge. eg.
submit.addEventListener('click',(e)=>{ e.preventDefault();
if(input.checkValidity()){ // some code }else{
//display error err.innerText=input.validationMessage; }
})
2.mark the email input as required to avoid creating hardcoded not-null message. I hope you find these observation helpful. happy coding 😉
Marked as helpful - @AmerDakelbab@ricoom
Congratulations on completing this challenge, i like your application of grid but i advice you make use of grid-column and row span in the cards. Also try grid-template-columns(auto-fil, minmax(--params--) ) to get responsive cards. This would significantly save your time and reduce verbosity. For the mobile view, save your time by simply giving the container a block display, which will automatically stack the cards in one column. i hope you find this helpful. Happy coding 😊
Marked as helpful - @NehalSahu8055@ricoom
Hello Nehal, Congratulations for completing the challenge. I would like to point out however that using CSS grid to layout the cards would have saved you a lot of time and give you cleaner code. The real difference between using Flexbox and CSS Grid is in the amount of code: The code for creating a complex layout in Flexbox is more verbose, dispersed and hard to debug (as it being one dimensional you had to create several containers), while that created with the Grid (two dimensional layout) is much faster, tidier and simpler. Though flexbox performance may be high in complex scenarios, the performance difference is almost negligible. Note: I don't mean flex is bad, in fact you need both to achieve this, I just meant for this specific challenge grid would be good, notwithstanding browser support for flexbox is broader than the latter. I hope you find this insight helpful. Happy coding!!😉
Marked as helpful - @Saad-Hisham@ricoom
Hello, congratulations on completing the challenge, i have some remarks that i believe if implemented could improve the user experience. Please add a placeholder in the input field. I believe you are a ware that a placeholder attribute specifies a short hint that describes the expected value of an input field. In conclusion, you IP tracker should be able to use either IP address or a domain name as a parameter, according to the set challenge. Happy coding 😊
Marked as helpful - @Vacii@ricoom
Hi i was no able to track any IP address, please get the geo locations from the IPFY api so that you can you them to update you leaflet map. Also check on mobile responsiveness, as it was not very responsive on my mobile device. Well done good job
- @Mohamedsalahmsa@ricoom
Congratulations on completing your challenge. You IP address tracker should be able to track using either IP address or domain name. Good job