7 wtyczek do Twojej przeglądarki, które ułatwią pracę
Każdy stosuje jakieś wtyczki, czy to w Chromie, Operze czy Firefoxie. Zdecydowana większość stworzona jest pod wszystkie przeglądarki. Dziś chcę pokazać kilka, które mi przydają się na co dzień.
Wappalyzer
Rozpoznaje CMS na jakim postawiona jest strona. Dodatkowo wykrywa większość zastosowanych technologii, np. w jakim języku tworzana jest strona, czy posiada statystyki Googla, frameworki, czasami skrypty, Google Fonts itd. Ostanio dzięki temu wiedziałem wszystko o stronie klienta zanim ten zdążył ją opisać.
Font Face Ninja
Bardzo przyjemna wtyczka, która rozpoznaje wskazane myszką fonty. Oprócz nazwy fonta dostajemy info. o rozmiarze, wysykości linii czy odległości między znakami.
WebDeveloper
Wtyczka dla każdego web developera. Bardzo rozbudowana. Wtyczka jest już stara i chyba nawet od dawna nie aktualizowana. Jednak mimo to cały czas może bez problemu z niej korzystać .Daje nam wiele możliwości:
- podgląd strony na różnych rozdzielnościach (teraz już mniej przydatne)
- wyłączenie JS, lub samych powiadomień/popupów
- walidacja kodu
- zarządzanie cookies (wysłączanie, dodawanie, usuwanie)
- zarządzanie formularzami (coś z czego ja często korzystam)
- zarządzenie obrazami (np. wyświetlenie ścieżki do każdego zdjęcia, wyświetlenie rozmiarów, ukrywanie obrazów, przeładowanie, wyświetlenie samych obrazów na oddzielnej stronie itd.)
Możliwości tej wtyczki są naprawdę ogromne i można byłoby na jej temat napisać osobny wpis.
Full Page Screen Capture
Jest bardzo prosta i ma jedno zadanie: zrobić screena całej strony, od góry do dołu. Nie ważne jak długa by była. Do czego się może przydać? Często zanim zaczynam pracę przeglądam dziesiątki stron i cześć chcę sobie zapisać gdzieś w folderze do późniejszego wglądu. Taka teczka inspiracji. Nie muszę bawić się w robienie i łączenie screenów. Ta wtyczka robi zdjęcie całej strony jednym kliknięciem.
Eye Dropper
Miałeś sytuację, że chciałeś pobrać ze strony jakiś konkretny kolor? Eye Dropper tworzy próbnik, dzięki któremu możesz zobaczyć składowe każdego koloru na stronie bez zabawy w plikach CSS. Co więcej pozwala pobrać kolory także ze zdjęć czy czegokolwiek innego.
Image Downloader
Wtyczka dosyć prosta ale bardzo przydatna. Pozwala pobrać za kilkoma kliknięcami wszystkie zdjęcia ze strony. Jeżeli miałeś kiedyś klienta, mówiącego „niech Pan pobierze sobie nasze zdjęcia ze strony, my nie wiemy jak się do nich dostać” – to w końcu możesz odejść bez nerwów i je pobrać.
Dimensions
Fajna wtyczka, która pozwala na szybie sprawdzenie odległości pomiędzy elementami na stronie.
O AdBlocku czy Firebugu nie wspiminam. Myślę, że zna i używa je praktycznie każdy:)
Używacie innych ciekawych wtyczek? Dajcie znać w komentarzach;)
Przydatne wtyczki do ATOM edytora [wideo]
Podczas kręcenia widea Atom – najlepszy edytor web developera obiecałem pokazać wtyczki, które znacząco przyśpieszają pracę i czynią z tego edytora naprawdę fajne narzędzie pracy, i które sam stosuję. Dziś spełniam obietnice i przedstawiam owe wtyczki.
Nagranie jest trochę przydługie więc już gratuluje tym, którym uda się wytrwać do końca 🙂 Starałem się ciąć jak mogłem, jednak chciałem przedstawić jak każda wtyczka działa (chociaż powierzchownie) i dlatego tak się rozciągnęło.
Wtyczki
Na nagraniu przedstawiam i z grubsza omawiam kilka wtyczek, które obecnie stosuję i uważam za naprawdę przydatne:
- atom-beautify
- autoclose-html
- emmet
- file-icons
- less-autocompile
- livereload
- minimap
- pigments
- sass-autocompile