22 užitečných rozšíření pro začínajícího programátora

22 nástrojů, které usnadní život začínajícímu programátorovi webu

• Spuštění

Mario Hoyos změnil svou profesi z lékárníka na webového vývojáře a na vlastní kůži zažil peripetie přechodu. Během této doby sestavil seznam užitečných rozšíření prohlížeče a editoru, která mu značně usnadňují práci a zvyšují produktivitu dodnes. S tímto seznamem Mario sdílené na střední.

V technologickém světě existují tisíce nástrojů, které vám lidé řeknou, abyste je používali. A to je na mě, jako kodéra začátečníka, moc. Zjistil jsem, že instaluji doplňky v dávkách, ale mnoho z nich mi ve vývoji nepomohlo a někdy dokonce překážely.

Neberte mě jako odborníka, ale postupem času jsem sestavil seznam nástrojů, které se osvědčily speciálně pro mě. Pokud s programováním začínáte, mohou být dobrými pomocníky i pro vás.

Rozšíření Chrome

Svůj výběr začnu rozšířeními pro Chrome. Jako samozvaný programátor doslova žiju ve své konzoli Chrome. Samozřejmě existují i ​​jiné prohlížeče, ale jsem ochoten zaručit, že většina těchto nástrojů je dostupná i pro ně.

• WhatFont — Jméno mluví samo za sebe. Je to snadný způsob, jak na svých oblíbených stránkách najít písma, která chcete použít ve svých vlastních projektech.
• Pesticid – Užitečné pro prohlížení vašich obrysů a úpravu vašich CSS. Tento nástroj se pro mě stal záchranou, když jsem se učil blokový model v rozložení.
• Colorzilla — umožňuje zkopírovat přesné barvy z webu. Barva se zkopíruje rovnou do schránky, takže nemusíte donekonečna hledat tu správnou kombinaci RGBA.
• CSS Peeper – Pomáhá určit barvy a atributy používané na webu. Můžete klonovat krásné webové stránky, přijít na barevné schéma a podívat se, co dalšího je na stránce zajímavé.
• Wappalyzer — určuje technologie používané na místě. Pokud vás zajímá, jaký framework web používá nebo na jaké službě je hostován, použijte tento nástroj.
• Reagovat Dev Tools —pomáhá ladit aplikace React. Dovolte mi objasnit, že tento nástroj je užitečný pouze pro programátory React.
• Redux Dev Tools — pomůže ladit aplikace na Reduxu. Nástroj je užitečný pouze pro aplikace Redux.
• Formát JSON – s jeho pomocí bude JSON vypadat v prohlížeči čistěji. Už jste někdy nahlédli do ošklivé bubliny JSON a snažili se přijít na to, jak hluboko jsou v ní pohřbeny informace, které potřebujete? S tímto prodloužením vám tedy místo tří hodin budou stačit dvě.
• Opakování a rychlost Vimeo — umožňuje zrychlit videa Vimeo. Pokud jako většina vývojářů sledujete videonávody, víte, jak užitečné může být někdy zrychlit jejich přehrávání až 1,25krát. Existují také verze pro YouTube.

Rozšíření pro VS Code

Visual Studio Code je moje volba. Lidé milují jeho textové editory a já nejsem výjimkou. Jsem si ale jistý, že většina těchto rozšíření bude dostupná i pro jiné editory.

• Automatické přejmenování značky — automatické přejmenování spárovaných HTML tagů. Vytvořili jste značku . Nyní jej chcete změnit stejně jako uzavírací značku k nějakému jinému. Stačí změnit jedno a druhé se změní samo! Vaše produktivita se také změní k lepšímu.
• Podpora HTML CSS — Podpora CSS pro HTML dokumenty. To je užitečné pro získání jasného zvýraznění syntaxe a kódových vět, takže pomocí CSS budete chtít skončit s programováním více než dvakrát denně.
• Úryvky HTML – užitečné úryvky kódu. Toto je další dobrý optimalizátor. Spárováno s Emmet již nemusíte ručně zadávat značky HTML.
• Babel ES6/ES7 – přidává zbarvení syntaxe do JavaScript Babel. Pokud používáte Babel, tento nástroj výrazně usnadní pochopení vašeho vlastního kódu. Zvláště pokud si rádi hrajete s moderními funkcemi JavaScriptu.
• Colorizér pro pár závorek — přidává barvy do závorek, aby se bloky lépe zobrazovaly. Velmi vhodné pro identifikaci nejčastějších chyb, když jste zapomněli zavřít držák nebo s nimi zašli příliš daleko.
• ESLint — integruje ESLint do kódu Visual Studio. Je vhodné získat rady ohledně chyb při psaní kódu a v závislosti na konfiguraci vypilovat dobrý styl kódování.
• Příručky — přidává do kódu další vodicí čáry. Další vizuální pomůcka, která vám pomůže ujistit se, že závorky uzavíráte správně. Jak vidíte, vizualizace opravdu miluji.
• Nástroje konzoly JavaScript – Usnadňuje protokolování konzoly. Pokud se stejně jako většina vývojářů při ladění přistihnete při přechodu do konzole (já vím, použijte debugger), tento nástroj vám usnadní vytváření užitečných příkazů console.log().
• Kontrola pravopisu kódu je skvělý nástroj pro zachycení překlepů v proměnných nebo názvech funkcí. Tato kontrola pravopisu najde neobvyklá slova a je velmi užitečná pro sledování toho, jak píšeme v JavaScriptu.
• Git Lens — určuje, kdy a kým jsou změny provedeny. Je to velmi výhodné pro shromažďování důkazů proti někomu, jehož vinou se to všechno pokazilo. Navíc to rozhodně není vaše chyba – to nemůže být.
• Inteligence cesty — cesta k souboru automatického doplňování. Velmi pohodlné pro import jakéhokoli jiného souboru. Procházení stromem souborů se stává skutečným potěšením.
• Hezčí — automatické formátování kódu. Zapomeňte na doby, kdy jste museli ručně prohrabávat svůj kód, abyste si jej uspořádali. Prettier to udělá mnohem rychleji a lépe než ty. Vřele doporučuji.
• Ikony VSCode — přidá ikony do stromu souborů. Pokud vám při pohledu na vaši strukturu souborů krvácejí oči, pomůže vám tato věc. Má ikonu pro doslova jakýkoli typ souboru a pomůže vám zjistit, na co se právě díváte.

Přetištění článku je povoleno pouze v případě, že uvedete aktivní odkaz na stránku itmentor.by

Připojte se ke komunitám ITmentorů VKontakte , facebook и Telegram

Zveřejněno: 14 03 Sdílet: