Foundation and Pathways
COS10020 Creating Web Applications
Assignment 2
Semester 3, 2016
Purpose of Assignment:
An individual assignment, designed to familiarise in following the project life cycle in developing a website. It also provides an opportunity to practice again techniques and skills involved in designing webpages utilising validated HTML, and validated CSS using a standard text editor. Moreover, these webpages will contain input forms that will use Javascript to validate user data input before the form is submitted to the server for processing.
In this individual assignment you will develop a new Web form or enhance the Web form you developed in Assignment 1 by using PHP and storing server-side information in a MySQL database. This information will have been collected in your HTML Forms. It will involve the creation of simple MySQL tables to store, update and retrieve information from a Web site using MySQL commands.
Due Date: 8am Tuesday 10 January 2017
Submission as a single zip file, via the online submission system (Blackboard) http://blackboard.swin.edu.au/
Contribution to Final Assessment: 20%
Requirements and Specifications
The assignment requires you to develop a test website for a “Help Desk”. The director of the company is interested in developing a test website that allows the user to register a unique job number when first registering a technical problem. You are required to develop the front end (client) of the website. The director has asked a student, Mr Blog, who is taking up Web programming to develop the back end (server) of the website that will process the data input from the front end (client).
Task 1: Website Design
After several discussions with the director, it was agreed that 2 webpages will be developed. These are the Home Page and the Registration Page.
To keep the test website simple, the structure adopted is linear. Figure 2 illustrates the site map of the website.
The register.htm page:
1. Client side validation using Javascript.
The testreg.php page:
1. Redirects to the index page if registration is successful or outputs to successful registration feedback page with a link back to the index page.
2. Outputs an error page if server side validation fails. The outputted error page contains a link back to register.htm and index.html page.
Graphic Design
As part of the graphic design, it was agreed with the director that the main wireframe design for both webpages shown in Figure 3 be adopted.
These two structure elements will be styled by the CSS contained in common.css. You are free to design and add other structure elements to complete the index and the registration page.
Task 2: Construction and Content Development
Section One: HTML 5 Web Page
The two webpages must be developed using HTML5 to describe the content and structure. All pages must not contain any deprecated elements/attributes. The following HTML must be used in the assignment
· Index Page
· Anchor
· Registration pa ...
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Foundation and PathwaysCOS10020 Creating Web Application.docx
1. Foundation and Pathways
COS10020 Creating Web Applications
Assignment 2
Semester 3, 2016
Purpose of Assignment:
An individual assignment, designed to familiarise in following
the project life cycle in developing a website. It also provides
an opportunity to practice again techniques and skills involved
in designing webpages utilising validated HTML, and validated
CSS using a standard text editor. Moreover, these webpages will
contain input forms that will use Javascript to validate user data
input before the form is submitted to the server for processing.
In this individual assignment you will develop a new Web form
or enhance the Web form you developed in Assignment 1 by
using PHP and storing server-side information in a MySQL
database. This information will have been collected in your
HTML Forms. It will involve the creation of simple MySQL
tables to store, update and retrieve information from a Web site
using MySQL commands.
Due Date: 8am Tuesday 10 January 2017
Submission as a single zip file, via the online submission
system (Blackboard) http://blackboard.swin.edu.au/
Contribution to Final Assessment: 20%
Requirements and Specifications
The assignment requires you to develop a test website for a
“Help Desk”. The director of the company is interested in
2. developing a test website that allows the user to register a
unique job number when first registering a technical problem.
You are required to develop the front end (client) of the
website. The director has asked a student, Mr Blog, who is
taking up Web programming to develop the back end (server) of
the website that will process the data input from the front end
(client).
Task 1: Website Design
After several discussions with the director, it was agreed that 2
webpages will be developed. These are the Home Page and the
Registration Page.
To keep the test website simple, the structure adopted is linear.
Figure 2 illustrates the site map of the website.
The register.htm page:
1. Client side validation using Javascript.
The testreg.php page:
1. Redirects to the index page if registration is successful or
outputs to successful registration feedback page with a link
back to the index page.
2. Outputs an error page if server side validation fails. The
outputted error page contains a link back to register.htm and
index.html page.
Graphic Design
As part of the graphic design, it was agreed with the director
that the main wireframe design for both webpages shown in
Figure 3 be adopted.
3. These two structure elements will be styled by the CSS
contained in common.css. You are free to design and add other
structure elements to complete the index and the registration
page.
Task 2: Construction and Content Development
Section One: HTML 5 Web Page
The two webpages must be developed using HTML5 to describe
the content and structure. All pages must not contain any
deprecated elements/attributes. The following HTML must be
used in the assignment
· Index Page
· Anchor
· Registration page
· Form
· Input(Text and Submit)
· Select
Other elements can be used if deemed necessary and appropriate
for the content.
In addition, the following describes the required contents in
each webpage.
· Index page
· Show your details similar to the sample in Figure 4 inside the
main section structure.
·
4. · Clicking on the email address should launch an email client (if
installed)
· Display a link to allow users to proceed to the registration
page
· Registration page
· Show a simple form containing
· Job number – text field
· First name – text field
· Last name – text field
· Mobile Phone – text field
· Email address – text field
· Office – text field
· Desk – text field
· Computer – text field
· Problem – select field with options of “password”, “new user”,
“delete user”, “lost file”, “new computer”, “new software
installation” and “virus checking”.
· Set the method to POST and action to
·
http://mercury.ict.swin.edu.au/vcaravias/COS10020/regtest.php
Section Two: CSS files
Two CSS files are to be created. One is used to style both the
HTML pages, mainly to display a background image within the
5. main section and style the footer. The second CSS will style the
form itself. Everyone is encouraged to be creative in their
design. Any CSS property groups can be used if deemed
necessary and appropriate for the presentation.
In addition, implementing special features are highly
recommended. These are
· Tooltip for the job number that describes that a 5-digit number
is expected. The tooltip is displayed wherever the mouse hovers
over the job number input field.
· Pop up window for the terms and conditions of logging a
technical problem with the help desk.
Section Three: Javascript File
A Javascript file must be created for the registration page to
validate the input data in the form prior to submitting it to the
server for processing. The Javascript must
· Check that the job number is a 5 digit number before allowing
submission
· Check that the mobile number is a 10 digit number before
allowing submission
· Check that a valid email address has been entered
· Check that there are no blank input text field value
· Check that a selection is made for the selection input
· Show an alert box with a message if there is a problem
· Return true (if all input are okay) or false
6. Enhancements using JavaScript
You should complete the above requirements before attempting
enhancements using Javascript. Each enhancement must be
listed on a page called enhancements2.html. You will need to
add a link in in the index.html page to the enhancements page.
The entries on this page should:
•
briefly describe the interaction required to trigger the event and
what a programmer has to do to implement the feature.
•
provide a hyperlink to the page where the enhancement is
implemented in your website.
•
reference any 3rd party contribution to the enhancement
The JavaScript enhancements themselves should be in a separate
enhancements.js file. Make sure there are adequate comments to
explain the enhancement (including its source if applicable).
Examples of JavaScript and other enhancements you might
make include (but are not limited to):
• Use the JavaScript methods querySelector() that take a CSS
selector as an argument to manipulate the web page in response
to use action.
• Use regular expression patterns in JavaScript to validate the
data.
• Have the Menu display reflect the current page being viewed.
Any extensions that are not listed and linked on the page
enhancements2.html will not be assessed.
7. Section Four: Use PHP to reuse common elements in your Web
site
PHP provides us with more techniques to modularise and reuse
our web application code. You need to refactor your web pages
as follows:
-
Your web site contains common elements such a menu, header
and footer. Re-write your html pages so that static HTML
elements common to your pages are sourced from a single PHP
script.
Section Five: Create database table
You should create the following table:
Users Table (users)
This table will record the data the user enters into the form in
register.html. The format of the database fields should match
appropriate validation rules. If no rule exists for a particular
field, choose an appropriate format.
The email address of the user will be used as the primary key
for this table. Make sure duplicate email addresses cannot be
entered in the table.
Section Six: Registering users (register.html and regtest.php)
In this section you will adapt the register.html Web page. If you
have not already done, create a submit button Web page. On
clicking this button user information will be sent to the server
where it is processed by regtest.php and stored in the users
table. If a record with the email already exists in the table, an
error message will be sent back to the user.
Data validation: the data validation rules that you applied at the
8. client using HTML5 and JavaScript should also be applied at
the server. Data validated should include all input fields.
Remember: make sure you have the novalidate="novalidate"
form attribute set.
Demonstration Procedure:
1. Make sure you attend your allocated lab class. You will
demonstrate your assignment to the teacher in your allocated
Lab class in Week 13 (12-16 September 2016). You must attend
this class to receive a mark for this assignment. If you cannot
attend your allocated lab class time due to illness you must
provide a copy of the medical certificate to the Unit Convenor.
2. Before your demonstration starts:
a. Make sure you web site is running on Mercury. (Your teacher
will check the
URL). All demonstrations will be done on Firefox.
b. Load Web Developer in Firefox. Validate all your
new/altered web pages for
both HTML5 and CSS and the results display in separate
browser windows.
c. Load MySQL Monitor command line client or the
phpMyAdmin web interface so you can demonstrate the changes
to your table as your demonstration progresses.
3. As you demonstrate your Web site your teacher will ask you
to explain how you have implemented various aspects of it.
4. If there is time you may have an opportunity to demonstrate
and explain any additional features. If not, your tutor will mark
this from your Blackboard submission. After the demonstration
tutorial your teacher will mark your source code and
9. documentation.
5. Students must include a Full URL of their website,
phpmyadmin URL and username and password to access your
database in the submission for Assignment.
6. Create a document or separate page for references when using
outsourced images or text.
Modified November 2016
_993026946.doc
Read assignment submission instructions on pages 4 to 5 of the
course syllabus. Your essays will be graded on content to
include grammar and spelling. While there is no end to what
you might write you must convey your thoughts in essay of at
least four to five pages excluding cover page and references
section.
Assignment:
Write an essay that summarizes the six lessons for successful
virtual teams.
1. Are some more important than the others?
2. What was your most important lesson in this class
Submission Instructions:
Your completed essay must be submitted as an MS word
attachment to this assignment no later than Sunday.
Assignments completed in a narrative essay or composition
format must follow the citation style cited in the _ American
Psychological Association (APA).Students are encouraged to
read/understand the basics.
10. Conclusion: Six Lessons
for Successful Virtual Teams
As you’ve gone through each chapter, we hope you’ve learned
some tactics you can put into practice today and in the future.
Now we’d like to ask you to step back and take a broader look
at
some ‘‘big picture’’ principles.
The survey results that inspired this book point to six general
lessons for successful virtual teams. These broader themes
relate
(sometimes directly and other times indirectly) to the topics that
we’ve covered. They are summarized below.
Lesson 1: Focus on People Issues
Essentially, successful teaming depends largely on the effective
interaction of team members. And because an inherent lack of
human contact comes with the territory with virtual teams, they
must compensate by finding ways to support team spirit, trust,
and productivity.
As we’ve observed in earlier chapters, approaches to virtual
teamwork are different from those used for conventional teams,
and such matters of communication and culture — the so-called
‘‘people issues’’ — take on a heightened relevance to the
success
of these teams.
What are the warning signs that your virtual team’s people
issues need more attention? Do team members work indepen-
15. N
:
97
80
47
08
72
40
6
Conclusion: Six Lessons
for Successful Virtual Teams
As you’ve gone through each chapter, we hope you’ve learned
some tactics you can put into practice today and in the future.
Now we’d like to ask you to step back and take a broader look
at
some ‘‘big picture’’ principles.
The survey results that inspired this book point to six general
lessons for successful virtual teams. These broader themes
relate
(sometimes directly and other times indirectly) to the topics that
we’ve covered. They are summarized below.
Lesson 1: Focus on People Issues
Essentially, successful teaming depends largely on the effective
interaction of team members. And because an inherent lack of
20. hi
p,
H
ob
ok
en
, I
S
B
N
:
97
80
47
08
72
40
6
148 VIRTUAL TEAM SUCCESS
What can you do to improve communication and relation-
ships among team members? We suggest eight possible actions:
1. Develop a team web page where virtual team members can
21. share information and get to know one another.
2. Create ways for team members to interact and communicate
informally (virtual water cooler).
3. Build a collective ‘‘resource bank’’ to share experiences.
4. Find ways to ‘‘spotlight’’ team members.
5. Send newsletters or updates to the team.
6. Create ways to virtually celebrate successes as a team.
7. Partner team members at different locations and rotate these
periodically.
8. Invite thought leaders or speakers to engage with the team,
particularly on relevant topics or ideas.
Lesson 2: No Trust, No Team
Trust is the second of three factors that impact virtual team
success. Task-based trust is one of the strongest determinants
of high performance and one of the factors that differentiates
top-performing teams.
As we’ve said, in virtual teams trust seems to develop more
readily at the task level than at the interpersonal level. There
are
four warning signs that your team’s members are suffering from
low levels of trust. They include:
1. Team members do not refer to themselves as ‘‘we.’’
2. Team members do not appear to know one another
very well.
26. N
:
97
80
47
08
72
40
6
CONCLUSION: SIX LESSONS FOR SUCCESSFUL VIRTUAL
TEAMS 149
When faced with this situation, our research found that team
members can build trust when:
• Teams meet face-to-face at least once early on in the team’s
formation.
• Communication is truly open.
• Members feel empowered to make and act on decisions.
• Conflicts are managed and not avoided.
• The team leader models and reinforces these positive
behaviors.
Lesson 3: “Soft” Skills Are Essential
32. 150 VIRTUAL TEAM SUCCESS
• Needs assessments and skill development — Assess
development needs for team members and team leaders and
work on building and strengthening skills focused on these
areas. This can be done through training, on-the-job
assignments, and other developmental activities.
• Repeat — Continuously reassess and monitor team
interaction and team needs.
Lesson 4: Watch Out For Performance Peaks
Virtual teams that have been working together for more than
three years tend to be more successful than teams working
together for less time. However, be aware that in some virtual
teams performance tends to peak after approximately one year
and then declines. While high-performing virtual teams avoid
this problem by implementing strategies to overcome this peak
and subsequent decline, less-effective teams are not able to do
so.
Therefore it’s important to look out for warning signs that your
virtual team may be approaching its performance peak.
When you see the warning signs of a post-peak performance
decline — team members get along well but do not produce
results, there is an apparent lack of clarity or direction, team
members do not commit adequate time to the team — there are
four actions you can take:
1. Clearly define team roles and accountabilities to minimize
frustration and misunderstandings that can damage morale
and derail productivity.
37. B
N
:
97
80
47
08
72
40
6
CONCLUSION: SIX LESSONS FOR SUCCESSFUL VIRTUAL
TEAMS 151
4. Based on the outcomes, identify barriers to high perfor-
mance, as well as steps that can be taken to overcome these
barriers. Ensure that team success factors are retained.
Lesson 5: Create a “High-Touch” Environment
Electronic technology has made virtual teaming possible, but it
is
not a perfect substitute for human interaction. One of the
greatest
performance barriers is the inability to replicate a ‘‘high-
touch’’
environment in a virtual setting. While meeting face-to-face
requires time and expense, virtual teams that invest in one or
two such meetings per year perform better overall than those
43. 40
6
152 VIRTUAL TEAM SUCCESS
When trying to achieve a high touch virtual environment, it
is important to watch out for ‘‘technology overkill.’’ Teams that
reported using a high number of communication methods tended
to be among the low performers, as they were likely using too
many technologies with minimal impact.
Lesson 6: Virtual Team Leadership Matters
Leadership is the most important factor for the success of
virtual
teams. Our study and other research shows that leadership does,
in fact, have a statistically significant correlation with higher
performance on virtual teams. To be effective, team leaders in a
virtual environment must be especially sensitive to
interpersonal
communication and cultural factors to overcome the limitations
of long-distance teaming.
The warning signs of an ineffective team leader include: (1)
the team isn’t meeting its performance objectives and
deliverables
are delayed or of poor quality; (2) relationships between the
team
members and the leader are damaged; (3) the leader is not clear
about the team’s direction or purpose; and (4) the team leader
pays more attention to members who are at his or her location
or
with whom he or she has the best relationships.
48. p,
H
ob
ok
en
, I
S
B
N
:
97
80
47
08
72
40
6
CONCLUSION: SIX LESSONS FOR SUCCESSFUL VIRTUAL
TEAMS 153
yourself faced with this challenge, there are several things you
can do to improve performance:
• Set clear goals and direction, and revisit these as priorities
shift.
49. • Engage team members in development of strategies.
• Provide time early on for team building and coordinate
periodic face-to-face meetings.
• Find ways to ensure that team members feel included.
• Provide timely feedback to team members. Be responsive
and accessible.
• Emphasize common interests and values and reinforce
cooperation and trust.
• Create a system to easily integrate new team members.
• Teach the importance of conflict resolution.
• Celebrate team achievements and successes.
• Focus on the four elements of successful teamwork
(relationships, accountability, motivation, and
purpose/process).
Closing Thoughts
Organizations that get it right know that virtual teams and
co-located teams are as different as apples and oranges. But
unfortunately, too many organizations have yet to catch on to
this critical truth.
We’ve seen plenty of well-intentioned companies fail because
they treat their virtual teams the same way they treat their
co-located teams. And then there are the organizations that
start virtual teams on a whim without the proper planning or
follow-up — never a recipe for success.
54. N
:
97
80
47
08
72
40
6
154 VIRTUAL TEAM SUCCESS
Technology is, of course, only a tool. While it’s important for
virtual teams, our research shows that it’s a prerequisite rather
than a differentiator. Technological advancements will certainly
continue to impact how people collaborate and work together
from a distance. As technologies that bridge distance and help
compensate for the lack of face-to-face interaction continue to
develop, virtual teamwork will become much easier and more
efficient.
Organizations frequently set up virtual teams and task forces to
address particular business needs. However, as mentioned
before,
they jump in without really understanding what they’re getting
themselves into. By coupling better planning with the right mix
of communication technologies, they could dramatically
improve
their chances for success.