Scribd
Upload
18 views5 pages

ADIT-1105 - Front End Development Course Outline

Uploaded by

alihassan001567
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
18 views5 pages

ADIT-1105 - Front End Development Course Outline

Uploaded by

alihassan001567
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 5

Tentative Weekly Course Plan

Course Title Fundamental of Front-End Development


Course Code ADIT-1105 Credit Hour 4 (3+1)

Course Introduction

This course starts with describing front end development on web. Build foundations on Html, CSS
and Front-End Framework, and cover advance topics based on current trends, of Html5, CSS3,
Responsive Design and some of its frameworks like Bootstrap. Focus is to learn while solving
different problems and doing many real life case studies.

Learning Outcomes

Enable Course attendant to gain Web Front End Development knowledge and experience with real
life case studies
 Understanding Web Development process
 Able to develop Web site front end using HTML/5, CSS/3.
 Understanding of Advance topics, and current trends in Web Front end development.

Topic Outline/Syllabus
Sessions Topic Description
1 Week 1 Introduction to course , outcomes Aims objective.
Web History: Past and Present, URL, URL
hierarchy, HTTP, HTTP request, HTTPS,
Web Server, Web Services, Web Agents,
Email, SMTP, POP3, IMAP, FTP, Domain,
Hosting.

2 Week 2 Introduction to HTML, CSS,


Basic principles involved in developing a
web site
Planning process
Five Golden rules of web designing
3 Week 3 Designing navigation bar
Page design
Home Page Layout
Design Concept
4 Week 4 Brief History of Internet
What is World Wide Web
Why create a web site
Web Standards
Audience requirement.
5 Week 5 What is HTML
HTML Documents
Basic structure of an HTML document
Creating an HTML document
6 Week 6 Mark up Tags
Heading-Paragraphs
Line Breaks
HTML Tags.
7 Week 7 Introduction to elements of HTML
Working with Text
Working with Lists, Tables and Frames
8 Week 8 Working with Hyperlinks, Images and
Multimedia
Working with Forms and controls.
9 Week 9 Concept of CSS
Creating Style Sheet
CSS Properties
CSS Styling(Background, Text Format,
Controlling Fonts)
10 Week 10 Working with block elements and
objects
Working with Lists and Tables
CSS Id and Class
Box Model(Introduction, Border Properties, Padding
Properties, Margin properties)
11 Week 11 CSS Advanced(Grouping, Dimension,
Display,
Positioning, Floating, Align,Pseudo
class, Navigation Bar,
Image Sprites, Attribute sector)

12 Week 12 What is a front-end framework


Responsive Web Design
Bootstrap intro
Downloading Bootstrap
Different ways to add Bootstrap to your page
Bootstrap Container
Bootstrap Grid System
Multiple grids
13 Week 13 Rows and offsets
Responsive images, videos, maps
Bootstrap style vs your style
Bootstrap themes
14 Week 14 Building a Navbar
Using Jumbotron to Showcase Key Content
Adding Buttons and Button Groups
Horizontal Navs and Dropdown Buttons
Displaying Content with Cards
Building the Schedule with a List Group
Displaying a Modal Window
15 Week 15 Using ScrollSpy to Highlight Nav Links
Form Groups and Form Controls
Custom Form Controls for Cross-Browser Consistency
Structured Form Layouts with the Grid
Adding Validation Styles
16 Week 16 Project: Transforming some basic content into a good
looking and responsive website using Bootstrap
Framework

You might also like