Prettier
minuta czytania
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.
Nasza oferta
Web development
Dowiedz się więcejMobile development
Dowiedz się więcejE-commerce
Dowiedz się więcejProjektowanie UX/UI
Dowiedz się więcejOutsourcing
Dowiedz się więcejPowiązane artykuły
Architektura VIPER: Podstawy i praktyczne wskazówki
14 mar 2024
Architektura VIPER to model, wprowadzony dla zwiększenia przejrzystości i testowalności kodu w projektach iOS. Jego implementacja może wydawać się skomplikowana, dlatego przygotowaliśmy przystępny przewodnik, obejmujący teorię i praktykę. Od podstaw po konkrety - zrozumiesz kluczowe elementy tego rozwiązania, aby skutecznie je wykorzystać.
Zasady i Efektywność Metodyki Disciplined Agile
14 mar 2024
Rozważając różne metodyki Agile, często zapominamy o jednej o nazwie Disciplined Agile (DA). Ta metodyka, choć nie tak popularna jak Scrum czy Kanban, ma w sobie wiele zalet, które mogą przynieść wyraźne korzyści w realizacji projektów IT. Sprawdźmy, jakie zasady rządzą DA i jak skuteczna jest ta metodyka w praktyce.
Strangler Fig Pattern: Skuteczne strategie refaktoryzacji starej aplikacji
14 mar 2024
Pisanie nowego kodu jest ekscytujące. Ale co z częścią IT dotyczącą refaktoryzacji? Jak skutecznie modernizować starą aplikację, nie narażając jej na ryzyko awarii? Strangler Fig Pattern to rozwiązanie, które pozwala na stopniową zamianę starego systemu na nowy. Przeanalizujmy tę inspirującą strategię.
QTest a jakość oprogramowania - jak to działa?
13 mar 2024
Zapewnienie jakości oprogramowania staje się coraz ważniejsze w dynamicznie rozwijającym się środowisku IT. Kluczową rolę w tym procesie odgrywają narzędzia do testowania kodu, takie jak QTest. Poznaj zastosowanie i funkcjonalność QTest w kontekście zapewniania najwyższego standardu tworzonego oprogramowania.
Wprowadzenie do iPaaS: Jak skorzystać z Integration Platform as a Service?
13 mar 2024
Zrozumienie i efektywne korzystanie z iPaaS (Integration Platform as a Service) może być krokiem milowym dla Twojej firmy. Nie tylko ułatwia przepływ danych między różnymi aplikacjami, ale również Ci pozwala skoncentrować się na podstawowych zadaniach, gdyż zautomatyzowana integracja zajmuje się resztą. Nawet jeśli jesteś początkującym, nie musisz się obawiać - ten artykuł pomoże Ci zrozumieć, jak wykorzystać iPaaS w praktyce.
Meta Keywords: Jak poprawić SEO Twojej strony
13 mar 2024
Poznaj sekrety efektywnego SEO! W tym artykule przyjrzymy się bliżej metatagowi 'keywords', który pomimo swojego kontrowersyjnego statusu, ma potencjał zwiększyć widoczność Twojej strony w wynikach wyszukiwania. Czytaj dalej, aby dowiedzieć się więcej o tym nieocenionym narzędziu.
Nexus - efektywne zarządzanie pracą zespołową
12 mar 2024
Nexus, to nowoczesne podejście do zarządzania projektami, które stawia na efektywną współpracę zespołową. Puszcza w niepamięć długotrwałe plany i nieelastyczne harmonogramy. Przedstawia skuteczne strategie do zarządzanie projektem, które są wysoce efektywne.
Zobacz wszystkie artykuły