Saidah Saad Blok E-3-22

[email protected]

[email protected]

03-8921 6668

CLIENT

User interface

HTML(

content

) + CSS (

presentation

) AJAX /DOM + JavaScript (

Interactivity

) PHP Script (

Interactivity

)

SERVER

Database

Web Server



Course Name

 •

Pengaturcaraan Web (Web Programming)

KOD

 •

TP 2543

STATUS

 •

Lengkap Jabatan (TP)

APPROACH

•

Student Centered Learning

Di akhir kursus, pelajar mampu: At the end of the course, students will be able to:      Menyenarai fungsi sistem pengaturcaraan berasaskan web

List down the functions of web-based programming systems;

Merangka struktur asas pengaturcaraan web

Design the basic structure of web programming;

Menganalisis konsep dan teknik untuk mereka bentuk laman web

Analyze the concept and technique of web page design;

Membangunkan laman web yang menarik dan dinamik.

Build dynamic and attractive functional websites;

Mengaplikasi pendekatan pelayan pelanggan dalam pembangunan laman web

Apply client server approach in developing websites

Aktiviti

Kuliah Tugasan / Makmal Kuiz Membuat Projek kumpulan ( 5 orang / kumpulan)  Sistem pemantauan berdasarkan pembangunan blog group ahli   berdasarkan 5 tahap metodologi pembangunan web Menjana 5 laman berkonsepkan pembangunan 'three tier' (1/ahli) Pembelajaran sendirian Menduduki peperiksaan akhir semester Jumlah

Jam Pertemuan

21 20 1 36 44 2 123

Item

Projek / Project Tugasan/ Assignment Kuiz/ Quiz Peperiksaan Akhir Semester

TOTAL Peratus

40 15 15 30

100

Week 1 2 3 4 5 6 7 9 -13 14 Topics Introduction to Course and SCL Element Web 2.0

 intro to web 2.0 tool and element HTML CSS JavaScript DOM Web Server PHP Project (SCL Based) Revision

     Dietal, H.M, Dietal, P.J & Nieto, T.R 2008. Internet & World Wide Web: How To Program. 4 th Ed. New Jersey, Prentice Hall.

Sebesta R.W. 2010. Programming The World Wide Web. 6 th Ed. Addison Wesley, USA.

Carey, P. 2006. HTML, XHTML and Dynamic HTML. 3 rd Edition. Boston, MA, United States, Thomson.

Ullman, L. 2005. PHP and MySQL for Dynamic WebSites. 2 nd Ed. Barkeley, CA :Peachpit Press.

Marty Hall & Larry Brown. 2001. Core Web Programming. 2 nd Ed. Saddle River, New Jersey. A Sun Microsystems Press/Prentice Hall PTR Book.



Monday 8:00 am – 10:00 am

• Slaid lecture : SPIN 

Lab

• • Source such as youtube, website, documents : BLOG Discussion : BLOG  1 – Kumplulan FTSM ( hari : ???

 16 orang ( 3 kumpulan kecil) Jam : ???

)  2 – Kumplulan FSSK ( hari : ???

 25 orang ( 5 kumpulan kecil) Jam : ???

)

http://tp2543web.blogspot.com

http://www.ftsm.ukm.my/azraai/tp2543/index.html



http://evolutionofweb.appspot.com/

 The term Web 2.0 is associated with web applications that facilitate participatory information sharing , interoperability , user centered design , and collaboration on the World Wide Web . A Web 2.0 site allows users to interact and collaborate with each other in a social media dialogue as creators ( prosumers ) of user generated content in a virtual community , in contrast to websites where users ( consumers ) are limited to the passive viewing of content that was created for them. Examples of Web 2.0 include social networking sites , blogs , wikis , video sharing sites, hosted services , web applications and folksonomies .

  The rule-making body of the Web is the World Wide Web Consortium (W3C).

W3C puts together specifications for Web standards.  The most important W3C standards are: • HTML (HyperText Markup Language) • • • • • XHTML (EXtensible HyperText Markup Language) CSS (Cascading Style Sheets) XML (EXtensible Markup Language) XSL (eXtensible Stylesheet Language) DOM (Document Object Model)

    Web 1.0 focused on a relatively small number of companies and advertisers producing content = “brochure web” Web 2.0 involves the user. Web 1.0 is as a lecture and Web 2.0 is a conversation. Many Web 2.0 companies are built almost entirely on user-generated content and harnessing collective intelligence. Google, MySpace, Flickr, YouTube and Wikipedia, users create the content, while the sites provide the platforms. 17

 The user is not only contributing content and developing open source software, but directing how media is delivered, and deciding which news and information outlets you trust.

• Social bookmarking sites such as del.icio.us and ma.gnolia

• • Social media sites such as Digg or Reddit Social networking, MySpace, Facebook, Bebo, LinkedIn, and Second Life •  Web 2.0 businesses leverage the Long Tail Long Tail = economic model in which the market for non-hits could be significant and sometimes even greater than the market for big hits

 Web development technologies = Ajax, XHTML, Cascading Style Sheets, JavaScript, the Document Object Model, XML and the XMLHttpRequest object and popular Ajax toolkits—Dojo and Script.aculo.us  Rich Internet Applications (RIAs)—web applications that offer the responsiveness and rich GUI features of desktop applications  Key tools for building RIAs = Adobe’s Flex, Microsoft’s Silverlight, ASP.NET Ajax and Sun’s JavaServer Faces  Other Web development tools and technologies = Adobe’s Dreamweaver, JSON, the web servers IIS and Apache, MySQL, PHP and ASP.NET  Web services allow you to incorporate functionality from existing applications into your own applications quickly and easily. • • • Amazon Web Services Google Maps web services eBay web services 19

 Key to success for many of today’s leading Web 2.0 companies = user-generated content • articles • home videos • Photos 

Collective Intelligence

• Collaboration can result in smart ideas 20

 

Wikis

• Allow users to edit existing content and add new information • Wikipedia • •  MediaWiki open source software SocialText Using wikis for project collaboration reduces e-mails and phone calls between employees, while allowing the ability to closely track a project’s changes

Collaborative Filtering

• Users might submit false or faulty information    Wikipedia  people deliberately adding false information to entries Web 2.0 companies rely on the community to help police their sites Collaborative filtering lets users promote valuable material and flag offensive or inappropriate material

    Blog Social Networking (e.g. facebook) Social Media (e.g YouTube) Tagging

 http://oreilly.com/web2/archive/what-is-web-20.html

 http://en.wikipedia.org/wiki/Web_2.0

 http://en.wikibooks.org/wiki/Web_2.0_and_Emerging

_Learning_Technologies/Web_2.0_Tools

 http://www.go2web20.net/  http://edutechwiki.unige.ch/en/List_of_web _2.0_applications

 http://technologyties.pbworks.com/f/web20 _list.pdf

 http://www.web20searchengine.com/web20 /web-2.0-list.htm

4.

5.

1.

2.

3.

Surveying the Possibilities Developing a Website Evaluation Tool Colour Theory in Web Design and Selecting a Colour Scheme Organizing a Website Methodology of web development Source : http://www.washington.edu/accessit/webdesign/student/lesso ns.htm#unit1



Theme : E-Commerce



Paper work / proposal about project

 Dateline : 5 March 2012  Content – title / group name, member / summary about project / introduction / objective / target audience / analysis requirement , design, content / milestone / reference 

Group : 5 members + 1 blog

 http://www.opencart.com/index.php?route=demonstration /demonstration  http://www.zen-cart.com/