Download presentation
Presentation is loading. Please wait.
1
Secure Web Programming
Vahid K.Akram
2
Course Contents HTTP HTML 5 & CSS 3 AJAX JavaScript & JSON & jQuery
WebSocket & Socket.IO Node.js AngularJS Entity Framework & MVC Security HTML 5 & CSS 3 JavaScript & JSON & jQuery Bootstrap and Web Templates Document Object Model (DOM) Introduction to SQL and Databases ASP.NET & C# (Web From) Web Services
3
FRONT END vs BACK END
4
FRONT END vs BACK END Back End Front End
Codes run on Client (Your) machine (Computer, Tablet, Mobile Phone,…) All browsers (Firefox, Chrome,…) execute Front Ends Codes Have many security restrictions (Fortunately) Usually deal with page design, graphics, user interaction and client side programs HTML, CSS, JavaScript, AngularJS, jQuery, FLASH, Back End Codes run on server machine Dynamically generate contents of web pages Deal with databases, files, … C#, ASP.NET, PHP, JSP, Web Services, Node.js, SQL, JAVA, PYTHON
5
FRONT END vs BACK END Bridge Between Front End and Back End JSON XML
MVC Web Forms AJAX
6
Response: Webpage files
Accessing a Website Request: GET Response: Webpage files HTTP (hyper text transfer protocol) Client (You) Server (Google)
7
Accessing a Website Webpage files HTML CSS JavaScript
Assets (image, sound, …)
8
HTML Hypertext Markup Language
The language web browser uses to describe the content and structure on web pages
9
HTML HTML = Nested Boxes
10
HTML HTML = Nested Boxes
11
HTML HTML = Nested Boxes
12
HTML HTML = Nested Boxes
13
HTML HTML = Nested Boxes
14
HTML HTML = Nested Boxes
15
HTML
16
HTML
17
HTML
18
HTML
19
HTML
20
HTML
21
Basic HTML Elements <html> <head> <body>
<h1>, <h2>, <h3>, … <p> <div> <a> <img>
22
HTML Attributes <a href="link here"> (Opening tag)
Content goes here </a> (Closing tag) <a href="home.html">Link to home!</a>
23
HTML Attributes Some elements have no closing tags
<img src="pusheen.gif"></img> app/ hello.html images/ pusheen.gif <img src="images/pusheen.gif">
24
HTML Lists <ol> Ordered List (1, 2, 3…)
<ul> Unordered List (bullets) <li> List Item
25
HTML DIV <div> Block Section in Document
26
HTML A way to learn HTML, CSS and JavaScript: W3Schools.Com
Similar presentations
