Stiahnite si program. Držiaky. Požadované plugins. Každý tiež vie, čo každý z parametrov potrebuje

Držiaky. - Projekt vyvinutý spoločnosťou Adobe. Spočiatku považoval za editor kódu pre zjednodušené vytváranie webových aplikácií. Počas uplynulého roka vyšlo niekoľko aktualizácií, ktoré jednoducho nezvýšili výkon editora, ale tiež pridal niekoľko funkcií, ktoré budú užitočné pre vývojárov.

V súčasnosti je aktuálna verzia Konzoly 1.2.

Začnime s programovým rozhraním:

Rozhranie

Programové rozhranie pozostáva z:

  • Menu - súbor, úprava, vyhľadávanie, TD
  • Oblasť výberu projektu na úpravu
  • Oblasť písania kódu

Tlačidlo môžete tiež zvýrazniť na zapnutie režimu. Živý náhľad.Ale o niečo neskôr.

Spočiatku, bez plug-in a témy, programové rozhranie je pomerne jednoduché a štandardné. Nič navyše pre začínajúci vývojár: osvetlenie syntaxe kódu v oblasti úprav, adresára adresárov projektu.

Pomocou kombinácie CTRL ++ / CTRL + - môžete zvýšiť / znížiť veľkosť písma.

S výstupom verzia 0,42. Podporuje sa podpora pre zmenu a inštaláciu tém. Podľa štandardu boli len Svetlo a Tma.. Musí priznať, že temná téma je pre mňa príjemnejšia.

Nároky sú uvedené v karte vyhliadkaTémy.. Na tej istej karte sa môžete zmeniť písmo a to veľkosť.

Témy v zátvorkách.

Rozdelený pohľad.

Verzia 0,44 korigoval veľký počet chýb, zlepšená účinnosť a tiež pridala takúto funkciu ako Rozdelený pohľad.. Táto funkcia umožní rozdeliť Upraviť oblasť do dvoch častí a práca s dvoma súbormi súčasne. Musíme priznať - toto zjednodušilo vývoj občas.

Oddelenie je možné horizontálne.


Horizontálna separácia editora zátvoriek

A tiež je možné rozdeliť vertikálne.


Vertikálne rozdelenie editora zátvoriek

Farebná paleta

Aj v zátvorkách je funkcia ako funkcia palety farieb s kombináciou CTRL + E. Funguje to takto:

Vložte kurzy do farebného kódu a stlačte kombináciu CTRL + E.. Farebná paleta sa otvorí, kde môžete určiť, ktorá farba a s akou transparentnosťou potrebujete.


Brackets Color Palette

Extrakt pre konzoly (náhľad)

Tri roky po uvoľnení prvej verzie zátvoriek bola vydaná verzia 1.0.. Okrem zlepšenia produktivity bol takýto plugin pridaný ako Extrakt pre konzoly (náhľad).

Umožňuje otvoriť šablóny vo formáte PSD. Priamo v Brecketoch a zobraziť ich ako v Photoshop. Vrstiev. S ním môžete vidieť veľkosť stránky alebo inej stránky, ako sú bloky, v pixeloch alebo percentách, ako aj na jeho umiestnenie, a potom okamžite zadajte tieto hodnoty v editore.


Extrakt na zátvorky (recenzia)

Spočiatku je myšlienka vynikajúca a celkom užitočná. Ale problém bol to verzia 1.0 Plugin pracoval nesprávne, spomalil a naložil systém.

Aj mínus je potreba mať účet v "Cloud" Adobe Creative Cloud, pretože PSD. Šablóny sa tam načítajú.

Aby som bol úprimný, ani po vydaní nových verzií, túto funkciu nepoužívam kvôli "buggy".

Správca expanzie

Inštalácia pluginov sa vyskytuje v okne Správca expanzie, Môže byť inštalovaný a témy na dekoráciu.

Pluginy Konzoly vám umožňujú rozšíriť štandardnú funkčnosť a uľahčiť vývoj projektu. Jeden z týchto pluginov, všetky známe Emmet..

Emmet. - Plugin vám umožňuje napísať veľký kód pomocou skratiek, z časových úspor.

Napríklad:

Písaný takýto kód v dokumente HTML:

Xhtml

uL\u003e Li * 4\u003e A

uL\u003e Li * 4\u003e A [HREF \u003d #]

Po stlačení tlačidiel HOT (nastavené na tlačidlo Karty.) Písomný kód "rozvíja" v

Xhtml

    Živý náhľad.

    Nuž, nakoniec vám poviem o takej nádhernej funkcii Živý náhľad.. S touto funkciou môžete vidieť výsledok v reálnom čase. Princíp je jednoduchý: Vyberte si html Dokument, zapnúť Živý náhľad.. Otvorí sa okno prehliadača, v ktorom sa váš projekt zobrazí v aktuálnej možnosti písania. Stojí za to pridať, že táto funkcia funguje len s prehliadačom Chróm. . Zdá sa, že sa hovorí o podpore iných prehliadačov, ale len v budúcich verziách programu.

    Ale táto funkcia je podľa môjho názoru kľúčová. Najmä pre vývojárov pracujúcich s dvoma obrazovkami.

    Záver

    Na to chcem dokončiť túto recenziu. Stále to môžem pridať Držiaky. Vynikajúce vhodné začiatočníciwebových vývojárov. Som ako začiatočník značky stránok, odporúčam ho používať. Tento editor sa nevyžaduje na zdroje, jednoduché rozhranie a pomocou klávesových tlačidiel a plug-inov, umožňuje urýchliť a zjednodušiť kód písania.

    Oficiálny editor webových stránok Držiaky..

Prehistóriové konzoly.

Začať s menom a logom. Konzoly sú preložené ako [citácie]. Je to im, že vidíme na logu. Nedávno som zmenil logo. Je to viac vizuálne a čo je najdôležitejšie okamžite odráža podstatu našich stránok, ako zdroj na vytváranie lokalít. To isté tu - ideálne odráža podstatu editora kódu, zdá sa mi to.

Adobe Brackets, áno Áno, nepočuli ste - tento program je veľmi slávna spoločnosť Adobe Company v našich kruhoch. Je to s ich jednoduchým podaním, že začali vývoj tohto softvéru. Najprv však bol známy ako okrajový kód. Takže ak sa vás pýtate, viete - to je to isté.

Čo robili zátvorky ako ja?

Prvé združenie, Ktorý som mal na otvorení softvéru - sakra, a to je ruský vznešený! Program podporuje mnoho jazykov a môžete ľahko preberať zátvorky v ruštine priamo z offsightu. A neuveriteľne pripomína sublimetext.

Druhé, pohodlie práce. Samozrejme, v tom čase všetci zabili závady. Program však bol stále v etapách testovania a rozvoja. A práve som nezohľadnil húfy. Pretože dizajn je krajší a viac premyslený, najmä pre nováčikov. Tam sú tlačidlá, ponuky a iné buchty použiteľnosti. Zdá sa, že a minimalizmus zostal, a zároveň pohodlne do pekla.

Tretie, originálne nápady, ktoré som nesplnil v sublimetexte a iných editoroch. Interaktívne prezeranie a osvetlenie prvkov, keď rozloženie, rýchle úpravy, tipy farieb, vstavaný systém pomoci a oveľa viac. Najmä ma zaujíma pár pluginov. O tom poviem na konci článku, v sekcii - "Breaks Editor Brackets".

Po štvrté, je úplne zadarmo a je tu ruská verzia A slobodne stiahnuté z oficiálnych stránok. Zdá sa mi, že Adobe konkrétne mumedol to všetko, aby sa sublimetext z trhu. Bol veľmi populárny.

Piate, zvyšok je tiež vo veľkom

- tu a multiplatform. Môžete bezpečne "Spike" konzoly pre Windows, Linux a ďalšie OS. Z dôvodu, že editor je určený pre HTML, CSS a JS. A pracujú všade.

- A mnoho rôznych plug-inov a rozšírení. Ktoré vám umožňujú plne nakonfigurovať bracky pod vašim potrebám.

- A veľa tém pre všetky druhy farieb a tónov. Pre každú chuť, tak hovoriť.

Konzoly - Nastavenia a čipy

  1. Inštalácia editora
  2. Opravte problém ruského písma
  3. Rozhranie editora
  4. Základné konfiguračné konzoly.
  5. Split - Rozdelenie obrazovky
  6. Bočný panel
  7. Živý náhľad - Interaktívny pohľad
  8. Inline editory pre HTML - rýchle úpravy
  9. Inline editory pre CSS - Rýchla editácia
  10. Rýchla dokumentácia CSS

Konzoly - pluginy a rozšírenia

  1. Témy na dekoráciu
  2. Bracks Icons - Ikony v editore
  3. Overscroll - Rewind pod kódom
  4. Špeciálne charakteristiky - Špeciálna tabuľka rady
  5. Konzoly CSS Color Preview - Rýchle zobrazenie Kvety
  6. Colorhints - Rýchly výber farieb
  7. Brackets Color Palette - Vyberte farbu z obrázkov
  8. Sprievodcovia zarážkami - Kódovanie Orientácia na hniezdenie
  9. CODEFOLDING - Kód skladania
  10. Documets Toolbar - Horizontálny otvorený panel súborov
  11. Emmet - Fast Sada HTML a CSS
  12. CSFier - casting Vložiť selektory v CSS
  13. Minifier - CSS a kompresia súborov JS
  14. Js skrášovač - kód formátu
  15. Autoprefixer - automatické prefixy
  16. Extrakt na zátvorky (náhľad) - Časť 1
  17. Extrakt pre konzoly (náhľad) - Časť 2
  18. eQFTP - Klient priamo v editore
  19. QUICKFORMTOOL - FRONGOVÉ FORMY
  20. SVG Font - Zobraziť súbory SVG
  21. Konzoly útržky (podľa Zaggino) - útržky
  22. Odpoveď pre konzoly - Adaptívny dizajn

A teraz, ako sľúbené ...

BUNS EDITOROVÉ BRAY.

Na začiatku poďme cez výhody samotného programu, a potom sa dotkneme na "špeciálnom" expanzii a pluginoch, z ktorých som len bastard.

Interaktívne prezeranie (živý náhľad)

Prvá vec, ktorá stojí za zmienku, je funkcia interaktívneho sledovania, alebo, pretože mnohé z nich sa nazýva - živý pohľad. Vďaka nej môžete sledovať zmeny v lokalite, priamo počas rozloženia stránky. Upozorňujeme, že prehliadač Chrome Google je potrebný na prácu. Je v ňom, že sa vaše stránky otvorí a zobrazia sa všetky zmeny.

Viem, viem, teraz hovoríte - v Sublimetexte je to isté! Avšak, žiadam vás, aby ste brali do úvahy skutočnosť, že nie je jednoduchý "tancujúci s tamburín" zakaždým, keď je dosť jednoduchý "tanec" predtým, než všetko začne pracovať. A tu máme všetko z krabice. Ako to prichádza v jednej piesni: Kliknite na tlačidlo, získajte výsledok.

V súčasnosti interaktívne sledovanie funguje v súboroch HTML a CSS. Ale pri úprave Javascript - bude musieť byť uložený.

Rýchly editovanie (inline editory)

Veľmi pohodlná vec. Spodná čiara je, že CSS a JS môžete upravovať priamo z dokumentu HTML. Neprepínajte medzi súbormi. Verte mi, čas šetrí len obrovské množstvo. A o pohodlí a pohodliu práce vôbec tiché. Všetko možno vykonať z jedného súboru.

Jednoducho si vyberiete požadovanú značku, kliknite na CMDCTRL + E a máte zjavenie k dispozícii je špeciálne okno. V ktorom môžete urobiť štýly Pre tento volič. Je možné upravovať ako už existujúce štýly a začať nové. K dispozícii je tiež prepínanie medzi súbormi CSS, ak máte niekoľko z nich.

Umožňuje zobraziť farby, ktoré sa používajú v kóde. Ak je v iných aplikáciách, musíte otvoriť nejaký program alebo spustiť plugin, aby ste zistili, akú farbu sa používa. Potom tu len prejdite myšou nad požadovaným farebným kódom a zátvorky vám okamžite ukážu.

A v samotnom kurze, budeme stále inštalovať niekoľko zaujímavých prehliadačov, ktoré výrazne rozširujú a uľahčujú prácu s farbou. Všeobecne platí, že každý uvidí všetko.

Vždy som sa mi páčil tento čip vo Dreamweavere. Neviem, ako teraz, ale raz na dlhú dobu bola prítomná v ňom.

Ak chcete pripojiť nejaký súbor, štýly, skripty, obrázky - bez ohľadu na to. Konzolky vám automaticky povie nielen cestu, ale aj názov súboru. Veľmi pohodlne!

Zásuvné zásuvky a expanzia (väčšina):

Držiaky EMMET (22)

Tento plugin vám umožňuje rýchlo vytočiť HTML a CSS. V skutočnosti, ak sa dozviete, ako ho používať kompetentne, váš kód písania sa raz zrýchlil v 10. Toto je rozšírenie z kategórie "MUSIEŤ MAŤ"ktoré by mali byť v každom editore.

Extrakt pre konzoly (náhľad)

Toto rozšírenie sa mi páčilo najviac v editore. Povoliť stôl priamo z rozloženia PSD. To znamená, že program Photoshop už nie je potrebný.

Pripojte sa k pluginu, stiahnite si PSD do Adobe Creative Cloud Server a náš editor začne extrahovať všetky štýly a grafiku z rozloženia PSD.

Nie je možné popísať slovami, môžete vidieť a pochopiť len rozsah myšlienok. Naozaj super!

Odpoveď pre konzoly.

Umožňuje zadať prispôsobivosť stránky z okna Editor. Inými slovami, adaptívny dizajn vo vrecku.

Všetko je štýlové a pohodlné. Keď zapnete, vytvoríte samostatný štýlový súbor, kde sú napísané všetky zmeny. Na konci práce je potrebné jednoducho pripojiť k súborom stránok.

Ale je tu jeden okamih, kde bez neho, svokra. Rozšírenie sa stále vyvíja, a to funguje, povedzme, nie dosť stabilné. Je však modifikovaný, aktualizovaný a čoskoro bude všetko typové.

Bosas Editor konzoly.

Píšem váš názor v čase práce. Vzhľadom k tomu, že som bol v ňom zhrubil, a ja som určite môžem niečo povedať.

Najprv - Nikdy nedávajte niekoľko pluginy naraz. To platí najmä pre tie, ktoré nebudú opísané vo videu. Len niektoré z nich pracujú s novou verziou editora. A môže začať buggy.

Existuje málo takých, ale stále. Vždy sa držte takejto schéme: Dajte plugin - naháňaný na editor - ak všetko funguje, dajte nasledujúci.

Pretože niekedy človek dal veľa pluginov a potom sa hádať, kto zlomí prácu zátvoriek.

Po druhé - Akonáhle nainštalujte program, bude mať problém s ruským písmom. Bude vyzerať "desivé". Je to všetko o predvolenom písme, ktoré je umiestnené po inštalácii. Stačí len zmeniť písmo textu a všetko bude v poriadku.

Po tretie, Pre niektorých študentov, z nejakého dôvodu, editor nefungoval, keď ho položili na systémový disk. Neviem, aký problém nemusí mať dostatok práv správcu alebo vodičov. Preto som tu vždy dávam 3 poradenstvo:

  • Vložte zátvorky nie na systémovej jednotke
  • Nainštalujte Nodejs.
  • Snažte sa spustiť v mene administrátora

Dnes považujeme jeden z programov, ktoré budeme používať na prácu s rozložením stránok, sú zátvorky. Stiahnuť a nainštalovať program z oficiálnej stránky brackets.io.. V samotnej inštalácii nie je nič komplikované, ale nastavenie pre pohodlnú prácu bude trvať 5 minút.

Inštalácia pluginov v zátvorkách

Inštalácia pluginov je ako dvakrát dva. Spustite konzoly, hľadáte panel na ľavej strane a vyberte tlačidlo "Správca rozšírení".

Prvý spustenie programu inicializuje rozšírenia aktualizáciou ich základne. V zátvorkách Rozšírenia manažéra existujú tri karty: K dispozícii, nainštalované témy. Záujem o kartu K dispozícii.

V poli Hľadať zadáme názov pluginu, vyberte plugin a kliknite na tlačidlo "SET". Po inštalácii všetkých pluginov - je vhodné reštartovať program.

Dám pod zoznamom pluginov, ktoré potrebujeme:

  • Emmet. - Plugin, ktorý vám umožní výrazne urýchliť písanie kódu HTML a CSS pomocou skratiek a skratiek. Takže, ak chcete výkričnú značku (!) Po stlačení klávesu TAB sa zmenil na plnohodnotnú html stránku, potom je tento plugin potrebný. Tiež vám umožňuje zabaliť text pomocou značiek HTML.
  • Tabs - vlastné práce - plugin, ktorý pridáva krásne záložky v zátvorkách. Označuje neuložené súbory pomocou zelených kruhov. Hlavným účelom pluginu je urobiť prácu viac vizuálne.
  • Overscroll. - Plugin, ktorý umožňuje prechádzať kódom na koniec stránky a dokonca vykonať rolovanie prázdneho priestoru.
  • Kódové písmo. - V moderných verziách vám zátvorky menia kód písma. V starších verziách - je to jednoducho potrebné, pretože program má veľmi škaredú hanbu zobrazuje ruské písmo.
  • Konzoly Ďalšie Kliknite pravým tlačidlom myši - Pridáva mnoho pohodlných "buchty" do kontextového menu - napríklad na "kopírovanie" a "vložku".
  • Autosave súbory na blur - Plugin automatického ukladania otvorených súborov v okamihu, keď okno programu stratí zaostrenie (napríklad, ak ste prešli na prehliadač).

Pripomínam vám, že po inštalácii pluginov, reštartujte konzoly.

Pozrite si aj naše video na inštalácii pluginov v zátvorkách.

Webmasters a programátori na vytváranie lokalít často používajú textové editory. Ale funkčnosť bežných programov tejto skupiny, napríklad poznámkový blok, príliš úzky pre ľudí, ktorí pracujú v určenom smere. Vytvárajú špeciálne aplikácie určené na prácu s markupskými jazykmi. Jedným z nich je zátvorky zadarmo textový editor z Adobe.

Hlavná funkcia, vďaka, ktorým je držiaky populárne u vestigurtorov, je podporovať veľké množstvo markupských a webových programovacích jazykov, a to: HTML, Java, JavaScript, CSS, C ++, C, C #, JSON, Perl, SQL, PHP, Python a mnoho ďalších (iba 43 mená).

V okne editor programu Program Code sú konštrukčné prvky vyššie uvedených jazykov zvýraznené v samostatnej farbe, ktorá pomáha fotoaparátu rýchlejšie navigovať v kóde, a tiež je ľahké nájsť začiatok a koniec výrazu. Číslovanie reťazcov, možnosť skladacích blokov a automatického rozloženia štruktúrovania tiež slúžiť ako dodatočné faktory pohodlia používateľa pri práci s konzolmi.

Práca s textom

Zároveň, aby sa použili brackers, nie je nutné byť webový programátor alebo webové stránky, pretože program podporuje a jednoduchú prácu s textom ako pravidelný textový editor.

Konzoly môžu pracovať s veľmi veľkým zoznamom kódovania textu: UTF-8 (predvolené), Windows 1250 - 1258, KOI8-R, KOI8-RU a ďalšie (iba 43 mená).

Ukážkové zmeny v prehliadači

Konzoly podporuje funkciu "Živý náhľad"Čo je, že všetky zmeny vykonané v textovom editore môžu byť okamžite zobrazené v prehliadači Google Chrome. Preto je potrebná možnosť použitia zadanej funkcie, vyžaduje sa prítomnosť tohto webového prehliadača na počítači. Vrstva môže okamžite vidieť, ako sú vyrábané akcie ovplyvnené užívateľským rozhraním webovej stránky, pretože všetky zmeny sú zobrazené v aplikácii Google Chrome Synchrónne pri ukladaní súboru.

Správa súborov

V editore zátvoriek môžete súčasne pracovať s viacerými súbormi, prepínaním medzi nimi pomocou menu. Okrem toho je zabezpečené triedenie otvorených dokumentov podľa mena, dátum pridávania a typu, asistencie.

Integrácia v kontextovom menu

Vďaka integrácii do kontextového menu "Windows Explorer", Môžete otvoriť ľubovoľný súbor s konzolami bez predchádzajúceho spustenia samotného programu.

Režim ladenia

S konzolami môžete zobraziť a upravovať webové stránky v režime Debug.

Vyhľadávanie a výmena

Program poskytuje pohodlnú funkciu vyhľadávania a výmeny podľa textu alebo na značku.

Práca s rozšírením

Funkčnosť konzoly je možné zvýšiť inštaláciou vložených rozšírení. Môžete ich spravovať pomocou špeciálneho "Správca rozšírenia" V samostatnom okne. Pomocou týchto položiek môžete pridať do programu na podporu nového značkovacieho a programovacieho jazyka, zmeniť témy rozhrania, pracovať so vzdialeným FTP serverom, spravovať verzie aplikácie, ako aj vložiť ďalšie funkcie, ktoré nie sú uvedené Pôvodná verzia textového editora.

Dôstojnosť

  • Krížová platforma;
  • Viacjazyčnosť (31 jazykov, vrátane ruštiny);
  • Veľký počet podporovaných programovacích jazykov a textových kódov;
  • Schopnosť pridať novú funkčnosť s rozšírením.

nevýhody

  • Funkcia " Živý náhľad » K dispozícii len prostredníctvom prehliadača Chrome Google;
  • Niektoré časti programu nie sú Rusperifikované.

Konzoly je výkonný textový editor pracovať s programovým kódom a označením jazykov, ktoré majú veľmi širokú funkčnosť. Ale aj na takéto široké vlastnosti programu, môžete pridať nové pomocou vložených rozšírení.

Ako zmeniť vývojový proces v potešení? Áno, takže písanie tisíc riadkov kódexu si nevšimne, ako lietal pracovný deň a produktivita rástla o polovicu. Je tu odpoveď.

Pred niekoľkými rokmi, o meniacich sa ťažkých vývojových prostredí, sme dostali chladný Open Source Editor pre webových vývojárov - brackers, a teraz si vychutnávajú desiatky tisíc programátorov. Dokonca aj lojálni ventilátory vznešeného textu a Aptana Studio testované zátvorky a schválili jeho funkčnosť.

Konzoly rýchlo získali lásku a pozornosť od skúsených vývojárov. Jeho sila je v kombinácii jednoduchosti, multišpeciania a v možnosti prispôsobenia aplikácie pre najnáročnejších vývojárov. Jednoznačný plus editor je veľa rozšírení.

Predstavujeme vám deväť strmých pluginov, ktoré zjednodušia prácu v zátvorkách.

S týmto pluginom, relevantnosť podpory pre prehliadač Vlastnosti CSS a HTML, ktoré ste použili, sú kontrolované.

Screenshot Plugin -Caniuse

Zjednodušuje prácu s tagmi

    , ,