10 nejužitečnějších balíčků Atom pro webové vývojáře

Vyzkoušeli jste Atom? Ačkoli je to zcela nové, mnozí se zamilovali do Atomu, textového editoru GitHubu, který nabízí mnoho výhod a především je zdarma k použití. Atom je dodáván s několika vestavěnými balíčky, jako je například integrace s Git a stromovým zobrazením. Pro účely vývoje však budete určitě potřebovat další balíčky.

V tomto příspěvku jsme vybrali několik balíčků, které musí mít webový vývojář. Některé z nich jsou skvělé k tomu, aby vám pomohly uspořádat váš chaotický kód, jiní vám pomohou lépe přistupovat k souborům, aniž byste museli opustit Atom. Zde je 10 balíčků Atom.

Výběr barvy

Jak název napovídá, tento balíček vám umožní vybírat barvy a je to stejně snadné jako klepnutí pravým tlačítkem myši a výběr položky „Výběr barvy“. Alternativně to lze provést stisknutím CMD / CTRL + SHIFT + C. Nástroj pro výběr barev funguje, pokud je kurzor na textu na souborech CSS / SASS / LESS, které obsahují jeden z následujících formátů barev: HEX, HEXa, RGB, RGBa, HSL, HSLa, HSV, HSVa, VEC3 a VEC4 nebo barevnou proměnnou na SASS nebo LESS. Má také schopnost konvertovat mezi formáty.

Mravenec

Mravenec Zdá se, že je to plugin, který potřebujete nainstalovat, bez ohledu na prostředí textového editoru. Hlavní rysy Emmetu, jako je rozšiřování zkratek a obalů se zkratkami, vám umožní pracovat rychle při psaní syntaxí HTML, CSS, Sass / SCSS a LESS. Například v HTML zadejte p> a.mylink pak klepněte na klávesu TAB a získáte úplnou značku HTML

. Cheat Sheet vám pomůže rychle se naučit syntaxi zkratky Emmet.

Minimap

Pokud jste zvyklí na Sublime Text, můžete být obeznámeni s mini náhledem v pravém bočním okně. Tato funkce je užitečná pro rychlé procházení zdrojovými kódy příliš dlouhou pro výšku okna. S Minimap, dostanete to pro Atom. Můžete dokonce nastavit pozici, která má být vlevo nebo vpravo, zapnout / vypnout zvýraznění kódu a další. Minimap dokonce přichází s některými pluginy pro rozšíření jeho funkčnosti, jako je například zvýrazňovač barev.

Zkrášlit

Zkrášlit změní váš chaotický kódový čistič a bude lépe čitelný. Má velkou podporu pro programovací jazyky, jako jsou HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C ++, C #, Objective-C, CoffeeScript, strojopis a SQL. Po instalaci tohoto balíku jej spustíte kliknutím pravým tlačítkem myši a výběrem 'Zkrášlit obsah editoru', nebo přes Balíčky> Atom Beautify> Beautify.

Atom Linter

Atom Linter přichází jako „dům“ linování zásuvných modulů pro hlavní jazyky a poskytuje rozhraní API nejvyšší úrovně pro linters. K dispozici jsou linters pro JavaScript, CoffeeScript, CSS / SASS / SCSS / LESS / STYLUS, Ruby, Python. V jednom jazyce může být k dispozici více pluginů, například JSHint, JSCS a JSXHint pro JavaScript.

Po instalaci tohoto hlavního balíčku potřebujete nainstalovat konkrétní linter pro jazyk, na kterém pracujete, například pokud jste na JavaScriptu a zvolte JSHint pro linter, pak jej můžete nainstalovat spuštěním $ apm install linter-jshint na terminálu.

Ikony souborů

Ikony souborů přidat ikony do názvu souboru na základě odpovídajícího typu souboru. Přidá vizuální vylepšení při otevření souboru na kartě nebo ve stromovém zobrazení. Ikony souborů lze přizpůsobit: můžete přidat vlastní ikonu a změnit barvu pomocí souborů LESS v souboru balíčky / ikony souborů / styly adresář. Výchozí ikona je v 8 barvách a 3 variantách (světle, středně a tmavě).

Úryvky JavaScriptu

Úryvky JavaScriptu umožňuje rychle napsat část zdrojového kódu JS. S definovanou zkratkou nemusíte psát kódové slovo pro slovo, například jen typ cl dělat console.log a gi pro getElementById. Tato funkce je podobná funkci Emmet, ale běží na kódu JavaScript. Tento balíček Atom poskytuje mnoho syntaxe JavaScriptu, jako je funkce, konzola a smyčka.

CSS Comb

CSS Comb dělá váš kód stylů formátovaný konzistentně, vypadající elegantní a krásné. Můžete použít přednastavené předvolby třídění založené na samotném Yandexu, Zenu nebo CSSComb, nebo můžete dokonce použít vlastní preference pro vytvoření pravidel třídění. Po instalaci tohoto balíčku lze třídicí úlohu provést stisknutím kláves CTRL + ALT + C nebo pomocí kontextového menu Balíky> CSS comb> Comb.

Git Plus

Git Plus umožňuje pracovat s Gitem bez opuštění editoru Atom. V editoru můžete provádět Git commit, checkout, push / pull, diff a další příkazy git. Musíte nastavit svůj user.name a user.email na vašem konfiguračním souboru git, aby fungovaly všechny funkce. Pro přístup ke všem příkazům git otevřete paletu pomocí CMD + SHIFT + H nebo zvolte Balíček> Git Plus.

Remote Edit

Remote Edit vám umožní vidět a editovat vzdálené soubory bez opuštění editoru nebo s použitím jiných ftp aplikací. Chcete-li začít, nejprve vytvořte nového hostitele a pak přidejte nabídku Balíčky> Vzdálená úprava> Přidat nového hostitele a vložte své přihlašovací údaje. Nyní můžete procházet vzdálené soubory, pomocí kláves CTRL + ALT + B procházet registrované hostitele a zobrazit soubory.