/Frontend_Mentor

Sharpen Your Frontend Development Expertise with Frontend Mentor Challenges.

Primary LanguageHTMLMIT LicenseMIT

Frontend Mentor Projects 🚀

Frontend Mentor is an excellent platform for front-end developers who want to improve their skills and build real-world projects. It offers a range of challenges that cater to different skill levels and provides resources and support to help developers learn and grow their skills in HTML, CSS, and JavaScript.

Click here to checkout my Frontend Mentor Profile.

About the Journey

Listing of all the projects

S.No Name of the Project Live Project View Source Code Read Blog
1. Community Card Project Demo Project Code Read Blog
2. E-Commerce Product Page Project Demo Project Code Read Blog
3. Testimonials Grid Section Project Demo Project Code Read Blog
4. News Homepage Website Project Demo Project Code Read Blog
5. Chat App CSS Illustration Project Demo Project Code Read Blog
6. Advice Generator App Project Demo Project Code Read Blog
7. Base Apparel Coming Soon Project Demo Project Code Read Blog
8. Article Preview Component Project Demo Project Code Read Blog
9. Huddle Landing Page Project Demo Project Code Read Blog
10. Stats Preview Card Project Demo Project Code Read Blog
11. Huddle Introductory Section Project Demo Project Code Read Blog
12. Order Summary Component Project Demo Project Code Read Blog
13. Three Column Cards Project Demo Project Code Read Blog
14. Clipboard Landing Page Project Demo Project Code Read Blog
15. Profile Card Component Project Demo Project Code Read Blog
16. Fylo Two Column Layout Project Demo Project Code Read Blog
17. Product Preview Card Project Demo Project Code Read Blog
18. Intractive Rating Card Project Demo Project Code Read Blog
19. NFT Preview Card Project Demo Project Code Read Blog
20. Social Proof Section Project Demo Project Code Read Blog
21. Single Price Grid Component Project Demo Project Code Read Blog
22. QR Code Component Project Demo Project Code Read Blog
22. SHOE WEBSITE Project Demo Project Code Read Blog

Tech stack

  • HTML | CSS | SASS | TailwindCSS | Responsive Design
  • JavaScript | DOM Manipulation | OOPs | ES6 | ES7
  • React.Js | Redux | UseState | UseEffect | Framer Motion
  • APIs | Libraries | npm |
  • Git | GitHub | Markdown | VS Code | CodePen | Netlify | Vercel | Material UI | more...

Continuous Learning & Development

I am committed to an ongoing journey of improvement and expansion of my skills. To become a well-rounded full-stack developer, I will:

  • Deepen my proficiency in HTML, CSS, and JavaScript by working on additional projects and challenges. This will solidify my foundation in core web technologies.

  • Learn new frameworks and technologies to stay up-to-date and increase my versatility. This includes exploring JavaScript frameworks like React, Angular, and Vue to build interactive and dynamic web applications.

  • Focus on backend development by learning technologies such as Node.js, Express.js, and MongoDB. This will enable me to build fully-functional, full-stack applications.

  • Prioritize responsive design, accessibility, and SEO best practices to ensure the websites I build are high-quality, user-friendly, and optimized for search engines.

  • Continually challenge myself to expand my knowledge and skills, pushing the boundaries of what I'm capable of as a developer. This commitment to lifelong learning will be a driving force in my professional growth.

By consistently investing in my development and exploring new technologies, I will position myself as a well-rounded, adaptable, and highly valuable full-stack developer.

Useful Resources & Courses

⚙️ How to get started with the code

  1. Fork the repository
  2. Clone it on ur local Machine: git clone https://github.com/Your_Github_username/Frontend_Mentor.git
  3. Create New Branch: git branch -c "New Branch Name"
  4. Navigate to the New Branch: git checkout"New Branch Name"
  5. Make your changes and Commit them: git commit -m "Add Some feature"
  6. Push the Branch: git push origin New Branch
  7. Open Pull requestto main Repository and Submit.
  • Courses

    • Course 01 - This is an amazing course which helped me finally understand HTML, CSS & Responsive Design.
    • Course 02 - This is an amazing course which helped me finally understand Advanced CSS, SCSS, Advance Grid, Flexbox & Advanced Responsive Design.
    • Course 03 - This is an amazing course which helped me Master JavaScript.
    • Course 04 - This is an amazing course which helped me Master ReactJs, NextJs, TailwindCSS.
  • Resources

    • Resource 01 - This is an amazing articles which helped me finally understand HTML.
    • Resource 02 - This is an amazing articles which helped me finally understand CSS.
    • Resource 03 - This is an amazing articles which helped me finally understand JavaScript.

I would recommend everyone to check out the official resources for HTML, CSS, and JavaScript, as well as the Udemy courses that cover Web Development, JavaScript, React, and Node.js - these are all amazing and valuable learning materials to enhance your skills as a developer.

Author

Acknowledgments

I would like to thank Frontend Mentor for providing such an amazing platform to practice my coding skills. I would also like to thank the community for providing feedback on my projects and helping me improve my coding skills. Additionally, I'm thankful to my go-to YouTube channels, official docs, Stack Overflow, Udemy courses, and especially the wonderful instructors whose guidance has been crucial throughout this journey.

License

This project is licensed under the MIT LICENSE.

Our Contributors

  • We truly appreciate your incredible contributions to this project! Your dedication and hard work are vital to its continued growth and success. If you’ve found value in it, don’t forget to show your support by giving our repository a star! ⭐

-----------------------------------------------------

Stargazers ❤️

Stargazers repo roster for @beRajeevKumar/Frontend_Mentor

Forkers ❤️

Forkers repo roster for @beRajeevKumar/Frontend_Mentor

-----------------------------------------------------

Happy Coding 👨‍💻