Preparation

This information has been put together for those that are going to use the exercises on the ITC internal server at https://gisedu.itc.utwente.nl for serving websites, data and services.

Creating a Web Server Account

You have to create an account and website directory on the server only once!. If you have done this for earlier exercises already, you do not have to repeat it, just skip to the next section...

Before you can do anything that involves dynamic web pages, client-side scripting or server-side applications, you will have to make sure you have a web site to test and serve your content. There are many ways to get access to such a web server; for ITC students the simplest is to use the ITC internal server at https://gisedu.itc.utwente.nl. Below we will explain how to initiate your account on this server.

Note that for access to the server you need to be in the UT/ITC internal network. This means that if you are not in a UT building (the IIH hotel is such a building), you will have to access it through a VPN connection!

Open a web browser and go to the site https://gisedu.itc.utwente.nl/manage. Fill in any details asked for and do not forget to press "OK". This will create a special directory on the server, this directory will be served as webpages by a Web Server, and its web address will be https://gisedu.itc.utwente.nl/student/s1234567, where s1234567 will be replaced by your s-number.

Test the site by starting any web browser and typing in the web address mentioned above. You should see a webpage similar to the one below:

You can also access this directory using your computer's file system (through the so-called UNC file path, that is not using the Web): \\gisedu.itc.utwente.nl\student\s1234567 (again replacing the s1234567 with your login) --- on Linux and Mac OSX machines, you use forward slashes / instead of backslashes \) .

When using a Windows computer, the easiest way to work with this directory is to create a so-called Mapped Network Drive: In My Computer find the Map Network Drive menu. Choose an unused drive letter (e.g. U:) and add the UNC file path mentioned above. Be careful, you will have to use the option connect using different credentials, and then the username AD\s1234567 (replacing s1234567 with your login).

Now you can edit the file default.htm in a simple text editor (e.g. NotePad++ on Windows, available in the ITC Software Manager). Change the content (e.g. add a welcome message), save it and open again in a web browser. You should see the changes. This means your website is working and all content you place in this web-enabled directory will be served by the IIS webserver running on gisedu.itc.utwente.nl.

Now you are all set to start the exercise...

Coding HTML files

In many cases during these exercises, you will have to type code in so-called HTML files, CSS style files or JavaScript code files. It is easy to make mistakes in such code. HTML code is not case-sensitive, but proper use of the syntax is important, especially correct use and nesting of tags. JavaScript is even trickier, as it is also case-sensitive, i.e. the variable MyNiceParameter is not the same as the one called myniceparameter...

Retyping the code you see in the exercise description is usually not necessary: You can copy the code from the listings directly. Below in Listing 1 is an example of such a code listing. Make yourself familiar with the tools, especially the copy tool in the title bar... If you see dots [ • • • ] in code fragments, they indicate that there is more code above and/or below the code shown in the snippet. Please DO NOT copy the dots to your files. Additionally, lines with new code are highlighted in yellow. This should give you a reference as to where to implement the changes asked for in the exercise description.

[NOTE: Never copy from code in a PDF version of exercise descriptions!]

There are several software tools that can help you:

• Use a modern web–browser: FireFox, Chrome, Edge or Opera, or Internet Explore version 9 or higher. These are HTML5 compatible and have built-in web developer tools. These tools provide error messages, code views and a JavaScript console, network traffic monitoring, etc...
• Use a text–editor that is "code aware": on MacOSX and Linux use BBedit or medit, on Windows Notepad++. This will provide you with line numbers, automatic highlighting of recognised keywords, etcetera.
• Those of you already using a Web IDE (Integrated Development Environment - such as WebStorm) can of course also use that for these exercises.