CSS jest prostym językiem i można w nim pisać kod, który jest łatwo dołączany do projektu. Początkujący web deweloper nie zawsze jest świadomy, jakie szkody może wyrządzić nieumiejętne dokładanie kodu css. Wtedy zaczyna się niestety szukanie „na szybko” przyczyny złego stylowania poszczególnych elementów.
Blog - Tworzenie stron
Gulp.js – narzędzie do automatyzacji #2
Nadszedł czas na drugą część z cyklu minifikacja i automatyzacja w zakresie front-endu. Jakiś czas temu przedstawiłem teorię i konfigurację Gulp.js. Dzisiaj skupię się na nieco szerszej analizie i przedstawieniu przykładu, jak (wg. mnie) zautomatyzować proces tworzenia witryny. Jako przykładowy schemat działania wykorzystam skrypt z Grunt’a.
Gulp.js – narzędzie do automatyzacji #1
Jakiś czas temu pisałem na temat, jakim jest minifikacja js i css, na przykładzie narzędzia Grunt. Dzisiaj wstępnie omówię drugie narzędzie służące do automatyzacji procesu tworzenia stron www, czyli Gulp.js. Skupię się na porównaniu go do wspomnianego Grunt’a, zaletach i wadach oraz kilku prostych przykładach. Zaczynamy.
Animate.css, czyli proste animacje w czystym css
Witam. Coraz więcej serwisów internetowych zawiera w sobie efektowne animacje, przejścia, przekształcenia elementów. Kiedyś za te efekty odpowiadały grafiki, np. gif’y, jednak obecnie nie jest już to efektywne rozwiązanie, dlatego wykorzystuje się dobrodziejstwa CSS. Zatem, z czego korzystać? Jak stworzyć lekką, a zarazem efektowną stronę?
Porównanie funkcji querySelector, getElementById i getElementsByClassName
Tworząc strony internetowe „od strony frontowej” zastanawialiście się kiedyś nad wydajnością waszych witryn? Otóż ma to duży wpływ na szybkość generowania strony, podobnie jak optymalny skrypt po stronie serwerowej. Wydajność dzisiejszych aplikacji webowych jest niezwykle istotna ze względu na ogromną popularność wszelkiej maści urządzeń mobilnych.
Reguła !important w CSS – kiedy i jak używać?
Słowami Stephanie Rewis rozpoczynam te wpis, chcąc zwrócić uwagę na istotę „problemu”. Autor powyższego wpisu, sfrustrowany kodami css, zwraca uwagę na nadużywanie pewnych reguł, które niekiedy powodują bałagan w kodzie.
Bootstrap 4 – wstęp do nowości
Każdy, kto choć troche interesuje się tworzeniem stron internetowych na pewno zna framework frontendowy Bootstrap. Jest to jeden z najbardziej popularnych i najczęściej wykorzystywanych narzędzi deweloperskich do tworzenia stron. Właśnie została zaprezentowana jego czwarta wersja, póki co w stadium alpha. Jest sporo nowości, a więc zaczynamy.
Minifikacja plików JS i CSS – Grunt
Wiele osób, mając własną witrynę, zastanawia się czasem, jak by tu ją przyspieszyć. Coraz popularniejsze są narzędzia Google, tj. usługa PageSpeed Insights, która pozwala na przetestowanie danej witryny pod względem optymalizacyjnym, a co za tym idzie pod względem szybkości działania. Postaram się po krótce przedstawić narzędzie, które pozwoli zautomatyzować minifikację plików css i js.
Zagnieżdżenie elementów HTML
Zainspirowany brakiem magii świąt, chciałbym napisać kilka (krótkich) słów na temat zagnieżdżenia elementów html. Jest to temat o tyle ciekawy, że nierzadko istnieje więcej niż jedno poprawne rozwiązanie. Moje przykłady zawarte w tym tekście są moją praktyką i uważam je za poprawne. Dzisiejszy wpis będzie na temat linków i nagłówków.
AJAX – dobrodziejstwo dynamicznych witryn
AJAX jest to technika tworzenia aplikacji internetowych, dzięki której dane możemy pobierać i wysyłać asynchronicznie („w tle”). Wiele witryn korzysta z tego dobrodziejstwa, w którym ładowanie danych odbywa się bez przeładowania całej strony. Podstawowymi elementami, które wchodzą w skład AJAXu są XMLHttpRequest, JavaScript oraz XML.
Screenshot w HTML5
Wideo towarzyszy internautom niemal każdego dnia. Czy zastanawialiście się, jak zrobić screen’a z filmu w przeglądarce? Naturalnie można. Z pomocą przychodzi HTML5 wraz z metodą drawimage(). Co prawda funkcja obsługująca owe zdarzenia pojawiła się w specyfikacji już w 2008 roku, jednak jest do tej pory rozwijana i udoskonalana. Przejdźmy jednak do rzeczy.