Program Materials

Theory/Practical	Duration
Theoretical discussion	4 hours approx.
Practical/hands-on	12 hours approx.
Capstone project (Self-Paced)	20 hours
Self-paced learning (Skills Build)	9 hours
Total Duration	45 hours Approx.

Module1: Understanding of WEB & HTML.

Introduction to HTML- Fundamentals of Required tools and technologies like Visual Studio Code, notepad++, Eclipse for frontend web application development. HTML- Elements, Tags, Components and Structures, Formatting. Web Application: List, Table, Form, Media, graphics, Semantic tags, Link HTML 5 APIs: Geolocation, Web Storage

Module2: Introducing CSS

Introduction to CSS: CSS syntax and embedding, CSS selector. CSS properties: Colour, Background, Text, Font, Position, List style, table, pseudo-element, Transformations, Animation, and Media Queries, grid, flex

Module3: Basic Introduction to Java Script

Java Script: Types of JS, JS console, Dialog box, Operators and Functions. Control Structures, Document Object Model (DOM), Objects and Nodes, Handling DOM using JavaScript, JavaScript Events, Animation, Cookies & session

Module4: Cloud Computing

Introduction to Cloud Computing, Types of Clouds, Cloud Fundamentals, deployment models. Introduction to Git and GitHub- Creating account in Platform, Deployment of Webpages over in GitHub.

Module5: Case Study

Individual Student should be able to create his own webpage or website, from the given Case studies below. And must submit the Website Screenshot to us on the Form given to them with the Webpage link of that deployed in the GitHub.

WEEK	Course	Hours
Week1	1. Introduction to Skills Build Program (Orientation and Registration in Portal) 2. Introduction to Coding and Cloud Computing (Explaining the Syllabus and Future Program Instruction)	2 hrs
Week2	1. Understanding of WEB. 2. Introduction to HTML- Fundamentals of Required tools and technologies like Visual Studio Code, notepad++, Eclipse for frontend web application development. 3. HTML- Elements, Tags, Components and Structures, Formatting	2 hrs
Week3	1. Web Application: List, Table, Form, Media, graphics, Semantic tags 2.Link HTML 5 APIs: Geolocation, Web Storage	2 hrs
Milestone -1	Students should share the Screen shot of their HTML page (Self- Paced)	6hrs
Week4	1. Introduction to CSS 2. CSS syntax and embedding, CSS selector	2 hrs
Week5	1. CSS properties: Colour, Background, Text, Font, Position, List style, table 2. CSS Properties: pseudo-element, Transformations, Animation, and Media Queries, grid, flex	2 hrs
Milestone -2	Students should share the Screen shot of their HTML & CSS page (Self- Paced)	6hrs
Week6	1.Java Script: Types of JS, JS console, Dialog box, Operators and Functions 2. Java Script: Control Structures, Document Object Model (DOM)	2hrs
Week7	1. Java Script: Objects and Nodes, Handling DOM using JavaScript, 2.Java Script: JavaScript Events, Animation, Cookies & session	2hrs
Week8	1. Introduction of Cloud Computing-(Git & GitHub) 2. Deploying the Web page in GIT & GitHub	2hrs
Milestone -3	Students should share the Screen shot of their Deployment Model (Self- Paced)	7hrs

A Computer System (PC/Laptop) with Windows/Linux and the following preferred requirements:

1. RAM size - 2GB or more,   
2. HDD size - 20 GB free disk space is required,   
3. High-speed internet connection (1 Mbps recommended),   
4. Compatibility with the following software(s):   
5. Notepad and Visual Studio Code Editor (https://code.visualstudio.com/)
6. A Web browser (Microsoft Edge or equivalent)   

1. Create a Personal Website using HTML, CSS & JS:

   A personal website can serve as a portfolio for all your work. The header is perfect for introducing yourself, showing contact information, and linking other works. Similarly, the footer can contain links to social media accounts and further information about you and your services.

2. Create a Tribute Web Pages on Mahatma Gandhi Or (any Role Model of Yours):

   A tribute page is a single-page website outlining the qualities of someone you consider an idol or role model. This project only requires fundamental HTML and CSS skills and is one of the simplest tasks you can use to showcase your abilities.

3. Create a College Website:

   In this website understand what are the necessary requirements which are important in any College website. Give responsive Buttons for About, Courses, Information, other essential things of a college.

4. Create a Responsive Survey Form:

   A survey form project will test your knowledge and proficiency in interactive controls. It covers the full range of UI/UX, including receiving and submitting user input. Furthermore, you will use HTML elements like radio buttons, text fields, checkboxes, and labels in this project.

5. Create a Landing Page:

   A landing page is another single-page website specially designed for marketing campaigns. It aims to attract customers to a company or generate leads. As such, a landing page is often the first point of contact with search engine-optimized websites.

6. Create any College Event Page for Your College:

   At first glance, an event page seems like any static webpage project on this list. However, its defining feature is a register button for visitors interested in attending the event. Another standout feature is links for the venue, itinerary, and speakers.

7. Create a Restaurant Website:

   A restaurant website must use the right combination of colours to make food and drinks look more appealing to customers. You can also make the website interactive to increase customer engagement. For example, hovering over a meal’s image can display a menu card containing the price and availability.

8. Create a Learning Platform for Kids:

   This Website should Consists of Large Multimedia Platform with images, Gifs, Audios, Videos. These should be Creative enough for the students to Come and learn their important things.

9. Create a Website on First Aid:

   In this website explain the medical needs and Precautions, Guidelines and Remedies of any First Aid. Explain the Steps and Images of the First Aid to be followed. Add any multimedia to support the First Aid.

10. Technical Documentation Page:

    This Website is all about share your knowledge and notes to the people around you. To open Documents and PDFs about the Technical Content and sharing with People.