Embed Size (px)
Citation preview
@dskgry #WISSENTEILEN
Zeitgemäße Webanwendungen in JavaEE
MVC 1.0
@_openknowledge
Sven Kölpin – open knowledge GmbH
JSF
MVC 1.0
MVC 1.0
Action-based MVC
• Klassische Web-Programmierung
• Weniger Abstraktion
• Request / Response basiert
• Viel leichtgewichtiger
JSF hat Komponenten
Und MVC 1.0…
Keine Komponenten?
Und MVC 1.0…
Keine Komponenten?
• Clientseitige Komponenten!
MVC 1.0
• Serverseitiges Rendering
• „Rich internet applications“
• Rolle von JavaScript: DOM-Manipulation
jQuery
• Die JavaScript DOM-Library
• Komponenten-Library
jQuery UI
• HTML
• JavaScript
<input type="text"
data-datepicker="true"
name="dueDate"/>
$("input[data-datepicker='true']").datepicker();
Web Components
• W3C Draft
• Custom elements
• Eigene HTML-Tags (mit Logik)
• Templates
• HTML-imports
• Shadow DOM
Web Components: Custom elements
• HTML
• JavaScript
• Polymer
<javaland-datePicker name="dueDate"/>
var datePicker = Object.create(HTMLElement.prototype);
document.registerElement("javaland-datePicker", {prototype: datePicker});
MVC 1.0
• Clientseitiges Rendering
• „Single-page web applications“
• Rolle von JavaScript: Rendering + Business Logik
Bsp.: ReactJS
• HTML
<!DOCTYPE html>
<html>
<body>
<div id="app"></div>
<script src="${mvc.contextPath}/resources/dist/javaland.bundle.js"></script>
</body>
</html>
Bsp.: ReactJS
• JavaScript
import React, {Component} from "react";
import ReactDOM from "react-dom";
class MyView extends Component {
action(){…}
render() {
return (
<button onClick={this.action.bind(this)} />
);
}
}
• MVC 1.0 === Maximale Flexibilität
• Mehr Verantwortung im Client
• Clientside Components
• Rolle von Webtechnologien (JavaScript)MVC 1.0
