Frontend Development

Transkript

1 Frontend Development Bildungsgang PQ

2 Stand März 2016 Frontend Development Dieser Bildungsgang führt hin zum Design von Web-Anwendungen, die den aktuellen Erwartungen der Benutzer/innen entsprechen. Er zeigt, wie man Web-Anwendungen entwickeln kann, die auf Tablets, Smartphones und Desktops eine optimale Usability bieten. Frontend Development Dieser Bildungsgang führt hin zum Design von Web-Anwendungen, die den aktuellen Erwartungen der Benutzer/innen entsprechen. Er zeigt, wie man Web-Anwendungen entwickeln kann, die auf Tablets, Smartphones und Desktops eine optimale Usability bieten.

3 Inhalt Frontend Development 5 Web-Anwendungen 6 Standards und Tools 6 Umfassende Zielsetzung 7 Abschluss 7 Themenschwerpunkte 8 Aufnahme 12 Leitung 12 Daten und Anmeldung 13 Frontend Development Da mobile Geräte nicht auf eine unterbruchsfreie Internetverbindung zählen können, ist es sinnvoll, möglichst viel der App-Logik auf dem Client im Web-Browser unterzubringen und die App nur periodisch mit einem Server synchronisieren zu lassen. Durch die zunehmende Standardisierung ist der Browser zur eigentlichen Plattform geworden. Dadurch wird heute immer weniger serverbasiert entwickelt, sondern es werden eigenständig lauffähige Apps auf dem Fat-Client realisiert. Dieser Trend hat sich mittlerweile auch auf dem Desktop durchgesetzt. Dieser Bildungsgang ermöglicht das Erwerben von Kompetenzen zum Aufbau von Web-Anwendungen nach der genannten Funktionsweise für mobile Geräte oder den Desktop, die den aktuellen Anforderungen entsprechen. 5

4 Web-Anwendungen Spezifisch für mobile Geräte wird gezeigt, wie man die Features von Tablets und Smartphones ansprechen kann, welche betriebssystemspezifischen Hürden man dabei überwinden muss und wie Web-Apps für die unterschiedlichen Plattformen und Stores aufbereitet werden können. Bereits über die Hälfte aller Web-Besuche gehen heute von mobilen Endgeräten aus. In der Entwicklung von Websites führte dieser zum Paradigma «mobile first». Und schon gesellen sich mit dem «Internet of Things» unzählige weitere Geräte dazu, die einen Browser besitzen. Auf allen sollen sich Web-Anwendungen ebenso komfortabel bedienen lassen wie eine App: Spezifische Hardware-Features wie Kamera, GPS oder Bewegungssensor sollen ausgenutzt werden und die Bedienung intuitiv mit «Touch» erfolgen. Mit anderen Worten: Es soll auf jedem Gerät ein «natürliches» Benutzererlebnis erzeugt werden. Dieser Anwendungscharakter kann mit modernen Mitteln genauso auf dem Desktop erreicht werden. Standards und Tools Eine solche Universalität lässt sich dank der inzwischen etablierten Web-Standards HTML 5 und CSS 3 realisieren, in erster Linie aber durch die Verwendung von JavaScript und den intelligenten Einsatz zugehöriger Bibliotheken. Die Möglichkeiten entwickeln sich in fulminantem Tempo weiter: Ständig tauchen neue Bibliotheken und Werkzeuge auf. 6 Umfassende Zielsetzung 7 Zu den Zielen des Bildungsgangs gehört es, die Kompetenz zu fördern, mit neuen Trends in der Frontend- Entwicklung umzugehen. Neben dem Wecken der Begeisterung geht es aber auch darum, eine kritische Bewertung stets wechselnder modischer Tools oder der zunehmenden Herstellerbindung vorzunehmen. Abgerundet wird der Aufbau der spezifischen Kenntnisse durch Anwendung professioneller, zeitgemässer Methoden des Software-Engineerings. Abschluss Diplom der EB Zürich Die Teilnehmenden erhalten nach Abnahme und Präsentation der Abschlussarbeit ein Diplom der EB Zürich. Die Abschlussarbeit besteht aus einem selbst realisierten Projekt. Der Bildungsgang «Frontend Development» bietet Orientierung in diesem dynamischen Umfeld. Er vermittelt einerseits ein solides Fundament für das Entwickeln von modernen Web-Anwendungen und zeigt andererseits die Einsatzmöglichkeiten der neusten Tools und Techniken.

5 Themenschwerpunkte Der Bildungsgang gliedert sich in fünf Module, die je einen abgeschlossenen Themenkreis behandeln. Modul 1: Grundlagen In diesem Modul werden die grundlegenden HTML5-, CSS3- und JavaScript-Kenntnisse aufgefrischt, um die Teilnehmenden auf einen vergleichbaren Wissensstand zu bringen. Unterstützt wird dies durch den optionalen, kostenfreien Besuch des Ateliers «Web entwickeln mit Open Source» im Lernfoyer der EB Zürich. Es wird ebenso behandelt, welche Auswirkungen die Anforderungen einer Web-Anwendung auf die Frontend-Entwicklung haben. Vermittelt wird, wodurch sich eine moderne Anwendung gegenüber einer klassischen, für Desktop entworfenen Web-Anwendung auszeichnet und wie man eine solche konzipiert. 8 Modul 2: Tools und Methoden 9 In diesem Modul werden professionelle Arbeitsmethoden und -Tools in der Frontend-Entwicklung vermittelt. Neben dem Umgang mit professionellen Entwicklertools werden verschiedene Frameworks und Libraries zur Unterstützung oder Automatisierung des Entwicklungsprozesses sowie Debugging-Techniken und Performance- Optimierung behandelt. Node und npm Source Code Management (Git) Task-Runner Testing(-Frameworks) Debugging, linting Vorgehensmodelle zur agilen Softwareentwicklung Tools zur Verwaltung der Anforderungen Präprozessoren Requirements Usability Accessibility Editoren, IDEs HTML CSS Responsive Web Design JavaScript

6 Modul 3: Modernes Ökosystem und Benutzerinterfaces Die Zugriffe auf Web-Anwendungen erfolgen zu einem grossen Teil mit mobilen Geräten wie Smartphones oder Tablets. Aber auch das «Internet of Things» bekommt immer mehr Bedeutung im Frontend-Development. Anhand praktischer Beispiele wird geübt, wie auf die Eigenschaften von unterschiedlichen Geräten und die Eigenheiten von mobilem Surfverhalten Rücksicht genommen werden kann. Schliesslich wird die Offline- Nutzung einer Web-Anwendung besprochen eine entscheidende Funktionalität für den Erfolg einer modernen Web-Anwendung. Inhalte Simulatoren, Emulatoren Das moderne Ökosystem Formulare Bilder und Media Web Fonts, Icon Fonts Device APIs Offline-Storage, SQLite, IndexedDB 10 Modul 4: Bibliotheken und Deployment 11 In diesem Modul steht der Überblick über die wichtigsten Bibliotheken im Vordergrund, verbunden mit der Kompetenz, für jede Anforderung die geeignete Bibliothek einsetzen zu können. Neben zahlreichen JavaScript-Bibliotheken werden auch UI-Frameworks behandelt. Das Deployment und die Bündelung als Hybrid-Apps bilden die weiteren Themen. Ergänzend kommt zur Sprache, wie Inhalte bei Bedarf dynamisch nachgeladen werden können. Dazu gehören auch Themen wie WebSockets oder Backend as a Service-Lösungen. MV* Frameworks Debugging und Performance Minifying Hybrid-Apps Cordova/Phonegap AJAX, WebSockets, Backends Modul 5: Abschlussprojekt Im letzten Modul realisieren die Teilnehmenden ein Projekt als Diplomarbeit. Die Leitung des Bildungsgangs betreut und begleitet die Projekte und ergänzt sie durch geeignete Kurzinputs. Fallweise kommen weitere Themen zur Sprache, die sich aus der Arbeit an den Projekten ergeben. Auf die Anwendung professioneller, zeitgemässer Methoden des Software Engineering wird grosser Wert gelegt. Umsetzung Diplomarbeit Kurzinputs zu verschiedenen Themen Dokumentation und Testing Feedback und Korrekturen Abschlussveranstaltung

7 Aufnahme Aufnahmegespräche Nach der Anmeldung wird ein Aufnahmegespräch geführt. Voraussetzungen Gute Kenntnisse in JavaScript, HTML 5, CSS 3, z.b. Bildungsgang «WebProgrammer PHP» und Kurs «JavaScript: Aufbau». Leitung Thomas Gressly sowie weitere Dozierende 12 Daten und Anmeldung 13 Weitere Auskünfte Markus Huber Telefon Informationsveranstaltungen Allgemeine Geschäftsbedingungen EB Zürich Bildungszentrum für Erwachsene BiZE Riesbachstrasse 11, 8090 Zürich Telefon

8 EB Zürich EB Zürich Die EB Zürich bietet praxisorientierte Kurse und Bildungsgänge an, die sich an den Bedürfnissen der Menschen in der modernen Arbeitswelt orientieren. Wer sein Wissen und seine Fertigkeiten selbstständig in einer anregenden Lernumgebung festigen oder ausbauen möchte, ist hier am richtigen Ort. Bei der Entwicklung der Angebote orientiert sich die EB Zürich laufend an den sich wandelnden Ansprüchen der Berufswelt. Nach dem Motto «Die Sachen klären und die Menschen stärken» vermittelt sie Wissen und Praxis für ein breites Publikum. Die EB Zürich ist die grösste von der öffentlichen Hand getragene Weiterbildungsinstitution der Schweiz und gehört zu den Berufsschulen des Kantons Zürich. Sie ist eduqua-zertifiziert. Dies bedeutet, dass alle Kurse und Bildungsgänge anerkannten Qualitätskriterien unterliegen. Dazu gehört, dass Lernziele ständig überprüft und neuen Anforderungen angepasst werden. EB Zürich bietet praxisorientierte Kurse und Bildungsgänge an, die sich an den Bedürfnissen der Menschen in der modernen Arbeitswelt orientieren. Wer sein Wissen und seine Fertigkeiten selbstständig in einer anregenden Lernumgebung festigen oder ausbauen möchte, ist hier am richtigen Ort. Bei der Entwicklung der Angebote orientiert sich die EB Zürich laufend an den sich wandelnden Ansprüchen der Berufswelt. Nach dem Motto «Die Sachen klären und die Menschen stärken» vermittelt sie Wissen und Praxis für ein breites Publikum. Die EB Zürich ist die grösste von der öffentlichen Hand getragene Weiterbildungsinstitution der Schweiz und gehört zu den Berufsschulen des Kantons Zürich. Sie ist eduqua-zertifiziert. Dies bedeutet, dass alle Kurse und Bildungsgänge anerkannten Qualitätskriterien unterliegen. Dazu gehört, dass Lernziele ständig überprüft und neuen Anforderungen angepasst werden.

9 Weiterbildung wie ich sie will EB Zürich Kantonale Berufsschule für Weiterbildung w PQ Bildungszentrum für Erwachsene BiZE Riesbachstrasse 11, 8090 Zürich Telefon [email protected]