Aplikacje SPA, Angular, TypeScript. dr hab. inż. Marek Wojciechowski
|
|
- Dominik Sikorski
- 6 lat temu
- Przeglądów:
Transkrypt
1 Aplikacje SPA, Angular, TypeScript dr hab. inż. Marek Wojciechowski
2 Ewolucja aplikacji webowych (pre-spa) Model 1 (pierwotny model WWW) Strony powiązane linkami (jak dokumenty WWW) Model 2 (MVC) Kontroler decyduje o nawigacji Strony nie odwołują się do siebie bezpośrednio Model 3 (MVC + komponenty) Wersja Model 2 inspirowana sposobem działaniem aplikacji desktopowych: komponenty obsługujące zdarzenia Przebudowa i przeładowanie strony w reakcji na zdarzenie (Model 2 / Model 3) + Ajax Częściowa eliminacja nawigacji i odświeżania stron Źródło: 2
3 Single Page Applications (SPA) Strona startowa aplikacji jest jedyną stroną pobieraną w całości z serwera (potem interakcje Ajax, WebSocket) Strona aplikacji nie przeładowuje się w czasie pracy z nią Nie następuje nawigacja do innych stron Zmienia się stan (i wygląd) strony w przeglądarce User Experience (UX) podobny do aplikacji desktopowych Technologie: HTML5, CSS, JavaScript, Ajax, WebSocket Frameworki: Angular, Ember.js, Meteor.js, ExtJS, React, 3
4 Single Page Interface (SPI) Czy model SPA jest odpowiedni tylko dla aplikacji webowych (web applications) czy również dla witryn (web sites)? Pytanie otwarte, różne stanowiska Głos na tak : The Single Page Interface Manifesto ( Problemy przy tworzeniu witryn mocno opartych o Ajax: Zakładki do stanu strony po jej zmianie Ajaksem, historia przeglądarki Indeksowanie przez wyszukiwarki (Search Engine Optimization (SEO)) Model biznesowy oparty o liczbę odwiedzin stron Potrzeba wyskakujących okienek (pop-up) Wolne pierwsze wyświetlenie strony 4
5 Stan aplikacji SPA/SPI W tradycyjnej aplikacji webowej sekwencja stanów aplikacji to sekwencja stron W aplikacji SPA/SPI każda częściowa zmiana strony w przeglądarce (Ajax, DOM) skutkuje zmianą stanu Stany aplikacji SPA/SPI można podzielić na: Stany fundamentalne (odpowiadałyby stronom w modelu tradycyjnym, warte tworzenia zakładek) Stany drugorzędne Przykład kategoryzacji stanów: obsługa logowania Ekran do wprowadzenia użytkownika i hasła (fundamentalny) Informacje o błędach w formularzu logowania (drugorzędny) Ekran powitalny po zalogowaniu (fundamentalny) 5
6 Zakładki i historia przeglądarki w SPA Opis problemu Dla aplikacji SPA samoistnie pojawi się tylko jeden wpis w historii przeglądarki Ewentualna zakładka będzie prowadzić do strony w wersji pobranej z serwera (stan początkowy) Programowa podmiana (JS) window.location (location.href) może spowodować odwołanie przeglądarki do serwera Rozwiązania Wykorzystanie adresów URL adresujących fragmenty stron (#) Podmiana adresu URL (przez location.href lub location.hash) na różniący się od poprzedniego treścią po znaku # nie powoduje odwołania do serwera Wykorzystanie HTML 5 History API: history.pushstate [W obu przypadkach obsługa nawigacji Back/Forward jest programowa] 6
7 Rozwiązania pozostałych problemów modelu SPA/SPI Search Engine Optimization (SEO) Specjalny tryb nawigacji dla robotów (web crawlers) <a href="url page" onclick="return false"> </a> (roboty obecnie ignorują JavaScript) Linki w formacie (Ajax-crawlable): #! (wyszukiwarka widząc taki URL zmienia go na zawierający?_escaped_fragment_ a aplikacja odpowiada snaphotem strony HTML) Zwiększanie licznika odwiedzin stron Ramka IFRAME prowadząca do pustej strony ze skryptem Okienka pop-up Problemy: brak okien modalnych w przeglądarce, współdzielenie stanu między oknami Rozwiązanie: Symulowanie okienek modalnych/niemodalnych za pomocą elementów HTML z odpowiednim pozycjonowaniem 7
8 Architektura aplikacji SPA Źródło: Cechy architektury: Write-only DOM Cały stan aplikacji w komponentach modelu Widoki obserwujące zmiany w modelu Modularyzacja z jak najmniejszymi zależnościami między modułami Jak największa izolacja od implementacji DOM w przeglądarce Brak kontrolera (znanego z MVC) 8
9 Kontrolery w aplikacjach SPA? Część pierwszych frameworków dla aplikacji SPA (np. AngularJS 1.x) przeniosło do przeglądarki wzorzec architektoniczny MVC sprawdzony i powszechny po stronie serwerowej Separacja modeli i widoków powszechnie akceptowana, ale czy spoiwem powinien być kontroler? Koncepcja Model-View-Whatever, MV* Typowe zadania przydzielane kontrolerom w SPA: Obsługa zdarzeń w modelu DOM Renderowanie szablonów widoków Synchronizacja widoków z modelami Lepiej jest powyższe zadania rozdzielić (zasada pojedynczej odpowiedzialności) 9
10 Angular (2.x) / AngularJS (1.x) Front-endowy framework do tworzenia aplikacji webowych Rozwijany pod skrzydłami Google Głównie zorientowany na aplikacje SPA Od wersji 2.0 pozycjonowany jako jeden framework dla aplikacji webowych, mobilnych i desktopowych Zaimplementowany w języku JavaScript i (od wersji 2.0) TypeScript, wykorzystujący HTML i CSS Główna motywacja: HTML jest odpowiedni dla stron WWW, ale nieodpowiedni dla aplikacji webowych 10
11 AngularJS 1.x Framework oparty o wzorzec MVC po stronie klienta Obiekt scope ($scope) jako sposób współdzielenia danych między kontrolerem a widokiem Spoiwo między kontrolerem i widokiem, pełni rolę ViewModel Wiązanie danych (data binding): Interpolacje {{ }}, one-way data binding, two-way data binding Dyrektywy ng-* dodatkowe atrybuty dla elementów HTML np. ng-app, ng-model, ng-repeat Filtry filtracja, sortowanie, transformacja danych 4 rodzaje komponentów do logiki biznesowej: Factory, Service, Provider, Value Routing nawigacja między widokami aplikacji SPA Modularność (Angular modules) 11
12 AngularJS 1.x Hello World <!doctype html> <html ng-app> <head> <script src=" </script> </head> <body> <div> <label>name:</label> <input type="text" ng-model="yourname" placeholder="enter a name here"> <hr> <h1>hello {{yourname uppercase}}!</h1> </div> </body> </html> Na podstawie: 12
13 Web Components Zbiór cech dodawanych do specyfikacji HTML i DOM Częściowo wspierany przez współczesne przeglądarki Wsparcie dla starszych przeglądarek poprzez polyfille Intencja: przeniesienie komponentowego modelu tworzenia aplikacji na grunt WWW umożliwienie tworzenia reużywalnych komponentów (widgets) do wykorzystania na stronach WWW i po stronie front-endu aplikacji webowych Cechy (rodzaje Web Components) Custom Elements - APIs to definiowania nowych elementów HTML Shadow DOM enkapsulacja DOM i styli w elemencie HTML Przeglądarka renderuje DOM elementów z Shadow DOM bez umieszczania ich w DOM głównego dokumntu HTML Imports deklaratywny import dokumentów HTML do innych dokumentów HTML HTML Templates szablony fragmentów HTML 13
14 Angular 2 na tle Angular 1.x Istotne zmiany w porównaniu z Angular 1.x Właściwie nowy framework Brak zgodności wstecz, opcja migracji i współistnienia obu wersji w obrębie jednej aplikacji Duże zmiany w czasie jego rozwoju (Alpha->Developer Preview->Beta->Final) wiele tutoriali nieaktualnych Witany przez deweloperów z mieszanymi uczuciami Przyczyny radykalnych zmian: Rozwój języka JavaScript, pojawienie się języka TypeScript Rozwój przeglądarek Nowe trendy, np. Web Components Nadmierna komplikacja niektórych aspektów Angular 1.x (np. kilka rodzajów komponentów logiki biznesowej) Problemy wydajnościowe (np. gdy dużo danych w $scope) 14
15 Cechy Angular 2 (zalety na tle 1.x) Framework również dla urządzeń mobilnych Większa modularność Wsparcie tylko współczesnych przeglądarek Uproszczenie frameworka przez brak workarounds dla starszych Orientacja na język TypeScript Choć możliwe jest programowanie w czystym JavaScript Wykorzystanie elementów ECMAScript 2015 Dynamiczne ładowanie Prostszy routing, serwisy do logiki biznesowej Poprawione wstrzykiwanie zależności Komponenty i dyrektywy zamiast kontrolerów i $scope Programowanie reaktywne (RxJs) 15
16 TypeScript Nadzbiór języka JavaScript rozwijany przez Microsoft Ze względu na postulowaną nieodpowiedniość JS dla dużych aplikacji Powstał jako rozszerzenie ECMAScript 5, z uwzględnieniem cech przewidywanych w ECMAScript 6 Transpilowany do kodu JavaScript Najważniejsze cechy języka TypeScript: Klasy, moduły, funkcje strzałkowe, param. opcjonalne/domyślne (ES6) Składowe public (domyślnie), protected i private, przestrzenie nazw Adnotacje typu i kontrola typów na etapie kompilacji Automatyczna dedukcja typu (type inference) Interfejsy, klasy używane jako interfejsy (implements) Typy generyczne (<>), typy wyliczeniowe (enum), unie (union type), krotki (tuple) Domieszki (mixins) w części implementowane programowo Dekoratory (@) 16
17 AngularJS 2.x Hello World import { Component } from selector: 'my-app', template: `<h1>hello {{name}}</h1>` }) export class AppComponent { name: string = 'Marek'; } component = directive + template Na podstawie: 17
Aplikacje SPA, Angular, TypeScript. dr hab. inż. Marek Wojciechowski
Aplikacje SPA, Angular, TypeScript dr hab. inż. Marek Wojciechowski Ewolucja aplikacji webowych (pre-spa) Model 1 (pierwotny model WWW) Strony powiązane linkami (jak dokumenty WWW) Model 2 (MVC) Kontroler
Bardziej szczegółowoWYKŁAD 1 ANGULARJS CZĘŚĆ 1
WYKŁAD 1 ANGULARJS CZĘŚĆ 1 DEFINICJA ANGULARJS Framework JavaScript na licencji open-source wykorzystywany do tworzenia aplikacji SPA (single page applications) w oparciu o wzorzec projektowy Model-View-Controler.
Bardziej szczegółowoFull Stack JavaScript z Angular i Nest. Dni: 5. Opis: Adresaci szkolenia
Kod szkolenia: Tytuł szkolenia: DED/FSJS Full Stack JavaScript z Angular i Nest Dni: 5 Opis: Adresaci szkolenia Kurs przeznaczony jest dla programistów posiadających podstawową wiedzę w zakresie JavaScript,
Bardziej szczegółowoO sobie. Adam Kowalski. Absolwent informatyki Uniwersytetu Wrocławskiego Full-stack Developer w firmie Synergy Codes.
Wstęp do Angulara O sobie Adam Kowalski Absolwent informatyki Uniwersytetu Wrocławskiego Full-stack Developer w firmie Synergy Codes adam.kowalski@synergycodes.com https://www.synergycodes.com Plan wykładu
Bardziej szczegółowoTytuł szkolenia: Angular 4 - budowanie nowoczesnych i wydajnych aplikacji przeglądarkowych
Kod szkolenia: ANGULAR 4 Tytuł szkolenia: Angular 4 - budowanie nowoczesnych i wydajnych aplikacji przeglądarkowych Dni: 5 Opis: Adresaci szkolenia Kurs przeznaczony jest dla programistów posiadających
Bardziej szczegółowoANGULAR 2+ Waldemar Korłub. Aplikacje i Usługi Internetowe KASK ETI Politechnika Gdańska
ANGULAR 2+ Waldemar Korłub Aplikacje i Usługi Internetowe KASK ETI Politechnika Gdańska 2 Architektura MVC: Model View Controller 3 Wzorzec architektoniczny modelujący przepływ sterowania w interfejsie
Bardziej szczegółowoANGULARJS TWORZENIE APLIKACJI INTERNETOWYCH
ANGULARJS TWORZENIE APLIKACJI INTERNETOWYCH szkolenie dla webdeveloperów ze znajomością przynajmniej podstaw HTML i JavaScript INFORMACJE PODSTAWOWE AngularJS to framework JavaScript stworzony przez inżynierów
Bardziej szczegółowoSzkolenie wycofane z oferty
Szkolenie wycofane z oferty Program szkolenia: Java Server Faces 2 Informacje: Nazwa: Java Server Faces 2 Kod: Java-EE-JSF 2 Kategoria: Java EE Grupa docelowa: developerzy Czas trwania: 3 dni Forma: 50%
Bardziej szczegółowoASP.NET MVC. Grzegorz Caban grzegorz.caban@gmail.com. 20 stycznia 2009
ASP.NET MVC Grzegorz Caban grzegorz.caban@gmail.com 20 stycznia 2009 Agenda Przyczyna powstania Co to jest ASP.NET MVC Architektura Hello World w ASP.NET MVC ASP.NET MVC vs ASP.NET WebForm Przyszłość framework'a
Bardziej szczegółowoFramework Angular4. Alicja Frankowicz Weronika Węglińska
Framework Angular4 Alicja Frankowicz Weronika Węglińska Angular Pierwszym wydaniem Angulara był Angular1, zwany także AngularJS. Opierał się on na języku JavaScript oraz na wzorcu MVC wdrożonego do aplikacji
Bardziej szczegółowoTechnologie dla aplikacji klasy enterprise. Wprowadzenie. Marek Wojciechowski
Technologie dla aplikacji klasy enterprise Wprowadzenie Marek Wojciechowski Co oznacza enterprise-ready? Bezpieczeństwo Skalowalność Stabilność Kompatybilność wstecz Wsparcie Dokumentacja Łatwość integracji
Bardziej szczegółowoANGULAR 2+ Waldemar Korłub. Aplikacje i Usługi Internetowe KASK ETI Politechnika Gdańska
ANGULAR 2+ Waldemar Korłub Aplikacje i Usługi Internetowe KASK ETI Politechnika Gdańska 2 Architektura Architektura frameworka Angular 3 Aplikacja wykorzystuje język HTML i style CSS Poza standardowymi
Bardziej szczegółowoPrzygotowanie do nowoczesnego programowania po stronie przeglądarki. (HTML5, CSS3, JS, wzorce, architektura, narzędzia)
Program szkolenia: Przygotowanie do nowoczesnego programowania po stronie przeglądarki (HTML5, CSS3, JS, wzorce, architektura, narzędzia) Informacje: Nazwa: Kod: Kategoria: Grupa docelowa: Czas trwania:
Bardziej szczegółowoAplikacje Internetowe
Aplikacje Internetowe ITA-103 Wersja 1 Warszawa, październik 2008 Spis treści Wprowadzenie i-4 Moduł 1 Podstawy HTML 1-1 Moduł 2 Kaskadowe Arkusze Stylów CSS 2-1 Moduł 3 Podstawy JavaScript 3-1 Moduł 4
Bardziej szczegółowoREACT NATIVE. Anna Maziejuk Kamil Jankowski
REACT NATIVE Anna Maziejuk Kamil Jankowski React Native Framework/biblioteka bazujący na React Pozwala na tworzenie aplikacji tylko za pomocą języka JavaScript Wspiera platformy ios i Android REACT React
Bardziej szczegółowoBudowa aplikacji ASP.NET z wykorzystaniem wzorca MVC
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:
Bardziej szczegółowoAngular, cz. II. Tworzenie serwisów Web 2.0. dr inż. Robert Perliński rperlinski@icis.pcz.pl
ngular, cz. II 1/24 Angular, cz. II Tworzenie serwisów Web 2.0 dr inż. Robert Perliński rperlinski@icis.pcz.pl Politechnika Częstochowska Instytut Informatyki Teoretycznej i Stosowanej 10 kwietnia 2015
Bardziej szczegółowoArchitektura MVC w ASP.NET. Autor wykładu: Marek Wojciechowski
Architektura MVC w ASP.NET Autor wykładu: Marek Wojciechowski Modele programistyczne ASP.NET Web Forms Komponentowy interfejs użytkownika (kontrolki) Programowanie wizualno-zdarzeniowe Klasyczna składnia
Bardziej szczegółowoAgenda. Wstęp Zmiany Co nowego dla web developerów? Nowości we front-end developingu Czego spodziewać się może końcowy użytkownik?
Agenda Wstęp Zmiany Co nowego dla web developerów? Nowości we front-end developingu Czego spodziewać się może końcowy użytkownik? Podsumowanie Drupal 8 w liczbach 26 nowych modułów 6 608 plików 247 597
Bardziej szczegółowoEfektywne tworzenie aplikacji webowych z wykorzystaniem AngularJS, HTML5 i JavaScript
Kod szkolenia: Tytuł szkolenia: HTML5/ANG Efektywne tworzenie aplikacji webowych z wykorzystaniem AngularJS, HTML5 i JavaScript Dni: 5 Opis: Adresaci szkolenia: Kurs przeznaczony jest dla programistów
Bardziej szczegółowoPLAN WYNIKOWY PROGRAMOWANIE APLIKACJI INTERNETOWYCH. KL III TI 4 godziny tygodniowo (4x30 tygodni =120 godzin ),
PLAN WYNIKOWY PROGRAMOWANIE APLIKACJI INTERNETOWYCH KL III TI 4 godziny tygodniowo (4x30 tygodni =120 godzin ), Program 351203 Opracowanie: Grzegorz Majda Tematyka zajęć 1. Wprowadzenie do aplikacji internetowych
Bardziej szczegółowoREFERAT O PRACY DYPLOMOWEJ
REFERAT O PRACY DYPLOMOWEJ Temat pracy: Projekt i budowa systemu zarządzania treścią opartego na własnej bibliotece MVC Autor: Kamil Kowalski W dzisiejszych czasach posiadanie strony internetowej to norma,
Bardziej szczegółowoProgramowanie obiektowe
Programowanie obiektowe Wykład 7 Marcin Młotkowski 8 kwietnia 2015 Plan wykładu Z życia programisty, część 1 1 Z życia programisty, część 1 2 3 Z życia programisty, część 2 Model View Controller MVC w
Bardziej szczegółowoPROJEKTOWANIE APLIKACJI INTERNETOWYCH
PROJEKTOWANIE APLIKACJI INTERNETOWYCH (WFAIS.IF-N016) dr inż. Marcin Zieliński Wykład dla kierunku: Informatyka Stosowana I rok, II stopień Rok akademicki: 2016/2017 - semestr letni WYKŁAD 2 Przypomnienie
Bardziej szczegółowoProgram szkolenia: JavaScript Craftsmanship
Program szkolenia: JavaScript Craftsmanship Informacje: Nazwa: Kod: Kategoria: Grupa docelowa: Czas trwania: Forma: JavaScript Craftsmanship Craft-practices-js-craft Craftsmanship developerzy architekci
Bardziej szczegółowoWybrane działy Informatyki Stosowanej
Wybrane działy Informatyki Stosowanej Aplikacje WWW. Statyczne oraz dynamiczne strony WWW. Skrypty po stronie klienta. Dr inż. Andrzej Czerepicki a.czerepicki@wt.pw.edu.pl http://www2.wt.pw.edu.pl/~a.czerepicki
Bardziej szczegółowoFront-end: solidne podstawy. Wszystko, co warto wiedzieć o HTML, CSS, JavaScript i Bootstrap.
Kod szkolenia: Tytuł szkolenia: FRONT-END Front-end: solidne podstawy. Wszystko, co warto wiedzieć o HTML, CSS, JavaScript i Bootstrap. Dni: 5 Opis: Adresaci szkolenia Kurs przeznaczony jest zarówno dla
Bardziej szczegółowoProjekt warsztatów. Full Stack Developer. Autor: Kamil Wołczyk
Projekt warsztatów Full Stack Developer Autor: Kamil Wołczyk Styczeń 2017 Harmonogram Sobota Niedziela Miesiąc 04 05 marzec - 11 12 marzec ZJAZD 18 19 marzec - 25 26 marzec ZJAZD 01 02 kwiecień - 08 09
Bardziej szczegółowoSpring Framework - wprowadzenie i zagadnienia zaawansowane
Program szkolenia: Spring Framework - wprowadzenie i zagadnienia zaawansowane Informacje ogólne Nazwa: Kod: Kategoria: Grupa docelowa: Czas trwania: Forma: Spring Framework - wprowadzenie i zagadnienia
Bardziej szczegółowoFull Stack Developer
Regulamin szkolenia Full Stack Developer Edycja 2 Autor: Kamil Wołczyk Maj 2017 Harmonogram Sobota Niedziela Miesiąc 07 08 październik ZJAZD 14 15 październik - 21 22 październik ZJAZD 28 29 październik
Bardziej szczegółowoSzczegółowy opis zamówienia:
Szczegółowy opis zamówienia: Rok 2016 budowa stron w html5 (8h v + 4h ćw) 8 szt. html5 - zaawans. (7h v + 5h ćw) 8 szt. programowania w java script (9h v + 7h ćw) 8 szt. java script zaawans (8h v + 4h
Bardziej szczegółowoZAAWANSOWANE PROGRAMOWANIE W JĘZYKU SKRYPTOWYM
ZAAWANSOWANE PROGRAMOWANIE W JĘZYKU SKRYPTOWYM Waldemar Korłub Aplikacje i Usługi Internetowe KASK ETI Politechnika Gdańska Agenda 2 Zaawansowane programowanie w przeglądarce Bogate aplikacje klienckie
Bardziej szczegółowoWybrane działy Informatyki Stosowanej
Wybrane działy Informatyki Stosowanej Aplikacje WWW. Statyczne oraz dynamiczne strony WWW. Skrypty po stronie klienta. dr hab. inż. Andrzej Czerepicki a.czerepicki@wt.pw.edu.pl http://www2.wt.pw.edu.pl/~a.czerepicki
Bardziej szczegółowoWYKŁAD 1 TECHNOLOGIE FRONT-END CZĘŚĆ 1
WYKŁAD 1 TECHNOLOGIE FRONT-END CZĘŚĆ 1 TROCHĘ HISTORII strona internetowa Webmaster - grafika, baza, programowanie, layout (Photoshop, MySQL, PHP, HTML, CSS, JS) strona internetowa Grafik - grafika (Photoshop,
Bardziej szczegółowoPoznaj ASP.NET MVC. Kamil Cieślak Microsoft Student Partner 2013-03-11
Poznaj ASP.NET MVC Kamil Cieślak Microsoft Student Partner 2013-03-11 Agenda Czym jest ASP.NET MVC? Wzorzec MVC ASP.NET MVC vs inne frameworki Bazy danych w ASP.NET MVC Jak zacząć? 2 Czym jest ASP.NET
Bardziej szczegółowoAplikacje Internetowe
Aplikacje Internetowe ITA-103 Wersja 1 Warszawa, październik 2008 2008 Piotr Bubacz. Autor udziela prawa do bezpłatnego kopiowania i dystrybuowania wśród pracowników uczelni oraz studentów objętych programem
Bardziej szczegółowoTworzenie witryn internetowych PHP/Java. (mgr inż. Marek Downar)
Tworzenie witryn internetowych PHP/Java (mgr inż. Marek Downar) Rodzaje zawartości Zawartość statyczna Treść statyczna (np. nagłówek, stopka) Layout, pliki multimedialne, obrazki, elementy typograficzne,
Bardziej szczegółowoKurs ASP.NET ASP.NET CORE APLIKACJE WEBOWE
Kurs ASP.NET ASP.NET CORE APLIKACJE WEBOWE Cena szkolenia Cena szkolenia wynosi 100 zł za 60 min. Ilość godzin szkolenia jest zależna od postępów w nauce uczestnika kursu oraz ilości czasu, którą będzie
Bardziej szczegółowoW czystym JavaScripcie zasięgi zmiennych tworzone były poprzez funkcje anonimowe, w AngularJS posiadamy kontrolery, które także są funkcjami.
Zrozumienie tego artykułu jest kluczowe aby móc tworzyć aplikacje w AngularJS. Do tej pory powinieneś wiedzieć czym jest Angular, umieć utworzyć moduł główny aplikacji i podpiąć do niego kontroler. Zdefiniowany
Bardziej szczegółowoFlex 3. Piotr Strzelczyk Wydział EAIiE Katedra Automatyki. Kraków, 2008
Flex 3 Piotr Strzelczyk Wydział EAIiE Katedra Automatyki Kraków, 2008 Flex 3 czyli co to jest? RIA (Rich Internet Application) Jest to aplikacja webowa posiadająca moŝliwości aplikacji desktopowej. UmoŜliwia
Bardziej szczegółowoFunkcje i instrukcje języka JavaScript
Funkcje i instrukcje języka JavaScript 1. Cele lekcji a) Wiadomości Uczeń : zna operatory i typy danych języka JavaScript, zna konstrukcję definicji funkcji, zna pętlę If i For, Do i While oraz podaje
Bardziej szczegółowoExulto Software House
Exulto Software House Oferta i cennik współpracy programistycznej biuro@exulto.pl Tworzymy autorskie aplikacje internetowe, z wykorzystaniem nowoczesnych technologii. Przygotowanie aplikacji internetowej,
Bardziej szczegółowoTworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery Łukasz Bartczuk Moduł 6 JavaScript w przeglądarce Agenda Skrypty na stronie internetowej Model DOM AJAX Skrypty na stronie
Bardziej szczegółowoWebowy generator wykresów wykorzystujący program gnuplot
Uniwersytet Mikołaja Kopernika Wydział Fizyki, Astronomii i Informatyki Stosowanej Marcin Nowak nr albumu: 254118 Praca inżynierska na kierunku informatyka stosowana Webowy generator wykresów wykorzystujący
Bardziej szczegółowoAjax. 1. Wprowadzenie. 2. Aplikacja serwerowa
Ajax 1. Wprowadzenie Do tej pory każda akcja na Waszej stronie kończyła się nowym requestem do serwera i przeładowaniem całej strony w przeglądarce. W tej instrukcji dodamy elementy asynchroniczne na stronie,
Bardziej szczegółowoModele danych walidacja widoki zorientowane na model
Modele danych walidacja widoki zorientowane na model 1. Wprowadzenie Modele danych Modele danych w ASP.NET MVC to klasy znajdujące się w katalogu Models. Ich zadaniem jest mapowanie danych przesyłanych
Bardziej szczegółowoPlan. Aplikacja. Architektura aplikacji. Architektura aplikacji Tworzenie aplikacji Application Builder podstawy
Plan Podstawy narzędzia Application Builder, 2 budowa strony, kreatory Architektura Tworzenie Tworzenie formularza tabelarycznego Budowa strony 2 Architektura Aplikacja kolekcja stron połączonych ze sobą
Bardziej szczegółowoComarch B2B Ulotka. Comarch ERP XL / Comarch ERP Altum. Zmiany w wersji
Comarch B2B Ulotka Comarch ERP XL / Comarch ERP Altum Zmiany w wersji 2018.1 Data produkcji wersji 26 luty 2018 Copyright 2018 COMARCH Wszelkie prawa zastrzeżone Nieautoryzowane rozpowszechnianie całości
Bardziej szczegółowoPrzykłady tworzenia aplikacji komponentowych w technologii JavaServer Faces 2.1 na podstawie
Przykłady tworzenia aplikacji komponentowych w technologii JavaServer Faces 2.1 na podstawie http://docs.oracle.com/javaee/6/tutorial/doc/ Przykłady na podstawie zadań lab. z przedmiotu Technologie internetowe
Bardziej szczegółowoProgramowanie zorientowane obiektowo. Mateusz Kołecki
Programowanie zorientowane obiektowo Mateusz Kołecki Plan MVC Wstęp Separacja odpowiedzialnośći Antyprzykład Dobry przykład Wady/zalety MVC MVC to tylko początek - wzorce projektowe Dlaczego chcemy używać
Bardziej szczegółowoComarch B2B Ulotka. Comarch ERP XL / Comarch ERP Altum. Zmiany w wersji
Comarch B2B Ulotka Comarch ERP XL / Comarch ERP Altum Zmiany w wersji 2018.4 Data produkcji wersji 30 lipiec 2018 Copyright 2018 COMARCH Wszelkie prawa zastrzeżone Nieautoryzowane rozpowszechnianie całości
Bardziej szczegółowoJAVA. Java jest wszechstronnym językiem programowania, zorientowanym. apletów oraz samodzielnych aplikacji.
JAVA Java jest wszechstronnym językiem programowania, zorientowanym obiektowo, dostarczającym możliwość uruchamiania apletów oraz samodzielnych aplikacji. Java nie jest typowym kompilatorem. Źródłowy kod
Bardziej szczegółowoLaboratorium 4: Routing
Laboratorium 4: Routing Ćwiczenie 1. Przygotowanie routingu Czas na coś bardziej skomplikowanego. Strona główna naszej galerii gotowa, pora dodać coś bardziej złożonego. Każdy nasz album zdjęciowy powinien
Bardziej szczegółowoZrąb JavascriptMVC. Krzysztof Płocharz. 6 kwiecień 2009. Uniwersytet Warszawski
Uniwersytet Warszawski 6 kwiecień 2009 Spis Treści 1 MVC Jak to wygląda w JavascriptMVC 2 Prawie jak klasy 3 Hierarchia Widoki Kontrolery Modele 4 Struktura katalogów Generatory kodu Generatory dokumentacji
Bardziej szczegółowoProduktywne tworzenie aplikacji webowych z wykorzystaniem Groovy i
Program szkolenia: Produktywne tworzenie aplikacji webowych z wykorzystaniem Groovy i Informacje: Nazwa: Kod: Kategoria: Grupa docelowa: Czas trwania: Forma: Produktywne tworzenie aplikacji webowych z
Bardziej szczegółowoKARTA PRZEDMIOTU. Warsztaty z Ruby on Rails. Ruby on Rails Workshop
KARTA PRZEDMIOTU Warsztaty z Ruby on Rails Ruby on Rails Workshop realizowanego w ramach projektu PO WER 2017 2019 Wydział Inżynierii Elektrycznej i Komputerowej Kierunek studiów: Informatyka Profil: ogólnoakademicki
Bardziej szczegółowoOracle Application Express -
Oracle Application Express - Wprowadzenie Wprowadzenie Oracle Application Express (dawniej: HTML DB) to narzędzie do szybkiego tworzenia aplikacji Web owych korzystających z bazy danych Oracle. Od użytkownika
Bardziej szczegółowoProgramowanie obiektowe
Programowanie obiektowe Laboratorium 11 - przegląd wybranych wzorców mgr inż. Krzysztof Szwarc krzysztof@szwarc.net.pl Sosnowiec, 24 maja 2017 1 / 38 mgr inż. Krzysztof Szwarc Programowanie obiektowe Wzorce
Bardziej szczegółowoDjango : praktyczne tworzenie aplikacji sieciowych / Antonio Mele. Gliwice, cop Spis treści
Django : praktyczne tworzenie aplikacji sieciowych / Antonio Mele. Gliwice, cop. 2016 Spis treści O autorze 13 O recenzentach technicznych 14 Wprowadzenie 17 Rozdział 1. Utworzenie aplikacji bloga 21 Instalacja
Bardziej szczegółowoSerwery aplikacji. dr Radosław Matusik. radmat
www.math.uni.lodz.pl/ radmat EL - Expression Language Załóżmy, że mamy klasę Pracownik, której atrybutem jest PESEL. Załóżmy dalej, że w atrybucie sesji zalogowany przechowujemy obiekt aktualnie zalogowanego
Bardziej szczegółowoGoogle Web Toolkit Michał Węgorek ZPO 2009
Google Web Toolkit Michał Węgorek ZPO 2009 Plan prezentacji Czym jest GWT? Co daje GWT motywacja Po co tłumaczyć Javę do JavaScriptu? - AJAX niebezpieczeństwa - Przewaga GWT nad AJAX - RPC - Utrzymywanie
Bardziej szczegółowoWeb frameworks do budowy aplikacji zgodnych z J2EE
Web frameworks do budowy aplikacji zgodnych z J2EE Jacek Panachida promotor: dr Dariusz Król Przypomnienie Celem pracy jest porównanie wybranych szkieletów programistycznych o otwartym kodzie źródłowym
Bardziej szczegółowoPROGRAM NAUCZANIA DLA ZAWODU TECHNIK INFORMATYK, 351203 O STRUKTURZE PRZEDMIOTOWEJ
PROGRAM NAUCZANIA DLA ZAWODU TECHNIK INFORMATYK, 351203 O STRUKTURZE PRZEDMIOTOWEJ Systemy baz danych 1. 2 Wstęp do baz danych 2. 2 Relacyjny model baz danych. 3. 2 Normalizacja baz danych. 4. 2 Cechy
Bardziej szczegółowoMVC w praktyce tworzymy system artykułów. cz. 2
MVC w praktyce tworzymy system artykułów. cz. 2 W drugiej części artykułu o wzorcu MVC stworzymy część skryptu, odpowiedzialną za obsługę kategorii. Tworzymy kontroler kategorii Na początek stwórzmy plik
Bardziej szczegółowoWidżety KIWIPortal. tworzenie umieszczanie na stronach internetowych opcje zaawansowane. Autor: Damian Rebuś Data: 29.06.2015 Wersja: 1.
Widżety KIWIPortal tworzenie umieszczanie na stronach internetowych opcje zaawansowane Autor: Damian Rebuś Data: 29.06.2015 Wersja: 1.3 Strona 1 z 17 1 SPIS TREŚCI 2 Metody osadzania widżetów... 3 2.1
Bardziej szczegółowoTechnologie internetowe ASP.NET Core. Paweł Rajba
Technologie internetowe ASP.NET Core Paweł Rajba pawel@cs.uni.wroc.pl http://itcourses.eu/ Plan wykładu Wprowadzenie Podstawowa aplikacja Usługi i middleware Obsługa błędów Request, Response, ciastka i
Bardziej szczegółowoOmówienie wzorców wykorzystywanych w Prism 5.0. Dominika Różycka
1 Omówienie wzorców wykorzystywanych w Prism 5.0 Dominika Różycka Czym jest wzorzec projektowy? 2 3 Wzorzec projektowy 1. Uniwersalne i sprawdzone w praktyce rozwiązanie często pojawiających się, powtarzalnych
Bardziej szczegółowoWzorce logiki dziedziny
Wzorce logiki dziedziny 1. Wzorce logiki dziedziny skrypt transakcji (Transaction Script), brama tabeli (Table Data Gateway), model dziedziny (Domain model), strategia (Strategy), moduł tabeli (Table Module),
Bardziej szczegółowoZaawansowane aplikacje internetowe
Zaawansowane aplikacje internetowe AJAX 1 Celem tego laboratorium jest pokazanie moŝliwości technologii AJAX. W ramach ćwiczeń zostanie zbudowana prosta aplikacja, przechwytująca kliknięcia uŝytkownika
Bardziej szczegółowoWICKET VS. DJANGO. Leszek Gawron vs. Michał Leszczyński
WICKET VS. DJANGO Leszek Gawron vs. Michał Leszczyński 0. Główne ficze 1. Środowisko developerskie AGENDA 2. Uruchomienie projektów 3. Warstwa DAO/serwisów 4. Tworzenie UI 5. Templating 7. i18n 8. Reusability
Bardziej szczegółowoJAVA NA SERWERZE SPRING. Waldemar Korłub. Platformy Technologiczne KASK ETI Politechnika Gdańska
JAVA NA SERWERZE SPRING Waldemar Korłub Platformy Technologiczne KASK ETI Politechnika Gdańska Java na serwerze 2 https://zeroturnaround.com/rebellabs/most-popular-java-frameworks-tools-and-libraries-2016/
Bardziej szczegółowoWzorce Strukturalne. Adapter: opis. Tomasz Borzyszkowski
Adapter: opis Wzorce Strukturalne Tomasz Borzyszkowski Alternatywna nazwa: Wrapper (opakowanie) Rola obiektu Adapter: pełni wobec Klienta rolę otoczki, która umożliwia przetłumaczenie jego żądań na protokół
Bardziej szczegółowoContexts and Dependency Injection (CDI) Autor wykładu: Marek Wojciechowski
Contexts and Dependency Injection (CDI) Autor wykładu: Marek Wojciechowski ASP.NET (2) Contexts and Dependency Injection (CDI) Specyfikacja składowa Java EE 6 dotycząca współpracy warstwy prezentacji z
Bardziej szczegółowoProgramowanie Urządzeń Mobilnych. Część II: Android. Wykład 2
Programowanie Urządzeń Mobilnych Część II: Android Wykład 2 1 Aplikacje w systemie Android Aplikacje tworzone są w języku Java: Skompilowane pliki programów ( dex ) wraz z plikami danych umieszczane w
Bardziej szczegółowoŹródła. cript/1.5/reference/ Ruby on Rails: http://www.rubyonrails.org/ AJAX: http://www.adaptivepath.com/publications/e ssays/archives/000385.
Źródła CSS: http://www.csszengarden.com/ XHTML: http://www.xhtml.org/ XML: http://www.w3.org/xml/ PHP: http://www.php.net/ JavaScript: http://devedgetemp.mozilla.org/library/manuals/2000/javas cript/1.5/reference/
Bardziej szczegółowoSOA Web Services in Java
Wydział Informatyki i Zarządzania Wrocław,16 marca 2009 Plan prezentacji SOA 1 SOA 2 Usługi Przykłady Jak zacząć SOA Wycinek rzeczywistości Problemy zintegrowanych serwisów : Wycinek Rzeczywistości Zacznijmy
Bardziej szczegółowoImię, nazwisko i tytuł/stopień KOORDYNATORA (-ÓW) kursu/przedmiotu zatwierdzającego protokoły w systemie USOS Dr Adam Naumowicz
SYLLABUS na rok akademicki 01/013 Tryb studiów Studia stacjonarne Kierunek studiów Informatyka Poziom studiów Pierwszego stopnia Rok studiów/ semestr II/4 Specjalność Bez specjalności Kod katedry/zakładu
Bardziej szczegółowoProgramowanie i projektowanie obiektowe
Programowanie i projektowanie obiektowe CherryPy, Genshi Paweł Daniluk Wydział Fizyki Jesień 2016 P. Daniluk(Wydział Fizyki) PO w. IX Jesień 2016 1 / 20 Aplikacje webowe Podejście standardowe Serwer (np.
Bardziej szczegółowoProjekt Giełdy Terminów Koncepcja. 19 czerwca 2015
Projekt Giełdy Terminów Koncepcja Michał Begejowicz Bartosz Żurkowski 19 czerwca 2015 Spis treści 1 Wstęp 3 1.1 Ogólny opis......................... 3 2 Architektura systemu 4 2.1 Model............................
Bardziej szczegółowoWzorce prezentacji internetowych
Wzorce prezentacji internetowych 1. Model kontrolera widoku (Model View Controller). 2. Kontroler strony (Page Controller). 3. Kontroler fasady (Front Controller). 4. Szablon widoku (Template View). 5.
Bardziej szczegółowoGoogle Web Toolkit. Piotr Findeisen
Google Web Toolkit Piotr Findeisen findepi@students.mimuw.edu.pl Czym jest GWT kompilator Javy do Javascriptu biblioteki Java/Javascript emulacja części java.lang i java.util webowe okienka narzędzia do
Bardziej szczegółowoASP.NET MVC. Podstawy. Zaawansowane programowanie internetowe Instrukcja nr 3
3 ASP.NET MVC Podstawy 1 1. Cel zajęć Celem zajęć jest zapoznanie się z podstawami ASP.NET MVC 2.0 Framework. 2. Zadanie Proszę zbudować prostą aplikację WWW przy zastosowaniu framework a ASP.NET MVC 2.0
Bardziej szczegółowo2 Podstawy tworzenia stron internetowych
2 Podstawy tworzenia stron internetowych 2.1. HTML5 i struktura dokumentu Podstawą działania wszystkich stron internetowych jest język HTML (Hypertext Markup Language) hipertekstowy język znaczników. Dokument
Bardziej szczegółowoInfrastruktura aplikacji WWW
ASP.NET WebForms Infrastruktura aplikacji WWW Gotowe rozwiązania architektoniczne i szkielety aplikacji zwalniają twórców aplikacji z implementacji infrastruktury, zwiększając ich produktywność Stanowy,
Bardziej szczegółowoREFERAT O PRACY DYPLOMOWEJ
REFERAT O PRACY DYPLOMOWEJ Temat pracy: Projekt i realizacja elektronicznego dziennika ocen ucznia Autor: Grzegorz Dudek wykonanego w technologii ASP.NET We współczesnym modelu edukacji, coraz powszechniejsze
Bardziej szczegółowoTworzenie i wykorzystanie usług sieciowych
Ćwiczenie 14 Temat: Tworzenie i wykorzystanie usług sieciowych Cel ćwiczenia: W trakcie ćwiczenia student zapozna się z procedurą tworzenia usługi sieciowej w technologii ASP.NET oraz nauczy się tworzyć
Bardziej szczegółowoSUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania. Wykład 2. dr Artur Bartoszewski - WYKŁAD: Języki i Systemy Programowania,
SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Wykład 2 1 SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Przekierowania 2 Przekierowanie za pomocą skryptu Przykład
Bardziej szczegółowoASP.NET MVC. Autor wykładu: Marek Wojciechowski
ASP.NET MVC Autor wykładu: Marek Wojciechowski Modele programistyczne ASP.NET Web Forms Komponentowy interfejs użytkownika (kontrolki) Programowanie wizualno-zdarzeniowe Klasyczna składnia ASP.NET ASP.NET
Bardziej szczegółowoSzkolenie. IBM Lotus - Podstawy projektowania aplikacji w Domino Designer 8.5. Strona szkolenia Terminy szkolenia Rejestracja na szkolenie Promocje
Szkolenie IBM Lotus - Podstawy projektowania aplikacji w Domino Designer 8.5 Strona szkolenia Terminy szkolenia Rejestracja na szkolenie Promocje Opis szkolenia Szkolenie dla początkujących projektantów
Bardziej szczegółowoReferat z przedmiotu Technologie Internetowe SPIS TREŚCI
SPIS TREŚCI 1.Dwie metody przekazu danych do serwera 2 2.Metoda GET przykład 3 3.Metoda POST przykład 4 4.Kiedy GET a kiedy POST 5 5.Szablony po co je stosować 7 6.Realizacja szablonu własną funkcją 8
Bardziej szczegółowoPatryk Jar Meet.js, Gdańsk 11 marca 2013 r. MODULARNY JAVASCRIPT
Patryk Jar Meet.js, Gdańsk 11 marca 2013 r. MODULARNY JAVASCRIPT O mnie Patryk yarpo Jar Programista JavaScript (nor-sta.eu) yarpo.pl 2 Agenda Chaos Obiekty Biblioteki AMD Podsumowanie Pytania 3 Dawno,
Bardziej szczegółowoProgramowanie komponentowe. Przykład 1 Bezpieczeństwo wg The Java EE 5 Tutorial Autor: Zofia Kruczkiewicz
Programowanie komponentowe Przykład 1 Bezpieczeństwo wg The Java EE 5 Tutorial Autor: Zofia Kruczkiewicz Struktura wykładu 1. Utworzenie użytkowników i ról na serwerze aplikacji Sun Java System Application
Bardziej szczegółowoIncreasing an efficiency of the web-applications developing the process through the combine of frameworks MeteorJS and AngularJS
Wysłane: 2016-11-29 Przyjęte: 2016-11-30 Zwiększenie efektywności procesu tworzenia aplikacji internetowych poprzez połączenie frameworków Meteor JS i Angular JS Viacheslav Nishtuk*, Elżbieta Miłosz a
Bardziej szczegółowoWybrane działy Informatyki Stosowanej
Wybrane działy Informatyki Stosowanej JSP - Java Server Pages dr hab. inż. Andrzej Czerepicki a.czerepicki@wt.pw.edu.pl http://www2.wt.pw.edu.pl/~a.czerepicki 2019 Aplikacje i skrypty WWW klasyfikacja
Bardziej szczegółowoMOBILNE APLIKACJE HYBRYDOWE
MOBILNE APLIKACJE HYBRYDOWE Waldemar Korłub KASK ETI Politechnika Gdańska JavaScript 2 Początkowo wykorzystywany tylko w przeglądarce internetowej Obecnie: Przeglądarki cały czas Po stronie serwera Node.js
Bardziej szczegółowo