Profile Card Project πΌ The Profile Card Project dynamically generates and displays user profile cards using data fetched from an API. Each card showcases the user's name, title, bio, and contact details, all styled for a clean and modern presentation. This project demonstrates how to integrate HTML, CSS, Bootstrap, and JavaScript to create a responsive and interactive user interface.
Features β¨ Fetch user data from an API. Generate user profile cards dynamically. Display user information in a visually appealing card layout. Utilize Bootstrap for styling and responsiveness. Ensure responsive design for proper display on all screen sizes. Reset profile cards with a single click.
Getting Started π Prerequisites π Basic knowledge of HTML, CSS, and JavaScript. A working environment to run and edit web files. Installation π οΈ Clone the repository. Open the project files in your preferred code editor. Launch the index.html file in a web browser.
Usage π‘ Fetch user data using the provided API. Insert the fetched data into the HTML structure. Style the profile cards with Bootstrap for a clean and modern look. Ensure the layout is responsive and centered. Reset the profile cards using the reset button.
Project Structure π index.html: Contains the HTML structure. styles.css: Includes custom CSS styles. scripts.js: Handles the API calls and dynamic content insertion.