Akademia MetaPack Uniwersytet Zielonogórski Budowa aplikacji ASP.NET z wykorzystaniem wzorca MVC Krzysztof Blacha Microsoft Certified Professional
Budowa aplikacji ASP.NET z wykorzystaniem wzorca MVC Agenda: 1. Dlaczego w MetaPack budujemy aplikacje wykorzystujące technologię ASP.NET oraz wzorzec MVC? 2. Czym jest platforma ASP.NET MVC? 3. Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 4. Tworzenie testów interfejsu użytkownika dla aplikacji ASP.NET MVC 5. Pytania 2/24
Dlaczego w MetaPack budujemy aplikacje wykorzystujące technologię ASP.NET oraz wzorzec MVC Ponieważ chcemy szybko dostarczyć klientowi produkt zgodny z jego oczekiwaniami oraz jak najmniejszą ilością błędów Wykorzystując do tego narzędzia, które w efektywny i przyjemny dla nas sposób pomogą osiągnąć wszystkie wymagania funkcjonalne i niefunkcjonalne 3/24
Czym jest platforma ASP.NET MVC Wzorzec MVC Definicja wzorca MVC: Wzorzec architektoniczny służący do organizowania struktury aplikacji posiadających graficzne interfejsy użytkownika Wzorzec składa się z: Modelu reprezentuje dane, które użytkownicy przeglądają lub modyfikują Widoku opisuje sposób wyświetlania obiektów modelu w interfejsie użytkownika Kontrolera obsługuje przychodzące żądania, wykonują operacje na modelu oraz wybierają widok do wyświetlenia Uruchamia, aktualizuje Kontroler Widok Powiadamia, aktualizuje Model Aktualizuje Źródło: ASP.NET 4 Zaawansowane programowanie, Adam Freeman 4/24
Repozytorium Czym jest platforma ASP.NET MVC Wzorzec MVC Architektura wzorca MVC: Zapytanie HTTP Odpowiedź HTML Widok Model widoku Kontroler Model Zapis/odczyt do/z bazy Źródło danych Źródło: ASP.NET 4 Zaawansowane programowanie, Adam Freeman 5/24
Czym jest platforma ASP.NET MVC Wzorzec MVC Stos ASP.NET MVC: Strony WWW Usługi Web Forms MVC Inne... ASP.NET: Framework Zaprojektowany do budowy dynamicznych aplikacji internetowych Źródła zostały udostępnione na licencji OpenSource ASP.NET IIS Windows Źródło: http://blogs.msdn.com/b/cesardelatorre/archive/2014/05/12/the-future-of-net-in-the-server-asp-net-vnext-optimized-for-cloud-and-server-workloads.aspx 6/24
Czym jest platforma ASP.NET MVC Zalety i wady platformy Zalety platformy ASP.NET MVC: Wprowadza spójną architekturę Możliwość testowania za pomocą testów jednostkowych Wykorzystanie wcześniej zdobytej wiedzy Możliwość użycia przyjaznych adresów URL dla m.in. SEO Wsparcie dla implementacji bezstanowej aplikacji web Jest szybsze i lżejsze niż klasyczne WebForms Większa kontrola nad wysyłanym do klienta strumieniem HTML Możliwość użycia jednego z silników dla widoków, np. Razor Umożliwia rozszerzenie lub zmianę domyślnych mechanizmów URL - Uniform Resource Locator, SEO - Search Engine Optimization 7/24
Czym jest platforma ASP.NET MVC Zalety i wady platformy Wady platformy ASP.NET MVC: Brak możliwości uruchomienia na systemach innych niż Windows Utrudnione uruchamianie na IIS starszym niż 7 Problem braku wsparcia dla modułowości Brak możliwości łatwego przejścia z innych technologii Brak weryfikacji spójności w strukturze zewnętrznych bibliotek IIS Internet Information Services Źródło: http://www.ytechie.com/2008/10/aspnet-mvc-pros-and-cons/ 8/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 Podstawowe elementy aplikacji ASP.NET MVC w wersji 5: Przestrzeń (ang. area) Kontroler (ang. controller) Akcja (ang. action) Widok, widok szablonu/częściowy (ang. view, layout/partial view) Rezultat uruchomienia akcji (ang. action result) Modele (ang. model) Filtry globalne oraz filtry akcji (ang. global filter, action filter) Mechanizm bindowania (ang. model binder) Convention over configuration Model vs View model vs Input model 9/24
Zdarzenia w procesie aplikacji HTTP Zdarzenia w procesie aplikacji HTTP Czym jest platforma ASP.NET MVC Cykl życia aplikacji Widok cyklu życia aplikacji ASP.NET MVC 5: Żądanie HTTP Tworzenie kontrolera Obsługa routingu Uwierzytelnienie i autoryzacja Odpowiedź HTTP Obsługa MVC Wiązanie modelu Wykonanie metody akcji Wywołanie akcji (z filtrami) Pobranie rezultatu widoku Źródło: http://www.asp.net/mvc/overview/getting-started/lifecycle-of-an-aspnet-mvc-5-application 10/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 Przygotowanie szablonu projektu aplikacji ASP.NET MVC 11/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 1. Stworzenie nowego projeku aplikacji web ASP.NET MVC 12/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 1.1. Wybór szablonu projektu oraz nadanie projektowi nazwy 13/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 1.2. Wybór szablonu aplikacji ASP.NET MVC 14/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 1.3. Struktura solucji projektu aplikacji ASP.NET MVC 15/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 1.3. Struktura solucji projektu aplikacji ASP.NET MVC 16/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 Budowa aplikacji umożliwiającej tworzenie przesyłek poprzez przeglądarkę WWW Nazwa budowanego systemu to QuickConsignment Użyjemy: AspNET MVC 5.2.2, AspNET Razor 3.2.2, jquery 1.9.1, Bootstrap 3.3.2 17/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 DEMO aplikacji QuickConsignment 18/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 Zadania: 1. Przygotowanie szablonu kontrolera Consignment wraz z akcją Send 2. Przygotowanie szablonu modelu dla widoku Send 3. Przygotowanie pliku układu strony oraz szablonu widoku dla akcji Send 4. Implementacja modeli (m.in. SendViewModel) 5. Implementacja widoku Send 6. Implementacja akcji Send 7. Uruchomienie i sprawdzenie działania aplikacji dla akcji Send 19/24
Tworzenie testów interfejsu użytkownika dla aplikacji ASP.NET MVC Weryfikacja zaimplementowanej funkcjonalności aplikacji QuickConsignment 20/24
Czym jest platforma ASP.NET MVC Rodzaje testów Rodzaje testów ze względu na sposób ich przeprowadzania: Manualne ręcznie przez testera, który przechodzi przez interfejs użytkownika zgodnie z ustaloną sekwencją kroków Automatyczne przeprowadzone przez oprogramowanie, które pozwala uruchamiać poprzednio napisane lub nagrane skrypty Testy automatyczne: Jednostkowe testują oprogramowanie na poziomie działania pojedynczych funkcji (metod) Integracyjne pozwalają sprawdzić jak współpracują ze sobą różne komponenty lub warstwy oprogramowania Źródło: Rodzaje testów oprogramowania, Arndt Rafał, Jaśkowski Mikołaj, Szydłowska Anna 21/24
Budowa aplikacji z wykorzystaniem technologii ASP.NET MVC w wersji 5 DEMO testów jednostkowych aplikacji QuickConsignment 22/24
Tworzenie testów interfejsu użytkownika dla aplikacji ASP.NET MVC Zadania: 1. Utworzenie nowego projektu z testami 2. Przygotowanie klasy dla testów kontrolera Consignment 3. Przygotowanie metody dla wybranego scenariusza testowego (akcja Send) 4. Implementacja testu 5. Sprawdzenie działania testu Testy automatyczne - zadania: 1. Implementacja automatycznego testu interfejsu użytkownika 2. Sprawdzenie działania testu automatycznego w przeglądarce Chrome 23/24
Warsztaty Zapraszam na Warsztaty, na których korzystając ze środowiska Visual Studio przygotujemy: 1. Aplikację wykorzystującą technologię ASP.NET MVC 5 2. Automatyczne testy interfejsu użytkownika zintegrowane z testami jednostkowymi Visual Studio 24/24
Warto przeczytać i zobaczyć Literatura: 1. Professional ASP.NET MVC 5 - Jon Galloway, Brad Wilson, K. Scott Allen, David Matson, 2014, Wrox - http://www.wrox.com/wileycda/wroxtitle/professional-asp-net- MVC-5.productCd-1118794753.html Zasoby internetowe: 1. Learn About ASP.NET MVC - http://www.asp.net/mvc 2. Introduction to ASP.NET MVC - http://www.microsoftvirtualacademy.com/trainingcourses/introduction-to-asp-net-mvc 3. Visual Studio Community 2013 - http://www.visualstudio.com/en-us/products/visual-studiocommunity-vs.aspx 4. Developing ASP.NET MVC Web Applications - https://www.microsoft.com/learning/plpl/exam-70-486.aspx 25/24
Pytania Źródło: http://pixabay.com/pl/komiks-przes%c5%82uchania-pytanie-dymek-151341/ 26/24