Teaching with Dynamic Documents Web Applications and Local Resources Jerzy Karczmarczuk Dept. of Computer Science, University of Caen, Caen, France Keywords: HTML5, Javascript, SVG, Servers, Python, Tornado, AJAX, LaTeX, Mathematical Tools, Moodle, Nodejs, Websockets. Abstract: One of the bottlenecks in the application of computer methods in teaching is the limited effort in the develop- ment of tools for the creation of pedagogical material (documents, presentations, software). These tools exist, but they are often dispersed, and sometimes not well known. Some methodological work would be very useful. Our talk concentrates on the usage of Web-oriented infor- mation processing techniques, from the perspective of an individual: making presentations, scripting them, adding dynamical content from specialized servers, enhancing the interaction between different sources, etc. We give some simple examples belonging to the domain of teaching of sciences. The usage of servers help to modularize the teaching software support, avoiding big, monolithic applications. 1 PEDAGOGICAL CREATION used as the main interfaces. AND WEB TECHNOLOGIES The world-wide success of collaborative computer-assisted teaching platforms such as Moodle ((Dougiamas and Taylor, 2003; Moodle, 2015)), This talk is addressed mainly, not exclusively, to Chamilo, etc., is established. Course databases, teachers of mathematically oriented sciences, who cohort assembly, management of timed examinations want to prepare visually rich, dynamic, and inter- – all this frees the teachers’ time. As a course active teaching documents, and who feel that the creation environment, they seem to be less useful. methodology of construction of such materials is un- Davidson and Waddington observe ((Davidson and derdeveloped. Our target reader need not be a Web Waddington, 2010)) that teaching matter they saw on developer, but she should be acquainted with the basic Moodle, are mainly static pages: PDF, Powerpoint notions, such as the structure of Web pages, scripting, slideshows, frozen video-tutorials, etc., manufactured the concept of server, etc. independently of the system. We observed this as We share here our experience with teaching var- well, at our university, and elsewhere. As authoring ious elements of computer science at the university systems, the LMS, LCMS etc. will evolve, but level, and cooperating with some secondary school the progress is slow. Creating under Moodle a teachers. We taught computer-assisted cartography, course with shared scripts or communicating with scientific visualizations, multimedia documents (im- some server-side applications, is difficult because ages and sound), simulation of dynamical systems, of many constraints to fulfil. All this requires some etc., which also needed visualization, and interac- competence in software engineering, while the effort tive experiments during the lectures: animations, ex- of a teacher should be, and usually is concentrated on ecutable code snippets, and sound samples, etc. We the taught matter, and on the teaching itself, they are feel that the progress in this domain is chaotic. The not Web developers. ever growing database of pedagogical software is not always sufficient for making other applications. We recommend the usage of tools usually associ- 1.1 Reasons to Choose “Web-based” ated with the Web programming (HTML5, Javascript, Tools applicative servers), considered as the building bricks of local environments, autonomous, and installable on The possibility to deploy the documents on a Web the teachers’ and students’ computers, with browsers site, enabling thus the distant access is an impor- Karczmarczuk J.. 315 Teaching with Dynamic Documents - Web Applications and Local Resources. DOI: 10.5220/0005447803150322 In Proceedings of the 7th International Conference on Computer Supported Education (CSEDU-2015), pages 315-322 ISBN: 978-989-758-107-6 Copyright c 2015 SCITEPRESS (Science and Technology Publications, Lda.) CSEDU2015-7thInternationalConferenceonComputerSupportedEducation tant, but secondary issue, since the teaching operates fest. Installing Apache is straightforward, but one of mostly in direct contact between teachers and stu- the harmful, persisting myths among the casual users dents. Our “target context” is the classical teaching of Internet, is that the users are just clients, and the with lectures, home assignments, and practical com- servers, heavy “monsters”, reside in some mythical, puter work, rather than some MOOC. “professional” domain. The main reason, mentioned already, is the stan- dard possibility to enrich the documents with dynamic elements: animation scripts, linked video sequences, 2 HTML5 FOR PEDAGOGICAL inclusion of other documents (iframes), style modifi- cations, internationalization, pop-up windows, etc. DOCUMENTS We didn’t use any other presentation platforms for many years. Difficulties for creators who are not Web A good course may be prepared and delivered us- specialists persist, but it is easier to control the details ing Powerpoint, or chalk, since good tools are well- in an autonomous environment, than within the LMS mastered tools. Old HTML pages were badly format- such as Moodle, which for rational reasons insist on ted. But the typesetting quality of Web documents the coherent usage of built-in tools, and which respect becomes very good, current browsers recognize also several security constraints, which make experiment- the hyphenation, it suffices to declare the style for an ing difficult. But there are other reasons for replac- element class, say: ing the Powerpoint/ImPress slideshows, or PDFs by p {hyphens:auto; -moz-hyphens:auto; HTML, and to use the “Web-based” tools. -webkit-hyphens:auto;} • According to the philosophy that learning tools and to specify the language, e.g., <p lang="pt">, should be freely and widely available, the readabil- and if it is insufficient, it suffices to load and acti- ity and facility to copy and edit a document is a vate the script Hyphenator of Mathias Nater ((Nater, major point. If the author wants to protect the doc- 2015)); it inserts automatically the conditional hy- phen &shy; where due, and uses the same multilin- ument, it is easy to export a frozen slideshow, but 1 this should not be frequent. gual hyphenation patterns as TEX and OpenOffice . There are other reasons to use HTML documents: • A Web page is a distributed document, with images • It is considerably easier than with other formats, to and other fragments kept separately. This makes provide different styles permitting to show the doc- it easier to share them, and the transfer process of ument on a large screen, on a computer, or printed, fragments may be parallelized, and/or delayed us- to dynamically change the background colour, etc. ing AJAX. HTML5 with CSS3, address specifically this prob- We recommend the installation, and active mainte- lem, with such attributes as media="print" (or nance of local resources, including servers. This "projection" or "aural", etc.), which can be means more initial work, but less problems after- queried and steer the formatting. wards. It should then be easy (for the teachers and • Pedagogical texts profit from many sources. While for the students) to work with or without Web access, the “copy and paste” techniques are easier for to profit from the learning sites if accessible, but to HTML, since this is a plain text, without hidden use more often their own local copies of documents style elements (as in Word), it is much easier than and programs, it is cheaper, safer, and controlled. elsewhere to assembly compound documents by In building our teaching environment, we insisted linking, to construct mashups, and other hybrids. that only free, legally clonable, and easily installable software (apart from the platforms themselves, such • The responsive, adaptive design of Web-oriented as Windows, or Mac OS), should be used; several documents, requires the scale neutral, dynamically third parties packages, scripts, and images, could thus rasterized “vector” graphics. The SVG (Scalable be shared. We avoided “experimental” or unknown Vector Graphics) standard (with animations and packages, pedagogical environments should be rea- scripting ((Eidenberger, 2003)) is there, easy to sonably stable. generate, easy to transform and render, but not di- For the dynamically generated documents, the rectly usable for the TEX or XXX-Office writers. server-based communication is a necessity, even if 1 in situ A local polling has shown that almost nobody uses the one works . Server installation is an easy task, hyphenation in the Web documents, people are not aware web servers, locals and remote, begin to be included of these facilities. There are many other formatting stylisa- by default in every operating system and every pro- tions, such as word-wrap:break-word, unknown by a gramming language support, this tendency is mani- majority of Web users. 316 TeachingwithDynamicDocuments-WebApplicationsandLocalResources But, being an ordinary (XML) text, a SVG docu- mains rare among non-professionals. The inclusion ment is easy to transmit through the network, or to of HTML in HTML is still not standard. However, paste into an HTML page. the existing tools are easy to use. • The audio and visual (canvas+SVG+CSS3, video • Many Javascript libraries offer calls to and WebGL) facilities in HTML5 offer more than XMLHttpRequest(), a function which ac- just the possibility to render multimedia docu- cesses a distant document, or a local file by its ments. New browsers