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
Performance Testing – jak poprawnie je wykonać?
24 lip 2024
Performance testing to kluczowy element w procesie tworzenia oprogramowania, mający na celu zapewnienie wysokiej jakości i sprawnego działania aplikacji. W tym przewodniku krok po kroku, przybliżę Ci zasady, metody oraz narzędzia, które pozwolą Ci efektywnie przeprowadzić testy wydajnościowe, a co za tym idzie - optymalizować działanie swojego oprogramowania.
![related-article-image-developer, Performance Testing](/_next/image?url=https%3A%2F%2Fd2ooyrflu7lhqd.cloudfront.net%2Fboringowl_io_developer_working_in_front_of_computer_there_is_co_2ea66295_1261_4fb3_9db6_43224455cd52_a643ef7008.png%3Fformat%3Dauto&w=3840&q=75)
Smarketing: Czym jest i dlaczego jest tak ważny dla współczesnych firm?
24 lip 2024
Smarketing, czyli integracja marketingu i sprzedaży, to nowoczesne podejście, które zdobywa popularność wśród współczesnych firm. W zglobalizowanym świecie, gdzie klienci mają nieograniczony dostęp do informacji, smarketing staje się kluczowy dla sukcesu biznesowego. Poznajmy bliżej tę strategię.
LLMO - Czym jest optymalizacja pod duże modele językowe
24 lip 2024
W świecie technologii, gdzie język staje się kluczem do interakcji między człowiekiem a maszyną, modelowanie językowe odgrywa kluczową rolę. Czy kiedykolwiek zastanawiałeś się, jak optymalizować duże modele językowe? Poznaj LLMO - rewolucyjny krok w dziedzinie modelowania językowego. Optymalizacja pod duże modele językowe otwiera nowe możliwości i perspektywy.
Privacy Sandbox – Kluczowe informacje, które musisz znać
23 lip 2024
Zasadnicze zrozumienie Privacy Sandbox - technologii stworzonej przez Google w celu ochrony prywatności online - jest niezbędne dla każdego, kto działa w świecie cyfrowym. W tym artykule poznasz nie tylko czym jest Privacy Sandbox, ale także jak ta innowacja wpływa na reklamę online i prywatność danych.
Czym tak naprawdę zajmuje się UX Strategist?
23 lip 2024
Zastanawiasz się, czym zajmuje się strateg UX? To osoba która zna wiele aspektów projektowania, która łączy kompetencje biznesowe i techniczne, a jego główne zadanie to odkrywanie, definiowanie i projektowanie celów produktu cyfrowego. Jest to kluczowa rola dla tworzenia użytecznych i atrakcyjnych interfejsów użytkownika.
Testy mutacyjne: Rewolucyjna strategia kontroli jakości w świecie programowania
23 lip 2024
Testy mutacyjne, znane też jako testy genetyczne, tackują wkroczenie w nową erę kontroli jakości w programowaniu. Aktualizacja naszego podejścia do testowania kodu staje się nieunikniona, a testy mutacyjne, podnosząc jakość i niezawodność naszych systemów, mogą odgrywać kluczową rolę.
Badania ilościowe w UX: Optymalizacja procesu i skuteczne wykorzystanie
22 lip 2024
Kiedy tworzymy doświadczenia online, jednym z kluczowych aspektów są badania ilościowe w UX. Natomiast, aby proces badania był efektywny, musi być on odpowiednio zoptymalizowany. W tym artykule zastanowimy się, jak skutecznie wykorzystać badania ilościowe w UX, aby poprawić naszą pracę.
Zobacz wszystkie artykuły