Archiwum dla kategorii ‘Tutoriale’

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 […]

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. […]

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 […]

udontsay-128

Tutorial node.js i socket.io – system komentarzy „real-time”

Poprzednio pisaliśmy o tym jak pracować z node.js i socket.io. Dziś rozwiniemy temat przykładem praktycznym. Stworzymy prosty, wydajny system komentarzy między użytkownikami, który będzie przetwarzał i odświeżał listę komentarzy wszystkim użytkownikom, którzy mają otwartą naszą aplikację web. Tutorial node.js i socket.io – real-time comments Krok po kroku, od podstaw. Oczywiście sama strona i funkcjonalność komentarzy […]

node-js

Node.js i socket.io

Node.js to rewelacja sama w sobie. Dodajmy jeszcze do tego socket.io, a otrzymamy możliwości o których dawniej nawet nam się nie śniło. Node.js i socket.io Po omówieniu podstaw node.js oraz pracy z bazami danych z poziomu tej technologii, pora sięgnąć po jeszcze ciekawsze rzeczy. Jedną z nich z pewnością jest socket.io. Wystarczy nawiązać połączenie pomiędzy […]

node-js

Node.js i MySQL oraz MongoDB

Po wprowadzeniu do node.js pora na bardziej zaawansowane i praktyczne informacje. Dziś zajmiemy się komunikacją node.js z bazami danych MySQL, a także wspomnimy o MongoDB. Node.js i MySQL Jeżeli programujemy np. w PHP, mamy zapewne w systemie środowisko LAMP, mamy więc też MySQL. Potrzebujemy jeszcze tylko node.js oraz modułu MySQL: $ npm install mysql Konfiguracja […]

building

Tutorial web storage – aplikacje przechowujące dane lokalnie

Dziś zaprezentujemy tutorial o tworzeniu prostej aplikacji web, która przechowuje dane w localStorage. Będzie on mogła zapisywać i przechowywać ustawienia dotyczące swojego wyglądu. Przejdźmy zatem do dzieła. Tutorial web storage 1. Zacznijmy od dodania biblioteki jQuery oraz prostych stylów CSS dla elementów UI: 2. Stwórzmy prosty formularz w sekcji body: Teraz możemy przejść do programowania […]

file1

DOM Storage – JavaScript Web Storage

W aplikacjach WWW z zapleczem server-side to żaden problem. Możemy przechowywać dane w bazie np. MySQL, czy też zwyczajnie w plikach. Dzięki Web storage / DOM storage, nasza nowoczesna aplikacja web może przechowywać dane samodzielnie, a my będziemy na nich operować w samym JavaScript. JavaScript Web Storage Jest to część specyfikacji HTML5. Przez web storage […]

html5-tutorial-canvas-image-hot-points_128

Tutorial HTML5: zdjęcie na Canvas z klikalnymi elementami

Rezultatem pracy nad dzisiejszym przykładem będzie efekt, który może być przydatny w wielu projektach z różnych branż. Chodzi o efekt będący swego rodzaju komentarzem do danego punktu na zdjęciu. Możemy w tym miejscu zaprogramować określoną akcję np. pokazanie szczegółowych informacji. Tutorial HTML5 – klikalne punkty na zdjęciu Trzeba mieć na uwadze, że konfiguracja klikalnych punktów […]