Migracja do Angular4

Angular4

Nowy Angular żyje i ma się nad wyraz dobrze. Efektem było wypuszczenie nieco ponad miesiąc temu wersji 4.0.0, z kolei zaledwie przedwczoraj wyszła wersja 4.1.0. W tym wpisie omówimy po krótce nową wersję oraz przeprowadzimy migrację z wersji Angular2 do Angular4.

Angular4 – co nowego?

Mniej znaczy szybciej

Projektanci frameworka postawili sobie za cel przyspieszenie oraz zredukowanie kodu wynikowego Angular4. Jak możemy przeczytać na oficjalnym blogu:

These changes reduce the size of the generated code for your components by around 60%  in most cases (..) During our release candidate period, we heard from many developers that migrating to 4 reduced their production bundles by hundreds of kilobytes

Animacje zostały wyciągnięte z @angular/core i umieszczone w osobnym pakiecie. By wykorzystać teraz animations, trzeba zaimportować paczkę BrowserAnimationsModule z pakietu @angular/platform-browser/animations.

Features

Na warsztat poszły dyrektywy *ngIf oraz *ngFor. Można od teraz po stronie HTMLa wykorzystywać składnię if/else:

TypeScript

Update przyniósł również wsparcie dla kolejnych wersji języka TypeScript. Angular4.0.0 jest zgodny z TypeScriptem 2.12.2. Z kolei przedwczorajszy update Angular4.1.0 przyniósł zgodność z TypeScriptem 2.22.3.

To tylko kluczowe zmiany. Zainteresowanych zachęcam do zerknięcia w CHANGELOG.

Migracja

Wpierw rzućmy okiem na nasz package.json. Interesują nas zależności @angular, zone.js oraz typescript.

Angular4 - before migration

Proces migracji zaczynamy od podniesienia TypeScriptu do najnowszej wersji:

npm install --save-dev typescript@latest

W moim przypadku musiałem podnieść także @angular/cli:

npm install --save-dev @angular/cli@latest

Przyszedł czas na zone.js:

npm install --save zone.js@latest

Ostatnim etapem jest podniesienie pozostałych wykorzystywanych paczek, u mnie będzie to kolejno:

npm install --save-dev @angular/compiler-cli@latest

oraz

npm install @angular/{common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router}@latest --save

Proces migrowania do wersji 4.1.0 przeszedł bez żadnych komplikacji. Kluczowym elementem jest niewielki rozmiar mojej aplikacji. Robiłem jednak wcześniej migrację dużo bardziej rozbudowanego systemu. Problemy, które wyniknęły w trakcie, nie blokowały mnie jednak w żadnym stopniu. Pamiętajmy, że nie powinniśmy zbytnio odwlekać w czasie, aktualizacji systemów, które utrzymujemy i tych które się ciągle rozwijają.

Na koniec jeszcze package.json po wszystkich update’ach:

Angular4 - after migration

Źródła:

  1. http://angularjs.blogspot.com/2017/03/angular-400-now-available.html
  2. http://angularjs.blogspot.com/2017/04/angular-410-now-available.html

Chatbot, Wit.ai – środowisko graficzne

AI Robot

W poprzednim wpisie dowiedzieliśmy się czym są chatboty, do czego mogą służyć oraz było kilka słów o jednym z systemów do ich tworzenia. Dzisiaj przyjrzymy się nieco bardziej środowisku graficznemu Wit.ai oraz zaczniemy projektować prostego chatbota.

Tworzenie aplikacji Wit.ai

Tworzenie aplikacji w Wit.ai jest bardzo proste i intuicyjne. W górnej belce należy kliknąć znak +. Zostaniemy przekierowani na stronę http://wit.ai/apps/new.

Możliwość tworzenia aplikacji, dostępna jest tylko dla zalogowanych użytkowników.

Po wypełnieniu prostego formularza, klikamy na przycisk Create App.

Wit.ai - creating app

Jeżeli wszystko przebiegnie pomyślnie, stworzona dla nas zostanie nowa instancja wit. Zostaniemy przekierowani do nowej aplikacji na zakładkę Understanding, gdzie zostaniemy przywitani przez kota.

Wit.ai - welcome

Entity

Cała magia w tworzeniu aplikacji za pomocą Wit.ai polega na właściwym wytrenowaniu sieci. W input User says... wpisujemy zatem sentencję, jaką mógłby wypowiedzieć użytkownik aplikacji. Następnie oznaczamy poszczególne elementy składowe.

Wit.ai - test sentence

Jak widać na obrazku załączonym powyżej, sentencja brzmi Kim jest Johnny Depp?. Zidentyfikowałem sobie intencję jako find-person oraz stworzyłem encję fullName, do której zostało przyporządkowane imię i nazwisko znanego aktora.

Po kliknięciu validate mamy możliwość wpisania kolejnej sentencji testowej. Spójrzmy jednak poniżej. Lista używanych encji zmieniła się. Nasza aplikacja wykorzystuje teraz dwie encje: fullName oraz intent. Obie zostały utworzone przez nas, a na skrajnie prawej kolumnie widać jakie wartości kryją się za daną encją.

Wit.ai - entity

Wbudowane encje (Built-in entities)

Warto przy tej okazji nadmienić, że Wit.ai posiada szereg wbudowanych encji, które możemy wykorzystać w swojej aplikacji. Built-in entities mają przede wszystkim ułatwić pracę deweloperom, tak by nie musieli tworzyć najczęściej używanych encji.

You’ll often need to extract temporal expressions, numbers, locations, temperatures, etc. To make your developer life easier, we have predefined these entities. They are trained across all our dataset, so they are supposed to perform very well.

Strategia wyszukiwania (Search Strategy)

Jeżeli nie używamy wbudowanych encji, musimy określić Search Strategy. Wit.ai rozróżnia następujące strategie wyszukiwania:

  • trait – należy wybrać tę strategię, gdy wartość encji nie wywodzi się ze słowa kluczowego lub nie jest bezpośrednią częścią składową w danej sentencji. Wykorzystujemy ten sposób wyszukiwania do określania ogólnego kontekstu lub wyczuwania intencji użytkownika.
  • free-text – należy wybrać tę strategię, gdy chcemy wyodrębnić tekst z danej sentencji.
  • keywords – słowa kluczowe. Wykorzystujemy dla zdefiniowanych wartości np. kraje, waluty itp.

Trenowanie

Nasza aplikacja zaczyna lepiej rozumieć nasze wypowiedzi, jeśli ją dobrze wytrenujemy. Zadbajmy o to, żeby wpisywane dane były różnorodne. Zmieniajmy szyk zdania oraz popełniajmy częste literówki. Pomoże to w przypadku chatbota z którym chcemy się komunikować za pomocą tekstu.

Trenowanie w Wit.ai to żmudny proces, który niestety wymaga naszej atencji. W minimalnym stopniu, ale jednak. Gdy wprowadzimy odpowiednią ilość sentencji treningowych, możemy przejść dalej.

Stories

Stories są na razie w fazie beta. Nic nie stoi jednak na przeszkodzie, by wykorzystać je do prostej implementacji chatbota. To swoiste dialogi pomiędzy użytkownikiem, a naszą aplikacją.

Stwórzmy zatem przykładową historię klikając Create a story.

Wit.ai - story

Zaczynamy od wpisania sentencji użytkownika: Kim jest Adam Małysz? Sprawdzamy jednocześnie czy tekst został poprawnie zinterpretowany. Następnie klikamy Bot executes, gdzie wpisujemy nazwę metody. W naszym przypadku ma się uruchomić metoda findPerson(). Jak widzimy na screenie, w metodzie są przekazywane parametry: context i entities. Następnie możemy uzupełnić context-key, który nie jest wymagany. Na koniec dodajemy standardową odpowiedź naszego bota do zaistniałej sytuacji.

Test

Wit.ai - chat buttonŚrodowisko graficzne pozwala nam także szybko przetestować naszą aplikację. W prawym dolnym rogu jest przycisk rozpoczynający dialog z chatbotem.

W okienku, które wyskoczyło, możemy teraz wpisać dowolną sentencję i zaobserwować jak do tego ustosunkuje się stworzony chatbot.

Co dalej?

Wit.ai - responseTo pierwszy krok do stworzenia własnego chatbota. W tym wpisie było dużo klikania, a mało kodowania. Poprawimy to w kolejnej części serii, gdzie stworzymy od podstaw aplikację w node.js. Skomunikujemy się z naszą instancją Wit.ai. Wyślemy sentencję użytkownika do API, zobaczymy co nam chatbot odpowie i spróbujemy coś zrobić z danymi, które zostały wydobyte z zadanej sentencji.

Chatbot, Wit.ai – z czym to się je

Chatbot

Chatbot - Sport.plTworzenie chatbotów, to dziedzina ciesząca się coraz większym zainteresowaniem i popularnością. Dostrzegły to firmy świadczące najróżniejsze usługi. Za pomocą chatbota możemy już teraz sprawdzić wiadomości, pogodę i wyniki sportowe, dowiedzieć się co obecnie jest grane w kinach i zamówić bilety na wybrany seans czy dobrze się bawić, grając z wirtualnym przeciwnikiem.

Zdecydowany prym wiodą boty tworzone na Facebookowego Messengera. Kolejni wirtualni towarzysze, wyrastają obecnie jak grzyby po deszczu. Z polskich chatbotów obecnych na FB można wymienić chociażby Sport.pl, MultikinoBot czy Milionerzy.

Wit.ai

Chatbot - Multikino PolskaJednym ze systemów wspomagających tworzenie chatbotów, w tym także do messengera, jest wit.ai. Środowisko to jest w miarę nowe, ale już teraz zebrała się wokół niego pokaźna społeczność. Za pomocą wit.ai można tworzyć boty tekstowe i głosowe, które możemy wykorzystać do różnorakich celów, np autoresponder, wirtualny sprzedawca czy systemy wspomagające IoT czy roboty.

Wit.ai makes it easy for developers to build applications and devices that you can talk or text to. Our vision is to empower developers with an open and extensible natural language platform. Wit.ai learns human language from every interaction, and leverages the community: what’s learned is shared across developers.

Dlaczego wit.ai?

Chatbot - MilionerzyDużym plusem, jest liczba wspieranych języków. W momencie pisania artykułu jest ich 50, w tym język polski. Rozpoznawanie naszego rodzimego języka stoi na naprawdę imponującym poziomie. Przy dobrze wytrenowanej sieci daje to olbrzymie możliwości.

Wit.ai jest zupełnie darmowy. Możemy go wykorzystywać zarówno dla celów prywatnych, hobbistycznych jak i do komercyjnego użytku.

Wybierając wit.ai dostajemy rozbudowane środowisko do tworzenia własnych chatbotów. Dostajemy także narzędzia do trenowania, tworzenia HTTP API czy SDK (np. node.js, python, ruby).

Co dalej?

Ten wpis to wstępniak i zarazem początek miniserii, poświęconej chatbotom i wit.ai. W kolejnym wpisie stworzymy prostego bota i spróbujemy go wytrenować. Póki co, polecam zerknąć na możliwości wit.ai tutaj.