CodePen ama Qoraal sare? Haddii aan ka hadalno barnaamijyada websaydhka, magaca HTML, CSS iyo JavaScript ayaa isla markiiba noo yimaada. Waxaa jira dhowr siyaabood oo aad ku tagi karto halkaas. Xitaa, haddii aan furno notepad waxaan ka shaqeyn karnaa qorista "html". Waa run in si loo arko natiijada waxa aad ka diyaarinayso suufka, waxaad u baahan doontaa hanaan hawl badan si aad u ogaato horumarka.
Goobahani waa goobaha ugu waaweyn ee lagu ciyaaro ee loogu talagalay horumarinta barnaamijyada ee loogu talagalay dadka isticmaala maalinta. Si aan wax badan uga ogaanno faa'iidooyinka iyo faa'iido darrooyinka barnaamijyadan, waxaan si qoto dheer ugu lafa guri doonnaa maqaalkan (ugu yaraan, wax kasta oo aan ognahay). Sida aan had iyo jeer idhaahdo, hubaal qaar idinka mid ah oo halkan jooga ayaa mawduuca inbadan ka yaqaan. Hadday sidaas tahay, ka faallo wax kasta oo naga baxsada halkan. Waxaan ku farxi doonnaa inaan ka wada hadalno!
Maanta waxaan falanqeyn doonnaa CodePen, JSBin, Plunkr, heer sare ah, CSSDeck, Dabblet, iyo LiveWeave. Kuwee ayaa ah kuwa ugu caansan uguna qalab badan ee deegaankan lagu isticmaalo. Waxaa jira waxyaabo badan, dabcan.
Laakiin dhammaantiin kuwa aan garanaynin waxa FrontEnd ama BackEnd ku saabsan yahay, bal aan wax yar sharaxno. Front-End ama interface waa qaybta muuqaalka ee adeegsadaha hagitaanku awood u yeelan doono inuu ku arko shabakadda. BackEnd wuxuu noqon doonaa qeybta uu maamulo maamulka goobta. Barnaamijyada, haddii aad ku qorto koodh adoo adeegsanaya qalab soo bandhigaya natiijada isla markaa, tan waxaa loogu yeedhi doonaa dhammaadka hore.
CodePen
Qaar badan oo ka mid ah qalabka ugu dhameystiran dhammaan wixii aan ka hadlayno. Waxaa loo adeegsaday aalad web ah taas oo ah waxa ugu dhaw bulshada si loo muujiyo shaqadaada. Nooc ka mid ah youtube ka barnaamijka. Tan dhexdeeda, waxaad ka arki kartaa shaqada barnaamijyada ku xiran websaydhka oo aad la xiriirtaa iyaga haddii ay dhacdo inaad danaynayso, arag boggooda, ku raac iyaga shabakadaha iyo xitaa rukhsad marinkooda si aad u eegto dhammaan mashaariicdooda mustaqbalka.
Soo bandhigida waxa ku jira, taageerada iyo toobiyeyaasha kumbuyuutarka
Soo bandhigida CodePen waa tan ugu xiisaha badanSababtoo ah kaliya qasabno yar, waxaad ku shaqeyn kartaa nidaamka isla markiiba. Iyada oo leh khadad aad u kala fog oo kala ah html, css iyo javascript. Marka lagu daro qaybta muuqaalka, oo aad dhex-dhexaadin karto kor iyo hoosba si aad si cad ugu aragto horumarkaaga. Sidaas awgeed gacan ka geysashada sidii loo kala saari lahaa luuqad kasta si wanaagsan. Waxyaabaha anfacaya barnaamijyada cusub.
Taageeradaada shabakada, waxay kadhigeysaa mid loo dulqaadan karo markaad rabto inaad bilowdo adeegsiga wax aanan runtii sifiican u aqoon. Taasi macnaheedu maaha inay adiga kuu fiican tahay, waxay kuxirantahay baahiyaha aan qabno. Laakiin haa, si aad u ogaatid deegaanka waxoogaa fiican ka hor intaanad goaansanin inaad wax ku rakibo kombuyuutarka asalka "aan la garanayn".
Hadaad ka mid tahay kuwa loo bartay isticmaalkeeda casi gabi ahaanba kiiboodhka markaad shaqeyneyso, CodePen ayaa kuu noqon doona wax cajiiba. Qalab kale ayaa u baahan plugins inaad awood u yeelatid inaad isticmaashid furayaasha kumbuyuutarka si aad u buuxiso deegaanka. Tani waxay ka dhigeysaa shaqada wax yar oo raaxo leh (in kastoo ay waxtar leedahay mar la rakibay). CP. wuxuu isku darayaa nidaam ahaan nidaam kaa dhigaya inaad buuxiso isla xariiqyada koodhka ee lagu celiyo, maadaama ay ku jiri karto liis. Waxaad qoreysaa sida aad rabto in liistadu u muuqato oo waxaad gujisaa Tab.
Nooca Pro sidoo kale wuxuu u oggolaanayaa xulashooyin badan oo dheeri ah qiimaha € 9,00 xirmada aasaasiga ah ilaa .29,25 XNUMX xirmada "Super". Inaad awood u yeelatid cusbooneysiinta dhowr qalab oo isku mar ah waxa aan ku sameyno hal. Sidoo kale qaab iskaashi, "hab macalin", iwm. Ka faa'iideyso haddii aad halkan rabto.
JSBin
JSBin waa aalad aan si toos ah ugu qalmi karno. Tan iyo markii aad tagto boggaaga internetka, waxay diyaar u noqon doontaa inay bilawdo sameynta mashruucaaga xiga, dib u dhac la'aan. In kasta oo xarunteedii ugu horreysay aysan ahayn mid soo jiidasho leh, haddana waa mid raaxo leh.
JSBin waa fududahay, qaab dhismeedka aasaasiga ah ee lagu sameeyay html si aan waqti looga lumin, waxaad kala dhex geli doontaa luqadaha kala duwan si aad u dhamayso shaqada. Marka hore waxaa jira HTML, ka dib CSS, Javascript iyo ugu dambeyntii shaqadaada muuqaal ahaan. Oo inkasta oo ay u muuqato mid ka sii dhib badan, waxaad yeelan doontaa noocyo isku mid ah oo ah tuuryo oo aanad rakibin wax. Si toos ah uga socda biraawsarka.
Si kastaba ha noqotee, waxaan u arkaa wax aan fiicnayn inaan si sax ah u arko koodhka, mar haddii la qariyo sababo la xiriira tiirarka xiga. Tan iyo, adoo adeegsanaya laptop-ka, waa inaad iska dhiibtaa ama aad hoos u dhigtaa iyada oo trackpad mana aha dheecaan badan.
Kaliya waxay leedahay laba qaybood, bilaash ama lacag. Tani way ka qaalisan tahay CodePen, inkasta oo haddii aad sanadkii bixiso, ay ka macaash badan tahay, haddii aad bixin karto € 120.
CSDeck
Deegaanka shaqada ee CSDeck wuu ka duwan yahay kan kor lagu arkay. Waxaa loo qaybiyaa laba tiirar oo keliya, muuqaal-koodh, CSSDeck wuxuu la shaqeeyaa 3 saf oo hoos u qaybiya noocyada kala duwan ee luqadda. Iyada oo lagu soo bandhigayo qaab shabakad bulsheed iyo jawi shaqo nadiif ah oo midab khafiif ah leh. Waxay umuuqataa qalab fudud. In kastoo mararka qaar taasi macnaheedu ahayn inay xun tahay.
Iyada oo in ka badan lixdan kun oo isticmaaleyaal diiwaangashan iyo in ka badan laba boqol iyo konton kun oo mashruuc la abuuray, raadinta iyo helitaanka waxa aad rabto ma adkaan doonto. Luqadda sida had iyo jeer, haddii ay ku noqon karto dhib ku ah kuwa aan aqoon Ingiriisiga, laakiin tan shabakada bulshada Sawirka aad ayuu muhiim u yahay, markaa uma maleynayo inay caqabad weyn tahay.
plunkr
plunkr waa aaladda ugu soo jiidashada yar ee aan ilaa hadda la kulmay. Bandhigga waxaa lagu qiimeeyay farriimaha iyo sawir la'aan. Waxyaabaha la rakibayaa waa gaabis oo wax tar badan kuma leh jaleecada hore. Intaa waxaa sii dheer, ku dalbashada taariikhda waxay sameyneysaa jadwal kasta, si kasta oo ay u fududahay, waxay ku jiri kartaa booska koowaad. Si aad u aragto wax aad u xiiso badan waa inaad aadaa tabka oranaya: «Ugu Aragti«. Taasi waa, haddii aadan horay ugu turjumin Google.
Sidoo kale waxaad dhahdaa sida ku cad webka, waxay ku jiraan nooca 1.0.0. Marka tani wax yar ayey sharraxeysaa naqshadeynta, soo bandhigidda iyo khaladaadka suurtagalka ah ee aad ka heli karto markaad booqaneyso shabakadda.
Faa’iido ahaan, haddii fikrado kaa dhammaadaan, maahan inaad katagto ama aad tab kale ka furto Plunkr, maadaama toos tooska dhinaca midig aad ugala socon karto mashaariicda kale isla markaana aad isla markiiba u arki karto. Tani waxay kuu sahlaysaa inaad soo uruuriso fikradaha degdegga ah isla markaana aad isla markaa ku dabaqdo mashruucaaga.
dabblet
dabblet waa aalad fudud, waad gasho oo wax abuur. In kasta oo aad isdiiwaangelin karto oo aad ku adeegsan karto magacaaga adeegsiga iyada oo loo marayo GitHub, maahan wax wax badan ka taagan shabakadda. Iyada oo leh taariikh midab huruud iyo guduud ah, qeybta muuqaalka iyo asalka cad ee qeybta koodhka (sida caadiga ah), mashruuca Dabblet waa la soo bandhigay, in kastoo aad ka beddeli karto tabka CSS. Aniga ahaan, waxaa igafiican in laga dhigo madhan, maxaa yeelay garaadleydaas wixii bixiya oo dhan waa waxyar nolosha a
Markaad tafatirayso, waad habeyn kartaa tabka aad aragto si fudud. Xitaa xitaa haddii aad rabto inaad u beddesho tiirar ama saf si aad u daawatid raaxo leh iyadoo kuxiran qofka wax hagaajinaya. Beddelida cabbirka xarfaha, keydinta si qarsoodi ah iyada oo aan la diiwaangelin ama la ansaxinin lambarka HTML ayaa ah fursado badan oo uu Dabblet ku bixiyo jaleecada hore. In kasta oo aysan ahayn ikhtiyaarka ugu horreeya ee aan dooran lahaa, waxay noqon kartaa in lagu xisaabtamo noocyada mustaqbalka haddii la cusbooneysiiyo.
Mid ka mid ah waxyaabaha aan jeclaa ugu yaraa, laakiin barnaamijyada waaweyn ay jeclaan karaan, waa taas ma lihid ikhtiyaar aad ku qorto shay oo aad iskaga qorto. Taasi waa, geli HTML oo guji tabta oo si toos ah ugu qor "html" iyo "/ html". Wax in codsiyada kale haddii la sameeyo.
LiveWeave
LiveWeave Waxay aad ugu egtahay kuwa kale, ma hayso wax aysan kuwa kale ku bixin karin dhanka waxtarka. Waxa aan ku iftiimineyno mashruucan waa nashqadeyntiisa, midab madow oo la mid ah CodePen laakiin leh qeybinta laba jibbaaran. Inaad bedeli karto cabirka dhadhamin. Waxa kale oo jira qaab cad iyo «khadka ka baxsan« halkaasoo koodhka aad wax ka beddeli doontaa uusan ka muuqan doonin muuqaalka, illaa aad kicinayso. Ma ahan muuqaal aad waxtar badan uhesho, naqshadeeye ahaan, waxaa muhiim ah inaad had iyo jeer aragto waxa aad wax ka beddeshay waqtiga dhabta ah, laakiin qof ayaa kuu arki doona xoogaa isticmaal ah oo hubaal ah. In kasta oo, sida had iyo jeer, aad isdiiwaangelin karto, isticmaalehu ma laha door hoggaamineed. Tan iyo, xitaa haddii aadan isdiiwaangalin, waad badbaadin kartaa mashruucaaga.
Qoraalka Sare
Qalabkan Gabi ahaanba way ka duwan tahay waxaad ku aragtay ilaa iyo hadda falanqaynta. Text Sublime ma aha sida ilaha webka, laakiin waa codsi. Dhinac marka laga eego, xaqiiqdii waa waxtar badan in laga helo desktop-ka. Gaar ahaan shilalka internetka ee suurtagalka ah ama barafoobay sababo la xiriira xad-dhaaf iyo suurtagalnimada luminta shaqada. Dhanka kale, ma ahan aalad muuqaal ahaan u muuqata sidii kuwii ka horreeyay. Ka sokow in aan la helin suurtagalnimada beel wadaagto mashaariicda.
Halkan wax waliba waa laga soo bilaabay. Waa inaad sameysid tab si aad u dhigtid xariijinta koodhka oo aad dib ugu magacawdo si aad u ogaato midka uu yahay. Haddii kan hore yahay HTML, ka labaad CSS ... ama taa beddelkeeda. Sidoo kale ma lahan wax looyaro oo laga baxo waxa ay noqon doonto gebi ahaanba gacanta, marka laga reebo xigashooyinka.
Gabagabo
Dhammaan barnaamijyadu waxay la mid yihiin taabashada shaqsiyadeed ee shirkad kasta oo u horseeda inay ku yeeshaan faa'iidooyin iyo qasaarooyin iyaga ka mid ah. Mid waliba wuxuu dooran doonaa midka ku habboon iyaga, taladaydu waa in loo isticmaalo CodePen ama CSSDeck deegaanka iyo shabakada bulshada ee ay maamusho. Laakiin, haddii aad mid kale ka heshay, ka tag faallo oo sharax sababahaaga, hubaal way waxtar yeelan doonaan.