Section I. Introduction to WWW : Fundamentals of Web, HTTP protocol, Working of HTTP protocol, Request methods and their message format of HTTP

Transcription

1 Course Title Course Code Internet Technology CE511 Lecture : 03 Course Credit Practical : 02 Tutorial : 00 Course Learning Outcomes Total : 05 On the completion of the course, students will be able: To design web pages using HTML and HTML5. To design dynamic and interactive web pages using dynamic HTML. To illustrate storing and retrieving data to and from XML document. To create their own XML document structure. To develop rich user interface using AJAX. Tocreate dynamic web application using PHP and MySQL database. To understand the fundamental concept of Google AdSense and Analytics. To create scenario using WordPress and Joomla. Detailed Syllabus Sr. No. 1 2 Name of chapter & details Section I Introduction to WWW : Fundamentals of Web, HTTP protocol, Working of HTTP protocol, Request methods and their message format of HTTP Introduction to HTML : Applications of HTML, HTML Document structure, Basic HTML tags: Headers, links, list, table, image, HTML forms. Introduction to XHTML: Need for XHTML, Meta tags, frames and frame sets. Introduction to HTML5: Difference between HTML and HTML5, Features of HTML5, Basic tags like semantic tags, HTML5 Web forms, validations, Offline website, location API. Hours Allotted

2 Style sheets : Introduction to CSS, Need for CSS, Types of CSS: Inline, Internal and External; CSS Box Model: margins, border, padding; Positioning using CSS, CSS3 and Responsive Web JavaScript: Introduction to Client side scripting, Need for JavaScript, Sample JavaScriptexamples, Document Object Model, Browser Object Model, Event handling in JavaScript. DHTML: Creating Dynamic HTML using JavaScript and CSS. Section II XML: Introduction to XML, application of XML, writing simple XML, XML key components, Well-formed vs Valid XML, XML namespaces, DTD and XML Schemas, XSLT. AJAX: Introduction to AJAX, Application of AJAX, XMLHttpRequest object, ActiveX object, Writing application powered by Ajax. PHP : Starting to script on server side, Arrays, function and forms, Advance PHP, Handling request and generating response, Session handling. Databases : Creating database, Connecting with database server, Selectionof a database, CRUD operation on database, Advance queries on database, phpmyadmin. Web development tools: Exploring web development tools: WordPress, Joomla; Google plugins: Global search, analytics, AdSense. Web Hosting: Hosting website on a server, Migrating database Instructional Method and Pedagogy 2

3 Conduction of the lecture will include effective use of multimedia projector. During the lecture topic will be covered by doing hands on programming. After completion of each unit the assignment will be provided which will be evaluated on time. Tutorials will be provided periodically for each modeling that has to be practiced during the lab lesions under continues monitoring. Edmodo is used as learning management systems for engaging students in off time. Active learning methodologies will be introduced like problem based, quiz etc, according to the topic requirement. Students will be assigned a mini project to identify and apply the concepts learned throughout the course. Text book: Kogent Learning Solutions Inc., Web Technologies Black Book, Dreamtech Press, Reference Books: P.J.Deitel, H.M.Deitel, Internet and World Wide Web: How to program, Third Edition, Pearson publication. U. K. Roy,Web Technologies, First Edition, Oxford Higher Education Additional Resources NPTEL Video Lecturesof Internet Technology by Indranil Sengupta, IIT Kharagpur [Available at: 3

4 Tutorial List Tutorial 1 1. Develop HTML page to demonstrate commenting code. 2. Integrate all text formatting an HTML document which include heading My Favorite Teacher. And write one paragraph about that. Use bold and italic font. 3. Design an HTML document for a web page of your favorite national Leader. Design the page with an attractive background color, text color and background image. 4. Demonstrate the use of different attributes of HR tag for Horizontal line. 5. Develop HTML page which display computer code for i = 1 to 10 print i next i Tutorial 2 1. Design an HTML page which contains 3 images at LEFT, RIGHT and BOTTOM. 2. Create an HTML page to display your contact information. 3. Develop an HTML page which contain following image. By clicking on that image, it display description about image on same page. Tutorial 3 1. Construct an HTML page which include Table of Content Topic 1: History of C Topic 2: Feature of C Language Topic 3: Structure of C program Topic 4: Operators Topic 5: Array By clicking on link, it navigate to respective topic within the same page. 4

5 2. Design an HTML page as given below List of Subjects 1. Computer Engineering Department a..net Technology b. Design Analysis and Algorithm c. Advance Computer Architecture 2. Electrical Engineering Department Electrical Machine Power Electronics Micro Controller 3. Information Technology I..Net Technology II. Design Analysis and Algorithm III. Project Management Practice. 3. Create an HTML page as given below Nested List: Coffee Tea Black tea o Green tea Milk 4. Develop an HTML page as given below Details Year-I Semester I a. FCP b. Maths - I c. CS d. EG e. ECE Semester II a. Maths - II b. EME c. Physics d. FOEE e. ES 5

6 Tutorial - 4 Same way display details of all the semester. 1. Design an HTML page to display following table Name Telephone XYZ Develop an HTML page which display following table Name Contact Number XYZ Create an HTML page which display following table Project Details Goup ID CE_1 Student Name Project Name Project Guide ABC Guide1 Guide 2 XYZ PQR ID of student Insert at least five records. 4. Develop an HTML page which contain time table of your class using TABLE Tag. Also apply ROWSPAN, COLSPAN, CELL SPACING and CELL PADDING. Tutorial 5 1. Create anhtml page for the registration form like you see while creating an account in Gmail. 2. Develop a complete web page using Frames and Frameset which gives the Information about RK University. 3. Develop an HTML page which looks like below image using Frameset and Frame tags. 6

7 4. Rectify the errors in the following code and redesign it. html> <body> <p text-color: red > This is a form which is in red color. </p> <form id= f1 > <input type="month" name="bdaymonth"> <input type="submit" value="send"> <input type="textarea" value="text"> <input type="radio" value="a1">a1<br> <input type="radio" name="aaa" value="a2">a2 </form> <p><b>note:</b> </body> </html> Tutorial 6 1. Integrate CSS rule that contains a background image halfway down the page, filling the horizontally in your HTML page. The image should remain static when the user scrolls up or down. 7

8 2. Create external CSS file external.css with a. change the color of all text b. containing attribute class green c. Shift them 25 pixel down from top for all paragraph. Use external.css file to create following image. 3. Add embedded styles sheet to HTML document that contain all border properties using id selector. 4. Develop CSS rule and integrate with HTML to divide document into multiple section as given below. Header Content Sidebar Footer 5. Integrate CSS rule with WordPress open source tool for creating menu and sidebar. Tutorial-7 1. Integrate JavaScript with HTML for display your information same as in I-card. 2. Writea JavaScript code which display button on clicking that button it displays Good day if time is less than Create a JavaScript that takes two numbers from user using prompt box and display addition in alert box. 4. Create a HTML page with JavaScript, which takes an integer Number as input from the user and alert user whether the number is even or odd. 5. Write a JavaScript program to print first N odd numbers divisible by 7. 8

9 Tutorial-8 1. Write a JavaScript that alerts your result either PASS or FAIL based on subject marks entered by user. 2. Construct an array of 10 non-negative integers. Use this array to find smallest no among them. 3. Create UDF that takes an integer values and alerts whether the no is Armstrong or not. 4. Define UDF that display system date on button click. 5. Integrate JavaScript code for Gmail signup form validation. Tutorial-9 1. Code the XML for food menu and also display the food menu. 2. Design the DTD of above given code declaring attributes like ATTLIST, REQUIRED, IMPLIED and also form the tree structure of it. 3. Develop a XML Schema for above mentioned food tree structure. 4. Write down the code of any three XML Applications CML, OSD and VoiceXML. Tutorial Construct a XSL for above food tree structure. 2. Design a code to display XML file data into HTML table using XSLT. 3. Create a <xsl: choose> element for above tree structure. 4. Create a <xsl: if> element for above tree structure. 5. Create a <xsl: sort> element for above tree structure. Tutorial Analyze and list the different types of applications in AJAX. 2. Demonstrate the difference in AJAX and normal form of HTML request and response model? Tutorial Code an AJAX application to display information return from a server where the button should call a function named loadxmldoc() when it is clicked. 9

10 2. Write an application to create XMLHttpRequest object for above definition. 3. Write an AJAX application to display server time using GET method and POST method Tutorial Develop PHP Script which take Input as one integer number and Test it is prime or not. 2. Construct web page which include student registration form, fill the data in form and store data in student table using POST method. 3. Illustrate PHP script to list all records of student table in tabular format. 4. Design PHP Script to delete all rows from student table whose roll numbers are between 1 and 3 Tutorial Apply PHP script to modify update student mobile number take user input. 2. Illustrate a PHP script to update student information based on student Roll No. Provided by user. Tutorial Install Wordpress and create sample website. Also apply a theme and modify it as per the requirement. Tutorial Install Joomla and create sample website. Also apply a theme and modify it as per the requirement. 10