Experimental Outline - Grade 2019- Chinese Class - WEB Program Design
 
time: 2025-03-28


WebProgramming(Google)” Experimental Teaching Arrangements

No.

ExperimentItem

ClassHours

ContentSummary

Category

Requirements

Numberof StudentsEach Group

Instruments,Equipments and Software

1

Basic of HTML and CSS

2

Wirte a web page foryourself, including

  1. Self-introduction, recentphoto, courses of this semester, and some favorite movies.

  2. Self-introduction cannot be inone paragraph.

  3. Courses should be in an orderedlist.

  4. Favorite movies should be in anon- ordered list.

  5. Set a hyper-link to website ofcourse SE-805.

  6. For easily reading, please use different font.

Design

Compulsory

1

Instruments:any computer that connected to Internet


Equipment:Web designer (Dreamweaver, WebStorm, etc.), Photoshop, SketchFlow,Web plugin (jQuery, Prototype, ExtJS, Telerik, ComponentOneStudio, EasyUI, etc.)

2

Advanced practice programming of CSS

2

  1. Write a web page listing themain contents of the course, each content should be listedspecific details, including all HTML tags and CSS attributes, andexplaining their use and usage, etc.

  2. Write the style in a separate CSS file, and so the maincontent.

Design

Compulsory

1

3

Basic of JavaScriptprogramming

2

  1. Practice the JavaScriptfoundation and write a quick sorting algorithm in JavaScript thatrequires to output the original input and the sorted result onthe page.

  2. Write a web page that shows themost favorite movies (at least 3). Maked the colors of thesemovie names changed from black to red every 10 seconds

  3. Add a button to the page. When the button is clicked, itwill make the movie name to reverse order, and then pop up themin a message dialog box. (requires to use DOM functions andPrototype.js functions

Design

Compulsory

1

4

Advanced practice programming of JavaScript andXML

2

  1. Writing code in the Firebugconsole to define classes for Employee, Manager, and Secretary,requires:

  • Each Employee has name andsalary.

  • Each Manager is an Employeemanaging other Employees in the same group.

  • Each Secretary is an Employeeworking for Manager.

  1. Add functions to these classes,requires:

  • Each Employee has a show()function returning own name and salary as a  string.

  • Each Manager has agetInferiors(0 function returning own inferiors.

  • Each Secretary has agetSuperior() function returning own superior.

  1.  Try to use two differentmethods to inherit, includingcopy and prototype.

Design

Compulsory

1

5

Cookie

4

  1. Write a simple to-do list in asingle page using <div id=“to-do”></div> toinclude all HTML elements.

  2. Design a form using textarea tomake a new to-do matter. A “add” button which be clicked toadd this matter to to-do list.

  3. Each matter has a checkbos,“choose all” button, “delete all” button, “delete”button. Requires:

  • Use non-intrusive JavaScripttechnology.

  • Use the DOM event handlerfunction in prototype.js.

  • All event handles areregistered on the 'to-do' div element.

  • Use event.element () to findthe source of the event.

  1. Add hot keys to to-do list,requires:

  • Use “↑” and “↓” tomove in the list.

  • Use “Enter” to choose /unchoose current to-do list.

  1. Use simple cookie to save all to-do matters to a cookie.

Design

Compulsory

1

6

HTML5 Programming

4

Write a simpleGoogle Map application to show location of SCUT, requires:

  1. Get latitude and longitude ofSCUT through Google.

  2. Use Google Maps JavaScript API V3.

Design

Compulsory

1

7

The Last applicational design project

After class

Write a web site tointroduce your hometown, including these sections: localinformation, hometown style, native products, economy, education,cultural heritage, historical celebrity events, historical sites,communities and forums, requires:

  1. Use all tags of HTML, mainattibutes of CSS.

  2. Use JavaScript to interact.

  3. Use DOM event handle functionin prototype.js.

  4. Use simple cookie to save to-dolist.

  5. Use Maps JavaScript API V3to finish communities section.

Design

Compulsory

1