PROJEKTOWANIE APLIKACJI INTERNETOWYCH LABORATORIUM NR 2 REJESTRACJA NA WEBRATIO.COM 1. Wejdź na webratio.com i zarejestruj konto na uczelniany adres email (@wi.zut.edu.pl). 2. Po wpisaniu danych i zatwierdzeniu, należy potwierdzić rejestrację poprzez kliknięcie linka wysłanego na nasz adres email. 3. Kolejnym krokiem jest wybranie naszej roli wybieramy University Student oraz podajemy nazwę naszej uczelni (ZUT West Pomeranian University of Technology).
4. Po zalogowaniu, szukamy na dole strony programu dla uczelni (University Program) i klikamy Apply. 5. Następnym krokiem jest kliknięcie aktywacji programu (Activate Program). 6. Po aktywacji powinniśmy przejść na stronę z danymi do licencji oraz możliwością pobrania WebRatio. 7. Pobieramy odpowiednią wersję dla naszego systemu, instalujemy i podajemy serial który jest widoczny na podstronie. Dokonujemy instalacji wraz z serwerem Tomcat.
OBSŁUGA WEBRATIO PERSPEKTYWY Po uruchomieniu WebRatio otwiera się nam centrum nauki (learning center), po jego zamknięciu uruchamiana jest domyślna perspektywa (Web IFML). Perspektywa składa się z widoków (np. WebRatio Explorer, Outline, Properties, Layout) oraz edytora. Podczas pracy z WebRatio możemy dowolnie przechodzić pomiędzy poszczególnymi perspektywami. Dokonujemy tego poprzez kliknięcie Window / Open Perspective / Other i wybraniu interesującej nas perspektywy (np. Debug). Po otwarciu nowej perspektywy pojawia się ona w pasku narzędziowym perspektyw. WIDOKI Perspektywa składa się widoków znajdujących się w folderach (obszarach okna). Możemy dowolnie przesuwać widoki pomiędzy folderami, a także dodać lub usunąć widoki z danego folderu. Dodawanie widoków odbywa się poprzez wybranie menu Window / Show View i wybranie pożądanego widoku. TWORZENIE PROJEKTU Tworzenie nowego projektu w WebRatio jest bardzo łatwe. Wybieramy menu File / New oraz typ projektu np. Web Project. Przy tworzeniu nowego projektu należy pamiętać, aby nie używać spacji w nazwie projektu.
ZADANIE STWORZENIE PROSTEJ APLIKACJI HELLO WORLD Naszą przygodę z WebRatio rozpoczniemy od stworzenia prostej aplikacji wyświetlającej tekst Hello World!. 1. Z menu File wybieramy New Project / Web Project i podajemy nazwę projektu HelloWorld Po kliknięciu Finish otrzymujemy nowy widok HelloWorld zawierający listę widoków projektu: Domain Model, Site Views, Service Views oraz Module Definitions. 2. Następnym krokiem jest dodanie widoku Site View. 3. W widoku projektu, wybieramy zakładkę Project 4. Klikamy PPM na Site Views i klikamy Add Site View 5. Podajemy nazwę widoku HelloWorld i klikamy Finish. 6. Do naszego widoku dodajemy kontener Page i ustawiamy mu nazwę. Warto zwrócić uwagę, na zakładkę Properties w lewym dolnym rogu. W tym miejscu możemy ustawić właściwości obiektów w projekcie. 7. Kolejnym krokiem jest dodanie do strony komponentu Message. 8. Możemy edytować tekst wiadomości poprzez kliknięcie ikonki Edit w widoku Properties, dla właściwości Message Text wiadomości Hello World!. Podajemy jako treść Nasza aplikacja jest już w zasadzie gotowa. Teraz wystarczy ją tylko uruchomić, aby to zrobić, wystarczy kliknąć ikonkę Generate and Run znajdującą się na pasku narzędzi.
PRACA WŁASNA Do stworzonej aplikacji dodaj stronę z kalendarzem oraz obszar ( Area ) składający się z dwóch stron wyświetlających dwie różne wiadomości. Za pomocą właściwości Landmark spraw, by linki do stron zawartych w obszarze ( Area ) wyświetlane były jako podmenu. Poeksperymentuj z właściwościami Landmark, Home oraz Default dostępnymi w widoku Properties po zaznaczeniu jednej ze stron ( Page ). PYTANIA 1. Do czego służy właściwość strony Landmark? 2. Czym różni się właściwość Home od Default?