Skip to content
OverviewSolutions
18
Comments
12
Riyad
@riyad-96

All comments

  • MikDra1•6,920
    @MikDra1Submitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    💻 Hello, Frontend Mentor Community,

    This is my solution for the Notifications page.

    • Scored 99,75% on Google Pagespeed Insights! 🚀
    • Solution with 100% W3C validation accuracy 🌟
    • You can mark your notification as read separately as well as mark them all at the same time 🖱

    🛠️ Built with:

    1. HTML ✨
    2. CSS 🎨
    3. JavaScript 🧾
    4. React ⚛️
    5. Vite.js 💡
    • Fully responsive design crafted with a mobile-first approach 📲
    • Enjoyed every moment coding this! 😎
    • Feedback is always welcome—let’s grow together! 🌱
    • Completed 19 out of 30 Junior Challenges so far—keeping up the momentum! 🔥
    • 👨‍💻 Join me on my coding journey as I tackle advanced challenges and add innovative touches to every project.

    Notifications page built with HTML | CSS | REACT - MikDra1

    1
    Riyad•230
    @riyad-96Posted about 2 months ago

    Nicely done brother as always.

    0
  • MikDra1•6,920
    @MikDra1Submitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    💻 Hello, Frontend Mentor Community,

    This is my solution for the Manage landing page.

    • Scored 97,75% on Google Pagespeed Insights! 🚀
    • Solution with 100% W3C validation accuracy 🌟
    • Custom-built CSS animations for a smooth user experience 💫
    • Custom testimonials scroll animation 🌴
    • Special testimonial function on mobile 📱
    • As you hover on the testimonial section the scroll animation is stopped 💥
    • Custom loading animation at the entrance 🛫

    🛠️ Built with:

    1. HTML ✨
    2. CSS 🎨
    3. JavaScript 🧾
    4. React ⚛️
    5. Vite.js 💡
    6. Context API 🛒

    • Fully responsive design crafted with a mobile-first approach 📲

    • Enjoyed every moment coding this! 😎

    • Feedback is always welcome—let’s grow together! 🌱

    • Completed 8 out of 13 Intermediate Challenges so far—keeping up the momentum! 🔥

    • 👨‍💻 Join me on my coding journey as I tackle advanced challenges and add innovative touches to every project.

    • As I am starting my journey with React I'm really looking forward to hearing your thoughts and suggestions! 💡

    Manage landing page built with HTML | CSS | REACT - MikDra1

    1
    Riyad•230
    @riyad-96Posted about 2 months ago

    Mind blown 🤯.

    0
  • MikDra1•6,920
    @MikDra1Submitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    💻 Hello, Frontend Mentor Community,

    This is my solution for the Bookmark landing page.

    • Scored 94% on Google Pagespeed Insights! 🚀
    • Solution with 100% W3C validation accuracy 🌟
    • Custom-built CSS animations for a smooth user experience 💫
    • Custom animation with the arrow in the FAQ section 🛫
    • Email validation while typing ⌨

    🛠️ Built with:

    1. HTML ✨
    2. CSS 🎨
    3. JavaScript 🧾
    4. React ⚛️
    5. Vite.js 💡
    6. Context API 🛒

    • Fully responsive design crafted with a mobile-first approach 📲

    • Enjoyed every moment coding this! 😎

    • Feedback is always welcome—let’s grow together! 🌱

    • Completed 9 out of 13 Intermediate Challenges so far—keeping up the momentum! 🔥

    • 👨‍💻 Join me on my coding journey as I tackle advanced challenges and add innovative touches to every project.

    • As I am starting my journey with React I'm really looking forward to hearing your thoughts and suggestions! 💡

    Bookmark landing page built with HTML | CSS | REACT - MikDra1

    1
    Riyad•230
    @riyad-96Posted about 2 months ago

    Nicely done brother.

    0
  • Riyad•230
    @riyad-96Posted about 2 months ago

    You need more practice brother.

    0
  • Aminpatra•260
    @AminpatraSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    Very proud with the final look and responsibility of the website, Looking forward to hearing your feedback ♡.

    Testimonials grid section Solution.

    2
    Riyad•230
    @riyad-96Posted about 2 months ago

    Excellent animation brother. I'm inspired by you. I'll copy your animation, If you don't mind.

    1
  • Riyad•230
    @riyad-96Posted about 2 months ago

    Practice more and more, and you should try to make everything responsive.

    0
  • Riyad•230
    @riyad-96Posted about 2 months ago

    It was so smooth & inspiring. Keep it up.

    1
  • Riyad•230
    @riyad-96Posted 2 months ago

    Not bad at all, need more practice brother. I hope you can understand.

    1
  • Riyad•230
    @riyad-96Posted 2 months ago

    Nicely done, you need more practice to reach your expectation.

    0
  • Riyad•230
    @riyad-96Posted 2 months ago

    Excellent work brother. Keep it up.

    1
  • Edwin Cheng•360
    @edwinc73Submitted 2 months ago
    What challenges did you encounter, and how did you overcome them?

    I learnt that tailwind doesnt read interpolated classes.

    e.g "text" + "-gray-300" will not change the color of the text however "text-gray-300" as a whole string will.

    Result component

    1
    Riyad•230
    @riyad-96Posted 2 months ago

    Nicely done brother.

    0
  • Adarsh•1,640
    @adram3l3chSubmitted 2 months ago
    What are you most proud of, and what would you do differently next time?

    First Angular Project

    I'm proud of successfully building a mortgage calculator as my first Angular project, especially since it was a challenging transition from React. Completing this project gave me a solid grasp of Angular’s architecture, and seeing the final product work smoothly was very rewarding.

    Next time, I’d spend more time planning the project structure and learning Angular best practices upfront. I’d focus on better code organization, leveraging Angular’s dependency injection, and integrating testing earlier in the process to ensure a more maintainable and scalable codebase.

    What challenges did you encounter, and how did you overcome them?

    One of the main challenges I encountered was implementing two-way data binding in custom components. Initially, the data wasn’t updating as expected, leading to incorrect or undefined values in forms. To overcome this, I learned how to properly use Angular’s @Input() and @Output() decorators along with EventEmitter to manage two-way binding effectively. This allowed me to ensure that data flowed correctly between parent and child components, solving the issue.

    Another challenge was adapting to Angular’s more complex structure compared to React. To overcome this, I spent time understanding Angular’s core concepts, such as dependency injection and services, which helped me structure the project more effectively and manage the application logic.

    Mortgage repayment calculator

    1
    Riyad•230
    @riyad-96Posted 2 months ago

    This is inspiring bro. keep it up.

    Marked as helpful
    1