FrontEnd Development: CodePen yoki Sublim Matnmi?

CodePen yoki yuksak matnmi?
CodePen yoki Sublime Text? Agar veb-dasturlash haqida gapiradigan bo'lsak, HTML, CSS va JavaScript-ning nomi darhol bizga keladi. U erga borishning bir necha yo'li mavjud. Hatto, agar biz bloknot ochsak, "html" yozish bilan ishlashimiz mumkin. Haqiqatan ham siz dasturlashingiz natijasini yostiqdan ko'rish uchun sizga taraqqiyotni sezish uchun juda mashaqqatli protsedura kerak bo'ladi.

Ushbu saytlar kunning foydalanuvchilari uchun dastur ishlab chiquvchilari uchun asosiy o'yin maydonchalari. Ushbu dasturlarning afzalliklari va kamchiliklari haqida ko'proq bilish uchun ularni ushbu maqolada chuqur tahlil qilamiz (hech bo'lmaganda biz bilgan hamma narsa). Men har doim aytganimdek, shubhasiz bu erda sizning ba'zilaringiz mavzuni ko'proq bilishadi. Agar shunday bo'lsa, bu erda bizdan qochib qutuladigan hamma narsaga izoh bering. Biz muhokama qilishdan xursand bo'lamiz!

Bugun biz CodePen, JSBin, Plunkr, sublime-ni tahlil qilamiz, CSSDeck, Dabblet va LiveWeave. Qaysi biri eng yaxshi tanilgan va ushbu muhitda eng ko'p ishlatiladigan vositalar. Bundan ham ko'proq, albatta.

Ammo FrontEnd yoki BackEnd nima ekanligini bilmaydigan barchangiz uchun biroz tushuntirib beramiz. Front-End yoki interfeys - bu navigatsiya qiluvchi foydalanuvchi Internetda ko'rishi mumkin bo'lgan ingl. BackEnd sayt administratori boshqaradigan qism bo'ladi. Dasturlashda, natijani bir vaqtning o'zida aks ettiradigan vosita orqali kodni kiritsangiz, bu "oldingi" deb nomlanadi.

CodePen

Ko'pchilik uchun eng to'liq vosita biz gapiradigan narsalardan. O'zingizning ishingizni namoyish qilish uchun hamjamiyatga eng yaqin bo'lgan veb-vosita sifatida ishlatiladi. Bir xil Youtube dasturchidan. Bunda siz Internetga aloqador dasturchilarning ishlarini ko'rishingiz va qiziqishingiz bo'lsa, ular bilan bog'lanishingiz, ularning profilini ko'rishingiz, tarmoqlarda kuzatib borishingiz va hatto kelajakdagi barcha loyihalarini ko'rish uchun o'z kanallariga obuna bo'lishingiz mumkin.

Tarkibni taqdim etish, qo'llab-quvvatlash va klaviatura yorliqlari

CodePen taqdimoti eng qiziqarliChunki bir necha marta bosish bilan siz jarayonni darhol bajarishingiz mumkin. HTML, CSS va JavaScript-ning juda yaxshi ajratilgan satrlari bilan. O'zingizning taraqqiyotingizni aniq ko'rish uchun yuqoriga va pastga tushishingiz mumkin bo'lgan ingl. Qismga qo'shimcha ravishda. Shunday qilib har bir tilni yaxshi farqlashga yordam beradi. Yangi dasturchilar uchun foydali bo'lgan narsa.

Sizning veb-yordamingiz, biz haqiqatan ham yaxshi bilmagan narsadan foydalanishni boshlashni xohlasangiz, buni yanada toqatli qiladi. Bu siz uchun yaxshiroq degani emas, bu bizning ehtiyojlarimizga bog'liq. Ha, "noma'lum" kelib chiqishi bo'lgan kompyuterga biror narsa o'rnatishni boshlashdan oldin atrof-muhitni yaxshiroq bilish.

Agar siz foydalanishga odatlanganlardan bo'lsangiz Jassim to'liq klaviatura ishlaganda, CodePen siz uchun ajoyib bo'ladi. Boshqa vositalar kerak plugins atrof-muhitni to'ldirish uchun klaviatura yorliqlaridan foydalanish imkoniyatiga ega bo'lish. Bu ishni biroz noqulayroq qiladi (garchi o'rnatilgandan keyin ham xuddi shunday samarali bo'lsa). CP. ro'yxat kabi takrorlanadigan bir xil kod satrlarini to'ldirishga majbur qiladigan tizimni standart sifatida birlashtiradi. Ro'yxat qanday ko'rinishini xohlaganingizni yozasiz va Tab tugmasini bosing.

Pro versiyasi, shuningdek, asosiy paket uchun 9,00 evrogacha bo'lgan narxga "Super" to'plam uchun 29,25 evrogacha bo'lgan ko'plab variantlarni taqdim etadi. Bir vaqtning o'zida bir nechta qurilmalarni yangilab turishimiz mumkin. Shuningdek, kooperativ rejim, "o'qituvchi rejimi" va boshqalar. Agar xohlasangiz, foyda oling.

JSBin

JSBin - biz to'g'ridan-to'g'ri tanlab olishimiz mumkin bo'lgan vosita. Uning veb-domeniga kirganingizdan so'ng, u kechiktirmasdan keyingi loyihangizni tuzishga tayyor bo'ladi. Va uning birinchi sahnasi unchalik jozibali bo'lmasa-da, u qulay.

JSBin sodda, html-da yaratilgan asosiy tuzilma, vaqtni sarf qilmaslik uchun, siz ishni bajarish uchun turli xil tillar orasiga kirasiz. Avval HTML, keyin CSS, Javascript va nihoyat sizning ishingiz ingl. Va bu qiyinroq tuyulsa-da, siz hech narsa o'rnatmasdan bir xil yorliqlarga ega bo'lasiz. To'g'ridan-to'g'ri brauzerdan.

Biroq, keyingi ustunlar tufayli yashiringanidan so'ng, kodni to'g'ri ko'rish noqulayroq edi. Chunki, noutbuk bilan, dan voz kechishingiz yoki pastga tushishingiz kerak Trackpad va bu juda suyuq emas.

Bepul yoki pulli atigi ikki qismdan iborat. Bu CodePen-dan biroz qimmatroq, garchi siz uni har yili to'lasangiz, foydaliroq, agar 120 evro to'lashingiz mumkin bo'lsa.

CSSDeck

CSSDeck
Ning ish muhiti CSSDeck yuqorida ko'rilganidan farq qiladi. Faqat ikkita ustunga bo'lingan vizual-kod CSSDeck 3 qator pastga ishlaydi va ular yordamida tilning har xil turlarini ajratadi. Ijtimoiy tarmoq ko'rinishidagi taqdimot va ochiq rangdagi toza ish muhiti bilan. Bu oddiy vosita kabi ko'rinadi. Garchi ba'zida bu salbiy degani emas.

Oltmish mingdan ortiq foydalanuvchi ro'yxatdan o'tgan va ikki yuz ellik mingdan ortiq loyihalar yaratilgan bo'lsa, qidirish va kerakli narsani topish qiyin bo'lmaydi. Til har doimgidek, agar bu ingliz tilini bilmaydiganlar uchun noqulaylik tug'dirsa, lekin bunda ijtimoiy tarmoq Tasvir juda muhim, shuning uchun bu juda katta muammo deb o'ylamayman.

Plunkr

Plunkr bu men hozirgacha duch kelgan eng jozibali vosita. Taqdimot xabarlar va rasmlarning etishmasligi bilan yopishtirilgan. Tarkibni yuklash sekin va bir qarashda unchalik foydali emas. Bundan tashqari, sana bo'yicha buyurtma har qanday jadvalni, qanchalik sodda bo'lishidan qat'iy nazar, birinchi pozitsiyada bo'lishi mumkin. Yana qiziqroq narsani ko'rish uchun yorliqqa o'ting: «eng ko'p ko'rilgan«. Agar siz ilgari uni Google bilan tarjima qilmagan bo'lsangiz.

Shuningdek, veb-saytga ko'ra, ular 1.0.0 versiyasida. Shunday qilib, bu dizayn, taqdimot va Internetda ko'rib chiqishda yuzaga kelishi mumkin bo'lgan xatolar haqida bir oz ma'lumot beradi.

Agar g'oyalaringiz tugagan bo'lsa, afzallik sifatida, Plunkr-da boshqa yorliqni qoldirishingiz yoki ochishingiz shart emas, chunki to'g'ridan-to'g'ri o'ng paneldan siz boshqa loyihalar bilan yurishingiz va ularni darhol ko'rishingiz mumkin. Bu sizga tezkor g'oyalarni to'plashni va ularni loyihangizga bir vaqtning o'zida qo'llashni osonlashtiradi.

Dabblet

Dabblet bu oddiy vosita, siz kirib yaratasiz. GitHub orqali ro'yxatdan o'tishingiz va foydalanuvchi ismingiz bo'lishi mumkin bo'lsa-da, bu Internetda juda ko'p ajralib turadigan narsa emas. Sariqdan qizil gradyangacha bo'lgan fonda, vizual qismda va kod qismidagi oq fonda (odatdagidek), Dabblet loyihasi taqdim etiladi, ammo uni CSS yorlig'idan o'zgartirishingiz mumkin. Men uchun uni bo'sh qoldirganingiz ma'qul, chunki bu berayotgan narsa ozgina hayot a

Tahrirlash paytida siz ko'rgan yorliqlarni sozlashingiz mumkin osonlik bilan. Hatto tahrir qilayotgan kishiga qarab qulay ko'rish uchun ustunlar yoki qatorlarga o'tishni xohlasangiz ham. Shrift hajmini o'zgartirish, HTML kodini ro'yxatdan o'tkazmasdan yoki tasdiqlamasdan noma'lum sifatida saqlash, Dabbletning birinchi qarashda taqdim etadigan ko'proq imkoniyatlari. Garchi bu men tanlagan birinchi variant bo'lmasa-da, ular yangilangan bo'lsa, kelajakdagi versiyalarda hisobga olinishi mumkin.

Menga eng kam yoqqan, ammo ajoyib dasturchilarga yoqishi mumkin bo'lgan narsalardan biri shu yorliqni jadvalga qo'shish va uni o'zi yozish imkoniyati yo'q. Ya'ni, HTML-ni qo'ying va yorliqni bosing va avtomatik ravishda "html" va "/ html" yozing. Agar bajarilsa, boshqa dasturlarda mavjud bo'lgan narsa.

LiveWeave

jonli efir
LiveWeave Bu boshqalarga juda o'xshaydi, uning foydasi jihatidan boshqalar taklif qila olmaydigan hech narsa yo'q. Ushbu loyihada ta'kidlaganimiz - bu uning dizayni, CodePen-ga o'xshash quyuq rang, lekin kvadrat taqsimot bilan. Hajmini o'zgartira olish tatib ko'rmoq. Shuningdek, aniq rejim va «oflayn« bu erda siz tahrir qiladigan kod uni faollashtirmaguningizcha ingl. Sizga juda foydali bo'lgan xususiyat emas, chunki dizayner sifatida har doim tahrir qilgan narsangizni real vaqtda ko'rish muhim, ammo kimdir sizga aniq biron bir foydalanishni topadi. Va har doimgidek, siz ro'yxatdan o'tishingiz mumkin, ammo foydalanuvchi etakchi rolga ega emas. Chunki ro'yxatdan o'tmagan bo'lsangiz ham, o'zingizning loyihangizni saqlashingiz mumkin.

ulug'vor Matn

Ushbu vosita bu hozirgacha tahlilda ko'rganingizdan butunlay farq qiladi. Sublime Text veb-resurs sifatida emas, balki dastur sifatida. Bir tomondan, uni ish stolida bo'lish foydaliroq. Ayniqsa, haddan tashqari ko'p miqdordagi ishning yo'qolishi yoki mumkin bo'lgan ish yo'qotilishi sababli Internetning qulashi yoki muzlashi tufayli. Boshqa tomondan, bu avvalgilar kabi ingl. Bundan tashqari, jamoaning loyihalarni baham ko'rish imkoniyati yo'q.

Bu erda hamma narsa noldan. Kod satrlarini joylashtirish uchun yorliqlar yaratishingiz va ularning qaysi biri ekanligini bilish uchun ularning nomini o'zgartirishingiz kerak. Agar birinchisi HTML bo'lsa, ikkinchisi CSS ... yoki aksincha. Bundan tashqari, uning nima bo'lishiga oid yorliqlari yo'q tirnoqlardan tashqari to'liq qo'lda.

Xulosa

Barcha dasturlar har bir kompaniyaning shaxsiy shaxsiy ta'siriga o'xshashdir, bu ulardagi ijobiy va salbiy tomonlarni keltirib chiqaradi. Har biri o'ziga mos keladiganini tanlaydi, mening tavsiyam atrof-muhit va u boshqaradigan ijtimoiy tarmoq uchun CodePen yoki CSSDeck-dan foydalanish. Ammo, agar siz boshqasini yoqtirgan bo'lsangiz, sharh qoldiring va sabablaringizni tushuntiring, ular albatta foydali bo'ladi.


Maqolaning mazmuni bizning printsiplarimizga rioya qiladi muharrirlik etikasi. Xato haqida xabar berish uchun bosing bu erda.

Birinchi bo'lib izohlang

Fikringizni qoldiring

Sizning email manzilingiz chop qilinmaydi. Kerakli joylar bilan belgilangan *

*

*

  1. Ma'lumotlar uchun javobgardir: Migel Anxel Gaton
  2. Ma'lumotlarning maqsadi: SPAMni boshqarish, izohlarni boshqarish.
  3. Qonuniylashtirish: Sizning roziligingiz
  4. Ma'lumotlar haqida ma'lumot: qonuniy majburiyatlar bundan mustasno, ma'lumotlar uchinchi shaxslarga etkazilmaydi.
  5. Ma'lumotlarni saqlash: Occentus Networks (EU) tomonidan joylashtirilgan ma'lumotlar bazasi
  6. Huquqlar: istalgan vaqtda siz ma'lumotlaringizni cheklashingiz, tiklashingiz va o'chirishingiz mumkin.