Archiwum dla kategorii ‘Praktyka’

content-like-water-rwd-128

Tutorial Bootstrap i RWD – responsywne strony

Dziś szybki tutorial Bootstrap o tworzeniu responsywnych stron WWW. A właściwie szablonu, stanowiącego dobry punkt wyjścia dla dalszych projektów. Opowiemy też o kilku technikach, które pozwalają osiągnąć określone rezultaty. Zebraliśmy także linki do zasobów z cennymi informacjami. Tutorial Bootstrap i RWD – szablon od ręki Jak wiemy, Twitter Bootstrap (TB) to framework CSS, rozwijany jako […]

Progress bar

Style CSS dla html5 progress bar w różnych przeglądarkach

Dziś kilka słów o HTML5 progress bar, a konkretnie nadawanie mu CSS w taki sposób, aby wyglądał tak samo we wszystkich przeglądarkach. Może tego wymagać projekt, a programista może być zaskoczony, że określone style stosują się tylko w określonej przeglądarce, podczas gdy w innych przygotowany pasek postępu wygląda zupełnie inaczej. Ten sam wygląd html5 progress […]

html5-css-progress-bar-mini

Pasek postępu w CSS – progress bar w kilku linijkach kodu

Pasek postępu (progress bar) w projekcie Web? Jasne – i to bez użycia obrazków. Dziś krótko i na temat. Pasek postępu w CSS i HTML5 Możemy skorzystać z HTML5 i Bootstrap, lub zdefiniować własne style CSS. Sposób 1 – HTML5 Dodajmy do strony Bootstrap i jQuery, oraz kod jak poniżej. Gotowe. Mamy pasek postępu! Kolory […]

AngularJS-tutorial-logo

Tutorial AngularJS – proste UI do sterowania elementami

Angular w praktyce! Dziś mamy tu mały tutorial AngularJS, w którym stworzymy proste UI powiązane z dynamicznie rysowanym (odświeżanym ) obiektem graficznym. Tutorial AngularJS – sterowanie obiektem graficznym za pomocą Angular W kursie podstawowym skupialiśmy się głównie na informacjach, warto więc teraz zobaczyć to w realnym przykładzie. Pomoże nam ten prosty tutorial w kilku krokach. […]

angularjs-logo

Nauka AngularJS od podstaw – część III – podsumowanie

W części III podstawowego kursu Angular kontynuujemy zagadnienia z części poprzedniej, jak i dotykamy nowych, kolejnych zagadnień dotyczących pracy z tą biblioteką. Nauka AngularJS – kolejne zagadnienia Zacznijmy od filtrów. To kolejna cecha AngularJS, która zdejmuje z programisty część żmudnej pracy. Zobaczmy je w akcji, podczas formatowania danych różnego rodzaju. Filtry (AngularJS filters) Już w […]

AngularJS-tutorial-logo

Nauka AngularJS od podstaw – część II

Dziś kontynuujemy naukę frameworku AngularJS od podstaw, opisując najważniejsze aspekty składowych aplikacji Angular, oraz analizując małe przykłady praktyczne. Nauka AngularJS – kolejne kroki Poprzednia część opisuje podstawowe kwestie związane z tym znakomitym rozwiązaniem. Wiemy że AngularJS jest frameworkiem języka JavaScript i rozszerza HTML poprzez dyrektywy ng. Poprzednia część pokazuje także prosty przykład z data-binding. Mamy […]

mustache-js

Mustache JS na przykładzie aplikacji Express. Część 2/2.

Witamy w II części tutoriala o Mustache JS i Express. Dziś dokończymy dzieło rozpoczęte w części I. Mustache JS i jQuery w akcji Dotąd omówiliśmy podstawy pracy z biblioteką Mustache, przygotowaliśmy dane testowe oraz serwer w node.js. Teraz pora na oprogramowanie warstwy front-end. W naszym przypadku użyjemy: Bootstrap v3.3.5 jQuery v1.11.3 jQuery Easing v1.3 plugin […]

mustache-js

Użycie Mustache JS na przykładzie aplikacji Express. Część 1/2.

Dziś stworzymy aplikację Web w oparciu o wspaniałe narzędzia – html5, Bootstrap, jQuery, Mustache JS i Express. Krok po kroku. Użyjemy także ionicons do wyświetlenia ikon. Mustache JS Nie każdy (w tym ja) przepada za systemami szablonów np. w PHP. Tutaj jednak sprawa wygląda znacznie inaczej. Mustache JS to implementacja dla języka JavaScript mini-engine szablonów […]

jQuery

Mini porady jQuery III – formularze

Witamy w kolejnym artykule z serii mini porady jQuery. Dziś zajmiemy się wybranymi aspektami pracy z elementami formularzy. 1. Nie więcej niż jedna opcja możliwa do zaznaczenia w input select multiple Ostatnio tworzyłem projekt, gdzie trzeba było pokazać UI w nieco staroświeckim stylu (podobnym do typowych aplikacji desktop sprzed lat). Niektóre z inputów musiałby być […]

Program control

Mini porady JavaScript i jQuery II

OK! Pora na kolejne szybkie porady JavaScript i jQuery. Dziś co nieco o Fancybox plugin, checkboxach i parsowaniu linków w tekście. Porady JavaScript i jQuery Do rzeczy. 1. Wysyłanie formularza warunkowo – tylko jeśli użytkownik zaznaczył checkbox (np. akceptuję regulamin). Oczywiście chodzi o walidację w JS / jQ, bez użycia języka takiego jak PHP. Mamy […]