mvc e di spring e angular js
DESCRIPTION
A very introductive presentation about how Model-View-Controller pattern (MVC) and Dependence Injection (DI) are implemented in some popular frameworks, such as Spring and Angular JS. The presentation is took from the Software Engineering course I run in the bachelor-level informatics curriculum at the University of Padova.TRANSCRIPT
DEPENDENCY INJECTION E MVC: SPRING E ANGULARJSINGEGNERIA DEL SOFTWAREUniversità degli Studi di Padova
Dipartimento di Matematica
Corso di Laurea in Informatica, A.A. 2013 – 2014
2
Ingegneria del software mod. B
INTRODUZIONE
Un po’ di storia …
Riccardo Cardin
1996 1998 2006
Java beans• Riusabilità e composizionalità• Troppo semplici Transazionalità? Sicurezza?
EJB 1.0• Aggiunge ai beans componenti server-side• Servizi accedibili da remoto• Tecnologia molto complessa
EJB 3.0• Implementazione semplificata• Deployment semplificato (annotazioni)
3
Ingegneria del software mod. B
INTRODUZIONE
Spring
Framework opensource creato per ridurre la complessità dello sviluppo di applicazioni enterprise
Non è limitato alla componente server
Utilizza componenti semplici (bean)
Permette di ridurre l’accoppiamento
Riccardo Cardin
“Spring is a lightweight inversion of control and aspect oriented container framework”
4
Ingegneria del software mod. B
INTRODUZIONE
Spring
Lightweight Non è intrusivo, gli oggetti sviluppati non dipendono da
classi del framework
Framework/Container Gestisce il ciclo di vita e la configurazione degli oggetti
dell’applicazione. La configurazione utilizza XML o annotazioni. Lo sviluppatore può concentrarsi sulla logica di business
IoC e DI Il container si fa carico di “iniettare” le dipendenze degli
oggetti a runtime
Riccardo Cardin
5
Ingegneria del software mod. B
SPRING: CONCETTI
Plan Old Java Object (POJO)
Inversion of Control (principio di Hollywood) Il ciclo di vita degli oggetti è gestito da una
entità esterna (container)
Dependency Injection Le dipendenze di un oggetto vengono “iniettate”
nell’istanza automaticamente e a runtime Utilizzo costruttori e metodi setter
Riccardo Cardin
"We wondered why people were so against using regular objects in their systems and concluded that it was because simple objects lacked a fancy name. So we gave them one, and it's caught on very nicely."
6
Ingegneria del software mod. B
SPRING: CONCETTI
Dependency Injection pattern
Separa il comportamento di una componente dalla risoluzione delle sue dipendenze
Minimizza il livello di accoppiamento
La componente dichiara unicamente le sue dipendenze
Un framework DI risolve a runtime le dipendenze dichiarate Utilizzo costruttori e metodi setter dei POJO Perdita dell’incapsulamento
Riccardo Cardin
7
Ingegneria del software mod. B
DEPENDENCY INJECTION
Poor initialization
Riccardo Cardin
… migliorando un po’ …
8
Ingegneria del software mod. B
DEPENDENCY INJECTION
Classic inizialization Utilizzo del design pattern factory
Riccardo Cardin
9
Ingegneria del software mod. B
DEPENDENCY INJECTION
Spring injection Costruzione e risoluzione delle dipendenze
Riccardo Cardin
...e si vuole cambiare l’implementazione di
B...
10
Ingegneria del software mod. B
SPRING: ARCHITETTURA
Architettura del framework
Riccardo Cardin
11
Ingegneria del software mod. B
SPRING: ARCHITETTURA
Core container Implementa l’IoC attraverso la BeanFactory
Wiring bean
Application context Fornisce servizi come i18n, JNDI, EJB integration
Modulo JDBC e DAO Gestione degli accessi al datasource Evita la gestione delle connessioni
Modulo MVC Separa la logica di controllo da quella di business
Riccardo Cardin
12
Ingegneria del software mod. B
SPRING: COMPONENTI
Configurazione XML org.springframework.beans.factory.BeanFactory
Implementazione del pattern factory, costruisce e risolve le dipendenze
org.springframework.context.ApplicationContext Costruita sulla bean factory, fornisce ulteriori
funzionalità AOP, transazionalità, ...
Riccardo Cardin
ApplicationContext ctx = new ClassPathXmlApplicationContext( "com/springinaction/springidol/filename.xml");
[…]
MyBean bean = (MyBean) ctx.getBean(“beanid”);
13
Ingegneria del software mod. B
SPRING: COMPONENTI
Configurazione XML Dependency injection attraverso proprietà
Utilizzo metodi setter e getter
Riccardo Cardin
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN 2.0//EN""http://www.springframework.org/dtd/spring-beans-2.0.dtd"></beans> <bean id="A" class="nomeClasseA" >
<property name="nome1" ref="B"/> <property name="nome2" value="una stringa"/> <property name="nome3" value="37"/> </bean > <bean id="B" class="nomeClasseB" /></beans>
14
Ingegneria del software mod. B
SPRING: COMPONENTI
Configurazione XML Dependency injection attraverso costruttori
DI attraverso factory methods, init e destroy methods...
Riccardo Cardin
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN 2.0//EN""http://www.springframework.org/dtd/spring-beans-2.0.dtd"></beans> <bean id="A" class="nomeClasseA" >
<constructor-arg value="15"/> <constructor-arg ref="B"/> </bean > <bean id="B" class="nomeClasseB" /></beans>
15
Ingegneria del software mod. B
SPRING: COMPONENTI
Wiring utilizzando annotazioni Permette una gestione migliore della
configurazione in progetti grandi Introduce una dipendenza da framework esterni
@Autowired @Inject, annotazione JSR-330 @Resource, annotazione JSR-250
Riccardo Cardin
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN 2.0//EN""http://www.springframework.org/dtd/spring-beans-2.0.dtd">
</beans> <context:annotation-config/> <context:component-scan base-package="org.example"/> [...]
16
Ingegneria del software mod. B
SPRING: COMPONENTI
Wiring utilizzando annotazioni @Inject/@Autowired
Ricerca per tipo il bean della proprietà Si utilizza su costruttori, proprietà, ... Il bean non deve essere ambiguo
Disambiguazione tramite @Named per l’ID
Autodiscovery @Component, @Controller, @Service, ...
Riccardo Cardin
@Injectprivate Instrument instrument;
@Inject@Named("guitar")private Instrument instrument2;
17
Ingegneria del software mod. B
SPRING
Esempio Interfacce e dependency injection
Riccardo Cardin
18
Ingegneria del software mod. B
SPRING: MVC
Componente per lo sviluppo di applicazione web
Model Layer della logica di business del sistema
View Layer di visualizzazione/presentazione dati
Utilizza la tecnologia JSP e Tag library Control
Layer che gestisce/controlla flussi e comunicazioni Dispatcher delle richieste (Front controller) Controller che implementano la logica applicativa
Integrazione con Spring IoC container Utilizzo del DI pattern
Riccardo Cardin
19
Ingegneria del software mod. B
FRONT CONTROLLER PATTERN
Architettura
Riccardo Cardin
20
Ingegneria del software mod. B
FRONT CONTROLLER PATTERN
Il controller è l’unico punto di accesso Gestisce le richieste in tutti gli aspetti
Riccardo Cardin
21
Ingegneria del software mod. B
SPRING: MVC
Architettura e componenti
Riccardo Cardin
22
Ingegneria del software mod. B
SPRING: MVC org.springframework.web.servlet.DispatcherServlet
Front controller del framework Spring Da configurare nel file web.xml
Configurata via XML (Web Application Context) <servlet-name>-servlet.xml
Riccardo Cardin
<servlet> <servlet-name>disp</servlet-name> <servlet-class> org.springframework.web.servlet.DispatcherServlet </servlet-class> <load-on-startup>1</load-on-startup></servlet><servlet-mapping> <servlet-name>disp</servlet-name> <url-pattern>/</url-pattern></servlet-mapping>
Default servlet, non preclude alcun formato
nella risposta, ma gestisce anche i contenuti statici.
23
Ingegneria del software mod. B
SPRING: MVC Handler mappings
Associa la servlet (gli URL) con i controller BeanNameUrlHandlerMapping
SimpleUrlHandlerMapping
Riccardo Cardin
<beans> <bean id="beanNameUrlMapping" class="org.springframework.web.servlet.handler.BeanNameUrlHandlerMapping" /> <bean name="/listEmployee.htm" class="controllers.ListEmployeeController"> ….</bean>
<bean id ="handlerMapping" class="org.springframework.web.servlet.handler.SimpleUrlHandlerMapping"> <property name="mappings"> <value> /ex/view*.htm=helpController /**/help.htm=helpController </value> </property></bean>
http://localhost:8080/ExampleSpring/listEmployee.htm
24
Ingegneria del software mod. B
SPRING: MVC
Controller e annotazioni Racchiudono la logica dell’applicazione web DefaultAnnotationHandlerMapping
Mapping delle richieste utilizzando @RequestMapping Sfrutta l’autowiring e l’autodiscovering dei bean POJO, più semplice da verificare (i.e. Mockito)
Riccardo Cardin
<beans> <bean id="defaultHandlerMapping" class="org.springframework.web.portlet.mvc.annotation. DefaultAnnotationHandlerMapping" />
<mvc:annotation-driven/> <context:component-scanbase- package="com.habuma.spitter.mvc"/> [...]</bean>
25
Ingegneria del software mod. B
SPRING: MVC
Controller e annotazioni
Riccardo Cardin
@Controllerpublic ClassHomeController { private SpitterService spitterService;
@Inject public HomeController(SpitterServicespitterService) { this.spitterService = spitterService; }
@RequestMapping({"/","/home"}) public String showHomePage(Map<String,Object> model) { model.put("spittles",spitterService.getRecentSpittles( DEFAULT_SPITTLES_PER_PAGE)); return "home"; }}
Dichiarazione del Controller
Injection dell’applicazion logic
Dichiarazione URL gestiti
Modello ritornato alla view
Scelta della prossima view
26
Ingegneria del software mod. B
SPRING: MVC
@RequestParam Permette il recupero dei parametri da una richiesta
org.springframework.ui.Model Mappa di stringhe – oggetti Convention over configuration (CoC) Da utilizzare con Controller annotati
Riccardo Cardin
@RequestMapping(value="/spittles",method=GET)public String listSpittlesForSpitter( @RequestParam("spitter") String username, Model model) { Spitterspitter=spitterService.getSpitter(username); model.addAttribute(spitter); model.addAttribute( spitterService.getSpittlesForSpitter(username)); return"spittles/list";}
27
Ingegneria del software mod. B
SPRING: MVC
Componente view Scelte da un risolutore (resolver) secondo il
ModelAndView
XmlViewResolver Usa un file di configurazione xml per la risoluzione delle view
ResourceBundleViewResolver Usa un resource bundle (una serie di file con estensione .properties) per risolvere le view
UrlBasedViewResolver Esegue una risoluzione diretta del nome simbolico della view in una URL
InternalResourceViewResolver Il nome logico viene utilizzato direttamente come nome della view.
Riccardo Cardin
28
Ingegneria del software mod. B
SPRING: MVC
Componente view
Riccardo Cardin
[...]<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver"> <property name="prefix" value="/WEB-INF/jsp/" /> <property name="suffix" value=".jsp" /></bean>[...]
<bean class="org.springframework.web.servlet.view.XmlViewResolver"> <property name="location"> <value>/WEB-INF/spring-views.xml</value> </property> </bean>
<beans xmlns=“…”> <bean id="WelcomePage“ class="org.springframework.web.servlet.view.JstlView"> <property name="url" value="/WEB-INF/pages/WelcomePage.jsp" /> </bean> </beans>
InternalResourceViewResolver
XmlViewResolver
29
Ingegneria del software mod. B
SPRING: PERSISTENZA
Fornisce supporto uniforme verso lo strato di persistenza
JDBC, ORM, … Versione particolare del template method pattern
Nessun metodo astratto Le firme dei metodi hanno come parametri interfacce
che vengono risolte a runtime
PreparedStatementCreator CallableStatementCreator RowCallbackHandler RowMapper ...
Riccardo Cardin
30
Ingegneria del software mod. B
TEMPLATE METHOD
Struttura
Riccardo Cardin
Definisce le operazione astratte primitive. Definisce lo scheletro
dell’algoritmo
Implementa le operazioni primitive fornendo i passi
concreti all’algoritmo
31
Ingegneria del software mod. B
SPRING: PERSISTENZA
Supporto JDBC org.springframework.jdbc.core.JdbcTemplate
Gestione trasparente delle connessioni Incapsulamento API JDBC (query, ResultSet, … ) Cattura le eccezioni JDBC e le trasforma in eccezioni
più comunicative
Permette di costruire DAO utilizzando IoC
Riccardo Cardin
public class JdbcCorporateEventDao implements CorporateEventDao {
private JdbcTemplate jdbcTemplate; public void setDataSource(DataSource dataSource) { this.jdbcTemplate = new JdbcTemplate(dataSource); }}
32
Ingegneria del software mod. B
SPRING: PERSISTENZA
Supporto JDBC Accesso al JDBC layer in I/O
Riccardo Cardin
int countOfActorsNamedJoe = this.jdbcTemplate.queryForInt("select count(0) from t_actors where first_name = ?", new Object[]{"Joe"});
public class ActorRowMapper implements RowMapper { public Object mapRow(ResultSet rs, int rowNum) throws SQLException { Actor actor = new Actor(); actor.setFirstName(rs.getString("first_name")); actor.setSurname(rs.getString("surname")); return actor; }...Actor actor = (Actor) this.jdbcTemplate.queryForObject( "select first_name, surname from t_actor where id = ?", new Object[]{new Long(1212)}, new ActorRowMapper() );
Recupero primitivo
Recupero oggetti
33
Ingegneria del software mod. B
STRUMENTI ORM
Definizione
Framework in grado di mappare proprietà di un oggetto con colonne di un DB Persistenza garantita attraverso gli oggetti
Offrono specifici linguaggi di interrogazione Garantiscono sofisticate funzionalità
Lazy loading Eager fetching Caching Cascading …
JPA, Java Persistence API
Riccardo Cardin
34
Ingegneria del software mod. B
SPRING: PERSISTENZA
Hibernate Mappa una tabella su un oggetto
Riccardo Cardin
Studenti
ID: NUMBER
FIRST_NAME: VARCHAR
LAST_NAME: VARCHAR…
public class Studente { private Integer id; private String firstName; private String lastName; private Set courses; ... public String getFirstName() { return firstName; } public void setFirstName(String firstName) { this.firstName = firstName; } ...
H8
35
Ingegneria del software mod. B
SPRING: PERSISTENZA
Hibernate H8 Session Factory è il gestore delle connessioni
fra oggetti Java e il database Necessità di datasource … inietiamolo con Spring!
Riccardo Cardin
<beans> <bean id="myDataSource" class="org.apache.commons.dbcp.BasicDataSource" > <property name="driverClassName" value="org.gjt.mm.mysql.Driver"/> </bean> <bean id="mySessionFactory" class="org.springframework.orm.hibernate3.LocalSessionFactoryBean"> <property name="dataSource" ref="myDataSource"/> <property name="mappingResources"> <list> <value>hibernate.hbm.xml</value> </list> </property> ...</beans>
36
Ingegneria del software mod. B
SPRING: PERSISTENZA
Hibernate org.springframework.orm.hibernate3.HibernateTemplate Fornisce l'accesso alla sessione di H8 Assicura che la session stessa sia appropriatamente aperta
e chiusa Fornisce le funzionalità standard di accesso ai dati
L’implementazione dell’interfaccia HibernateCallback permette l’interfacciamento Spring – H8
Riccardo Cardin
public Collection loadAziende(final String category) throws DataAccessException { HibernateTemplate ht = new HibernateTemplate(this.sessionFactory); return (Collection) ht.execute(new HibernateCallback() { public Object doInHibernate(Session session) throws HibernateException { Query query = session.createQuery("from spring-samples.Aziende aziende"); return query.list(); } });}
37
Ingegneria del software mod. B
SPRING: PERSISTENZA
Hibernate È possibile configurare HibernateTemplate
direttamente con una session factory Non occorre più implementare HiberateCallback
Riccardo Cardin
<bean id="hibernateTemplate“ class="org.springframework.orm.hibernate3.HibernateTemplate"> <property name="sessionFactory"> <ref bean="sessionFactory"/> </property></bean>
public void updateStudent(Student student) { hibernateTemplate.update(student);}
public List findStudentsByLastName(String lastName) { return hibernateTemplate.find("from Student student " + "where student.lastName = ?", lastName);}
38
Ingegneria del software mod. B
SPRING
Ci sarebbero ancora molti aspetti da trattare …
Gestione delle transazioni Aspect Oriented Programming (AOP) Remoting Spring Roo Spring Social Spring Web Service Spring.io ...
… ma non c’è più tempo!!!Riccardo Cardin
39
Ingegneria del software mod. B
ANGULARJS
Javascript framework Client-side
Model-View-Whatever MVC per alcuni aspetti (controller)… …MVVM per altri (two-way data binding)
Utilizza HTML come linguaggio di templating Non richiede operazioni di DOM refresh
Controlla attivamente le azioni utente, eventi del browser
Dependence injection
Fornisce ottimi strumenti di testRiccardo Cardin
40
Ingegneria del software mod. B
ANGULARJS
Model – View – Whatever
Riccardo Cardin
Views Model
Controllers
$scope
(ModelView)
ServicesTemplates
view controller - modelview model
Espone i metodi dell’application logic e realizza il two-way data binding
Realizza le viste utilizzando le proiezioni del modello
Modello dati e servizi di business logic
«whatever works for you»
41
Ingegneria del software mod. B
ANGULARJS
Viste e templating Approccio dichiarativo: HTML Direttive
Widget, aumentano le caratteristiche del DOM Markup {{ }}
Effettua il binding agli elementi del view-model Solitamente contenuta in una sola pagina
Riduce il dialogo con il server e non richiede refresh
Riccardo Cardin
<html ng-app> <body ng-controller="MyController"> <input ng-model="foo" value="bar"> <button ng-click="changeFoo()">{{buttonText}}</button> <script src="angular.js"> </body></html>
Le direttive vengono
compilate
index.html
42
Ingegneria del software mod. B
ANGULARJS
One-way data binding …not the right way…
Riccardo Cardin
Il merge tra modello e template avviene all’atto di creazione della vista
Modifiche al modello richiedono un aggiornamento esplicito e custom della vista
43
Ingegneria del software mod. B
ANGULARJS
Two-way data binding …the Angular way!
Riccardo Cardin
Il template è compilato in una live view
La vista è una proiezione del modello (Model-View ViewModel)
44
Ingegneria del software mod. B
ANGULARJS
Oggetto $scope Collante tra controller e le viste
Contesto di esecuzione per espressioni Alcune direttive creano uno scope $rootScope
Gerarchia simile a quella definita dal DOM
Browser event loop $watch: permette alle direttive di comprendere quando
il view-model cambia $apply: permette alle direttive di modificare il view-
model eseguendo funzioni
Riccardo Cardin
45
Ingegneria del software mod. B
ANGULARJS
Browser event loop
Riccardo Cardin
46
Ingegneria del software mod. B
ANGULARJS
Controller ng-controller Inizializza e aggiunge funzioni all’oggetto $scope
Riccardo Cardin
var myApp = angular.module('spicyApp2', []); myApp.controller('SpicyCtrl', ['$scope', function($scope){ $scope.customSpice = "wasabi"; $scope.spice = 'very'; // Functions $scope.spicy = function(spice){ $scope.spice = spice; };}]);
<div ng-app="spicyApp2" ng-controller="SpicyCtrl"> <input ng-model="customSpice"> <button ng-click="spicy('chili')">Chili</button> <button ng-click="spicy(customSpice)">Custom spice</button> <p>The food is {{spice}} spicy!</p></div>
view
Aggiunta variabili e funzioni al view-
model
47
Ingegneria del software mod. B
ANGULARJS
Controller Contiene l’application logic di una singola vista
Non ha riferimenti diretti alla vista Facilita la fasee di testing
Non contiene business logic Per questo si usano i servizi: $http, $resource, ...
Dependence injection Non deve effettuare manipolizazione del DOM
Non è un presenter! Non deve occuparsi dell’input formatting
Usare i form controls Non deve occuparsi dell’output filtering
Usare i filters
Riccardo Cardin
48
Ingegneria del software mod. B
ANGULARJS
Servizi Racchiudono la business logic
Richiamati dai Controller
Riccardo Cardin
angular.module('finance2', []) .factory('currencyConverter', function() { var currencies = ['USD', 'EUR', 'CNY'], usdToForeignRates = { USD: 1, EUR: 0.74, CNY: 6.09 }; function convert(amount, inCurr, outCurr) { return amount * usdToForeignRates[outCurr] * 1 / usdToForeignRates[inCurr]; }
return { currencies: currencies, convert: convert }; });
private
public
49
Ingegneria del software mod. B
ANGULARJS
Angular services Forniscono utilità comuni alle applicazioni $http
Permette di comunicare con servizi HTTP XMLHttpRequest o JSONP
Utilizza Promises ($q) reactive programming
Gestione history ($location), logging ($log), ...
Riccardo Cardin
$http({method: 'GET', url: '/someUrl'}). success(function(data, status, headers, config) { // this callback will be called asynchronously // when the response is available }). error(function(data, status, headers, config) { // called asynchronously if an error occurs // or server returns response with an error status. });
promise
50
Ingegneria del software mod. B
ANGULARJS
Dependency Injection $provide: risolve le dipendenze fra le
componenti Viene invocato direttamente da Angular al bootstrap
Riccardo Cardin
// Provide the wiring information in a moduleangular.module('myModule', []). // Teach the injector how to build a 'greeter' // Notice that greeter itself is dependent on '$window' factory('greeter', function($window) { // This is a factory function, and is responsible for // creating the 'greet' service. return { greet: function(text) { $window.alert(text); } }; });// Request any dependency from the $injectorangular.injector(['myModule', 'ng']).get('greeter');
"Ricetta" di come costruire greeter
Ritorna il servizio $provide
51
Ingegneria del software mod. B
ANGULARJS
Dependency Injection
Riccardo Cardin
52
Ingegneria del software mod. B
ANGULARJS
Dependency Injection Factory methods: costruiscono le componenti
Utilizzano recipe (ricette)
Riccardo Cardin
angular.module('myModule', []). config(['depProvider', function(depProvider){ //... }]). factory('serviceId', ['depService', function(depService) { //... }]). directive('directiveName', ['depService', function(depService) { //... }]). filter('filterName', ['depService', function(depService) { //... }]). run(['depService', function(depService) { //... }]);
53
Ingegneria del software mod. B
RIFERIMENTI Spring Source, pagina ufficiale del progetto
http://www.springsource.org/ Spring in Action (3° edition), Manning Publications Spring tutorial
http://www.roseindia.net/spring/index.shtml Mastering Web Application Development with
AngularJS, Packt Publishing AngularJS databing http://
docs.angularjs.org/guide/databinding AngularJS controller http://
docs.angularjs.org/guide/controller Inversion of Control Containers and the
Dependency Injection pattern http://martinfowler.com/articles/injection.html
Riccardo Cardin