CST8285
WEB PROGRAMMING
WEEK#1
COURSE OVERVIEW &
INTRODUCTION
BY
HALA OWN, Ph.D.
Lesson Agenda
❑ Course Outline And Section Information(BrightSpace)
❑ Introduction
❑ What Is The Internet
❑ Client-server Computing Model
❑ Web Technology Terminologies
❑ Webserver, Application, Browser
❑ Uniform Resource Locator (URL)
❑ Hypertext Transport Protocol (HTTP)
2
About The Course
Software
• XAMPP
• Visual Studio Code or Notepad++
Textbook:
• Learning PHP, MySQL and JavaScript: A Step-by-Step Guide to Creating Dynamic
Websites (ISBN 9781492093824)
Other recourses
• Lecture Materials
• [Link]
• MDN Web Docs (Mozilla) – High-quality documentation for HTML, CSS, and JavaScript
3
Contacting your Professor
Professor: Hala Own
Email: ownh@[Link]
•Expect email reply is within Two business days. Therefore you need plan your
emails accordingly
•Include in your email:
• Your name
• Course name and code
• Section No.
4
Evaluation Breakdown
Assessment Value
Lab Activities (5 labs): 20%
• Lab1:4%
• Lab2:4%
• Lab3:4%
• Lab4:4%
• Lab5:4%
Assignment(s) 30%
• Assignment 1 Weeks 3 – 7 • 10%
• Assignment 2 Weeks 9 – 12 • 20%
Total Practical 50%
Participation 10%
Midterm Exam 15%
Final Exam 25%
Total Theory 50%
5
Lab Activities(6 Labs)
Lab 1 4%
Lab 2 4%
Lab 3 4%
Lab 4 4%
Lab 5 4%
Individual WORK
6
Assignments
Assignment1 – HTML , 10% Week 2- week 7: Individual Work
CSS Individual work
Assignment 2– HTML- 20% Week 9- week 12: Group Work
Individual work
CSS-JavaScript -PHP &
MySQL
❖Lab Assignment 2 is group work. Please stick with the following guidelines
1. Group Size: Each group for Assignment 2 should consist of a maximum of three
members.
2. Lab Section Requirement: All members of a group must be enrolled in the same
lab section.
7
Midterm Exam Wednesday, February 21, 11:00 am – 1:00 pm
Time: Week 7 (one hour) make up lecture TBA
Material: HTML, CSS &JavaScript
Weight: 15%
Closed book
On paper
Bring your own
Cheat sheet
8
Final Exam
Time: Week 15
Material: introduction, HTML, CSS, JavaScript & PHP
Weight: 25%
Closed book
On paper
Bring your own Cheat sheet
Participation
▪ Each week, participation will be required during or after the lecture.
▪ The content for participation will be based on the topics covered that week.
▪ On Brightspace
▪ Open book (one attempt)
Lecture Rules
• Feel free to ask questions at anytime at all. Don’t be shy, you’re not the only
one who will have questions.
• Most topics covered in the lecture slides will be demonstrated. Feel
free to follow along with the demonstrations with your own computers.
• Note-Taking
Lab Rules
• Attendance is mandatory for the weeks that have lab activities
assigned or require you to demo your Lab/assignment.
• Working with others is encouraged.
• Explaining concepts and your way of thinking is allowed. Copying someone’s
answers is not.
• Reference everything you get from elsewhere
Important Information
• You must get at least 50% in practical (labs and Assignments) and at least
50% in theory (Quizzes, midterm, and final exam) to pass the course. Simply
getting 50% overall without meeting the 50% min in each theory and
practical is not sufficient to pass the course.
• Labs and Lab Assignments must be demonstrated according to their scheduled
weeks (stated in the CSI). Missed Demo on the specified date would result in
zero mark.
Important Information…
• Labs and Lab Assignments demo will be done During your lab session.
• Lab professor may ask you to do something else to verify that you have done the
lab by yourself.
• You may miss marks if you fail to answer questions about your work.
• Submissions has always a due date on Sunday’s midnight.
• Late Labs and Assignments will be penalized 10% for each day up to four days.
• No late submission for Assignment 2.
Course Objectives
❑ Design and implement a professional website
❑ Build the skeleton of web pages using HTML
❑ Make stylistic decisions with CSS
❑ Create interactive websites with JavaScript PHP
❑ Use PHP for server programming
❑ Understand the client-server programming
model and apply this to your designs
15 Image source: [Link]
Course Contents
Topic #Weeks
Introduction ,Course Overview 1 week
HTML 1.5 weeks
CSS 1.5 weeks
JavaScript 3 weeks
PHP 4 weeks
Midterm 1 week
Introduction
Basic Terminology
17
What Is The Internet?
• The Internet is collection of computer networks that use a protocol to
exchange data. It includes other services such as email, chat, online games, etc.
Is the World Wide Web (WWW) and the internet the same?
18 Image source: [Link]
Internet versus World Wide Web
• The Web is the collection of web
sites and pages around the world
linking to each other.
• The internet is hardware plus
protocols while the world wide web
is software plus protocols
Source: [Link]
Web Servers
Web server a computer that responds to HTTP requests.
In our course we will rely on the WAMP software ,which refers to
• W indows operating system,
• A pache web server,
• M ySQL database, and
• P HP scripting language
20
Web Browsers
• Interpreting the entire HTML markup together with the image for display within the
browser window is called rendering the webpage.
• Search engine integration
• Implemented differently for each browser (Firefox, Chrome, Safari, Explorer, and
Opera)
21
Transmission Control Protocol (TCP/IP)
• Protocol (rules) to govern how data packets are transferred over the
internet from one machine to another.
• Implemented in every operating system
22
TCP/IP Application layer Protocols
• HTTP. The Hypertext Transfer Protocol is used for web communication.
• SSH. The Secure Shell Protocol allows remote command-line connections to servers.
• FTP. The File Transfer Protocol is used for transferring files between computers.
• POP/IMAP/SMTP. Email-related protocols for transferring and storing email.
• DNS. The Domain Name System protocol used for resolving domain names to IP
addresses.
23
Client- Server Model
The www uses a client-server model
24
Hypertext Transfer Protocol (HTTP/HTTPS)
HTTP client-server protocol that allows clients to request web pages from web servers.
HTTPS (Hypertext Transfer Protocol Secure)
25
HTTP Request/Response Message Format
26
HTTP Status Codes
HTTP error is a response code in reply of the request sent by the browser when
the webserver fails to serve the requested data.
Number Meaning
200 OK
page has moved (permanently or
301-303
temporarily)
403 you are forbidden to access this page
404 page not found
500 internal server error
27
Internet Protocol (IP)
A computer unique address on the internet
• 32-bit for IPv4
• 128-bit for IPv6
28 Image Source: [Link]
Domain Names System(DNS)
• A Domain Name is a name for an IP address
• Map written names to IP addresses
29 Image Source: [Link]
Uniform Resource Locator (URL)
Is the location of a web resource on the web
2023
30
Port Number
serving endpoint communication between two computers.
Image –source: [Link]
31
Table Source: [Link]
World Wide Web Consortium (W3C)
• International community that develops open standards to ensure
the long-term growth of the Web.
• Writes HTM, CSS, and JavaScript standards which specify how
the code should function.
• is it important to validate your code
32
Web Applications, Why?
• Accessibility
• Platform independence
• Automatic updates
• Collaborative capabilities
• Scalability
33
Participation(Week 1)
34
Questions ???
35