COURSE DESCRIPTION

NAME OF INSTITUTION Lahore Garrison University
PROGRAM (S) TO BE EVALUATED Computer Science , Spring 2023
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 Object Oriented Programming
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. Describe 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. Integrate web concepts by creating a dynamic website.
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. C 2
Describe Html5, CSS3, JavaScript, jQuery and Bootstrap for Graphical user interface. C 2
Practice a web application in .Net MVC Core 5 using C#, Entity Framework Core, SQL Server and N-Tier Architecture. P 3
Integrate web concepts by creating a dynamic website P 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
10 Float, Positions. Web Implementations using HTML 5 Tags and CSS Concept of media queries and view port for Responsive Websites
Week 6 11 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
12 Introduction of Client and Server Scripting. Introduction to Java Script, Elements of Java Script.
Week 7 13 Elements of Java Script, Variables Data Types. Operators, Control Statements, Functions.
14 Dialogs: Performing I/O, Objects in Java Script such as Date, Document Object Model: Document, Form, Controls, Events, Alerts, Prompts Box and implementation
Week 8 1 hours Mid Term
Week 9 15 Introduction to SQL Server. Working with Tables, Schemas. Columns & Built-In Data Types.
16 Working with Primary Keys, Foreign Keys & Identity Column. Introduction to T-SQL & Writing Basic.
Week 10 17 Where clause Select Statements. Normalizations.
18 Joins and Stored Procedure Introduction using ecommerce database. Overview of Microsoft .NET Platform. Fundamentals of C# Language.
Week 11 19 C# Introduction, Object Oriented Class Libraries Development
20 Developing Web Applications using Visual Studio 2019 & 2022. Admin theme convert into MVC.
Week 12 21 Create web pages and user registration form using HTML, CSS and Bootstrap.
22 User registration form Validating using HTML Attributes, JavaScript & jQuery
Week 13 23 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
24 Login module. Authentication and Authorization. CRUD of user registration form and product table using entity framework
Week 14 25 Data submit on server side using AJAX. Concepts of session and cookies using login module.
26 Model Validation Using Data Annotations In .NET MVC CORE 5.
Week 15 27 Fetch data from database and show in frontend theme in MVC. Show category, sub category, Products
28 Add to cart using session. Mange order table and order details.
Week 16 29 Testing and Debugging Creating Reports Configuration & Deployment of ASP.NET MVC Applications,
30 Concepts of Hosting, Domain, Server, File Zilla. Website upload on File manager / Cpanel Data base Creation on C panel Upload Site using Filemanager
Week 17 2 hours Final Term
Laboratory Projects/Experiments Done in the Course
Programming Assignments Done in the Course
Instructor Name Ahsan Ali Haroon
Instructor Signature
Date