https://github.com/abanoub-refaat/frontendmentor_challenges
A showcase of my solutions to various Frontend Mentor challenges, where I apply HTML, CSS, and JavaScript to build responsive and visually engaging web components. These projects highlight my approach to solving real-world frontend development tasks.
https://github.com/abanoub-refaat/frontendmentor_challenges
bootstrap5 challenges code-challenges css-flexbox css-grid front-end frontend frontend-mentor frontendmentor frontendmentor-challenge html-css javascript learning-in-public responsive-design ui-ux web-components
Last synced: 9 months ago
JSON representation
A showcase of my solutions to various Frontend Mentor challenges, where I apply HTML, CSS, and JavaScript to build responsive and visually engaging web components. These projects highlight my approach to solving real-world frontend development tasks.
- Host: GitHub
- URL: https://github.com/abanoub-refaat/frontendmentor_challenges
- Owner: abanoub-refaat
- Created: 2023-07-28T15:41:40.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-29T17:03:30.000Z (over 1 year ago)
- Last Synced: 2024-08-29T18:55:06.950Z (over 1 year ago)
- Topics: bootstrap5, challenges, code-challenges, css-flexbox, css-grid, front-end, frontend, frontend-mentor, frontendmentor, frontendmentor-challenge, html-css, javascript, learning-in-public, responsive-design, ui-ux, web-components
- Language: CSS
- Homepage: https://abanoub-refaat.github.io/FrontendMentor_Challenges/
- Size: 1020 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Abanoub Refaat
Welcome to my GitHub repository! I'm Abanoub Refaat, a passionate front-end developer focusing on creating responsive and visually appealing web components. Below are my solutions to various challenges from [Frontend Mentor](https://www.frontendmentor.io/challenges), categorized by difficulty level.
## 🌟 Newbie Challenges
Explore my solutions to some of the simpler challenges, perfect for getting started with frontend development:
1. [Product Preview Card](https://abanoub-refaat.github.io/FrontendMentor_Challenges/Code/index.html)
2. [State Product Preview Card](https://abanoub-refaat.github.io/FrontendMentor_Challenges/ProjectCode/index.html)
3. [QR Code Component](https://abanoub-refaat.github.io/FrontendMentor_Challenges/QRCodeComponent/index.html)
4. [Profile Card Component](https://abanoub-refaat.github.io/FrontendMentor_Challenges/ProfileCardComponent/index.html)
5. [Huddle Landing Page](https://abanoub-refaat.github.io/FrontendMentor_Challenges/NHuddleLandingPage/index.html)
6. [Results Summary Component](https://abanoub-refaat.github.io/FrontendMentor_Challenges/ResultsSummaryComponent/index.html)
7. [Order Summary Component](https://abanoub-refaat.github.io/FrontendMentor_Challenges/OrderSummaryComponent/index.html)
8. [Three Column Card Preview](https://abanoub-refaat.github.io/FrontendMentor_Challenges/ThreeColumnCard/index.html)
9. [Single Price Grid Component](https://abanoub-refaat.github.io/FrontendMentor_Challenges/SinglePriceGridComponent/index.html)
10. [NFT Preview Card Component](https://abanoub-refaat.github.io/FrontendMentor_Challenges/NFTPreviewCard/index.html)
11. [Four Card Feature Section](https://abanoub-refaat.github.io/FrontendMentor_Challenges/FourCardFeatureSection/index.html)
12. [Social Links Profile](https://abanoub-refaat.github.io/FrontendMentor_Challenges/SocialLinksProfile/index.html)
## 🚀 Junior Challenges
Here are my solutions to some of the more advanced challenges, perfect for honing your frontend skills:
1. [Testimonials Grid Section](https://abanoub-refaat.github.io/FrontendMentor_Challenges/TestimonialsGridSection/index.html)
2. [Fylo Landing Page](https://abanoub-refaat.github.io/FrontendMentor_Challenges/FyloLandingPage/index.html)
3. [Huddle Landing Page](https://abanoub-refaat.github.io/FrontendMentor_Challenges/HuddleLandingPage/index.html)
4. [Contact Form Main](https://abanoub-refaat.github.io/FrontendMentor_Challenges/ContactFormMain/index.html)
---
You can explore these projects and see how I've approached each challenge. Your feedback is always welcome!