Fortgeschrittene Webentwicklung

Transkript

1 Fortgeschrittene Webentwicklung Hochschule Darmstadt, Fachbereich Informatik, Wintersemester 2016/2017 Christopher Dörge, Thomas Sauer, David Müller

2 Vorlesung 1 Einleitung Wer sind wir? Für wen ist Fortgeschrittene Webentwicklung geeignet? Leistungsnachweis? Was haben wir vor? Projekt?

3 Christopher Dörge M.Sc. Informatik Hochschule Darmstadt Incloud GmbH

4 Thomas Sauer B.Sc. Informatik Hochschule Darmstadt Freier Softwareentwickler, Onmatic GmbH

5 David Müller M.Sc. Informatik Hochschule Darmstadt Incloud GmbH

6 Eine Einschätzung für uns CSS (3) Hast Du Erfahrung mit (bitte melden!) HTML 5 PHP ES6 Responsive Design node.js Professionelle Webentwicklung Angular JS nginx nosql

7 Du bist hier richtig, wenn... Du über solide Kenntnisse in der Webentwicklung verfügst Javascript, CSS, Datenbanken bereiten Dir keine Probleme, Du regelmäßig privat entwickelst Auch unabhängig von der Hochschule tüftelst Du mit Webtechniken. Du Blogs liest und dranbleiben willst Moderne Webentwicklung ändert sich so schnell, dass Du sonst abgehängt wirst. Du viel Zeit in eine anspruchsvolle Veranstaltung investieren möchtest Hier bekommst Du nichts geschenkt. Es gibt anspruchsvolle Hausaufgaben, Anwesenheitspflicht und ein umfangreiches Praxisprojekt. Dich auf ein Experiment einlassen möchtest Das ist unsere erste Runde mit dieser Veranstaltung. Lasst uns zusammen das Beste daraus machen.

8 Achtung! Das wird keine klassische Lehrveranstaltung Es wird wenig Folien, dafür ganz viele praktische Beispiele geben. Workshop-Charakter. Deswegen wird die Veranstaltung auch aufgenommen.

9 Aus der Modulbeschreibung (1) Die Studierenden kennen für verschiedene Teilbereiche einer Webanwendung aktuelle Werkzeuge. Sie sind in der Lage, diese Frameworks und Technologien sinnvoll miteinander zu kombinieren, um eine qualitativ hochwertige Webanwendung nach state of the art zu entwickeln. Sie verbessern ihre Fähigkeiten, im Team zu arbeiten.

10 Die Motivation für die LV Die Art, Webanwendungen zu entwickeln, hat sich in den letzten Jahren extrem geändert. Mobile Anwendungen / Responsive Mächtiges Frontend Single Page Applikationen API-Driven Development

11 Aus der Modulbeschreibung (2) REST aktuelle serverseitige Frameworks inkl. Datenbankanbindung aktuelle clientseitige Frameworks Neuerungen in CSS und ECMAScript responsive Design und aktuelle Frameworks zur Umsetzung Unit-Testing der serverseitigen und clientseitigen Module automatisierte UI-Tests Buildtools, Continuous Integration, Versionierung

12 Materialien Die Materialien zur Lehrveranstaltung gibt es immer vor der Lehrveranstaltung auf der Personen-Seite von David Müller

13 Modus V+P Das heißt: Anwesenheitspflicht, immer. Termine 13 Wochen, 13 Workshops, Rest Praktikum Aufteilung Die erste Hälfte: Vorlesung, Die zweite Hälfte: Gruppen-Praktikum Note Setzt sich zusammen auf 2 Hausaufgaben und dem Praxisprojekt

14 DIE HAUSAUFGABE Es gibt 2 Hausaufgaben im ersten Teil der Vorlesung Jede Hausaufgabe geht mit 10% in die Endnote ein Wird eine der beiden Hausaufgaben mit 5 bewertet, führt dies zum Ausschluss von der Lehrveranstaltung Anspruch Die Hausaufgaben werden sehr arbeitsintensiv und dienen auch Deiner Selbsteinschätzung, ob die Veranstaltung richtig für Dich ist.

15 DAS PROJEKT Das Projekt startet im zweiten Teil der Veranstaltung Es geht mit 80% in die Gesamtnote ein Das Projekt wird in Gruppen durchgeführt (Teamarbeit). Die Sprache und Themen wählen wir später. Am Ende des Projekts steht eine Präsentation à 45min, Termin 8.2. und Uhr Wir werden euch mit Tipps unterstützen. Es wird nicht reichen, nur in der Veranstaltung selbst zu entwickeln. Wahl der Sprachen Mit der Wahl der Programmiersprachen und Frameworks sowie mit der Gruppenzusammenstell ung warten wir so lange, bis das Praktikum dann auch wirklich beginnt.

16 IDE Stark empfohlen wird die Verwendung von JetBrains WebStorm. Für Studenten kostenlos: m/students State of the Art IDE, perfekt angepasst für Webentwicklung. Integrierte Toolchains (Grunt, Gulp, Unit Testing, CI Server, Git ) Bitte auf keinen Fall einen Editor (Sublime, Notepad++ ) verwenden. Alternativen Netbeans und Eclipse sind die anderen, relevanten Plattformen im Web-IDE Geschäft. Bitte versuche auf jeden Fall WebStorm, da es viele unserer Arbeitsschritte stark vereinfacht.

17 Literaturempfehlungen wdrl.info ponyfoo.com css-tricks.com phpdeveloper.org Samples auf codepen.io und jsfiddle.net twitter.com/javascriptdaily medium.com/tag/javascript medium.com/tag/nodejs youtube.com/user/{angularjs,remysharp,k ylerobinsonyoung}/videos

18 Git Was ist Versionsverwaltung, wo kommen wir her (SVN) Open Source Beispiel: mmits/master Glossar: Commit, Push, (Feature) Branch, Repository, Develop, Master, Merge, Ignore, Add, Conflict Repo anlegen WebStorm mit gitignore / readme.md und dem Standart Workflow vs. Merge Conflict

19

20 Quelle: