10 hyödyllisintä Atom-pakettia Web-kehittäjille

Oletko kokeillut Atomia? Vaikka se on aivan uusi, monet ovat rakastuneet Atomiin, GitHubin tekemään tekstieditoriin, joka tarjoaa monia etuja ja on ennen kaikkea ilmainen käytettäväksi. Atomissa on muutama sisäänrakennettu paketti, kuten integrointi Gitin ja puunäkymiin. Kehitystarkoituksiin tarvitaan kuitenkin varmasti muita paketteja.

Tässä viestissä olemme valinneet muutamia paketteja, joita web-kehittäjällä on oltava. Jotkut ovat hyviä auttamaan järjestelemään sotkuista koodiasi, toiset auttavat sinua pääsemään paremmin tiedostoihisi poistumatta Atomista. Tässä on 10 pakollista Atom-pakettia.

Värinvalitsija

Kuten nimestä käy ilmi, tämä paketti antaa sinulle mahdollisuuden valita värejä, ja se on yhtä helppoa kuin hiiren kakkospainikkeella ja valitsemalla 'Värivalitsin'. Vaihtoehtoisesti se voidaan tehdä painamalla CMD / CTRL + SHIFT + C. Color Picker toimii, jos kursori on tekstissä CSS / SASS / LESS-tiedostoissa, jotka sisältävät jonkin seuraavista värimuodoista: HEX, HEXa, RGB, RGBa, HSL, HSLa, HSV, HSVa, VEC3 ja VEC4 tai värimuuttuja päällä SASS tai LESS. Sillä on myös mahdollisuus muuntaa formaatteja.

Emmet

Emmet näyttää olevan plugin, joka sinun on asennettava riippumatta tekstieditoriympäristöstäsi. Emmetin pääpiirteet, kuten lyhenteiden laajentaminen ja lyhentäminen, mahdollistavat nopean työskentelyn HTML-, CSS-, Sass / SCSS- ja LESS-syntaksien kirjoittamisessa. Esimerkiksi HTML-muodossa p> a.mylink napauta sitten TAB-näppäintä saadaksesi täydellisen HTML-koodin

. Cheat Sheet auttaa sinua oppimaan nopeasti Emmetin lyhenteiden syntaksin.

minimap

Jos olet tottunut Sublime Textiin, saatat tuntea mini-esikatselun oikealla puolella olevasta ikkunasta. Tämä ominaisuus on hyödyllinen, kun haluat nopeasti selata lähdekoodeja liian pitkiksi ikkunan korkeudelle. Kanssa minimap, saat tämän Atomille. Voit jopa asettaa sijainnin vasemmalle tai oikealle, kytkeä päälle / pois koodin kohokohdat ja paljon muuta. Minimapissa on jopa joitakin laajennuksia, joiden avulla voidaan laajentaa sen toimintoja, kuten värin korostus.

Kaunistaa

Kaunistaa kääntää sotkuisen koodisi neaterin ja luettavaksi. Se tukee suuresti ohjelmointikieliä, kuten HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C ++, C #, Objective-C, CoffeeScript, kirjoituskirja ja SQL. Kun olet asentanut tämän paketin, suorita se napsauttamalla hiiren kakkospainikkeella ja valitsemalla "Koristele editorin sisältö", tai kautta Paketit> Atom Beautify> Beautify.

Atom Linter

Atom Linter tulee tärkeimpien kielten vioittavien laajennusten "talona", joka tarjoaa huipputason API: n. Käytettävissä on JavaScript, CoffeeScript, CSS / SASS / SCSS / LESS / STYLUS, Ruby, Python. Yhdellä kielellä voi olla enemmän kuin yksi plugin, kuten JSHint, JSCS ja JSXHint JavaScriptille.

Kun olet asentanut tämän pääpaketin, sinun täytyy asenna tietty kieli, jota käytät, esimerkiksi jos olet JavaScriptissä ja valitse JSHint linterille, voit asentaa sen käynnissä $ apm asentaa linter-jshintin Terminalissa.

Tiedoston kuvakkeet

Tiedoston kuvakkeet lisää kuvakkeet tiedostonimelle vastaavan tiedostotyypin perusteella. Se lisää visuaalisia parannuksia, kun avaat tiedoston välilehdellä tai puunäkymässä. Tiedoston kuvakkeet ovat muokattavissa: voit lisätä oman kuvakkeen ja muuttaa väriä LESS-tiedostojen kautta paketit / tiedostojen kuvakkeet / tyylit hakemistoon. Oletuskuvake on 8 väriä ja 3 muunnosta (kevyt, keskikokoinen ja tumma).

JavaScript-pätkät

JavaScript-pätkät voit kirjoittaa nopeasti osan JS-lähdekoodista. Määritetyllä lyhenteellä ei tarvitse kirjoittaa koodisanaa sanalle, esimerkiksi vain kirjoita cl tehdä console.log ja gi varten getElementById. Tämä toiminto on samanlainen kuin Emmet, mutta se toimii JavaScript-koodilla. Tämä Atom-paketti sisältää monia JavaScript-syntaksi, kuten toiminto, konsoli ja silmukka.

CSS Comb

CSS Comb tekee tyylisivujen koodisi muotoiltua johdonmukaisesti, ja se on siisti ja kaunis. Voit käyttää ennalta tehtyjä lajitteluasetuksia, jotka perustuvat itse Yandexiin, Zeniin tai CSSCombiin, tai voit jopa käyttää omia mieltymystesi lajittelusääntöjen tekemiseen. Kun olet asentanut tämän paketin, lajittelutyö voidaan tehdä painamalla CTRL + ALT + C tai pääsyä kontekstivalikosta Paketit> CSS-kampa> kampa.

Git Plus

Git Plus voit työskennellä Gitin kanssa poistumatta Atom-editorista. Editorissa voit tehdä Gitin sitoumuksen, kassalle, push / pull, diff ja muut git-komennot. Sinun täytyy asentaa user.name ja user.email git-konfigurointitiedostossa voit tehdä kaikki toiminnot. Voit avata kaikki git-komennot avaamalla paletin CMD + SHIFT + H tai valitsemalla Paketti> Git Plus.

Etäkäsittely

Etäkäsittely auttaa sinua näkemään ja muokkaamaan etätietojesi poistumatta editorista tai käyttämällä muita ftp-sovelluksia. Aloita luomalla ensin uusi isäntä ja lisää sitten valikko Paketit> Etäkäsittely> Lisää uusi isäntä ja lisää kirjautumistiedot. Nyt voit selata etätiedostojasi, selata rekisteröityä isäntää CTRL + ALT + B: llä ja nähdä tiedostot.