CodePen: HTML, CSS, û JavaScript, Avakirin, Test, Parvekirin û Vedîtin

Kodkirin: Koda Pêş-Dawî Ava Bikin, Test bikin, û Kifş bikin

Yek pirsgirêkek bi pergala rêveberiya naverokê re ceribandin û hilberîna amûrên nivîsandî ye. Gava ku ew ji bo piraniya weşangeran ne hewce ye, wekî weşangehek teknolojiyê, ez dixwazim carinan carinan nivîsarên xebatê parve bikim ku alîkariya mirovên din bikim. Min çawa bikar anî parve kir JavaScript ku hêza şîfreyê kontrol bike, çawa Hevoksaziya navnîşana e-nameyê bi Bêjeyên Rêkûpêk kontrol bikin (Regex), û herî dawî ev zêde kir hesabker ku bandora firotanê ya nirxandinên serhêl pêşbînî bike. Ez hêvî dikim ku bi dehan amûran li ser malperê zêde bikim lê WordPress ji bo weşandina bi vî rengî ne guncan e… ew pergalek naverokê ye, ne pergalek pêşkeftinê ye.

Ji ber vê yekê, da ku nivîsên xweyên piçûk bixebitînin ez kêfa xwe bi kar tînim CodePen. CodePen bi panelê HTML, panel CSS, panel JavaScript, Konsol, û koda encam ve hatî weşandin amûrek bi rêkûpêk a bi rêkûpêk e. Her panel dema ku hûn hêmanan bi mişkî dikin, da ku hûn pê fam bikin ka çi mimkûn e, û hem jî kod-rengkirina HTML, CSS û JS-a we heye ku ji we re bibe alîkar ku hûn hêsantir sererast bikin û binivîsin.

CodePen jîngehek geşedana civakî ye. Di dilê wê de, ew dihêle hûn di gerokê de kodê binivîsin, û dema ku hûn çêdikin encamên wê bibînin. Edîtorek koda serhêl a kêrhatî û azadker ji bo pêşdebirên her jêhatî, û nemaze ji bo mirovên fêrbûna kodkirinê hêzdar dikin. CodePen di serî de li ser zimanên pêş-end mîna HTML, CSS, JavaScript, û hevoksazên pêş-pêvajoyê ku vediguherin wan tiştan disekine.

About CodePen

Bi CodePen re, min karibû ku hemî karên ku hewce ne bikim kalkulator biweşînin Ez di malperê de bicîh bûm. Piraniya afirandinên li ser CodePen çavkaniya gelemperî û vekirî ne. Ew tiştên zindî ne ku mirovên din û civak dikarin bi wan re têkiliyê deynin, ji dilek sade, bihêlin şîroveyek, bigire û ji bo hewcedariyên xwe guherîn.

CodePen - hesabker ji bo pêşbînîkirina bandora firotanê ya nirxandinên serhêl

Bi CodePen re, hûn dixwazin ku gava hûn dixebitin panelên li milê çepê, rastê an binî bin, hûn dikarin nêrîna xwe biguherînin… an jî HTML-ê di tabek nû de bibînin. Dîmena kêleka kêlekê ji bo ceribandina mîhengên bersîva we ji dil baş dixebite ji ber ku hûn dikarin mezinahiya panelê ya xuyang bikin.

Hûn dikarin her nivîsên xweyên xebitandinê di Pênûsan de bi rêxistin bikin, wan di Projeyan de (edîtorê pir-pelê) bi hev ve girêbidin, an jî berhevokan jî çêbikin. Ew di bingeh de malperek kargêra karûbarê koda pêş-end e ku hûn dikarin nivîskarên din bişopînin, projeyên din ên bi gelemperî ve parvekirî li xwe biponijînin ku biguhezînin, û hetta fêr bibin ka meriv bi zehmetiyan çend tiştên kêfê dike.

Hûn dikarin wekî GitHub Gist-ê tomar bikin, di pelê zip de, û heta jî hinardeyê bikin embed pênûs di gotarek bi vî rengî de:

Pênûsê bibînin
Bandora Firotana Pêşbînkirî ya Nirxandinên Serhêl
by Douglas Karr (@douglaskarr)
on CodePen.


Yek ji sînorkirinên edîtorê Pênûsê qebareya koda mezin e. Dibe ku hûn carî li ser vê pirsgirêkê dernekevin, ji ber ku edîtor divê bi sedhezaran an bi hezaran rêzikên kodê xweş be. Lê gava ku ew dest bi lêdana 5,000 - 10,000 an zêdetir rêzikên kodê bikin, hûn ê bibînin ku sernûser dest pê dike ku têk biçe. Lêbelê, hûn dikarin referansên derveyî li ser şêwaz an JavaScript-a li cîhek din mêvandirî zêde bikin!

Ez ji we re teşwîq dikim ku hûn bibin endam. Hûn ê ji e-nameya wan a heftane re bibin abonî û her weha hûn dikarin feedê jî li RSS-ya xwe zêde bikin da ku hûn pênûsên ku nû hatine weşandin bibînin. , Heke hûn li wir dest bi lêgerîn an lêgerîna pênûsên gelemperî bikin, hûn ê hin projeyên bêhempa bibînin find bikarhêner pir jêhatî ne!

Pêketin Douglas Karr li ser Codepen

Guhertoya drav, CodePen Pro, ji bo karbidestiyê an tîmên çêtirîn tonek taybetmendiyên din pêşkêş dike - hevkariyê, pêvajoyan, mêvandariya sermayeyê, nêrînên taybetî, û heta ku projeyên bi navgîniya xwe an subdomaina xwe ve hatî bicîh kirin. , Bê guman, CodePen bi integrasyona Github re depoyek mezin peyda dike ku tevahiya tîmê we dikare bixebite. Heke hûn tenê dixwazin ku ez çend kodê sade biceribînin, ez im, CodePen amûrek bêhempa ye.

Hûn çi difikirin?

Ev malpera Akismet bikar tîne ku ji bo kêmkirina spam. Zêdetir agahdariya danûstandinên we çawa pêvajoy kirin.