1. Developing Modern Web Platforms (HTML,CSS,JS)
Course description
1st edition
Lecturer: Farhad Eftekhari
| © Farhad Eftekhari

2.  Content Course description Topics Assignments Practical arrangements
1/9
Course description
Topics
Assignments
Practical arrangements
Assessment
Grading
References
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

3.  Course description
2/9
The goal of this course is for the student to be familiar with required technologies to develop modern web platforms. After passing this course, the student will be able to select between primary technologies in web designing to work with them, and also develop projects and websites using such technologies. The student will be introduced to HTML as a markup language for describing web documents, and then will be familiar with CSS to apply styles on HTML elements, and finally learn JavaScript as an interpreted language to add dynamic functionalities to web applications. Together, they are among the essential technologies of World Wide Web content production.
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

4.  Topics (1/4) INTRODUCTION 3/9 History of Internet
The evolution of HTML
The advent of World Wide Web
How the web works?
Responsive Design
How web can get accessed to?
Editors
Common Web Protocols
Design  Target your audience
Solutions for hosting our projects
Mockups (Wireframes)
Hosting – Things to consider
Template  Design
Registering a Domain
Your website statistics
Importance of having web developing skills for a software engineer
What is Search Engine Optimization?
Publishing your website
Web Application vs. Desktop Application
Browsers
Developing Concerns
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

5.  Topics (2/4) HTML Tags or Elements Working with Lists Page Structure
3/9
HTML
Tags or Elements
Working with Lists
Page Structure
Working with Links
HTML Tags and Attributes
Working with Images
3 Musketeers
Working with Tables
Body Element
Working with Forms
Head Element
Extra Markups
The <!DOCTYPE> Declaration
Commenting in HTML
View the source
ID vs. Class
Creating your first HTML page
META Tags
Working with Text
Especial Characters
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

6.  Topics (3/4) CSS Understanding CSS Styling Links
3/9
CSS
Understanding CSS
Styling Links
HTML and CSS are BestFriendsForever
Hover, active, focus
Boxes; Border, Margin, and Padding
How CSS works?
How to insert CSS?
Styling Lists, Tables and Forms
CSS Selectors
Layouts
CSS Rules Overlapping
Working with Images
CSS Rules Inheritance
HTML5 Layout Elements
Mastering Colors
CSS Frameworks
Styling Text
Introduction to Bootstrap (EXTRA)
Working with Fonts and Typefaces
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

7.  Topics (4/4) JavaScript 3/9 How to store JS? (Internal vs. External)
JavaScript – Short History
Accessing Elements in DOM
Is JavaScript same as Java?
Display Data in JavaScript
Removing Elements from the DOM
JavaScript benefits
Using Objects and Methods
Accessing Elements Attributes
Say hi to Scripts
Variables and Data Types
Understanding flowcharts for programming
Operators
Events
Functions
Validation
Objects and Properties
this
Error Handling
Objects and Events
Using Document Object Model (DOM)
Debugging
Objects and Methods
Strict Mode
Understanding the Document object
Using Browser Object Model
JSON
Working with Global Objects
When a Browser meets a Web Page
Introduction to JavaScript Libraries and Frameworks
Comparison Operators
How HTML-CSS-JS coexist?
Logical Operators
Introduction to jQuery
Writing your first JavaScript
Decisions
Introduction to AngularJS
Loops
Introduction to ReactJS
| © Farhad Eftekhari
Developing Modern Web Platforms | Course description

8.  Assignments - Introduction
4/9
The assignments has been designed for the students to have a better understanding over course’s topics and personally be able to follow the instructors and do the assignments in an innovative and interactive way. A big portion of assessments will be dedicated to the assignment, and the students need to return it to the teacher after the course in order to be assessed.
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

9.  Assignments - Parts Exercises Sessions diary Feedback
5/9
Exercises
Learning material
Videos
Code challenges
Sessions diary
Feedback
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

10.  Practical arrangements
6/9
Items
Time
Introduction
43h
HTML
87h
CSS
JavaScript
113h
Total:
330 hours
Calculated time is based on Lectures, Labs, Assignments, Self- study, Quiz, and Project which has been created for the course.
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

11.  Assessment
7/9
the students need to return the assignments to the teacher after the course in order to be assessed.
Quiz will be held in the last session. The student must do it on her/his own, and it is going to contain 40 simple questions regarding the course material.
Project will be held in the last session. Any type of materials are free to use (Just like real life situations, when you are working on a project!)
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

12.  Grading Points Grade Description 90-100 5 80-89 4 70-79 3 60-69 2
8/9
Points
Grade
Description
90-100 5
Excellent performance: not only fulfils all standard requirements, whether, demonstrates originality and imagination.
80-89 4
Very good performance: fulfilling all tasks in an appropriate manner.
70-79 3
Good performance: showing strong understanding of basic concepts and good grasp of techniques, but with certain minor problems still requiring further attention.
60-69 2
Satisfactory performance: demonstrating basic grasp of concepts and techniques but less adept at more advanced application of these.
50-59 1
Sufficient performance: showing just enough understanding of the subject to merit a pass grade but requiring greater effort to achieve a more satisfactory result.
0-49 
Fail: 30-49: insufficient to pass but capable of achieving a more satisfactory result if greater effort is made. 0-29: a result indicating a significant lack of effort on the part of the student.
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

13.  References Tutorial videos Slides Reference book
9/9
Tutorial videos
Slides
Reference book
HTML, CSS and JavaScript All in One, Sams Teach Yourself (2nd Edition)
Developing Modern Web Platforms | Course description
| © Farhad Eftekhari

14. I hope you have a wonderful class! 
Thank you for your consideration!
fb.com/techclass
@etechclass
bit.ly/etechclass
I hope you have a wonderful class! 
Copyright © 2016 by Farhad Eftekhari
All rights reserved. No part of this publication may be reproduced, distributed, or transmitted in any form or by any means, including photocopying, recording, or other electronic or mechanical methods, without the prior written permission of the publisher, except in the case of brief quotations embodied in critical reviews and certain other noncommercial uses permitted by copyright law. For permission requests, write to the publisher, addressed “Attention: Permissions Coordinator,” at the address below.
Helsinki Metropolia UAS Bulevardi Heksinki, Finland
| © Farhad Eftekhari