Wszyscy wiemy że dobre narzędzia mogą nam pomóc szybciej osiągnąć cel i być bardziej produktywnym podczas pisania kodu. Dlatego stworzyłem listę 10 wtyczek bez których nie wyobrażam sobie pracy z kodem JavaScript.

1. atom-beautify

atom-beautify

Automatyczne formatowanie kodu w językach HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQL, i wiele więcej.

Skrót klawiszowy: ⌃+⌥+B

2. toggle-quotes

via GIPHY

Szybka zamiana pojedynczego cudzysłowu na podwójny cudzysłów i na odwrót.

Skrót klawiszowy: ⌘+⇧+’

3. Linter-eslint

via GIPHYvia GIPHY

Interfejs dla narzędzia eslint, w czasie rzeczywistym wyświetla uwagi oraz podpowiedzi poprzez analizę kodu pod kątem poprawnego formatowania i błędów.

4. change-case

via GIPHY

Szybka zmiana wielkości liter w zaznaczonym fragmencie kodu.

5. tree-view-copy-relative-path

tree-view-copy-relative-path

Umieszcza w schowku ścieżkę do pliku, niezwykle przydatne podczas wykonywania importu plików znajdujących się daleko w strukturze projektu.

6. Language-babel

Language-babel

Obsługa składni dla wszystkich wersji języka JavaScript oraz składni JSX używanej w bibliotece React.

Ponadto: * Automatyczne formatowanie składni JSX, * automatyczne zamykanie tagów oraz elementów html w języku JSX, * dodawanie odpowiednich tagów komentarzy w oparciu na aktualnym kontekście.

7. React ES7 snippets for atom

via GIPHY

Zestaw niezbędnych snippetów przy pracy z frameworkiem testującym Jest.

8. Highlight Selected

Highlight Selected

Podświetlenie powtórnych wystąpień zaznaczonego fragmentu kodu. Przydatne w poszukiwaniu definicji metody lub funkcji bez potrzeby angażowania narzędzia ‘szukaj’.

9. local-history

Local-history

Podświetlenie powtórnych wystąpień zaznaczonego fragmentu kodu. Przydatne w poszukiwaniu definicji metody lub funkcji bez potrzeby angażowania narzędzia ‘szukaj’.

10. Project-manager

via GIPHY

Łatwe zarządzanie i praca nad wieloma projektami.

Skrót klawiszowy: ⌘+⌃+P