Lect0 CSE326

Download as pptx, pdf, or txt
Download as pptx, pdf, or txt
You are on page 1of 30

CSE326

INTERNET
PROGRAMMING
LABORATORY
Lecture #0
The kick start session
Course Details
• Course Code:- CSE326
• LTP:- 0 0 3 [0 lectures, 3 practical's /week]
• Credits:- 2
Vision
To be a globally recognized school
through excellence in teaching, learning
and research for creating Computer
Science professionals, leaders and
entrepreneurs of future contributing to
society and industry for sustainable
growth.
Mission
• To build computational skills through hands-on and
practice-based learning with measurable outcomes.
• To establish a strong connect with industry for in-
demand technology driven curriculum.
• To build the infrastructure for meaningful research
around societal problems.
• To nurture future leaders through research-infused
education and lifelong learning.
• To create smart and ethical professionals and
entrepreneurs who are recognized globally
Revised Bloom’s Taxonomy
Course outcome
Through this course students should be able to:
CO1 :: identify HTML document structure, work with basic
elements, and utilize different types of tags to create well-
structured web pages.
CO2 :: apply text, create links, embed multimedia, and work
with images to enhance the visual and interactive aspects of
web pages.
CO3 :: cultivate CSS selectors, properties, and the box model
on different HTML elements to effectively construct a web
page
CO4 :: construct and style tables, implement form controls, and
apply CSS to enhance the layout and functionality of web
forms
Course outcome(cont.)
CO5 :: develop interactive web applications by incorporating
JavaScript code for variable manipulation, control statements,
looping, popup boxes, object manipulation, and form
validation.

CO6 :: manipulate and interact with web page elements


dynamically using JavaScript DOM methods and properties.
Program Outcomes
PO1
Engineering knowledge: Apply the knowledge of mathematics, science, engineering
fundamentals, and an engineering specialization to the solution of complex engineering
problems.

PO2
Problem analysis::Identify, formulate, research literature, and analyze complex
engineering problems reaching substantiated conclusions using first principles of
mathematics, natural sciences, and engineering sciences.

PO3
Design/development of solutions::Design solutions for complex engineering problems
and design system components or processes that meet the specified needs with
appropriate consideration for the public health and safety, and the cultural, societal, and
environmental considerations.

PO4
Conduct investigations of complex problems::Use research-based knowledge and
research methods including design of experiments, analysis and interpretation of data,
and synthesis of the information to provide valid conclusions.
Program Outcomes
PO5
Modern tool usage::Create, select, and apply appropriate techniques, resources, and
modern engineering and IT tools including prediction and modeling to complex
engineering activities with an understanding of the limitations.

PO6
The engineer and society::Apply reasoning informed by the contextual knowledge to
assess societal, health, safety, legal and cultural issues and the consequent
responsibilities relevant to the professional engineering practice.

PO7
Environment and sustainability::Understand the impact of the professional engineering
solutions in societal and environmental contexts, and demonstrate the knowledge of,
and need for sustainable development.

PO8
Ethics::Apply ethical principles and commit to professional ethics and responsibilities
and norms of the engineering practice.

PO9
Individual and team work::Function effectively as an individual, and as a member or
leader in diverse teams, and in multidisciplinary settings.
Program Outcomes
PO10
Communication::Communicate effectively on complex engineering activities with the
engineering community and with society at large, such as, being able to comprehend and
write effective reports and design documentation, make effective presentations, and give
and receive clear instructions.

PO11
Project management and finance::Demonstrate knowledge and understanding of the
engineering, management principles and apply the same to one’s own work, as a member
or a leader in a team, manage projects efficiently in respective disciplines and
multidisciplinary environments after consideration of economic and financial factors.

PO12
Life-long learning::Recognize the need for, and have the preparation and ability to engage
in independent and life-long learning in the broadest context of technological change.
Course contents
Unit I
Exposure To HTML : HTML document
structure, Working with HTML basic elements
like title, head, body, Working with Root and
Metadata, Horizontal Rules and line breaks
and paragraph, working with citation,
quotation, definitions and comments, Types of
Tags in HTML
Course contents
Unit II
Working with Text, Links, Images and Tables in HTML :
Formatting text with HTML physical style elements,
Formatting text with HTML logical style elements, Arranging
text, Exploring the Hyperlinks and linking to a mail system,
Exploring the link relations, Working with images in a web
page, Displaying Plain, Bold, Italic, Small, Subscripted,
Superscripted text, Displaying Program Code, Program
Output, Keyboard text, Emphasizing text, Defining New
Terms, Short and long Quotations, Creating Links with anchor
tag.
Course contents
Unit III
Introduction to Cascading Style Sheets : CSS rules like
link and style, CSS properties like text controlling and
text formatting, CSS selectors like type, id, class,
Introduction To CSS and types of CSS, Inline CSS,
Internal CSS, External CSS, CSS Box Model- Padding,
Margin, Border, Div and Span Tag in CSS, Working
with background Images.
Course contents
Unit IV
Working with Tables : Working With Tables-Colspan and
Rowspan, applying css on tables, creating hoverable tables
Working with Forms : Working with Forms- action
attribute, get and post methods, Form Elements
and Controls Like Text Inputs, TextArea, Buttons,
CheckBoxes, Dropdown Boxes, Radio Buttons,
Select and File Select, applying css on all controls of forms
CSS Grids and Webpage Layouts : Grid introduction,
Grid container, Grid Item, Creating different layouts for
webpage
Course contents
Unit V
JavaScript Application Development : Incorporating
JavaScript in the HEAD and BODY element, Using an
External JavaScript file, Using variables and operators,
Using control statements such as
if...else, switch, break and continue, Using looping
statements such as while, do...while, for, Using Popup
boxes such as Alert, Confirm, and Prompt, Working with
JavaScript Objects,Properties and Methods.
JavaScript Functions,Events and Validation : Working
with Functions-Using function arguments and return
statement, Working with JavaScript Events like Form
Based, Keyboard Based and Mouse Based, JavaScript
Form Validation.
Course contents
Unit VI

Javascript DOM : DOM introduction, DOM methods,


DOM document, DOM elements, DOM HTML, DOM
CSS, DOM Events
Complete evaluation criteria for the course
CA1: 30 marks (Visual Implementation Assessment -VIA)
HTML Skill Assessment: Understanding of HTML structure and syntax,
knowledge of common HTML tags, proficiency in using links , knowledge of
elements and attributes.
CA2: 30 marks (Visual Implementation Assessment –VIA)
CSS Skills Assessment: Understanding of CSS syntax, selectors (e.g., class, id,
element), box model (margin, padding, border), positioning (static, relative,
absolute), responsive design principles (media queries), CSS3 features
(animations, transitions, flexbox, grid).

CA3: 30 marks (Project)


Project in HTML, CSS, JS Skills Assessment: Proficiency in creating HTML
structure, applying CSS styling, and implementing JavaScript for interactive web
projects.
CA 3 – Project Rubrics

• Functionality and Deployment(6),


• User Interface(6),
• Novelty/Uniqueness(6),
• Documentation(6),
• Presentation(6),
Why Star Course?
Industry Demand:
•High: Essential for front-end web development roles across
industries.
•Skills Needed: Proficiency in creating and styling web pages using
HTML5, CSS3, and JavaScript for interactive features.
Product-Based Companies:
•Skills Sought: Ability to create responsive and visually appealing
web applications that enhance user experience.
Service-Based Companies:
•Demand: Significant, especially in client-facing projects and
website development services.
Government Jobs:
•Relevance: Increasingly important in digital government initiatives
and web-based services.
Execution Strategies
Execution Strategies
Execution Strategies
Execution Strategies
Open Education Resources(OER)
Unit mapped Broad topic Source Type Source Title *%age Source URL
mapping
(approx)
Unit 1 Exposure To HTML Reading INTERNET 100% https://www.w3schools.com/html/
Material PROGRAMMING html_head.asp
LABORATORY
Unit 2 Working with Text, Reading INTERNET 100% https://www.w3schools.com/html/
Links, Images and Material PROGRAMMING html_formatting.asp
Tables in HTML LABORATORY

Unit 3 Cascading Style Reading INTERNET 100% https://www.w3schools.com/html/


Sheets Material PROGRAMMING html_css.asp
LABORATORY
Unit 4 Working with Tables Reading INTERNET 100% https://www.w3schools.com/html/
Material PROGRAMMING html_table_colspan_rowspan.asp
Working with forms, LABORATORY
CSS Grids and
Webpage Layouts

Unit 5 JavaScript Reading INTERNET 100% https://www.w3schools.com/jsref/jsref_


Application Material PROGRAMMING if.asp
Development , LABORATORY
JavaScript https://www.w3schools.com/js/
Functions,Events and js_events.asp
Validation

Unit 6 Javascript DOM Reading INTERNET 100% https://www.w3schools.com/js/


Material PROGRAMMING js_htmldom.asp
Skill Attainment
• Technical Skills:
• HTML
• CSS
• JS
• Soft Skills:
• Creativity, Time management, Adaptability.
• Problem-solving, Continuous Learning.
Text & Reference Books
Text Books:

• MASTERING HTML, CSS & JAVA SCRIPT WEB


PUBLISHING by LAURA LE MAY, RAFE COLBURN,
JENNIFER KYRNIN, BPB PUBLICATIONS

References:
• HTML 5 BLACK BOOK by DT EDITORIAL SERVICES,
DREAMTECH PRESS.
Softwares
Standard Editor- VS-Code.

Online Editors for Practice:


1. CodeSandBox
2. CodePen.
Tech Update : Most Popular Programming
Languages in 2023(Stack Overflow Survey)
The Stack Overflow Developer Survey 2023 collects data from developers worldwide to
understand their experiences, preferences, and challenges. It covers a wide range of
topics, including the most popular programming languages, development environments,
salary insights, and education levels.
Link to Read: https://survey.stackoverflow.co/2023/

Key takeaways:
•JavaScript: Essential for modern web development.
•HTML/CSS: Crucial for beginners and web developers.
•Python: Versatile and beginner-friendly, ideal for various applications including data
science and web development.
•SQL: Important for database management, highly used by professionals.
•TypeScript: Growing in popularity, particularly for larger web projects.
Understanding these trends can help you choose the right languages to learn, enhancing
your skills and employability in the tech industry
Tech Update : Most Popular Programming
Languages in 2023
Key Points from the Stack Overflow
Developer Survey 2023:
•JavaScript: Most used programming
language for 11 years (63.61% usage).
•Python: Third most-used overall; top choice
for beginners.
•HTML/CSS: Along with JavaScript, very
popular among new coders.
•SQL: More frequently used by professionals
than beginners.
•Trends: Professionals use SQL more (52%
vs. 45%), students prefer Python (59% vs.
37%).
Next Class: Introduction HTML

You might also like