Hey there! 👋 I'm all about web dev 🧑💻, drumming 🥁, and hitting the road on my bike 🚴! Designing and developing with Webflow is my jam, serving clients worldwide 🌎. Studying FullStack at GO-IT in Ukraine atm! Drop me a line ✉️ if you wanna chat 😊.
I’m currently learning...React, TypeScript, NextJS
Latest solutions
Password Generator WebApp | React | TypeScript
#typescript#reactPSubmitted 5 months ago-
Code Review:
I believe feedback from more experienced developers is the best way to improve my skills and get closer to the job I’ve been dreaming of for so long. Please let me know if way that I was write a code is good enough for working as a developer, and how much time such a project should take according to the real life job? -
State Management:
I used a lot of states in my implementation. While this approach makes the code clear and understandable for me, I wonder if it's the best practice or if there’s a better way to handle it. I’d love to hear suggestions on improving state management in my project.
-
Tip Calculator | NextJS | TailwindCSS | TypeScript | Redux
#next#redux#tailwind-css#typescriptPSubmitted 5 months agoI’d love feedback on how my code looks from a Junior Developer perspective. Is it enough to start applying for Junior positions? If not, what should I improve? I’d also appreciate guidance on optimizing my process with this stack to save time in future projects.
Time tracking dashboard build with React
#reactPSubmitted 5 months agoI would really appreciate it if you could review my code and provide feedback on how I can improve it for my next challenge. I want to make my work cleaner and increase my chances of landing a job.
I’m also wondering where to focus my time next: should I spend more time polishing my React skills, or after improving my understanding of Redux, should I dive deeper into Next.js? I’ve heard that Next.js is a more powerful and efficient way to build websites and web apps, offering great performance and high SEO rankings.
Newsletter Sign-Up form with vanila JavaScript validation
PSubmitted 8 months agoI think the main help I need is advice on how to simplify the process and whether my code is broken down enough to be suitable for a Junior role.
Testimonials cards section using Grid CSS
PSubmitted 9 months agoOverall, I want to ensure that my code aligns with what’s expected for a junior position. Does this approach meet those standards?
Responsive Product Card component CSS
PSubmitted about 1 year agoI’d like help in reviewing my code to see if it’s efficient and good enough to meet hiring standards.
Latest comments
- @miguel-jardinezP@grifano
Hi Miguel 👋
Congratulations on completing this exciting challenge! It was a great experience for me to review your work.
To be honest, I felt a little overwhelmed by your code. You’ve used some concepts that are new to me, like ThemeProvider, type unions, and advanced Next.js features. Even though I have some knowledge of Next.js, I found myself a bit lost in certain areas of your implementation.
That said, I really appreciate the effort and thought you’ve put into this project! I have a couple of suggestions that might help improve your project and your GitHub README: • It would be great to make the strength level update dynamically as the user changes settings. This way, they get immediate feedback on whether their password is strong enough. • I noticed an issue with the color table in your GitHub README. It seems like the image paths for the colors might be incorrect.
Overall, this is an awesome project, and I can see you’re making great progress with Next.js—I’m a fan of the framework too!
Keep up the great work, and I look forward to seeing your future solutions! 😊
- @SpecroWhat are you most proud of, and what would you do differently next time?
Read a bit about useMemo and was able to overcome all NaN cases (I think) :)
What challenges did you encounter, and how did you overcome them?At first I thought I could hold the tip percent state in the tip input component but the reset button made me lift it up. Also I kind of hate how the input with an icon in front requires that much HTML but it seems like all other solutions are pretty hacky.
P@grifanoHi Specro,
Congratulations on completing the Tip Calculator challenge! 🎉 I really like your approach to handling the “value not zero” validation—it’s super clean and efficient. I don’t know why I didn’t think of using a utility function for that myself!
I also had to dig into useMemo recently, especially when I ran into warnings while using useEffect. After exploring it further, I realized it’s a great best practice to avoid unnecessary re-renders—so it’s awesome to see you using it here.
Overall, you did a fantastic job! 👏 The only thing I noticed is that the Custom field seems to be missing characters in its placeholder. Fixing that would make it look more polished. I’d also suggest adding a red outline to the field when the error message (“Can’t be a zero”) appears. If you want to take it a step further, you could include a notification or toast for a better user experience.
Great work! Keep up the amazing effort, and happy coding as you take on new challenges! 🚀
- @SpecroP@grifano
Hi there! 👋 Congratulations on your solution – it’s truly impressive. As I started exploring your code, I couldn’t help but feel like a complete React newbie 😂. Your work is so clean, elegant, and well-organized that I’m absolutely amazed.
The only thing I’d love to see is some smooth hover transitions to make the user experience even better. Keep up the fantastic work! 🚀
- @LupoNetnP@grifano
Hi! Congratulations on completing the challenge! 🎉 I hope this isn't your final solution, and that you'll continue working on improving it, especially the styles to match the design.
Here are a few tips to help you improve your code:
-
HTML: Try to give your classes more meaningful names. Avoid using numbers like "hidden-2" as it makes it harder to understand what the class is doing.
-
CSS: I noticed the styles were missing, but remember that user experience is a key part of web development. Adding styles will really make your project stand out.
-
JavaScript: To make your JS cleaner, you can break it down into smaller functions. Also, using
addEventListener
for form handling is a good idea, like this:addEventListener('submit', function() {})
Feel free to check out my code if you want.
Overall, great work! You've shown a lot of progress and learned some valuable skills that will help you become an even better web developer. Keep it up!
-
- @KingoruovieP@grifano
Great job! The code is well-organized and easy to read. I just have a couple of suggestions to share:
Try using const for variables that don’t change, and only use let when you know the value will be reassigned. It's a good practice for cleaner code. For SVG icons, there’s an interesting approach I learned in my full-stack course: using an SVG sprite. You can check out this article for a quick intro: https://medium.com/@sorlenk/introduction-to-svg-sprite-004a99bcd2bd.
Keep up the great work, and remember—every small improvement you make brings you one step closer to mastering your craft!
- P@DalaScriptWhat are you most proud of, and what would you do differently next time?
- I am proud that I successfully brought this project to the end. 🎉✅
- There were some challenges with the images, but nothing too difficult. 🖼️🔍
- Any advice would be appreciated. Thanks in advance! 🙏💡
P@grifanoHi, great job with the solution! Keep up the good work!
Here is a few improvements: The solution includes some semantic HTML, such as proper use of <section>, <header>, and <footer>. However, improvements can be made by ensuring each section has meaningful roles, such as using <main> for main content and limiting to one <h1> for SEO and accessibility.
Accessibility: Color contrast is generally good, but some improvements can be made by ensuring all images have descriptive alt texts. Add ARIA labels to interactive elements, like buttons, for better screen reader accessibility.
Layout on Different Screen Sizes: The layout is responsive and adjusts well across different screen sizes, from mobile to desktop. However, the text in some sections (like the subtitle under "Smarter meetings") could benefit from better spacing on smaller screens to avoid cramped appearance.
Code Structure: The code appears clean and well-organized, it can be improved for reusability by using more classes and CSS variables for commonly reused styles.
Design vs. Solution: The overall solution closely matches the design, though there are minor differences, such as I was mentioned before.