AngularJS dla początkujących – Routing w AngularJS

Aplikacje webowe mogą szybko się rozrosnąć podczas tworzenia. Duża ilość danych i skomplikowana logika w kontrolerach powoduje, że może być ciężko wszystko uporządkować. Tutaj do akcji wchodzi routing w AngularJS. Dzięki tej technice, można dzielić widok na mniejsze ‚pod-widoki’. A co za tym idzie, możemy podzielić logikę na łatwe do przełknięcia kawałki.

Dziś kontynuacja mojej serii o Angularze dla początkujących (poprzednie wpisy tu oraz tu). Tym razem pokażę krótki skrypt przedstawiający routing. Skrypt ten nie będzie zawierał specjalnie skomplikowanej logiki 🙂 . Za to na pewno po lekturze tego wpisu będziecie znali podstawy potrzebne do dalszego rozwoju umiejętności programowania z pomocą AngularJS.

routing w angularjs Czytaj dalej AngularJS dla początkujących – Routing w AngularJS

Jak ustawić serwer node.js?

Parę razy wspominałem już, że w niektórych przykładach (Angular), wymagany jest lokalny serwer. Dziś zaprezentuję jak ustawić taki serwer przy pomocy node.js. Jest to naprawdę prosty sposób, dzięki któremu będziecie mieli możliwość testowania waszych front-endowych rozwiązań.

Na początku potrzebny będzie node. Można go bez problemu pobrać z oficjalnej strony. Strona sama wykryje jaki mamy system i na głównej stronie, poda odpowiedni instalator. Ja poniżej opiszę sposób na ustawienie serwera node w środowiskach, które sam używam: windows oraz linux mint. Tak naprawdę do na linuxie nie potrzebna jest nawet ta instalka, ale to za chwilę.

Jak ustawić serwer node.js Czytaj dalej Jak ustawić serwer node.js?

(WIP) Gra tekstowa w jQuery. Aktualizacja numer 2 – używanie przedmiotów

Nic nie sprzyja kreatywnej pracy tak jak stan podgorączkowy 😀 . Ahh, uroki jesieni. Postanowiłem wykorzystać ten błogosławiony stan i zasiadłem do mojego dawno nie ruszanego projektu. Dzięki temu, gra tekstowa w jQuery uzyskała nową aktualizację. Poprzednie wpisy o tekstówce można znaleźć tutaj oraz tutaj.

Tym razem do gry dodałem możliwość używania przedmiotów. Dzięki temu może zajść interakcja pomiędzy graczem a światem gry. Na przykład znaleziony klucz może posłużyć do otworzenia zamkniętych drzwi.

W najnowszą wersje gry można zagrać klikając w ten link.

gra tekstowa w jQuery Czytaj dalej (WIP) Gra tekstowa w jQuery. Aktualizacja numer 2 – używanie przedmiotów

AngularJS dla początkujących częśc 2 – Prosta aplikacja w AngularJS

Tym razem krótki wpis. Aby utrwalić wiedzę, która przekazałem wczoraj, napisałem prościutki program wykorzystując framework AngularJS. W zaledwie parunastu linijkach JavaScriptu udało się bez problemu napisać pełną, działającą aplikację.

Przedstawiam wam Zgadywankę. Jest to bardzo prosta aplikacja w AngularJS. Powstała ona na podstawie informacji, które zawarłem w ostatnim poście.

Dzisiejsza aplikacja to (a jakże) gra 🙂 . Gracz musi odgadnąć hasło na podstawie podpowiedzi wyświetlonej na ekranie. Hasło wybierane jest losowo przy każdym zainicjalizowaniu gry. Lista możliwych haseł i odpowiedzi znajduje się w skrypcie. Jeżeli gracz odgadnie hasło, gra wyświetli gratulacje oraz przycisk pozwalający na rozpoczęcie od nowa. Nieudane próby będą zliczane a ich suma wyświetlana na ekranie.

prosta aplikacja w AngularJS
Obraz Alana Lee – „Riddles in the dark”
Czytaj dalej AngularJS dla początkujących częśc 2 – Prosta aplikacja w AngularJS

AngularJS dla początkujących część 1 – „witaj świecie” w Angular

Artykuł ‚AngularJS dla początkujących’ wypadałoby zacząć napisaniem paru zdań o tym czym jest Angular. Następnie akapit albo dwa, dlaczego jest tak wspaniały i często wykorzystywany. Główną część wpisu powinienem poświęcić opisowi architektury MVW, tłumaczeniem czym są modele a czym kontrolery i jak dobrze ze sobą działają. Na koniec parę linijek kodu i wpis gotowy 🙂 Nie pójdę dziś tą drogą. Nie dlatego, że są to rzeczy nieważne. Są bardzo ważne, ale zostały już napisane wiele razy. Ja skupie się na tym co lubię najbardziej, czyli przejdę prosto do przykładów. To pierwszy wpis z serio dwóch lub trzech. Po ich lekturze, będziesz w stanie sam, ze zrozumieniem stworzyć prostą aplikację używając frameworka Angular JS.

Napiszę tylko odpowiedź na pytanie, „dlaczego Angular?” Jest to bardzo popularny framework. Tak popularny, że niezależnie od naszych odczuć względem niego, każdy front-endowiec powinien zapoznać się z obecną wersją. Nawet pomimo tego, że druga wersja angulara nadchodzi wielkimi krokami. W świecie jest po prostu bardzo dużo kodu napisanego w Angular 1.x i prędzej czy później trafimy na niego. Dobrze być na to przygotowanym.

AngularJS dla początkujących Czytaj dalej AngularJS dla początkujących część 1 – „witaj świecie” w Angular

Jesienna układanka – jak napisać prostą grę w jQuery

We wcześniejszych wpisach pokazywałem już jak napisać prostą grę w jQuery, popularnym javascriptowym frameworku. Przykładem może być moja gra tekstowa lub wariacja na temat space invaders. Fakt, jQuery nie sprawuje się tak dobrze jak canvas. Ma znacznie uboższe możsliwośći animacji. Jest jednak, w moim mniemaniu, mniej skomplikowane i do prostych gier nadaje się idealnie.

Weekendowy spacer w lesie zainspirował mnie do stworzenia takiej właśnie prostej gry – układanki. Celem jest ułożenie elementów w odpowiedniej kolejności, tak aby pokazywały zdjęcie. Najlepiej zrobić to w jak najkrótszym czasie. Sprawa jest o tyle trudna, że można przesuwać tylko po jednym klocku jeśli akurat obok niego jest wolne miejsce. Elementy można przesunąć klikając na nich. Gra daje również możliwość wyboru poziomu zaawansowania. Dostępne są poziomy: „łatwy”, „średni” i „trudny”. Po ułożeniu zdjęcia, gra wyświetla wynik, czyli czas jaki zajęło graczowi ukończenie układanki.

Jak napisać prostą grę w jQuery Czytaj dalej Jesienna układanka – jak napisać prostą grę w jQuery

„Świat poza jQuery Biblioteki: AngularJS, KnockoutJS, BackboneJS” – Recenzja

W dzisiejszym poście chciałbym przedstawić swoje wrażenia po przeczytaniu Świat poza jQuery Biblioteki: AngularJS, KnockoutJS, BackboneJS autorstwa Karola Rogowskiego. Książka została wydana przez wydawnictwo PWN.

jQuery jest bezsprzecznie jednym z najczęściej wykorzystywanych bibliotek JavaScriptu. Jednak od jakiegoś czasu można zauważyć wzrost popularności innych frameworków. Trudno znaleźć dziś ofertę pracy we front-endzie, która nie wymagałaby znajomości np. Angulara. Nie ma się co dziwić, te frameworki często okazują się bardzo pomocne.

Technologie sieciowe rozwijają się bardzo szybko. Strony internetowe już dawno przestały być statycznymi wizytówkami, a stały się pełnoprawnymi aplikacjami, mogącymi spokojnie konkurować z tymi tworzonymi dla środowiska desktopowego. Oczywiście, wraz ze wzrostem złożoności stron internetowych, wzrósł czas pracy nad nimi oraz poziom wymaganych do tej pracy umiejętności. I tu wracam do wspomnianych już frameworków. Dzięki nim, tworzenie aplikacji internetowych, staje się dużo prostsze i mniej czasochłonne. Ale nie oznacza to, że stało się proste. Wciąż wymagany jest dość konkretny poziom umiejętności. Kiedy doda się do tego jeszcze zarządzanie projektem, automatyzacje zadań, testowania itd. Okazuje się że wciąż wymagany jest dość duży pakiet umiejętności. Jak to ugryźć? Od czego zacząć? Nie ma na to pytanie jednej dobrej odpowiedzi, dróg jest wiele. Jedną z nich jest na pewno książka Świat poza jQuery Biblioteki: AngularJS, KnockoutJS, BackboneJS.

poza jQuery Biblioteki: AngularJS, KnockoutJS, BackboneJS Czytaj dalej „Świat poza jQuery Biblioteki: AngularJS, KnockoutJS, BackboneJS” – Recenzja

JSON i AJAX – przykład wykorzystania

Dziś dość krótki wpis. Tak jak obiecałem w ostatnim poście, tym razem przygotowałem pseudo aplikację wykorzystującą JSON. Użyłem też AJAXa, czyli asynchronicznego ładowania danych na stronie. JSON i AJAX to technologie, które zazwyczaj występują w parze, ponieważ świetnie do siebie pasują. Jakby tego wszystkiego było mało, dla dodania aplikacji wiarygodności, zbudowałem również prosty back-end stworzony w PHP. Mam nadzieję, że udało mi się osiągnąć wynik, który zilustruje jak wszystko pięknie ze sobą współgra.

Działanie aplikacji jest bardzo proste. Po podaniu przez użytkownika odpowiedniego loginu i hasła serwer przesyła dane konta, które zostają wyświetlone w oknie przeglądarki. Tutaj można, zobaczyć to na żywo.

JSON i AJAX Czytaj dalej JSON i AJAX – przykład wykorzystania

JSON dla początkujących, i kompletnie początkujących

Dziś mała odskocznia od projektów. Dla odmiany poruszę temat łatwy i przyjemny, ale ważny – JSON. Obecnie jest to chyba jeden z najpopularniejszych formatów wymiany danych w środowisku internetowym. Jest lekki, czytelny i prosty w obsłudze, szczególnie dla JavaScriptowców. Dlatego warto wiedzieć czym jest, jak wygląda i przede wszystkim jak go używać.

W tym poście omówię JSON dla początkujących.

JSON dla początkujących Czytaj dalej JSON dla początkujących, i kompletnie początkujących

(WIP) Gra tekstowa RPG – aktualizacja – przedmioty

Nadeszła prawdziwa jesień. Za oknem zimno, szaro i deszczowo. Idealna atmosfera do pisania kodu! Parę projektów przewija się ostatnio przez ekran mojego monitora, ale to co chcę dziś pokazać to aktualny stan gry tekstowej o której pisałem niedawno.

Gra tekstowa RPG wciąż nie jest kompletna, ale prace zdecydowanie ruszyły do przodu. Zacząłem od drobnych zmian w strukturze kodu. Przede wszystkim jednak dodałem do gry przedmioty. Gracz, może teraz w pomieszczeniach gry znaleźć różne rupiecie, które można podnieść i odłożyć w innym miejscu. Aktualna wersja gry do przetestowania tutaj.

Gra tekstowa RPG Czytaj dalej (WIP) Gra tekstowa RPG – aktualizacja – przedmioty