FrontEnd Development: CodePen alebo Sublime Text?

CodePen alebo vznešený text?

CodePen alebo Sublime Text? Pokiaľ hovoríme o programovaní na webe, hneď nám prídu názvy HTML, CSS a JavaScript. Existuje niekoľko spôsobov, ako sa tam dostať. Dokonca, ak otvoríme poznámkový blok, môžeme sa pustiť do písania „html“. Je pravda, že aby ste videli výsledok toho, čo programujete z podložky, budete potrebovať namáhavý postup, aby ste si všimli pokrok.

Tieto stránky sú hlavným ihriskom pre vývojárov aplikácií pre používateľov daného dňa. Ak sa chcete dozvedieť viac o výhodách a nevýhodách týchto programov, budeme ich hlboko analyzovať v tomto článku (aspoň všetko, čo vieme). Ako vždy hovorím, určite tu niekto z vás pozná túto tému viac. Ak je to tak, komentujte tu všetko, čo nám uniká. Budeme radi diskutovať!

Dnes budeme analyzovať CodePen, JSBin, Plunkr, vznešené, CSSDeck, Dabblet a LiveWeave. Ktoré sú najznámejšie a najpoužívanejšie nástroje v tomto prostredí. Je ich samozrejme viac.

Ale pre všetkých z vás, ktorí nevedia, o čom je FrontEnd alebo BackEnd, vysvetlíme si trochu. Klientske rozhranie alebo rozhranie je vizuálna časť, ktorú bude môcť navigujúci používateľ vidieť na webe. BackEnd bude časťou, ktorú ovláda správca webu. Ak v programovaní zadáte kód pomocou nástroja, ktorý zobrazuje výsledok súčasne, bude sa to nazývať front-end.

CodePen

Pre mnohých najkompletnejší nástroj zo všetkého, čo hovoríme. Používa sa ako webový nástroj, ktorý komunite najbližšie ukáže vašu prácu. Druh youtube od programátora. V tejto časti budete môcť vidieť prácu programátorov združených s webom a kontaktovať ich v prípade záujmu, zobraziť ich profil, sledovať ich v sieťach a dokonca sa prihlásiť na odber ich kanála, aby ste si mohli pozrieť všetky ich budúce projekty.

Prezentácia obsahu, podpora a klávesové skratky

Prezentácia CodePen je najzaujímavejšiaPretože iba niekoľkými kliknutiami môžete tento proces prejsť okamžite. S veľmi dobre oddelenými riadkami html, css a javascript. Okrem vizuálnej časti, ktorú môžete prekladať hore a dole, aby ste jasne videli svoj pokrok. Pomáha tak dobre odlíšiť každý jazyk. Niečo, čo sa hodí novším programátorom.

Vaša webová podpora, je znesiteľnejšie, keď chcete začať používať niečo, čo v skutočnosti veľmi dobre nepoznáme. To neznamená, že je to pre vás lepšie, záleží to na potrebách, ktoré máme. Ale áno, trochu lepšie spoznať prostredie, než sa zaviažete nainštalovať čokoľvek na počítač „neznámeho“ pôvodu.

Ak patríte k tým, ktorí sú zvyknutí používať CASI keď pracujete úplne ako klávesnica, CodePen pre vás bude úžasný. Potrebné sú ďalšie nástroje pluginy vedieť používať klávesové skratky na vyplnenie prostredia. To robí prácu trochu nepohodlnejšou (aj keď rovnako účinnou po nainštalovaní). CP. štandardne integruje systém, ktorý vám umožní vyplniť rovnaké riadky kódu, ktoré sa opakujú, ako to môže byť v zozname. Napíšete, ako chcete, aby sa zoznam zobrazil, a kliknete na kartu.

Verzia Pro tiež umožňuje oveľa viac možností za cenu od 9,00 EUR za základné balenie až po 29,25 EUR za balík „Super“. Byť schopný aktualizovať na viacerých zariadeniach súčasne to, čo robíme na jednom. Taktiež režim spolupráce, „režim učiteľa“ atď. Využite, ak tu chcete.

JSBin

JSBin je nástroj, ktorý by sme mohli označiť ako priamy. Pretože akonáhle prejdete na svoju webovú doménu, bude pripravená bezodkladne začať pripravovať ďalší projekt. A hoci jeho prvé uvedenie nie je príliš atraktívne, je pohodlné.

JSBin je jednoduchý, so základnou štruktúrou vytvorenou v html, aby ste nestrácali čas a dokončili ste prácu tým, že sa budete prekladať medzi rôznymi jazykmi. Najprv je to HTML, potom CSS, Javascript a nakoniec vaša práca vizuálne. A hoci sa to zdá zložitejšie, budete mať rovnaké typy skratiek bez toho, aby ste niečo nainštalovali. Priamo z prehliadača.

Zdá sa mi však nepríjemnejšie správne zobraziť kód, akonáhle je kód skrytý kvôli následným stĺpcom. Vzhľadom k tomu, s notebookom, musíte sa vzdať alebo dole s trackpad a nie je to veľmi tekuté.

Má iba dve splátky, zadarmo alebo zaplatené. To je o niečo drahšie ako CodePen, aj keď ak ho platíte ročne, je výnosnejšie, ak môžete platiť 120 EUR.

ČSSDeck

ČSSDeck

Pracovné prostredie Slovenska ČSSDeck sa líši od vyššie uvedeného. Rozdelené iba do dvoch stĺpcov, vizuálneho kódu, CSSDeck pracuje s 3 riadkami nadol, pomocou ktorých rozdeľuje rôzne typy jazyka. S prezentáciou v podobe sociálnej siete a čistejšieho pracovného prostredia vo svetlej farbe. Zdá sa to ako jednoduchý nástroj. Aj keď to niekedy neznamená, že je to negatívne.

S viac ako šesťdesiattisíc registrovanými používateľmi a viac ako dvestopäťdesiattisíc vytvorenými projektmi nebude hľadanie a hľadanie toho, čo chcete, ťažké. Jazyk ako vždy, ak to môže byť nepríjemnosťou pre tých, ktorí nevedia anglicky, ale v tomto sociálnu sieť Obrázok je veľmi dôležitý, takže si nemyslím, že je to veľká výzva.

plunkr

plunkr je to najmenej atraktívny nástroj, s ktorým som sa doteraz stretol. Prezentácia je zhlukovaná správami a nedostatkom obrázkov. Načítanie obsahu je pomalé a na prvý pohľad nie veľmi užitočné. Vďaka zoradeniu podľa dátumu môže byť akékoľvek programovanie, nech je akékoľvek jednoduché, na prvej pozícii. Ak chcete vidieť niečo zaujímavejšie, mali by ste prejsť na kartu s textom: «Najviac videné«. Teda, ak ste to doteraz nepreložili pomocou vyhľadávača Google.

Tiež povedzte, že podľa webu sú vo verzii 1.0.0. Toto teda vysvetľuje niečo málo o dizajne, prezentácii a možných chybách, ktoré nájdete pri prehľadávaní webu.

Výhodou je, ak vám dôjdu nápady, nebudete musieť opustiť alebo otvoriť inú kartu v aplikácii Plunkr, pretože priamo z pravého bočného panela môžete prechádzať s inými projektmi a okamžite ich zobraziť. To vám uľahčí zbieranie rýchlych nápadov a ich súčasné použitie vo vašom projekte.

dablovať

dablovať je to jednoduchý nástroj, vstúpite do neho a vytvoríte ho. Aj keď sa môžete zaregistrovať a mať svoje užívateľské meno prostredníctvom GitHubu, na webe to nie je nič, čo by veľmi vyniklo. S pozadím v žltom až červenom prechode, vo vizuálnej časti a bielym pozadím v časti s kódom (ako je bežné), sa zobrazí projekt Dabblet, aj keď ho môžete zmeniť na karte CSS. Pre mňa je lepšie nechať to prázdne, pretože ten gradient, čo dáva, je málo život a

Pri úpravách môžete konfigurovať zobrazené karty ľahko. Dokonca aj vtedy, keď chcete prepnúť na stĺpce alebo riadky na pohodlné prezeranie v závislosti od osoby, ktorá ich upravuje. Zmena veľkosti písma, uloženie ako anonymné bez registrácie alebo overenia kódu HTML je viac možností, ktoré Dabblet ponúka na prvý pohľad. Aj keď to nie je prvá možnosť, ktorú by som si vybral, v budúcich verziách môže byť zohľadnené, ak budú aktualizované.

Jedna z vecí, ktorá sa mi páčila najmenej, ale ktorá sa môže páčiť skvelým programátorom, je tá nemáte možnosť uviesť štítok do tabuľky a nechať ho napísať sám. To znamená, vložte HTML, kliknite na kartu a automaticky napíšte „html“ a „/ html“. Niečo, čo v ostatných aplikáciách, ak je hotové.

LiveWeave

živá väzba

LiveWeave Je veľmi podobný ostatným, nemá nič, čo by ostatní nemohli ponúknuť z hľadiska úžitku. Na tomto projekte zdôrazňujeme jeho dizajn, tmavá farba podobná CodePen, ale so štvorcovým rozložením. Byť schopný zmeniť veľkosť ochutnať. K dispozícii je tiež režim čistenia amimo« kód, ktorý upravíte, sa vo vizuále neprejaví, kým ho neaktivujete. Nie je to vlastnosť, ktorá sa mi zdá veľmi užitočná, ako dizajnér je dôležité vždy vidieť, čo upravujete, v reálnom čase, ale niekto to určite nájde. A hoci sa ako vždy môžete zaregistrovať, používateľ nemá vedúcu úlohu. Pretože aj keď sa nezaregistrujete, môžete svoj projekt uložiť.

Sublime Text

Tento nástroj Je to úplne odlišné od toho, čo ste doteraz videli v analýze. Sublime Text nie je ako webový zdroj, ale ako aplikácia. Na jednej strane je určite užitočnejšie mať ho na pracovnej ploche. Najmä z dôvodu možných zlyhaní alebo zamrznutí internetu z dôvodu prebytku a možnej straty práce. Na druhej strane to nie je taký vizuálny nástroj ako tie predchádzajúce. Okrem toho, že nemá možnosť komunity zdieľať projekty.

Tu je všetko od nuly. Musíte vytvoriť karty, aby ste mohli umiestniť riadky kódu a premenovať ich, aby ste vedeli, ktorý z nich je. Ak je prvý HTML, druhý CSS ... alebo naopak. Nemá tiež žiadne skratky pre to, čo to bude úplne manuálny, až na citáty.

Záver

Všetky programy sú podobné určitým osobným dotykom každej spoločnosti, ktoré vedú k tomu, že sú v nich klady a zápory. Každý si vyberie ten, ktorý mu najlepšie vyhovuje, moje odporúčanie je použiť CodePen alebo CSSDeck pre prostredie a sociálnu sieť, ktorú spravuje. Ak sa vám ale páčil ďalší, zanechajte komentár a vysvetlite svoje dôvody, určite budú užitočné.


Zanechajte svoj komentár

Vaša e-mailová adresa nebude zverejnená. Povinné položky sú označené *

*

*

  1. Zodpovedný za údaje: Miguel Ángel Gatón
  2. Účel údajov: Kontrolný SPAM, správa komentárov.
  3. Legitimácia: Váš súhlas
  4. Oznamovanie údajov: Údaje nebudú poskytnuté tretím stranám, iba ak to vyplýva zo zákona.
  5. Ukladanie dát: Databáza hostená spoločnosťou Occentus Networks (EU)
  6. Práva: Svoje údaje môžete kedykoľvek obmedziť, obnoviť a vymazať.