Prettier
minuta czytania
Tomasz Kozon
10 mar 2022
Prettier to narzędzie do automatycznego formatowania kodu, które w ostatnim czasie zyskało dużą popularność w środowisku programistów. Pozwala na ujednolicenie stylów pisania kodu, a tym samym przyczynia się do lepszej czytelności i łatwiejszej utrzymywalności projektów.
Czytelność kodu ma ogromne znaczenie dla każdego projektu, a w szczególności takiego którego piszemy w zespole. Dobrze sformatowany kod to taki, który trzyma się odpowiednich reguł i jest stosowany przez wszystkie osoby w projekcie, dlatego też powstały formatery kodu. Takie narzędzie formatuje kod za nas i trzyma się reguł, które jesteśmy w stanie sami określić wraz z zespołem. Ciężko jest sobie wyobrazić pisanie aplikacji bez formatera kodu, dlatego w tym artykule przedstawię najpopularniejszy formater kodu jakim jest Prettier.
Prettier nie tylko dla javascriptu
Aktualnie prettier wspiera nie tylko javascript, a także: JSX, Angular, Vue, Flow, TypeScript, CSS, LESS, SCSS, HTML, Ember, JSON, GraphQL, Markdown, YAML.
Prettier vs. ESLint
ESLint jest narzędziem służącym do analizy statycznej kodu, który znajduje błędy w kodzie lub złe praktyki i niektóre z tym błędów jest w stanie samemu naprawić, natomiast Prettier służy do formatowania kodu. Krótko mówiąc prettiera używamy do uproszczenia formatowania kodu, a ESLint do wyłapywania błędów. Dlatego warto korzystać z obu narzędzi. Warto również wspomnieć, że ESLint współpracuje tylko z Javascriptem.
Reguły Prettiera
Korzystając z Prettiera jesteśmy w stanie sami określić odpowiednie dla naszego projektu reguły, aby to zrobić należy w pliku .prettierrc skonfigurować Prettiera dodając nowe reguły np.:
{
"printWidth": 80, // określa długość linii
"tabWidth": 2, // określa liczbę spacji na poziomie wcięcia
"singleQuote": true // używa pojedynczych cudzysłowów
"semi": true // dodaje średnik na końcu linii
"useTabs": true // wcięcia linii są stosowane za pomocą tabulatorami zamiast spacji
}
Instalacja Prettiera
Aby dodać Prettiera do naszego projektu należy za pomocą managera pakietu wykonać następujące polecenia:
yarn add --dev --exact prettier
Lub jeśli korzystamy z edytora Visual studio code, wystarczy że dodamy nowe rozszerzenie o nazwie “Prettier - Code formatter”.
Podsumowanie
Dzięki rozwojowi takich narzędzi jak Prettier nie musimy już ręcznie formatować kodu, dzięki czemu zaoszczędzimy trochę czasu i możemy się bardziej skupić na kodowaniu. Warto również zapoznać się z narzędziem jakim jest husky, który pozwala nam na integrację z Git hookami, co umożliwia nam na zautomatyzowanie Prettiera oraz ESLinta.
Powiązane artykuły
Jak wykorzystać pliki cookies do poprawy jakości działania strony internetowej?
16 mar 2023
W erze cyfrowej, gdzie użytkownicy oczekują szybkich, spersonalizowanych i bezproblemowych doświadczeń online, coraz więcej właścicieli stron internetowych poszukuje skutecznych sposobów na poprawę jakości swoich witryn. Jednym z narzędzi, które może przyczynić się do osiągnięcia tego celu, są pliki cookie.
Tomasz Kozon

Reklamowanie się w Gmailu za pomocą Gmail Sponsored Promotion.
15 mar 2023
Reklama w internecie to obecnie niezbędny element strategii marketingowych dla firm każdej wielkości i branży. Jednym z kanałów reklamowych, które zdobywają coraz większą popularność, jest Gmail Sponsored Promotion. To narzędzie pozwala na wyświetlanie reklam w skrzynce odbiorczej użytkowników Gmaila w sposób nieinwazyjny i dopasowany do profilu odbiorcy.
Tomasz Kozon
Jakie są różnice między atrybutami nofollow i dofollow?
14 mar 2023
W świecie SEO atrybuty nofollow i dofollow są pojęciami, z którymi każdy właściciel strony internetowej powinien się zapoznać. Oba atrybuty stanowią ważny element optymalizacji strony internetowej, wpływając na jej pozycję w wynikach wyszukiwania. Atrybut nofollow i dofollow oznaczają dwa różne podejścia do linkowania, a ich właściwe stosowanie może przynieść korzyści dla witryny internetowej w postaci zwiększenia ruchu i poprawy reputacji w oczach algorytmów wyszukiwarek.
Tomasz Kozon
Definition of Done w metodologii Agile - jak wykorzystać ten koncept w praktyce
14 mar 2023
W dzisiejszym dynamicznym świecie zarządzania projektami IT, metodologia Agile zyskuje coraz większą popularność jako elastyczne i efektywne podejście do wytwarzania oprogramowania. Wśród kluczowych konceptów Agile, Definition of Done (DoD) pełni istotną rolę w utrzymaniu wysokiej jakości produktów oraz sprawnym monitorowaniu postępów projektu.
Tomasz Kozon
Geotargetowanie w strategii marketingowej: Jak może przyczynić się do wzrostu sprzedaży i świadomości marki
14 mar 2023
W erze cyfryzacji i rosnącej konkurencji na rynku, przedsiębiorstwa poszukują coraz bardziej efektywnych i innowacyjnych strategii marketingowych. Geotargetowanie, czyli wykorzystanie danych geolokalizacyjnych w celu dostarczania spersonalizowanych treści i reklam, stało się jednym z kluczowych narzędzi w budowaniu skutecznych kampanii.
Tomasz Kozon
Co to jest robots.txt i do czego służy?
14 mar 2023
Robots.txt to plik, który jest często pomijany przez właścicieli stron internetowych, a jednocześnie może mieć kluczowe znaczenie dla ich widoczności w wyszukiwarkach. Plik ten określa zasady, według których roboty wyszukiwarek powinny indeksować naszą witrynę. Właściwe wykorzystanie pliku pozwala kontrolować indeksowanie poszczególnych sekcji naszej witryny, co zwiększa jej bezpieczeństwo oraz skupia uwagę robotów na najważniejszych elementach.
Tomasz Kozon
Dlaczego evergreen content jest ważny dla strategii marketingowej?
13 mar 2023
W dzisiejszych czasach, gdy konkurencja w internecie jest ogromna, a uwaga użytkowników skupia się na krótkich treściach, evergreen content stanowi odrębną wartość w strategii marketingowej. Dzięki swojej trwałości i wartości, pozwala na przyciąganie uwagi i angażowanie odbiorców na długi czas.
Tomasz Kozon
Zobacz wszystkie artykuły