developing modern web platforms...

Developing Modern Web Platforms (HTML,CSS,JS)

Course description1st edition

Lecturer: Farhad Eftekhari

www.techclass.co | © Farhad Eftekhari

http://www.techclass.co/

Content

• Course description

• Topics

• Assignments

• Practical arrangements

• Assessment

• Grading

• References

1/9

Developing Modern Web Platforms | Course description www.techclass.co | © Farhad Eftekhari


Course description

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.


2/9

Developing Modern Web Platforms | Course description


Topics (1/4)

1. History of Internet

2. The advent of World Wide Web

3. How the web works?

4. How web can get accessed to?

5. Common Web Protocols

6. Solutions for hosting our projects

7. Hosting – Things to consider

8. Registering a Domain

9. Importance of having web developing skills for a software engineer

10. Web Application vs. Desktop Application

11. Developing Concerns

12. The evolution of HTML

13. Developing Concerns

14. Responsive Design

15. Editors

16. Design Target your audience

17. Mockups (Wireframes)

18. Template Design

19. Your website statistics

20. What is Search Engine Optimization?

21. Publishing your website

22. Browsers


3/9

A. INTRODUCTION



Topics (2/4)

23. Tags or Elements

24. Page Structure

25. HTML Tags and Attributes

26. 3 Musketeers

27. Body Element

28. Head Element

29. The <!DOCTYPE> Declaration

30. View the source

31. Creating your first HTML page

32. Working with Text

33. Working with Lists

34. Working with Links

35. Working with Images

36. Working with Tables

37. Working with Forms

38. Extra Markups

39. Commenting in HTML

40. ID vs. Class

41. META Tags

42. Especial Characters


3/9

B. HTML



Topics (3/4)

43. Understanding CSS

44. HTML and CSS are BestFriendsForever

45. How CSS works?

46. How to insert CSS?

47. CSS Selectors

48. CSS Rules Overlapping

49. CSS Rules Inheritance

50. Mastering Colors

51. Styling Text

52. Working with Fonts and Typefaces

53. Styling Links

54. Hover, active, focus

55. Boxes; Border, Margin, and Padding

56. Styling Lists, Tables and Forms

57. Layouts

58. Working with Images

59. HTML5 Layout Elements

60. CSS Frameworks

61. Introduction to Bootstrap (EXTRA)


3/9

C. CSS



Topics (4/4)

62. JavaScript – Short History

63. Is JavaScript same as Java?

64. JavaScript benefits

65. Say hi to Scripts

66. Understanding flowcharts for programming

67. Objects and Properties

68. Objects and Events

69. Objects and Methods

70. Understanding the Document object

71. When a Browser meets a Web Page

72. How HTML-CSS-JS coexist?

73. Writing your first JavaScript

74. How to store JS? (Internal vs.

External)

75. Display Data in JavaScript

76. Using Objects and Methods

77. Variables and Data Types

78. Operators

79. Functions

80. this

81. Using Document Object Model (DOM)

82. Using Browser Object Model

83. Working with Global Objects

84. Comparison Operators

85. Logical Operators

86. Decisions

87. Loops

88. Accessing Elements in DOM

89. Removing Elements from the DOM

90. Accessing Elements Attributes

91. Events

92. Validation

93. Error Handling

94. Debugging

95. Strict Mode

96. JSON

97. Introduction to JavaScript Libraries and Frameworks

98. Introduction to jQuery

99. Introduction to AngularJS

100. Introduction to ReactJS


3/9

D. JavaScript



Assignments - Introduction

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.


4/9



Assignments - Parts

• Exercises

– Learning material

– Videos

– Code challenges

• Sessions diary

• Feedback


5/9



Practical arrangements


Items Time

Introduction 43h

HTML 87h

CSS 87h

JavaScript 113h

Total: 330 hours

6/9


Calculated time is based on Lectures, Labs, Assignments, Self-

study, Quiz, and Project which has been created for the course.


Assessment


7/9

40%

20%

40%

Assignments Quiz Project

• 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!)



Grading


Points Grade Description

90-100 5Excellent 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 3Good performance: showing strong understanding of basic concepts and good

grasp of techniques, but with certain minor problems still requiring further

attention.

60-69 2Satisfactory performance: demonstrating basic grasp of concepts and techniques

but less adept at more advanced application of these.

50-59 1Sufficient 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.

8/9



References

• Tutorial videos

• Slides

• Reference book

– HTML, CSS and JavaScript All in One, Sams Teach Yourself(2nd Edition)


9/9



www.techclass.com | © Farhad Eftekhari

I hope you have a wonderful class!

Thank you for your consideration!

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 31

00079 Heksinki, Finland

www.techclass.co

fb.com/techclass

@etechclass

@etechclass

bit.ly/etechclass

http://www.techclass.com/

developing modern web platforms...

Documents