FrontEnd Development: CodePen või Sublime Text?

CodePen või ülev tekst?

CodePen või ülev tekst? Kui räägime veebiprogrammeerimisest, tuleb HTML, CSS ja JavaScripti nimi meile kohe ette. Sinna jõudmiseks on mitu võimalust. Isegi kui avame märkmiku, saame tööle hakata kirjutades "html". On tõsi, et programmeerimise tulemuste nägemiseks padjalt vajate edusammude märkamiseks vaevalist protseduuri.

Need saidid on peamised mänguväljakud tänapäeva kasutajatele mõeldud rakenduste arendajatele. Nende programmide eeliste ja puuduste kohta lisateabe saamiseks analüüsime neid selles artiklis põhjalikult (vähemalt kõike, mida teame). Nagu ma alati ütlen, teavad kindlasti mõned teist siin seda teemat rohkem. Kui jah, siis kommenteerige kõike, mis meid siin põgeneb. Arutame hea meelega!

Täna analüüsime ülevaid CodePen, JSBin, Plunkr, CSSDeck, Dabblet ja LiveWeave. Millised on selles keskkonnas kõige tuntumad ja enim kasutatavad tööriistad. Muidugi on veel.

Kuid kõigile teile, kes te ei tea, mida FrontEnd või BackEnd endast kujutab, selgitame natuke. Esiosa või liides on visuaalne osa, mida navigeeriv kasutaja saab veebis näha. BackEnd on see osa, mida saidi administraator kontrollib. Kui sisestate programmeerimisel koodi tööriista kaudu, mis kuvab tulemuse samaaegselt, nimetatakse seda esiosaks.

CodePen

Paljude jaoks kõige täiuslikum tööriist kõigest sellest, mida me räägime. Kasutatakse veebitööriistana, mis on kogukonnale oma töö näitamiseks kõige lähemal. Mingisugune Youtube programmeerijalt. Selles näete veebiga seotud programmeerijate tööd ja võtate ühendust, kui teil on huvi, vaadake nende profiili, jälgige neid võrkudes ja isegi tellige nende kanal, et vaadata kõiki nende tulevasi projekte.

Sisu, tugi- ja kiirklahvide esitlus

CodePeni esitlus on kõige huvitavamSest vaid mõne hiireklõpsuga saate protsessi kohe läbi töötada. Väga hästi eraldatud HTML-, css- ja javascripti ridadega. Lisaks visuaalsele osale, mille saate üles ja alla põimida, et oma edusamme selgelt näha. Aidates seega iga keelt hästi eristada. Midagi, mis tuleb uuematele programmeerijatele kasuks.

Teie veebitugi, muudab selle talutavamaks, kui soovite hakata kasutama midagi, mida me tegelikult väga hästi ei tea. See ei tähenda, et see oleks teie jaoks parem, see sõltub meie vajadustest. Aga jah, selleks, et enne "tundmatut" päritolu arvutisse midagi installimist pühenduda keskkonnaga veidi lähemalt tutvumiseks.

Kui olete üks neist, kes on harjunud kasutama casi täiesti klaviatuur, kui töötate, on CodePen teie jaoks suurepärane. Muud tööriistad vajavad pluginad osata keskkonna täitmiseks kasutada klaviatuuri otseteid. See muudab töö veidi ebamugavamaks (kuigi sama tõhus, kui see on installitud). CP. integreerib standardina süsteemi, mis paneb teid täitma samu koodiridu, mida korratakse, nagu see võiks olla loendis. Kirjutate, kuidas soovite loendi kuvada, ja klõpsake vahekaarti.

Pro versioon lubab ka palju rohkem võimalusi hinnaga 9,00 eurot põhipaketi eest ja 29,25 eurot paketi “Super” eest. Võimalus samaaegselt mitmes seadmes värskendada seda, mida me ühes teeme. Samuti ühistu režiim, "õpetaja režiim" jne. Kasu, kui soovite siin.

JSBin

JSBin on tööriist, mida võiksime kvalifitseerida otseseks. Kuna olete oma veebidomeeni läinud, on see kohe valmis järgmise projekti koostamist alustama. Ja kuigi selle esimene lavastus pole eriti atraktiivne, on see siiski mugav.

JSBin on lihtne, HTML-is loodud põhistruktuur, et mitte aega raisata, põigite töö lõpuleviimiseks erinevate keelte vahel. Kõigepealt on HTML, seejärel CSS, Javascript ja lõpuks visuaalselt teie töö. Ja kuigi see tundub keerulisem, on teil sama tüüpi otseteed ilma midagi installimata. Otse brauserist.

Kuid mul on olnud ebamugavam koodi õigesti vaadata, kui see on järgnevate veergude tõttu peidetud. Kuna sülearvutiga peate loobuma või alla andma puutepadi ja see pole eriti voolav.

Sellel on ainult kaks osamakse, tasuta või tasuline. See on natuke kallim kui CodePen, kuigi kui maksate seda aastas, on see tasuvam, kui saate maksta 120 eurot.

CSSDeck

CSSDeck

Türgi töökeskkond CSSDeck erineb ülaltoodust. Ainult kaheks veerguks (visuaalne kood) jagatud CSSDeck töötab 3 rida allapoole, millega ta jagab erinevat tüüpi keelt. Esitlusega suhtlusvõrgustiku ja puhtama heleda värviga töökeskkonna kujul. See näib olevat lihtne tööriist. Kuigi mõnikord ei tähenda see, et see oleks negatiivne.

Kui loodud on rohkem kui kuuskümmend tuhat registreeritud kasutajat ja loodud üle kahesaja viiekümne tuhande projekti, pole soovitud otsimine ja leidmine keeruline. Keel nagu alati, kui see võib tekitada ebamugavust neile, kes inglise keelt ei oska, kuid selles sotsiaalne võrgustik Pilt on väga oluline, nii et ma ei arva, et see oleks suur väljakutse.

plunkr

plunkr see on seni kõige vähem atraktiivne tööriist. Ettekanne on aglutineeritud sõnumites ja piltide puudumises. Sisu laadimine on aeglane ja pole esmapilgul eriti kasulik. Lisaks muudab kuupäevade järgi järjestamine mis tahes programmeerimise, olgu see nii lihtne kui tahes, esimesel kohal. Huvitava nägemiseks peaksite minema vahekaardile, mis ütleb: «Enim vaadatud«. See tähendab, et kui te pole seda Google'iga varem tõlkinud.

Samuti öelge, et veebi andmetel on need versioonis 1.0.0. Nii et see selgitab veidi kujunduse, esitluse ja võimalikke vigu, mida leiate veebis sirvimisel.

Eeliseks, kui ideed otsa saavad, ei pea te Plunkris lahkuma ega uut vahekaarti avama, kuna otse paremalt külgribalt saate teiste projektidega kõndida ja neid kohe vaadata. See hõlbustab teil kiirete ideede kogumist ja nende samaaegset rakendamist oma projektis.

Tupsuke

Tupsuke see on lihtne tööriist, lähete sisse ja loote. Kuigi saate registreeruda ja oma kasutajanime omada GitHubi kaudu, ei paista see veebis eriti silma. Kollase kuni punase gradiendiga taustaga, visuaalses osas ja valge taustaga koodiosas (nagu tavaliselt) esitatakse Dabbleti projekt, ehkki saate seda vahekaardil CSS muuta. Minu jaoks on parem, kui see on tühi, sest seda gradienti annab vaid vähe elu a

Redigeerimisel saate konfigureerida kuvatavad vahelehed lihtsalt. Isegi siis, kui soovite vahetada veergudele või ridadele mugavaks vaatamiseks olenevalt redigeerivast isikust. Fondi suuruse muutmine, anonüümseks salvestamine ilma HTML-koodi registreerimata või kinnitamata on rohkem võimalusi, mida Dabblet esmapilgul pakub. Kuigi see pole esimene variant, mille ma valiksin, võib see olla tulevaste versioonide puhul nende värskendamisel arvesse võetud.

Üks asi, mis mulle kõige vähem meeldis, kuid mis võib meeldida suurtele programmeerijatele, on see teil pole võimalust sildi tabelisse lisada ja lasta sellel ise kirjutada. See tähendab, et pange HTML ja klõpsake vahekaarti ning kirjutage automaatselt "html" ja "/ html". Midagi, mis teistes rakendustes, kui see on tehtud.

LiveWeave

eluspunumine

LiveWeave See on väga sarnane teistega, sellel pole midagi, mida teised ei saaks kasulikkuse osas pakkuda. Selle projekti puhul tõstame esile selle disaini, tumeda värvi, mis sarnaneb CodePeniga, kuid ruudukujulise jaotusega. Suuruse muutmise võimalus maitsta. Samuti on selge režiim ja «offline« kus teie muudetud kood ei kajastu visuaalis, kuni olete selle aktiveerinud. See pole funktsioon, mis minu arvates oleks väga kasulik, kuna disainerina on oluline alati näha, mida redigeerite, reaalajas, kuid keegi leiab, et see on kindlasti kindel. Ja kuigi registreeruda saab nagu alati, pole kasutajal juhtivat rolli. Kuna saate oma projekti salvestada, isegi kui te ei registreeru.

Sublime Text

See tööriist See erineb täiesti sellest, mida olete seni analüüsis näinud. Sublime Text pole veebiressurss, vaid rakendus. Ühest küljest on kindlasti kasulikum see töölaual olla. Eriti võimalike Interneti-krahhide või tardumiste tõttu, mis on tingitud liigsest ja võimalikust töö kaotamisest. Teiselt poolt pole see nii visuaalne tööriist kui eelmised. Lisaks sellele, et puudub võimalus kogukonnal projekte jagada.

Siin on kõik nullist. Koodiridade paigutamiseks ja nende ümbernimetamiseks peate looma vahelehed, et teada saada, mis neist on. Kui esimene on HTML, siis teine ​​CSS ... või vastupidi. Sellel pole ka otseteid, mis see saab täiesti käsitsi, välja arvatud jutumärgid.

Järeldus

Kõik programmid on sarnased iga ettevõtte teatud isikupäraste detailidega, mis toovad kaasa plusse ja miinuseid. Igaüks valib endale sobivaima, minu soovitus on kasutada keskkonda ja sellega töötavat sotsiaalvõrgustikku CodePen või CSSDeck. Aga kui teile veel üks meeldis, jätke kommentaar ja selgitage oma põhjuseid, neist on kindlasti kasu.


Jäta oma kommentaar

Sinu e-postiaadressi ei avaldata. Kohustuslikud väljad on tähistatud *

*

*

  1. Andmete eest vastutab: Miguel Ángel Gatón
  2. Andmete eesmärk: Rämpsposti kontrollimine, kommentaaride haldamine.
  3. Seadustamine: teie nõusolek
  4. Andmete edastamine: andmeid ei edastata kolmandatele isikutele, välja arvatud juriidilise kohustuse alusel.
  5. Andmete salvestamine: andmebaas, mida haldab Occentus Networks (EL)
  6. Õigused: igal ajal saate oma teavet piirata, taastada ja kustutada.