{"id":19844632,"url":"https://github.com/elazzouzihassan/recipewebsite","last_synced_at":"2026-03-11T01:02:01.498Z","repository":{"id":198697895,"uuid":"701344121","full_name":"ElazzouziHassan/RecipeWebsite","owner":"ElazzouziHassan","description":"Project: Recipe Website | HTML, CSS \u0026 Bootstrap","archived":false,"fork":false,"pushed_at":"2023-10-12T22:19:13.000Z","size":32567,"stargazers_count":4,"open_issues_count":0,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-06T18:08:41.061Z","etag":null,"topics":["bootstrap","css3","html","recipe-app","recipe-website"],"latest_commit_sha":null,"homepage":"","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ElazzouziHassan.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2023-10-06T12:51:35.000Z","updated_at":"2025-03-17T16:36:38.000Z","dependencies_parsed_at":"2023-10-11T02:19:34.221Z","dependency_job_id":null,"html_url":"https://github.com/ElazzouziHassan/RecipeWebsite","commit_stats":null,"previous_names":["elazzouzihassan/recipewebsite"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElazzouziHassan%2FRecipeWebsite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElazzouziHassan%2FRecipeWebsite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElazzouziHassan%2FRecipeWebsite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElazzouziHassan%2FRecipeWebsite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ElazzouziHassan","download_url":"https://codeload.github.com/ElazzouziHassan/RecipeWebsite/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251941269,"owners_count":21668703,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bootstrap","css3","html","recipe-app","recipe-website"],"created_at":"2024-11-12T13:05:00.274Z","updated_at":"2026-03-11T01:02:01.405Z","avatar_url":"https://github.com/ElazzouziHassan.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Project: Recipe Website\n\n## **Tools** :\n\n- HTML\n- CSS\n- Bootstrap \n\n## **Steps** :\n\n### **Set Up Your Project :**\n\nCreate a new folder for your project on your computer. Inside this folder, create the following files:\n\nindex.html (the main webpage)\nstyles.css (for your custom CSS)\nassets folder (for storing any images you want to use)\n\n### **HTML Structure :**\n\nIn your index.html file, set up the basic HTML structure with the following sections:\n\n- Header (navbar)\n- Home\n- Recipes\n- Contact\n\n### **Bootstrap Integration :**\n\nLink to the Bootstrap CSS and JS files in the \u003chead\u003e of your HTML file. You can do this by adding the following lines:\n\n```bash\n\u003clink rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/bootstrap/dist/css/bootstrap.min.css\"\u003e\n```\n```bash\n\u003cscript src=\"https://cdn.jsdelivr.net/npm/bootstrap/dist/js/bootstrap.min.js\"\u003e\u003c/script\u003e\n```\n\n\n### **Navbar :**\n\nCreate a responsive navigation bar using Bootstrap's Navbar component. Customize it with links to Home, Recipes, and Contact.\n\n### **Home Section :**\n\nIn the home section, you can have a welcoming message and a featured recipe or two. Use Bootstrap's components to style this section.\n\n### **Recipes Section :**\n\nCreate a section where you can showcase your favorite recipes. Each recipe can be displayed as a card with an image, title, ingredients, and instructions. Use Bootstrap's grid system to arrange the recipe cards.\n\n### **Contact Section :**\n\nInclude a contact form or provide your contact information, such as email and social media links. You can use Bootstrap's form components for this.\n\n### **Custom CSS :**\n\nCustomize the styling of your website by adding rules to your styles.css file. Adjust fonts, colors, and layout as per your preferences.\n\n### **Content and Images :**\n\nReplace placeholder text and images with your own content. Make sure to save your recipe images in the images folder and reference them correctly in your HTML.\n\n### **Testing :**\n\nTest your website by opening the index.html file in your web browser. Ensure that it looks and functions as expected on various screen sizes.\n\n### **Deployment :**\n\nIf you want to share your recipe website with others, you can host it on a web hosting service or a platform like GitHub Pages.\n\n---\n\nCreating a recipe website is a fun and practical project that allows you to use HTML, CSS, and Bootstrap to display your favorite recipes. You can also continuously add new recipes to expand your website's content.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Felazzouzihassan%2Frecipewebsite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Felazzouzihassan%2Frecipewebsite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Felazzouzihassan%2Frecipewebsite/lists"}