Welcome to the Tea Recipe Webpage repository! This project documents my journey through the Code Institute's 5-Day Challenge, where I created an engaging webpage teaching "How to make tea?" using HTML, CSS, and JavaScript. In addition to tackling the challenge prompts, I seized the opportunity to develop my own unique webpage on the same topic as part of the challenge.
- Introduction
- Learning Journey
- Motivation
- Key Features
- Getting Started
- Tea Recipe Webpage Preview
- Usage
- Contributing
- Future Aspirations
- License
In this project, I methodically developed a user-friendly web page showcasing a detailed tea recipe, employing a blend of HTML, CSS, and JavaScript during my 5-day Coding Challenge. From the elegant header featuring a captivating image to the structured sections detailing ingredients and preparation steps, every element was designed with precision and attention to detail.
I embarked on this coding adventure with enthusiasm, eager to explore the intricacies of web development and deepen my understanding of coding principles. Challenges fuel my passion for learning, and this project provided the perfect opportunity to expand my horizons.
Completing the 5-Day Coding Challenge has been a significant milestone in my journey as a technologist. I love coding and am always eager to explore its diverse applications. The opportunity to learn, grow, and connect with like-minded individuals in the coding community motivated me to participate. I am passionate about discovering how coding can be utilized in various ways, and this challenge was an exciting opportunity to further my exploration.
- Responsive Design: Uses HTML, CSS, and JavaScript to ensure the website adapts smoothly to various screen sizes, enhancing user experience and engagement.
- Interactive Elements: Incorporates CSS and JavaScript to create hover effects on headings and icons to enhance interactivity and provide a dynamic browsing experience.
- Accessibility: Prioritizes clean and organized HTML code and semantic markup to ensure compatibility with assistive technologies, making the website accessible to all users.
- Optimization: Applies optimization techniques to improve page loading speed and performance, enhancing user satisfaction and search engine visibility.
To view the Tea Recipe Webpage and explore the code, simply follow these steps:
-
Clone the Repository: Clone this repository to your local machine by running the following command in your terminal: https://github.com/FarahIbrar/5-Day-Coding-Challenge.git
-
Open the Webpage: Once the repository is cloned, navigate to the project directory and open the My webpage.html file in your preferred web browser to view the Tea Recipe Webpage. You should be able to view it on Chrome without any restriction as well as on VSCODE with any required extension. However, if it doesn't work on any other browser/applications than VSCODE, you can remove the VSCODE line and run it. This should solve the issue and make it work.
Here's how the Tea Recipe webpage looks like:
Feel free to use this project to learn about HTML, CSS, and JavaScript or as a template for your own web development projects. You can also contribute to this project by fixing bugs, adding features, or improving the design.
If you'd like to contribute to this project, please fork the repository, make your changes, and submit a pull request. Your contributions are greatly appreciated!
Looking ahead, I am eager to build upon this foundation and further explore the intersection of coding and data analysis. My goal is to seamlessly integrate my coding skills with my expertise in data analytics, unlocking new possibilities for innovation and problem-solving.
This project is licensed under the MIT License.