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.
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]() |
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...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.
Courses
Resources
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.
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.
This project is licensed under the MIT LICENSE.