COURSE DESCRIPTION

NAME OF INSTITUTION Lahore Garrison University
PROGRAM (S) TO BE EVALUATED Computer Science , Fall 2022
Course Description : In this course you will learn to develop interactive and responsive websites. It includes HTML5, CSS3, J-Query and Bootstrap for creating beautiful web pages. No prior knowledge of HTML or web design is required. Throughout the course students will get the info need to plan and design effective web pages using .NET MVC Core 5. Come away knowing how to implement web pages by writing HTML5 and CSS3. And discover ways to enhance web pages with the use of page layout techniques, text formatting, graphics, and images. BootStrap will use for developing responsive and elegant websites and perform CRUD operation using Entity Framework Core and SQL Server 2019. Also implement the N-Tier architecture in .NET MVC Core 5 using IDE Visual Studio 2019.
Course Code CSC394
Course Title Web Design and Development
Credit Hours 3
Prerequisites by Course(s) and Topics Fundamentals of programming,Object Oriented Programming, Database
Assessment Instruments with Weights (homework, quizzes, midterms, final, programming assignments, lab work, etc.) SESSIONAL (Quizzes, Assignments, Presentations) =25 %
Midterm Exam =25 %
Final Exam = 50%
Course Coordinator Ahsan Ali Haroon
URL (if any) https://www.w3schools.com/ https://jquery.com/ https://getbootstrap.com/ https://www.entityframeworktutorial.net/what-is-entityframework.aspx https://learn.microsoft.com/en-us/aspnet/core/tutorials/first-mvc-app/start-mvc?view=aspnetcore-5.0&tabs=visual-studio
Current Catalog Description
Textbook (or Laboratory Manual for Laboratory Courses) Pro HTML5 Programming Peter Lubbers , Brian Albers , Frank Salim ASP.NET-Core-5-for-Beginners Publish by: Packt
Reference Material https://www.w3schools.com/ https://jquery.com/ https://getbootstrap.com/ https://www.entityframeworktutorial.net/what-is-entityframework.aspx https://learn.microsoft.com/en-us/aspnet/core/tutorials/first-mvc-app/start-mvc?view=aspnetcore-5.0&tabs=visual-studio https://www.microsoft.com/en-us/sql-server/sql-server-downloads https://visualstudio.microsoft.com/vs/older-downloads/ https://visualstudio.microsoft.com/downloads/
Course Goals This course is to provide a combined applied and theoretical background in Web Development & Design to improve students’ learning outcomes: 1. Recognize the principles of effective web page. 2. Learn Html5, CSS3, JavaScript, jQuery and Bootstrap for Graphical user interface. 3. Practice a web application in .Net MVC Core 5 using C#, Entity Framework Core, SQL Server and N-Tier Architecture. 4. Implement web concepts.
Course Learning Outcomes (CLOs):
At the end of the course the students will be able to:DomainBT Level*
Recognize the principles of effective web page. Cognitive 2
Learn Html5, CSS3, JavaScript, jQuery and Bootstrap for Graphical user interface. Cognitive 2
Practice a web application in .Net MVC Core 5 using C#, Entity Framework Core, SQL Server and N-Tier Architecture. Cognitive 4
Implement web concepts. Psychomotor 5
* BT= Bloom’s Taxonomy, C=Cognitive domain, P=Psychomotor domain, A= Affective domain
Topics Covered in the Course, with Number of Lectures on Each Topic (assume 15-week instruction and one-hour lectures)
WeekLectureTopics Covered
Week 1 1 Introduction to Course, Description, Course Outline, Objectives Goals, Scope and Applications of web development.
2 Internet concepts and History, Addressing schemes (IP, DNS), Protocols, URL AND URI, Web Client/Web Server. Installation of Visual Studio & SQL Server
Week 2 3 Introduction and History of WWW. Communication Networks. Web Design Tools and Technologies, Types of websites (Static and Dynamic), Web Design and Development planning System.
4 Web Development Technologies: HTML, XHTML, HTML5, XML. TAGS with Html and HTML5 Syntax implementation.
Week 3 5 Common Tags: html, title, body, header, footer, article, aside, nav. Formatting Tags: P, B, I, U, FONT, BR, HR, Center
6 Structural Tags, Embedded Content Tags, Meta Tags, Form Tags, Table Tags, Scripting Tags Implementation of tags using Html 5. Table based layout VS Div. based layout. HTML and HTML5 with tags Image Tags, Image tag with links. Form Tags, Frame and Frameset. Text, Radio, Checkbox, Select, Button. Forms and Table Implementation.
Week 4 7 Image Tags, Image tag with links. Form Tags, Frame and Frameset. Text, Radio, Checkbox, Select, Button. Forms and Table Implementation.
8 Html with Internal And Inline Styling. HTML selectors (Class and Id) with implementation. Page layout with Box model using div. Web page design implementation.
Week 5 9 CSS Formatting: Text Formatting, Links, Block Elements, Inline Elements, Display Property, Selector Pseudo code class, Selector Pseudo code element, CSS Attributes Float, Positions. Web Implementations using HTML 5 Tags and CSS Concept of media queries and view port for Responsive Websites
10 Concepts of Frame works- Bootstrap - grid based system. Implementation of Web page using Bootstrap. PSD to Bootstrap Conversion Project: Static Web Site PSD to Bootstrap using HTML5, CSS, CSS3 Project Implementation using PSD (Slicing, Cropping, Color Picker, Text Formatting) to HTML/BOOTSTRAP
Week 6 11 Introduction of Client and Server Scripting. Introduction to Java Script, Elements of Java Script, Variables Data Types. Operators, Control Statements, Functions.
12 Dialogs: Performing I/O, Objects in Java Script such as Date, Document Object Model: Document, Form, Controls, Events, Alerts, Prompts Box and implementation
Week 7 13 Rivision
14 Midterm
Week 8 1 hours Mid Term
Week 9 15 Introduction to JQuery. Functions of JQuery. Implementation using functions.
16 JQuery Functions with form validations. Regular expressions. Web page Development using JQuery. Implementation
Week 10 17 Introduction to SQL Server. Working with Tables, Schemas. Columns & Built-In Data Types.
18 Working with Primary Keys, Foreign Keys & Identity Column.Introduction to T-SQL & Writing Basic.
Week 11 19 Where clause Select Statements. Normalizations.
20 Joins and Stored Procedure Introduction using ecommerce database. Overview of Microsoft .NET Platform. Fundamentals of C# Language.
Week 12 21 C# Introduction, Object Oriented Class Libraries Development
22 Developing Web Applications using Visual Studio 2019 & 2022. Admin theme convert into MVC.
Week 13 23 Create web pages and user registration form using HTML, CSS and Bootstrap.
24 User registration form Validating using HTML Attributes, JavaScript & jQuery
Week 14 25 Creating & using Layout Views, Partial Views & HTML Helpers Create user registration table in sql server 2019 Database connectivity using Database-First approach Database Programming using Entity Framework LINQ queries using Entity Framework approach
26 Login module. Authentication and Authorization. CRUD of user registration form and product table using entity framework
Week 15 27 Data submit on server side using ajax. Concepts of session and cookies using login module.
28 Model Validation Using Data Annotations In .NET MVC CORE 5.
Week 16 29 Fetch data from database and show in frontend theme in mvc. Show category, sub category, Products
30 Add to cart using session. Mange order table and order details.
Week 17 2 hours Final Term
Laboratory Projects/Experiments Done in the Course Semester Project in .Net MVC Core 5 using Microsoft Visual Studio 2019, SQL Server 2019, Entity Framework Core.
Programming Assignments Done in the Course Yes
Instructor Name Ahsan Ali Haroon
Instructor Signature
Date