Jul 12 2010

WebSocket Interface

Jedną z ciekawszych nowinek, które mają być wprowadzone wraz ze standardem HTML 5 jest (a może “są”…) WebSockets.

To do czego WebSockets mają służyć idzie opisać jednym zdaniem:
” Strony internetowe za pomocą protokołu WebSockets mogą nawiązać DWUSTRONNE połączenie ze zdalnym serwerem.”

Do tej pory, komunikacja była jednostronna. Ze strony zostało wysyłane zapytanie i serwer zwracał odpowiedź. Wprowadzenie technologii AJAX zautomatyzowało trochę ten proces, uruchomiony w przeglądarce javascript automatycznie wysyłał zapytanie i obsługiwał nadesłaną odpowiedź. Mimo iż to przypomina dwustronną komunikację – nadal jest ona jednostronna.
Czasami takie zapytania są powtarzane w bardzo krótkich okresach czasu (20-30 sekund) – nazywa się to HeartBeating (bicie serca). Główny problem jednak pozostaje taki sam: generowane jest wiele zapytań, które serwer musi obsłużyć. Na szczęście AJAX pozwala na minimalizację pytania i aktualizację tylko części strony, a nie pobieranie całej strony co kilkadziesiąt sekund, jednak problem pozostaje problemem.

Wspomniany wyżej protokół rozwiązuje ten problem poprzez wykorzystanie komunikacji dwustronnej. Ma ty wyglądać w ten sposób, że przeglądarka nawiązuje połączenie ze zdalnym hostem, a gdy informacje na tym hoście się zmienią zostaną wysłane z powrotem do przeglądarki. Nie trzeba już odpytywać serwera o zmiany co kilkadziesiąt sekund.

Z punktu widzenia użytkownika nic się nie zmieni, jednak z punktu widzienia developera bardzo dużo: wydajność, prostota użycia to główne zalety tego rozwiązania.

Trochę bardziej techniczniej

Konstruktor otwieranego obiektu WebSocket posiada dwa elementy:
- pierwszym z nich jest URL z jaki należy się połączyć,
- drugi to protokół, który ma być użyty do komunikacji.

Jeżeli występują jakieś błędy, np. URL jest nieprawidłowy lub użyto w nim niedozwolonych znaków, port jest zablokowany, protokół nie obsługiwany to serwer zwróci błąd. W przeciwnym przypadku jest generowany nowy obiekt WebSocket.

Z obiektem tym komunikujemy się za pomocą poniższych metod:
- url – zwraca nam url połączenia użyty w konstruktorze,
- readyState – zwraca nam stan połączenia, który może przyjać jedną z poniższych wartości:
(wartości te są numeryczne, dodatkowo podaję ich tekstowy odpowiednik)
1 – CONNECTING – połączenie nie zostało jeszcze zrealizowane,
2 – OPEN – połączenie zostało zrealizowane i możliwa jest komunikacja z serwerem,
3 – CLOSING – połączenie jest w trakcie rozłączania,
4 – CLOSED – połączenie zostało zamknięte lub nie zostało otworzone.

W momencie utworzenia obiektu status musi być zmieniony na CONNECTING.

W celu przesłania danych używamy metody send(data). W rezultacie wywołania tej metody uzyskamy wartość boolean oznaczającą czy wysyłka była pomyślna czy nie.

Wysyłane dane, są bufforowane po stronie serwera. Wielkośc tego buffera można sprawdzić za pomocą metody bufferedAmount. Sprawdzanie tego bufera jest przydatne zwłaszcza przy wykorzystaniu połączeń asynchronicznych – gdzie jedno połączenie wysyła dane, a drugie pobiera obliczenia na podstawie tych danych. W przypadku, gdy zostanie wysłane zapytanie o rezultat a nie wszystkie dane zostaną już przesłane to rezultat ten może być błędny. Warto zatem opatrzeć tą metodę sprawdzeniem czy bufferedAmount jest równe 0 co oznacza że wszystkie dane są już wysłane.

WebSockets muszą także implementować kilka rodzajów zdarzeń na które muszą reagować:
Zdarzenia które występują to: open, close, message i error, natomiast metody nasłuchujące wystąpienia tych zdarzeń to :onopen, onclose, onmessage i onerror.

Resume

Jeżeli kogoś interesuje bardziej temat polecam wgłębienie się w API tego ciekawego protokołu, który IMO może przynieść kolejną rewolucję w internecie. Na dzień dzisiejszy jednak nie jest on do końca wspierany przez wszystkie przeglądarki. Pomimo, że Chrome, Safari i Firefox implementują go w mniejszej lub większej skali, to pozostaje jeszcze najpopularniejsza przegląrka – Internet Explorer, która nie implementuje tej funkcjonalności wogóle. Mam nadzieję, że to się zmieni.

  • Wykop
  • Blip
  • Twitter
  • Facebook
  • DZone
  • Digg
  • Blinklist
  • Delicious
  • Evernote
  • LinkedIn
  • Google Bookmarks
  • Google Buzz
  • Google Reader
  • Share/Bookmark

Jul 9 2010

Szybka instalacja Drupala za pomocą Drush

Z doświadczenia wiem, że wszystkie czynności, które mogę wykonać z konsoli zabierają mi mniej czasu niż w interfejsie graficznym. No może przesadziłem, że wszystkie – przynajmniej większość z nich. Jeżeli zatem jest alternatywa, to zawsze wybiorę rozwiązanie konsolowe.

Dobrym przykładem jest narzędzie Drush. Jest to narzędzie, które pozwala nam z konsoli zainstalować drupala, moduły do niego, łączyć się z bazą danych i w pewnym stopniu administrować witryną z poziomu konsoli. Możliwości jest wiele, polecam zatem do samodzielnego ich sprawdzenia.

Pierwszym krokiem, który musimy uczynić jest zainstalowanie drusha. Musimy go pobrać z tej strony, oraz rozpakować w dowolnym folderze. Następnie utworzyć link symboliczny do takiego miejsca, aby był w zasięgu zmiennej PATH.

# cd /opt/devel
# wget http://ftp.drupal.org/files/projects/drush-6.x-3.1.tar.gz
# tar -zxvf drush-6.x-3.1.tar.gz
# sudo ln -s /opt/devel/drush/drush /usr/local/bin/

Po wykonaniu powyższych czynności wykonując komendę ‘drush’ w dowolnym miejscu, powinniśmy otrzymać listę dostępnych komend.

Aby zainstalować drupala przechodzimy do folderu w którym chcemy to zrobić i wywołujemy komendę:

# drush dl drupal

Drupal zostanie pobrany ze strony i rozpakowany w bieżącym folderze. Instalacji dokonujemy w normalny sposób. Od wersji 7 Drupala będzie także możliwa instalacja z lini poleceń, jednak na dzień dzisiejszy najświeższa wersja to 6.17 więc musimy instalacji dokonać w tradycyjny sposób.

Po zainstalowaniu drupala, czas na kilka modułów. Za pomocą Drusha nie musimy szukać ich w witrynie drupala, tylko znając ich nazwy automatycznie pobrać i zainstalować. Dla przykładu gdy korzystamy z modułu “Views” wykonujemy komendy:

# drush dl views
# drush en views
> views was enabled successfully.

Gdy po dłuższej pracy na projektem drupal, lub niektóre używane moduły pojawią się w nowej wersji, wystarczy, że skorzytamy z komendy

# drush up

aby zaktualizować wszystko do najnowszych wersji.

Drush ma jeszcze więcej możliwości polecam zapoznać się z jego dokumentacją.

  • Wykop
  • Blip
  • Twitter
  • Facebook
  • DZone
  • Digg
  • Blinklist
  • Delicious
  • Evernote
  • LinkedIn
  • Google Bookmarks
  • Google Buzz
  • Google Reader
  • Share/Bookmark

Mar 5 2010

Rails Template

Idąc za ciosem postanowiłem wydłubać własny szablonik do startu z aplikacjami. Jest on dostępny na githubie i można śmiało z niego korzystać.
Co robi szablonik?

- inicjuje repozytorium Git, dodaje niektóre miejsca i pliki do ignore’a po czym zatwierdza resztę.

- instaluje platformę testową RSpec, RSpec-Rails, Cucumber, Factory_Girl i Webrat.

- instaluje authologic i declarative_authorization,

- tworzy model do dodawania artykułów oraz cruda do niego.

- tworzy model użytkownika, ról  i sesji

- tworzy widoki dla artykułów, panel logowania i edycja profilu.

- tworzy dwie początkowe role: user i admin.

- nadaje uprawnienia:

- gość może czytać artykuły, założyć konto i się zalogować,

- użytkownik może się wylogować, dodać artykuł, edytować lub usunąć własny artykuł, edytować swój profil,

- admin może wszystko.

Planuję jeszcze nad kilkoma dodatkami, ale nie wiem jeszcze dokładnie co i jak. Muszę to przemyśleć. Jak na razie szablon tworzy to, co w prawie każdej aplikacji istnieje. Modele można rozbudować wg własnych potrzeb ale mamy już dobry punkt początkowy.

Zapraszam do testowania i wyrażania swoich uwag.

  • Wykop
  • Blip
  • Twitter
  • Facebook
  • DZone
  • Digg
  • Blinklist
  • Delicious
  • Evernote
  • LinkedIn
  • Google Bookmarks
  • Google Buzz
  • Google Reader
  • Share/Bookmark

Dec 12 2009

Automatyczny start czyli Rails Templates

Jeżeli tworzymy kilka aplikacji w ruby on rails, to przeważnie początkowe etapy są do siebie bardzo podobne. Np. inicjalizacja kontroli wersji (np. w sposób jaki jest opisany w poprzednim artykule), instalacja ulubionych pluginów, usuwanie zbędnych plików, Czy też inne operacje. Na szczeście do pomocy przychodzą nam Templates, które zostały wprowadzone w rails 2.3. Teplate to nic innego niż plik ruby, w którym wpisujemy komendy w przygotowanym do tego języku domenowym (DSL). Po przygotowaniu takiego szablonu inicjujemy projekt rails z parametrem -m ścieżka_do_szablonu.rb. Rails od razu po wykonaniu inicjacji projektu od razu uruchomi podany plik.

rails my_app -m ~/szablon_startowy.rb

tak samo jak URI, możemy uzywać URL:

rails my_app -m http://marioosh.5dots.pl/szablon.txt

(powyższy plik nie istnieje więc nie testujcie ;) )
ostatnim sposobem jest inicjacja szablonu przed odpowiednie zadanie rake z ustawienie zmiennej LOCATION:

rake rails:template LOCATION=~/szablon_startowy.rb

› Continue reading

  • Wykop
  • Blip
  • Twitter
  • Facebook
  • DZone
  • Digg
  • Blinklist
  • Delicious
  • Evernote
  • LinkedIn
  • Google Bookmarks
  • Google Buzz
  • Google Reader
  • Share/Bookmark

Dec 10 2009

Nowe trendy programowania

Patrząc na rynek pracy, a obecnie mam taką sytuację zawodową, że patrzeć muszę, zauważyłem pewną nową tendencję. Otóż jeszcze kilka lat temu, programistów szukało sie po języku programowania, w którym potrafi pracować. Szukało się programistów Java (ew. J2EE), PHP, C++ i innych. Po kilku latach, pojęcie języka programowania stało się zbyt ogólne, więc ogłoszenia stały się bardziej specjalistyczne, uzywano nazw frameworków czy technologii bezpośrednio z tym językiem związane, np. widziałem takie warunki: Struts, JSF, Hibernate, JPA, J2ME (to javowe), albo takie: CakePHP, Zend, Symphony, Smarty (to php-owe).

W sumie nic dziwnego, języki rozwijają się, dołączone do nich biblioteki rosną w postępie logarytmicznym. Poza tym znajomość języka to raz, a znajomość konkretnego frameworka to dwa. Dając ogłoszenie o programisty JSF jakoby normalny staje się fakt, że potrafi on Javę samą w sobie.

Można by było przypuszczać, że obecny trend zmierza do jeszcze większej specjalizacji. Jednak tak nie jest. Znajomość frameworka czy narzędzia nadal pojawia się w ogłoszeniach. Jednak oprócz nich pojawiają się wymagania dotyczących technologii nie związanych bezpośrednio z językiem, np. AJAX. Przecież możemy wykorzystywać go zarówno w aplikacjach javowych, php-owych, rails-owych czy też innych. Poniżej przedstawiam listę nowych wymagań stwianych w ofertach pracy. Wg mnie technologie te staną się w ciągu kilku najbliższych lat bardzo ważne, więc zapoznanie się znimi już dziś może nam ułatwić poszukiwania pracy.

1. Widgety, Gadgety

Wiele stron i mechanizmów umożliwia wykorzsytywanie tych mini aplikacji. Widgety to jakby aplikacje wewnątrz innych aplikacji, które potrafią żyć własnym cyklem nie ingerując w mechanikę strony. Za to dodają witrynie wiele nowych finkcjonalności, których napisanie zajęłoby nam sporo czasu.

2. Integracja z serwisami społecznościowymi

Serwisy społecznościowe rosną jak grzyby po deszczu. Jedne bardziej popularne drugie mniej. Jedne oferują więcej usług i możliwości inne odwrotnie. W każdym razie już coraz mniej witryn można spotkać, które nie mają chociaż jednej malutkiej integracji z takim portalem społecznościowy. Wiele takich integracji z resztą polega na dodaniu do strony widgetu wspomnianego w punkcie pierwszym. Przeglądając witrynę spójrzmy, czy nie ma tam linka do takich serwisów jak Twitter, Blip, Flakier, Wykop, Dig-it, delicious czy też innych.

3. SEO

SEO jest ważnym elementem pozycjonowania strony więc wiedza na ten temat jest coraz bardziej wymagana.

4. Aplikacje mobilne IPhone & Android

iPhone zrewolucjonizował rynek telefonów, uczynił rewolucję, która podłączyła wielu użytkowników do internetu. Przeglądamy strony jadąc tramwajem, słuchamy radia internetowego, czy też gramy w gry online. Oferty pracy dla programistów iPhone’a czy Androida pojawiają się coraz częściej. Moim zdaniem Android będzie się rozwijał szybciej bo nie jest blokowany jak to ma się z telefonem od Apple.Dostęp do tej technologi jest łatwiejszy, więc rynek będzie szedł w tą stronę.

  • Wykop
  • Blip
  • Twitter
  • Facebook
  • DZone
  • Digg
  • Blinklist
  • Delicious
  • Evernote
  • LinkedIn
  • Google Bookmarks
  • Google Buzz
  • Google Reader
  • Share/Bookmark

Dec 5 2008

960gs – praktyczne zastosowanie

Wygląd wytryny wordpress.org

Wygląd wytryny wordpress.org

Jak obiecałem w poprzednim artykule pokażę jak praktycznie można wykorzystać framework 960gs. Do tego celu będę się wzorował na layoucie witryny wordpress.org . › Continue reading

  • Wykop
  • Blip
  • Twitter
  • Facebook
  • DZone
  • Digg
  • Blinklist
  • Delicious
  • Evernote
  • LinkedIn
  • Google Bookmarks
  • Google Buzz
  • Google Reader
  • Share/Bookmark

Dec 2 2008

960 grid system

Kilkanaście miesięcy temu, podczas przeszukiwania sieci, natrafiłem na framework CSS o nazwie 960 grid system. Był on wtedy w fazie beta i zgodnie z komentarzami autorów – nie wszystko działało jak powinno. Kilka dni temu, gdy przyjąłem zlecenie na przerobienie pliku .psd na szablon .xhtml przypomniałem sobie o tym narzędziu. Zapytałem wujka google’a o adres, pobrałem kilkubajtowy plik, zerknąłem na przykład, rzuciłem okiem na plik .css, zrobiłem kilka poprawek w .psd i po kilkunastu minutach wielokolumnowy szablon był gotowy.

› Continue reading

  • Wykop
  • Blip
  • Twitter
  • Facebook
  • DZone
  • Digg
  • Blinklist
  • Delicious
  • Evernote
  • LinkedIn
  • Google Bookmarks
  • Google Buzz
  • Google Reader
  • Share/Bookmark