FrontEnd Development: CodePen eller sublim text?

CodePen eller sublim text?
CodePen eller sublim text? Om vi ​​pratar om webbprogrammering kommer namnet på HTML, CSS och JavaScript till oss direkt. Det finns flera sätt att komma dit. Även, om vi öppnar ett anteckningsblock kan vi börja skriva "html". Det är sant att du behöver en ansträngande procedur för att se resultatet av vad du programmerar från en pad.

Dessa webbplatser är de viktigaste lekplatserna för applikationsutvecklare för dagens användare. För att lära dig mer om fördelarna och nackdelarna med dessa program kommer vi att analysera dem djupt i den här artikeln (åtminstone allt vi vet). Som jag alltid säger, säkert känner några av er här ämnet mer. Om så är fallet, kommentera allt som rymmer oss här. Vi diskuterar gärna!

Idag ska vi analysera CodePen, JSBin, Plunkr, sublim, CSSDeck, Dabblet och LiveWeave. Vilka är de mest kända och de verktyg som används mest i denna miljö. Det finns naturligtvis fler.

Men för alla er som inte vet vad FrontEnd eller BackEnd handlar om, låt oss förklara lite. Frontend eller gränssnittet är den visuella delen som den navigerande användaren kan se på webben. BackEnd kommer att vara den del som webbplatsadministratören kontrollerar. Om du vid programmering anger kod genom ett verktyg som visar resultatet samtidigt kommer detta att kallas front-end.

CodePen

För många det mest kompletta verktyget av allt det vi talar om. Används som ett webbverktyg som är närmast en gemenskap att visa ditt arbete. Ett slags youtube från programmeraren. I detta kan du se de programmerare som är anslutna till webben och kontakta dem om du har något intresse, se deras profil, följa dem i nätverk och till och med prenumerera på deras kanal för att se alla deras framtida projekt.

Presentation av innehåll, support och kortkommandon

CodePen-presentationen är den mest intressantaFör med bara några få klick kan du arbeta igenom processen direkt. Med mycket väl separerade rader av html, css och javascript. Förutom den visuella delen, som du kan sprida upp och ner för att tydligt se dina framsteg. På så sätt hjälper vi till att differentiera varje språk väl. Något som kommer till nytta för nyare programmerare.

Ditt webbstöd, gör det mer uthärdligt när du vill börja använda något som vi inte riktigt känner till. Det betyder inte att det är bättre för dig, det beror på de behov vi har. Men ja, för att lära känna miljön lite bättre innan du förbinder dig att installera något på datorn av "okänt" ursprung.

Om du är en av dem som är vana vid att använda CASI helt tangentbord när du arbetar kommer CodePen att vara underbart för dig. Andra verktyg behöver insticksmoduler för att kunna använda kortkommandon för att fylla i miljön. Detta gör jobbet lite obehagligt (även om det är lika effektivt när det har installerats). CP. integrerar som standard ett system som får dig att fylla i samma kodrader som upprepas, som det kan vara i en lista. Du skriver hur du vill att listan ska visas och klickar på Tab.

Pro-versionen tillåter också många fler alternativ till ett pris på 9,00 € för baspaketet till 29,25 € för "Super" -paketet. Att kunna uppdatera i flera enheter samtidigt vad vi gör i en. Också ett samarbetsläge, ett "lärarläge" etc. Fördel om du vill här.

JSBin

JSBin är ett verktyg som vi kan kvalificera som direkta. Eftersom du väl har gått till dess webbdomän kommer den att vara redo att börja utarbeta ditt nästa projekt utan dröjsmål. Och även om den första iscenesättningen inte är särskilt attraktiv, är den bekväm.

JSBin är enkelt, med den grundläggande strukturen skapad i html för att inte slösa tid, kommer du att korsa mellan de olika språken för att slutföra arbetet. Först finns det HTML, sedan CSS, Javascript och slutligen ditt arbete visuellt. Och även om det verkar svårare kommer du att ha samma typer av genvägar utan att installera något. Direkt från webbläsaren.

Jag har dock tyckt att det är mer obekvämt att se koden korrekt, när den är dold på grund av de efterföljande kolumnerna. Eftersom, med den bärbara datorn, måste du ge upp eller ner med styrplatta och det är inte mycket flytande.

Den har bara två delbetalningar, gratis eller betald. Detta är lite dyrare än CodePen, men om du betalar det årligen är det mer lönsamt om du kan betala € 120.

CSSDeck

CSSDeck
Arbetsmiljön för CSSDeck skiljer sig från den som ses ovan. Uppdelad i endast två kolumner, visuell kod, fungerar CSSDeck med 3 rader nedåt med vilka de delar olika språktyper. Med en presentation i form av ett socialt nätverk och en renare arbetsmiljö i ljusa färger. Det verkar som ett enkelt verktyg. Även om det ibland inte betyder att det är negativt.

Med mer än sextio tusen registrerade användare och mer än två hundra femtio tusen projekt skapade är det inte svårt att söka och hitta det du vill ha. Språket som alltid, om det kan vara ett besvär för dem som inte kan engelska, men i detta sociala nätverk Bilden är väldigt viktig, så jag tycker inte att det är en stor utmaning.

plunkr

plunkr det är det minst attraktiva verktyget jag har stött på hittills. Presentationen är agglutinerad i meddelanden och brist på bilder. Att ladda innehåll går långsamt och inte särskilt användbart vid första anblicken. Dessutom gör beställningen efter datum någon programmering, oavsett hur enkel, kan vara i första position. För att se något mer intressant bör du gå till fliken som säger: «Mest sedda«. Det vill säga om du inte har översatt det med Google tidigare.

Säg också att enligt webben finns de i version 1.0.0. Så detta förklarar lite designen, presentationen och de eventuella fel som du hittar när du surfar på nätet.

Som en fördel, om du har slut på idéerbehöver du inte lämna eller öppna en annan flik i Plunkr, eftersom du direkt från höger sidofält kan gå med andra projekt och se dem direkt. Detta gör det lättare för dig att samla in snabba idéer och tillämpa dem på ditt projekt samtidigt.

dabblet

dabblet det är ett enkelt verktyg, du går in och skapar. Även om du kan registrera dig och ha ditt användarnamn via GitHub är det inte något som sticker ut mycket på webben. Med en bakgrund i en gul till röd toning, i den visuella delen och en vit bakgrund i koddelen (som normalt) presenteras Dabblet-projektet, även om du kan ändra det från CSS-fliken. För mig är det bättre att ha det tomt, eftersom den lutningen det enda som ger är lite livet a

När du redigerar kan du konfigurera de flikar du ser lätt. Även om du vill byta till kolumner eller rader för bekväm visning beroende på personen som redigerar. Att ändra teckenstorlek, spara som anonym utan att registrera eller validera HTML-koden är fler möjligheter som Dabblet erbjuder vid första anblicken. Även om det inte är det första alternativet som jag skulle välja, kan det vara att ta hänsyn till i framtida versioner om de uppdateras.

En av de saker som jag gillade minst, men som stora programmerare kanske gillar, är att du har inte möjlighet att tabulera en etikett och låta den skriva själv. Det vill säga, sätt HTML och klicka på fliken och skriv "html" och "/ html" automatiskt. Något som i de andra applikationerna om det görs.

LiveWeave

levande väv
LiveWeave Det är mycket likt de andra, det har inget som de andra inte kan erbjuda när det gäller nytta. Vad vi lyfter fram med detta projekt är dess design, en mörk färg som liknar CodePen men med en fyrkantig fördelning. Att kunna ändra storlek att smaka. Det finns också klart läge och «gått över gränsen« där koden du redigerar inte kommer att återspeglas i det visuella, tills du aktiverar den. Det är inte en funktion som du tycker är mycket användbar, som designer, det är viktigt att du alltid ser vad du redigerar i realtid, men någon kommer säkert att hitta det användbart. Och även om du som alltid kan registrera dig har användaren ingen ledande roll. Eftersom, även om du inte registrerar dig, kan du spara ditt projekt.

Sublima Text

Detta verktyg Det skiljer sig helt från vad du hittills har sett i analysen. Sublim text är inte som en webbresurs utan som en applikation. Å ena sidan är det säkert mer användbart att ha det på skrivbordet. Speciellt på grund av eventuella internetkrascher eller frysningar på grund av överskott och eventuell förlust av arbete. Å andra sidan är det inte ett så visuellt verktyg som de tidigare. Förutom att inte ha möjlighet för en gemenskap att dela projekt.

Här är allt från grunden. Du måste skapa flikar för att placera kodraderna och byta namn på dem för att veta vilken som är. Om den första är HTML, den andra CSS ... eller vice versa. Det har inte heller några genvägar för vad det kommer att bli helt manuell, förutom offerten.

Slutsats

Alla program är lika med vissa personliga detaljer från varje företag som leder till att de har fördelar och nackdelar. Var och en väljer den som bäst passar dem, min rekommendation är att använda CodePen eller CSSDeck för miljön och det sociala nätverk som den hanterar. Men om du gillade en annan till, lämna en kommentar och förklara dina skäl, kommer de säkert att vara användbara.


Innehållet i artikeln följer våra principer om redaktionell etik. Klicka på för att rapportera ett fel här.

Bli först att kommentera

Lämna din kommentar

Din e-postadress kommer inte att publiceras.

*

*

  1. Ansvarig för uppgifterna: Miguel Ángel Gatón
  2. Syftet med uppgifterna: Kontrollera skräppost, kommentarhantering.
  3. Legitimering: Ditt samtycke
  4. Kommunikation av uppgifterna: Uppgifterna kommer inte att kommuniceras till tredje part förutom enligt laglig skyldighet.
  5. Datalagring: databas värd för Occentus Networks (EU)
  6. Rättigheter: När som helst kan du begränsa, återställa och radera din information.