Dezvoltare FrontEnd: Text CodePen sau Sublim?

Text CodePen sau sublim?

CodePen sau text sublim? Dacă vorbim despre programarea web, numele HTML, CSS și JavaScript ne vine imediat. Există mai multe modalități de a ajunge acolo. Chiar, dacă deschidem un blocnotes, putem începe să scriem „html”. Este adevărat că pentru a vedea rezultatul a ceea ce programați dintr-un pad, veți avea nevoie de o procedură laborioasă pentru a observa progresul.

Aceste site-uri sunt principalele locuri de joacă pentru dezvoltatorii de aplicații pentru utilizatorii zilei. Pentru a afla mai multe despre avantajele și dezavantajele acestor programe, le vom analiza profund în acest articol (cel puțin, tot ceea ce știm). După cum spun mereu, cu siguranță unii dintre voi de aici știți mai mult subiectul. Dacă da, comentează tot ce ne scapă aici. Vom fi bucuroși să discutăm!

Astăzi vom analiza CodePen, JSBin, Plunkr, sublim, CSSDeck, Dabblet și LiveWeave. Care sunt cele mai cunoscute și instrumentele cele mai utilizate în acest mediu. Există mai multe, desigur.

Dar pentru toți cei care nu știți despre ce este FrontEnd sau BackEnd, să explicăm puțin. Front-End-ul sau interfața este partea vizuală pe care utilizatorul navigant îl va putea vedea pe web. BackEnd va fi partea pe care o controlează administratorul site-ului. În programare, dacă introduceți codul printr-un instrument care afișează rezultatul simultan, acesta se va numi front-end.

CodePen

Pentru mulți cel mai complet instrument din tot ce vorbim. Folosit ca un instrument web care este cel mai apropiat lucru de o comunitate pentru a vă arăta munca. Un fel de YouTube de la programator. În acest sens, veți putea vedea munca programatorilor afiliați la web și le puteți contacta în cazul în care aveți vreun interes, să le vedeți profilul, să le urmăriți în rețele și chiar să vă abonați la canalul lor pentru a vedea toate proiectele lor viitoare.

Prezentarea conținutului, asistență și comenzi rapide de la tastatură

Prezentarea CodePen este cea mai interesantăDeoarece cu doar câteva clicuri, puteți parcurge procesul imediat. Cu linii foarte bine separate de html, css și javascript. În plus față de partea vizuală, pe care o puteți intercala în sus și în jos pentru a vă vedea clar progresul. Ajutând astfel să diferențiem bine fiecare limbă. Ceva care este util pentru programatorii mai noi.

Asistența dvs. web, îl face mai suportabil atunci când vrei să începi să folosești ceva ce nu prea știm foarte bine. Asta nu înseamnă că este mai bine pentru tine, depinde de nevoile pe care le avem. Dar da, să cunoașteți mediul puțin mai bine înainte de a vă angaja să instalați ceva pe computerul de origine „necunoscută”.

Dacă sunteți unul dintre cei obișnuiți să folosiți casi tastatură totală când lucrezi, CodePen va fi minunat pentru tine. Alte instrumente au nevoie Plugin-uri pentru a putea utiliza comenzile rapide de la tastatură pentru a completa mediul. Acest lucru face ca lucrarea să fie puțin mai incomodă (deși la fel de eficientă odată instalată). CP. Acesta integrează standard un sistem care vă va face să completați aceleași linii de cod care se repetă, așa cum ar putea fi într-o listă. Scrieți cum doriți să apară lista și faceți clic pe Tab.

Versiunea Pro permite, de asemenea, multe alte opțiuni la un preț de 9,00 EUR pentru pachetul de bază până la 29,25 EUR pentru pachetul „Super”. Putem actualiza simultan în mai multe dispozitive ceea ce facem într-un singur. De asemenea, un mod cooperativ, un „mod profesor” etc. Beneficiați dacă doriți aici.

JSBin

JSBin este un instrument pe care l-am putea califica drept direct. Din moment ce veți accesa domeniul său web, acesta va fi gata să înceapă să elaboreze următorul dvs. proiect, fără întârziere. Și, deși prima sa punere în scenă nu este foarte atractivă, este confortabilă.

JSBin este simplu, cu structura de bază creată în html pentru a nu pierde timpul, veți intercala între diferitele limbi pentru a finaliza lucrarea. Mai întâi există HTML, apoi CSS, Javascript și, în final, munca dvs. vizuală. Și, deși pare mai dificil, veți avea aceleași tipuri de comenzi rapide fără a instala nimic. Direct din browser.

Cu toate acestea, mi s-a părut mai incomod să vizualizez corect codul, odată ce acesta este ascuns din cauza coloanelor ulterioare. Deoarece, cu laptopul, trebuie să renunțați sau să coborâți cu trackpad și nu este foarte fluid.

Are doar două rate, gratuite sau plătite. Acest lucru este puțin mai scump decât CodePen, deși dacă îl plătiți anual, este mai profitabil, dacă puteți plăti 120 €.

CSSDeck

CSSDeck

Mediul de lucru al CSSDeck este diferit de cel văzut mai sus. Împărțit în două coloane, cod vizual, CSSDeck funcționează cu 3 rânduri în jos, cu care împarte diferitele tipuri de limbă. Cu o prezentare sub forma unei rețele sociale și a unui mediu de lucru mai curat, în culori deschise. Pare un instrument simplu. Deși uneori, asta nu înseamnă că este negativ.

Cu peste șaizeci de mii de utilizatori înregistrați și peste două sute cincizeci de mii de proiecte create, căutarea și găsirea a ceea ce doriți nu va fi dificilă. Limba ca întotdeauna, dacă poate fi un inconvenient pentru cei care nu știu engleza, dar în aceasta rețea socială Imaginea este foarte importantă, așa că nu cred că este o mare provocare.

plunkr

plunkr este cel mai puțin atractiv instrument pe care l-am întâlnit până acum. Prezentarea este aglutinată în mesaje și lipsă de imagini. Încărcarea conținutului este lentă și nu este foarte utilă la prima vedere. În plus, ordonarea în funcție de dată face ca orice programare, oricât de simplă, poate fi în prima poziție. Pentru a vedea ceva mai interesant, trebuie să accesați fila care spune: «Cele mai văzute«. Adică, dacă nu l-ați tradus până acum cu Google.

Spuneți, de asemenea, că, conform web-ului, acestea sunt în versiunea 1.0.0. Așadar, acest lucru explică puțin despre design, prezentare și posibilele erori pe care le găsiți atunci când navigați pe web.

Ca avantaj, dacă rămâi fără idei, nu va trebui să părăsiți sau să deschideți o altă filă în Plunkr, deoarece direct din bara laterală dreaptă puteți merge cu alte proiecte și le puteți vizualiza instantaneu. Acest lucru vă va facilita colectarea de idei rapide și aplicarea acestora în același timp la proiectul dvs.

bălăceală

bălăceală este un instrument simplu, te duci și creezi. Deși vă puteți înregistra și avea numele de utilizator prin GitHub, nu este ceva care să iasă în evidență pe web. Cu un fundal într-un gradient galben spre roșu, în partea vizuală și un fundal alb în partea de cod (așa cum este normal), este prezentat proiectul Dabblet, deși îl puteți schimba din fila CSS. Pentru mine, este mai bine să-l am în gol, deoarece gradientul tot ceea ce dă este puțin viață a

Când editați, puteți configura filele pe care le vedeți uşor. Chiar și dacă doriți să treceți la coloane sau rânduri pentru o vizualizare confortabilă, în funcție de persoana care editează. Schimbarea dimensiunii fontului, salvarea ca anonim fără înregistrarea sau validarea codului HTML sunt mai multe posibilități pe care Dabblet le oferă la prima vedere. Deși nu este prima opțiune pe care aș alege-o, poate fi luată în considerare în versiunile viitoare dacă sunt actualizate.

Unul dintre lucrurile care mi-au plăcut cel mai puțin, dar care ar putea plăcea programatorilor mari, este acela nu aveți opțiunea de a întabula o etichetă și de a o scrie singură. Adică, puneți HTML și faceți clic pe filă și scrieți automat „html” și „/ html”. Ceva care în celelalte aplicații, dacă este făcut.

LiveWeave

liveweave

LiveWeave Este foarte asemănător cu celelalte, nu are nimic din ceilalți nu pot oferi din punct de vedere al utilității. Ceea ce evidențiem despre acest proiect este designul său, o culoare închisă similară cu CodePen, dar cu o distribuție pătrată. A putea schimba dimensiunea după gust. Există, de asemenea, modul clar și „in afara liniei« unde codul pe care îl editați nu va fi reflectat în vizual, până când nu îl activați. Nu este o caracteristică pe care o consider foarte utilă, în calitate de designer, este important să vedeți întotdeauna ce editați în timp real, dar cineva o va găsi sigur. Și, deși, ca întotdeauna, vă puteți înregistra, utilizatorul nu are un rol principal. Deoarece, chiar dacă nu vă înregistrați, vă puteți salva proiectul.

Textul Sublime

Acest instrument Este total diferit de ceea ce ați văzut până acum în analiză. Textul sublim nu este o resursă web, ci o aplicație. Pe de o parte, este cu siguranță mai util să îl aveți pe desktop. Mai ales din cauza posibilelor blocări sau blocări ale internetului din cauza excesului și a posibilei pierderi de muncă. Pe de altă parte, nu este un instrument la fel de vizual ca și cele anterioare. Pe lângă faptul că nu are posibilitatea unei comunități de a împărtăși proiecte.

Aici totul este de la zero. Trebuie să creați file pentru a plasa liniile de cod și să le redenumiți pentru a ști care este. Dacă primul este HTML, al doilea CSS .. sau invers. De asemenea, nu are comenzi rapide pentru ceea ce va fi complet manual, cu excepția ghilimelelor.

Concluzie

Toate programele sunt similare cu anumite atingeri personale ale fiecărei companii, ceea ce duce la a avea argumente pro și contra în ele. Fiecare îl va alege pe cel care i se potrivește cel mai bine, recomandarea mea este să folosiți CodePen sau CSSDeck pentru mediu și rețeaua socială pe care o gestionează. Dar, dacă ți-a plăcut altul, lasă un comentariu și explică motivele tale, cu siguranță îți vor fi utile.


Lasă comentariul tău

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *

*

*

  1. Responsabil pentru date: Miguel Ángel Gatón
  2. Scopul datelor: Control SPAM, gestionarea comentariilor.
  3. Legitimare: consimțământul dvs.
  4. Comunicarea datelor: datele nu vor fi comunicate terților decât prin obligație legală.
  5. Stocarea datelor: bază de date găzduită de Occentus Networks (UE)
  6. Drepturi: în orice moment vă puteți limita, recupera și șterge informațiile.