FrontEnd razvoj: CodePen ili uzvišeni tekst?

CodePen ili uzvišeni tekst?

CodePen ili uzvišeni tekst? Ako govorimo o web programiranju, ime HTML, CSS i JavaScript dolazi nam odmah. Postoji nekoliko načina da se tamo dođe. Čak, ako otvorimo blok za bilješke, možemo se upisati u "html". Istina je da će vam biti potreban naporan postupak da biste vidjeli rezultat onoga što programirate s jastučića.

Ove web stranice su glavna igrališta za programere aplikacija za današnje korisnike. Da bismo saznali više o prednostima i nedostacima ovih programa, detaljno ćemo ih analizirati u ovom članku (barem sve što znamo). Kao što uvijek kažem, sigurno neki od vas ovdje više znaju tu temu. Ako je tako, prokomentirajte sve što nam ovdje izmiče. Rado ćemo razgovarati!

Danas ćemo analizirati CodePen, JSBin, Plunkr, sublime, CSSDeck, Dabblet i LiveWeave. Koji su najpoznatiji i alati koji se najviše koriste u ovom okruženju. Ima ih još, naravno.

Ali za sve vas koji ne znate o čemu se radi FrontEnd ili BackEnd, objasnimo malo. Front-End ili sučelje je vizualni dio koji će korisnik navigacije moći vidjeti na mreži. BackEnd će biti dio koji kontrolira administrator web lokacije. U programiranju, ako kôd unesete putem alata koji istovremeno prikazuje rezultat, to će se nazvati front-end.

CodePen

Za mnoge najkompletniji alat svega što govorimo. Koristi se kao web alat koji je najbliži zajednici za prikaz vašeg rada. Neka vrsta Youtube od programera. U ovome ćete moći vidjeti rad programera povezanih s mrežom i kontaktirati ih u slučaju da vas zanima, vidjeti njihov profil, pratiti ih na mrežama, pa čak i pretplatiti se na njihov kanal da biste pogledali sve njihove buduće projekte.

Prezentacija sadržaja, podrška i prečice na tastaturi

CodePen prezentacija je najzanimljivijaJer sa samo nekoliko klikova možete odmah proći kroz postupak. Sa vrlo dobro odvojenim linijama html, css i javascripta. Pored vizuelnog dijela, koji možete presijecati gore i dolje kako biste jasno vidjeli svoj napredak. Na taj način pomažući dobro razlikovanje svakog jezika. Nešto što dobro dođe novijim programerima.

Vaša web podrška, čini ga podnošljivijim kada želite početi koristiti nešto što zapravo ne znamo baš najbolje. To ne znači da je za vas bolje, to ovisi o potrebama koje imamo. Ali da, malo bolje upoznati okolinu prije nego što se obvežete instalirati bilo šta na računar "nepoznatog" porijekla.

Ako ste jedan od onih koji su navikli da koriste Casi potpuno tipkovnica kad radite, CodePen će vam biti prekrasan. Potrebni su drugi alati plugins da biste mogli koristiti prečice na tastaturi za popunjavanje okoline. To čini posao malo neugodnijim (iako jednako učinkovit nakon instalacije). CP. standardno integrira sistem koji će vas natjerati da popunite iste retke koda koji se ponavljaju, kao što bi mogao biti na listi. Napišete kako želite da se lista pojavi i kliknete Tab.

Pro verzija takođe omogućava mnogo više opcija po cijeni od 9,00 € za osnovni paket do 29,25 € za “Super” paket. Mogućnost ažuriranja na nekoliko uređaja istovremeno što radimo na jednom. Takođe kooperativni način rada, "nastavnički način rada" itd. Iskoristite ako želite ovdje.

JSBin

JSBin je alat koji bismo mogli kvalificirati kao izravnog. Budući da nakon što prijeđete na svoju web domenu, ona će biti spremna za početak izrade vašeg sljedećeg projekta, bez odgađanja. I premda prvo uprizorenje nije previše atraktivno, ugodno je.

JSBin je jednostavan, s osnovnom strukturom stvorenom u html-u, kako ne bi gubio vrijeme, prolazit ćete između različitih jezika da biste dovršili posao. Prvo je HTML, zatim CSS, Javascript i na kraju vaš rad vizuelno. I premda se čini teže, imat ćete iste vrste prečica bez ikakvog instaliranja. Izravno iz preglednika.

Međutim, bilo mi je neugodnije pravilno pregledavati kod, nakon što je skriven zbog sljedećih stupaca. Budući da s prijenosnim računarom morate odustati ili spustiti trackpad i nije baš fluidno.

Ima samo dvije rate, besplatnu ili plaćenu. Ovo je nešto skuplje od CodePena, iako ako ga plaćate godišnje, isplativije je ako možete platiti 120 €.

CSSDeck

CSSDeck

Radno okruženje CSSDeck se razlikuje od gore viđenog. Podijeljen u samo dva stupca, vizualni kod, CSSDeck radi s 3 reda dolje kojima dijeli različite vrste jezika. Prezentacijom u obliku društvene mreže i čišćim radnim okruženjem u svijetlim bojama. Čini se kao jednostavan alat. Iako ponekad, to ne znači da je negativan.

S više od šezdeset tisuća registriranih korisnika i više od dvjesto pedeset tisuća projekata, potraga i pronalazak onoga što želite neće biti teško. Jezik kao i uvijek, ako može predstavljati neugodnost za one koji ne znaju engleski, ali u ovome socijalna mreža Slika je vrlo važna, pa mislim da nije veliki izazov.

plunkr

plunkr to je najmanje atraktivan alat na koji sam do sada naišao. Prezentacija je aglutinirana porukama i nedostatkom slika. Učitavanje sadržaja je sporo i na prvi pogled nije vrlo korisno. Pored toga, redoslijed po datumu bilo koje programiranje, bez obzira koliko je jednostavno, može biti na prvom mjestu. Da biste vidjeli nešto zanimljivije, idite na karticu koja kaže: «Najgledanije«. Odnosno, ako ga prije niste preveli s Googleom.

Takođe recite da su prema webu u verziji 1.0.0. Dakle, ovo objašnjava malo o dizajnu, prezentaciji i mogućim greškama koje pronađete prilikom pregledavanja weba.

Kao prednost ako ostanete bez ideja, nećete morati napustiti ili otvoriti drugu karticu u Plunkru, jer izravno s desne bočne trake možete šetati s drugim projektima i trenutno ih pregledavati. To će vam olakšati prikupljanje brzih ideja i istovremeno njihovo primjenjivanje na vašem projektu.

dabblet

dabblet to je jednostavan alat, uđete i kreirate. Iako se možete registrirati i imati svoje korisničko ime putem GitHub-a, to nije nešto što se posebno ističe na webu. S pozadinom u žutom do crvenom gradijentu, u vizualnom dijelu i bijelom pozadinom u dijelu koda (kao i obično), predstavljen je projekt Dabblet, iako ga možete promijeniti na CSS kartici. Za mene je bolje da je prazno, jer je taj gradijent sve što daje malo život a

Kada uređujete, možete konfigurirati kartice koje vidite lako. Čak i ako želite da se prebacite na stupce ili redove za ugodno gledanje, ovisno o osobi koja uređuje. Promjena veličine fonta, spremanje kao anonimno bez registracije ili provjere HTML koda više su mogućnosti koje Dabblet nudi na prvi pogled. Iako to nije prva opcija koju bih odabrao, možda će biti uzeti u obzir u budućim verzijama ako se ažuriraju.

Jedna od stvari koja mi se najmanje svidjela, ali koja se može svidjeti sjajnim programerima je ta nemate mogućnost tabelarnog prikazivanja oznake i njenog pisanja. Odnosno, stavite HTML i kliknite karticu i automatski napišite "html" i "/ html". Nešto što je u ostalim aplikacijama ako je gotovo.

LiveWeave

liveweave

LiveWeave Vrlo je sličan ostalim, nema ništa što ostali ne mogu ponuditi u korisnom smislu. Ono što ističemo kod ovog projekta je njegov dizajn, tamne boje sličan CodePenu, ali kvadratne distribucije. Mogućnost promjene veličine probati. Tu je i jasni način rada i «izvan linije« gdje se kod koji uredite neće odražavati u vizualu, dok ga ne aktivirate. To nije osobina koju smatram vrlo korisnom, jer sam kao dizajner važno uvijek vidjeti što uređujete u stvarnom vremenu, ali netko će zasigurno koristiti. I premda se kao i uvijek možete registrirati, korisnik nema vodeću ulogu. Budući da, čak i ako se ne registrirate, svoj projekt možete spremiti.

Sublim tekst

Ovaj alat Potpuno se razlikuje od onoga što ste do sada vidjeli u analizi. Uzvišeni tekst nije kao web resurs, već kao aplikacija. S jedne strane, sigurno je korisnije imati ga na radnoj površini. Pogotovo zbog mogućih padova ili zamrzavanja interneta zbog viška i mogućeg gubitka posla. S druge strane, to nije tako vizualno sredstvo kao prethodne. Osim toga što nemaju mogućnost zajednice da dijeli projekte.

Ovdje je sve ispočetka. Morate stvoriti kartice da biste postavili retke koda i preimenovali ih da biste znali koji je. Ako je prvi HTML, drugi CSS ... ili obrnuto. Takođe nema prečice za ono što će biti potpuno ručno, osim citata.

zaključak

Svi su programi slični određenim ličnim dodirima svake kompanije koji vode do prednosti i nedostataka. Svaka će odabrati onu koja mu najviše odgovara, moja preporuka je da koristite CodePen ili CSSDeck za životnu sredinu i društvenu mrežu kojom rukuje. Ali, ako vam se svidio još jedan, ostavite komentar i objasnite svoje razloge, oni će vam zasigurno biti korisni.


Ostavite komentar

Vaša e-mail adresa neće biti objavljena. Obavezna polja su označena sa *

*

*

  1. Za podatke odgovoran: Miguel Ángel Gatón
  2. Svrha podataka: Kontrola neželjene pošte, upravljanje komentarima.
  3. Legitimacija: Vaš pristanak
  4. Komunikacija podataka: Podaci se neće dostavljati trećim stranama, osim po zakonskoj obavezi.
  5. Pohrana podataka: Baza podataka koju hostuje Occentus Networks (EU)
  6. Prava: U bilo kojem trenutku možete ograničiti, oporaviti i izbrisati svoje podatke.