Welcome to the Frontend Development Challenge 1! 🚀 In this challenge, you will create a responsive webpage that displays a product catalog using Bootstrap. The catalog should have the following features:
You can view my solution live here.
Your task is to build a webpage with the following components:
-
Navigation Bar: Create a navigation bar at the top with links to Home, Products, and Contact Us.
-
Header: Design an attractive header with a title and a brief description.
-
Product Grid: Implement a grid layout to display product cards. Each card should contain the following:
- Product Image
- Product Name
- Product Price
- "Buy Now" button
-
Responsive Design: Ensure that the product cards arrange themselves into multiple columns on larger screens and a single column on smaller screens. Make sure the page looks good on both desktop and mobile devices.
PC View
Mobile View
You can use Bootstrap's grid system, components, and utility classes to achieve this challenge. Feel free to create a simple example or ask for more specific guidance on any part of the challenge.
When you have completed the challenge, share your code or describe your approach in this repository. You must follow contribution steps given on the main page.
If you have any questions, need feedback, or require assistance, don't hesitate to reach out. Happy coding! 🔥