DevClub-Assignment1

You have learnt about HTML, CSS and GitHub in our first session. Now use them to create a webpage by yourself!

Task: Covid Guide

Create a webpage for users to get information and guidelines about covid

Things to include

• A navigation bar with internal links to sections in your page
• The home banner, with a short description of what the webpage is about, and attractive background graphics
• Some Tips with images showing how to follow them
• A table of common symptoms, and recommended advice for them
• A list of common myths or FAQs regarding covid, especially the new variants
• Embed a YouTube video which you think would be helpful for people
• Finish with a footer giving yourself credits and also your contact details

A Figma prototype has been provided for reference, along with the Figma source file for the design. Use the drive link to download the image files

Bonus Task!

• Create a new branch bonus in your fork of this repo. This bonus task has to be done on the bonus branch only, while the main task stays on the main branch (do not merge them)
• Put your IIT Delhi email for contact in the footer, and use mailto to give pre-filled subject and body for the query. For example, the subject may be initialized with Query regarding CovidGuide, and the body with Hey! I visited your website and had a query...
• Add a favicon to your website
• Embed a Google Map of hospitals near IIT Delhi
• Make the website responsive, so it looks good on mobile screens
• Feel free to show your creativity in the design!
• You can use the CSS frameworks Materialize or Tailwind (but not Bootstrap)
• You can use Animate on Scroll or Vanta too!
• Deploy this bonus branch using Firebase Static Hosting, set up the GitHub Action such that the site should be rebuilt each time you push a commit to the repo. Finally, put the URL in the description (About > Website) for your fork of this repo. The URL should look something like https://*.web.app/index.html (where * can be your choice)

Use CDN option for including any libraries/frameworks. Please take only free subscriptions wherever applicable, using any paid features for the assignments is not allowed.

Submission Instructions

• First create your GitHub account. You can use your personal email id for it.
• FORK this repository, by clicking the "Fork" button on top right.
• In your fork of this repo, write the code in the index.html file. You can choose to either edit it directly on GitHub website, or maybe download it, edit on your machine and then upload, or maybe clone the repo, make changes, commit and then push.
• Feel free to upload helping-files (css and images) to your repo, make sure you include them properly with relative paths in the index.html file.
• Host the webpage using GitHub Pages.
• You do NOT need to create a pull request to this main repository.
• Feel free to add more comments in the README.md file.
• Finally, fill this Google Form with your details and URL to the hosted GitHub Pages site.

Ask any doubts on our Discord Server in #html-css-git-14jan channel

Resources

• Mozilla Developer Docs
• W3Schools
• ProgrammingWithMosh's HTML
• Hussein Nasser's Web
• CS50 HTML CSS JS
• web.dev CSS
• Kevin Powell's HTML and CSS basics and advanced playlist
• GitHub Pages Documentation
• YouTube Player Embed API Documentation

Trying out git status