Ena od mnogih frustrirajočih stvari pri spletnem razvoju je, da nimate preprostega načina, kako svoje projekte deliti z drugimi. V mnogih primerih boste morali svoj projekt gostiti na spletnem strežniku ali poslati vse ustrezne datoteke nekomu, ki želi videti, kaj ste ustvarili. Toda zahvaljujoč urejenemu spletnemu orodju CodePen vam o tem ni treba več skrbeti.
CodePen.io
CodePen je brezplačno orodje, s katerim lahko svoje projekte gostite v spletu, ne da bi vam bilo treba plačati niti denarja. Če želite začeti, pojdite na CodePen.io in ustvarite brezplačen račun.
Ko to storite, lahko ustvarite "pisalo" s klikom na gumb "Novo pisalo" v zgornjem desnem kotu zaslona.
Po tem boste lahko v ustrezna polja dodali kateri koli HTML, CSS in JavaScript. Ko začnete dodajati neko kodo, boste videli predogled v živo, kar ustvarjate. Prvi peresnik lahko naslovite v zgornjem levem kotu. Ko kliknete prvo tipko »Shrani«, boste URL strani lahko preprosto dali v skupno rabo s prijatelji, družino in sodelavci, da bodo lahko videli, na čem delate.
Tako bo videti vaše pisalo z nekaj kode (prijazno s projektom Free Code Camp z imenom Tribute Page):
Ko ustvarite svoj peresnik, boste pred začetkom želeli iti skozi Nastavitve. Ko kliknete na gumb "Novo pero", bi morala videti predlogo za pero, da boste lahko začeli vnašati neko kodo. V zgornjem desnem kotu bo gumb »Nastavitve«. Kliknite na to (videli bi spodaj zaslon).
Tu boste lahko zašli med zavihki HTML, CSS in JavaScript in dodali nekatere informacije. Na zavihku HTML boste lahko dodali meta podatke, stvari, ki bi morale biti vključene v
zavihek in tako naprej. Pod CSS boste lahko dodali predprocesorje CSS, kot sta LESS in Sass. Ne samo to, ampak lahko dodate tudi zunanje CSS, kot sta Bootstrap in Foundation. Na zavihku JavaScript lahko dodate JavaScript predprocesor, kot sta Babel ali CoffeeScript. Poleg tega lahko dodate zunanje okvire JavaScript, kot so Angular, React, Lodash, D3 in tako naprej.
Končno vam bo CodePen omogočil spreminjanje pogleda, ki ga gledate. Privzeti pogled je Editor View, ki vam omogoča, da vnesete kodo in dobite majhen predogled v spodnji konzoli. Vendar obstajajo tudi druge možnosti, pri čemer je še posebej priročen pogled "Celotna stran", kjer boste videli projekt, kot da je bil objavljen na spletnem mestu. Na voljo je še nekaj drugih pogledov, s katerimi se je vredno igrati!
CodePen je resnično lepo orodje in smo se le dotaknili površine njegove uporabnosti. Vredno je, da se pomaknete na CodePen.io in ga uporabite za sodelovanje pri nekaj projektih, nato pa jih, če se vam zdi, všeč, delite s prijatelji ali sodelavci.
Kaj menite o CodePenu? Ste uporabili podobno orodje? Sporočite nam v spodnjem delu komentarjev!
