CodePen: Diwangun, Nguji, Bagikeun sareng Ngajalajah HTML, CSS, sareng JavaScript

Codepen: Ngawangun, Nguji, sareng Manggihan Code Front-End

Hiji tantangan sareng sistem manajemen kontén nyaéta nguji sareng ngahasilkeun pakakas skrip. Sanaos sanés sarat pikeun kaseueuran penerbit, salaku publikasi téknologi, kuring resep ngabagi naskah anu dianggo ti jaman ka jaman pikeun ngabantosan jalma sanés. Kuring parantos ngabagi kumaha ngagunakeunana JavaScript pikeun mariksa kakuatan sandi, kumaha parios sintaksis alamat email sareng Ekspresi Biasa (Regex), sareng nembé nambihan ieu kalkulator pikeun ngaduga pangaruh penjualan ulasan online. Kuring miharep pikeun nambihan puluhan alat dina situs tapi WordPress henteu persis kondusif pikeun diterbitkeun sapertos kieu ... éta sistem kontén, sanés sistem pangwangunan.

Janten, pikeun ngagentoskeun naskah alit kuring resep ngagunakeun CodePen. CodePen mangrupikeun alat anu teratur rapi sareng panel HTML, panel CSS, panel JavaScript, Konsol, sareng diterbitkeun tina kode anu dihasilkeun. Masing-masing panel ngagaduhan inpormasi nalika anjeun mencét kana unsur-unsur sahingga anjeun ngartos naon anu dimungkinkeun, ogé kode-warna tina HTML, CSS, sareng JS anjeun pikeun ngabantosan anjeun pikeun ngédit sareng nyerat langkung gampil.

CodePen mangrupikeun lingkungan pangembangan sosial. Dina haténa, éta ngamungkinkeun anjeun nyerat kode dina pangotéktak, sareng ningali hasilna nalika ngawangun. Éditor kode online anu manpaat sareng ngabebaskeun pikeun pangembang tina sagala kaparigelan, sareng khususna memberdayakeun pikeun jalma anu diajar kode. CodePen museurkeun utamina kana basa payun sapertos HTML, CSS, JavaScript, sareng sintaksis preprocessing anu janten hal-hal éta.

Ngeunaan CodePen

Kalayan CodePen, kuring sanggup ngalakukeun sadaya padamelan anu diperyogikeun nyebarkeun kalkulator Kuring dipasang dina situs. Kaseueuran kreasi dina CodePen umum sareng sumber terbuka. Éta mahluk hirup anu jalma sanés sareng masarakat tiasa berinteraksi sareng, ti saderhana saderhana, dugi ka ngantunkeun koméntar, dugi ka garpu sareng ngarobih kabutuhan nyalira.

CodePen - kalkulator pikeun ngaduga pangaruh penjualan ulasan online

Kalayan CodePen, anjeun tiasa ngarobih pandangan upami hoyong panes aya di kénca, katuhu, atanapi handap nalika anjeun damel ... atanapi ningali HTML dina tab anyar. Tampilan sisi-sisi tiasa hadé pisan pikeun nguji setélan responsif anjeun kumargi anjeun tiasa nyaluyukeun ukuran dina pane anu tiasa ditingali.

Anjeun tiasa ngatur masing-masing naskah anu anjeun damel janten Pén, ngagabungkeun kana Proyék (multi-file editor), atanapi bahkan ngawangun koleksi. Éta dasarna mangrupikeun situs portopolio anu dianggo pikeun kode front-end dimana anjeun tiasa nuturkeun panulis anu sanés, garpu proyék-proyék anu sanésna dibagi kana perusahaan anjeun nyalira pikeun ngarobih, sareng bahkan diajar kumaha ngalakukeun sababaraha hal anu senang ngalangkungan tantangan.

Anjeun tiasa nyimpen salaku GitHub Gist, ngekspor dina file pos, komo Lebetkeun pulpén dina tulisan sapertos kieu:

Ningali Pena
Dédiksi Dampak Pangaruh Tinjauan Online
by Douglas Karr (@douglaskarr)
on CodePen.


Salah sahiji watesan éditor Pén nyaéta volume kode anu jelas. Anjeun panginten henteu tiasa ngaji masalah ieu, sabab éditorna kedah saé kalayan ratusan atanapi bahkan rébuan garis kode. Tapi nalika aranjeunna ngamimitian nganiaya 5,000 - 10,000 atanapi langkung garis kode, anjeun bakal ningali panyuntingna mimiti gagal. Nanging, anjeun tiasa nambihan rujukan éksternal kana styleheets atanapi JavaScript anu di-host di tempat sanés!

Abdi ngadorong anjeun daptar. Anjeun bakal langganan email mingguanna sareng ogé tiasa nambihan eupan kana RSS feed anjeun ku kituna anjeun tiasa ningali pulpen anu nembé diterbitkeun. Sareng, upami anjeun ngamimitian milarian atanapi ngotéktak pulpen umum di ditu, anjeun bakal mendakan sababaraha proyék anu luar biasa… pangguna lumayan bakat!

ngiringan Douglas Karr dina Codepen

Versi anu mayar, CodePen Pro, nawiskeun seueur fitur tambahan pikeun ningkat fungsionalitas atanapi tim - kalebet kolaborasi, prosés, hosting aset, pandangan pribadi, sareng bahkan ngerahkeun proyék nganggo domain atanapi subdomain anjeun nyalira. Sareng, tangtosna, CodePen nyayogikeun Repository anu saé kalayan integrasi Github dimana tim anjeun tiasa dianggo. Upami anjeun ngan ukur hoyong nyobian sababaraha kode saderhana sakumaha kuring, CodePen mangrupikeun alat anu teu ternilai.

Naon anu anjeun pikirkeun?

Situs migunakeun Akismet pikeun ngurangan spam. Diajar kumaha komentar data anjeun diolah.