ທ່ານເຄີຍປາດຖະຫນາວ່າມີແອັບຯເວັບຫຼືສ່ວນຂະຫຍາຍທີ່ຊ່ວຍໃຫ້ທ່ານສ້າງແລະແບ່ງປັນຕົວແບບ UI ໃນທັນທີບໍ?
ພວກເຮົາທຸກຄົນເຮັດ! ພວກເຮົາທຸກຄົນມີຄວາມຄິດຂອງວິທີການທີ່ພວກເຮົາຕ້ອງການເວັບໄຊຫຼືກິດຂອງພວກເຮົາເບິ່ງແລະຄວາມຮູ້ສຶກ.
ດັ່ງນັ້ນ, ທ່ານໄດ້ມາກັບການອອກແບບທີ່ຍິ່ງໃຫຍ່ແທ້ໆແລະບໍ່ສາມາດຈື່ໄດ້ແນ່ນອນວ່າທ່ານເຮັດແນວໃດມັນ?
ຕອນນີ້ເຈົ້າຕ້ອງຊອກຫາວິທີທີ່ຈະແບ່ງປັນມັນ. ອັນນີ້ອາດໃຊ້ເວລາຫຼາຍມື້, ເປັນອາທິດ, ຖ້າເຈົ້າພະຍາຍາມແບ່ງປັນການອອກແບບທີ່ຊັບຊ້ອນ.
ບໍ່ມີເຫດຜົນທີ່ຈະລໍຖ້າເພື່ອເຮັດໃຫ້ແອັບຯເວັບຂອງທ່ານເປັນຕົວແບບ. ສ້າງພວກມັນດຽວນີ້ດ້ວຍ Dabblet.
ລາກແລະວາງອົງປະກອບ, ຮູບແບບ, ແລະບັນທຶກມັນ. ສົ່ງໃຫ້ຜູ້ອອກແບບເພື່ອທົບທວນ ຫຼືພຽງແຕ່ຄັດລອກມັນເຂົ້າໃນການນຳສະເໜີ. ຄວາມເປັນໄປໄດ້ແມ່ນບໍ່ມີທີ່ສິ້ນສຸດ.
Dabblet ແມ່ນຫຍັງ?
ການນໍາໃຊ້ dabblet, ທ່ານອາດຈະທົດລອງກັບ CSS ແລະລະຫັດ HTML ເລັກນ້ອຍໃນເວລາຈິງ.
ທ່ານຈະບໍ່ຕ້ອງການຄໍານໍາຫນ້າໃດໆໃນລະຫັດ CSS ຂອງທ່ານໃນເວລານໍາໃຊ້ນີ້. GitHub gists ອະນຸຍາດໃຫ້ທ່ານເກັບຮັກສາເນື້ອຫາຂອງທ່ານ, ປະກາດມັນຢູ່ໃນເວັບໄຊທ໌ອື່ນໆ, ແລະແບ່ງປັນມັນກັບຜູ້ອື່ນ.
ນີ້ແມ່ນວິທີທີ່ດີທີ່ຈະແບ່ງປັນຕົວຢ່າງລະຫັດກັບຜູ້ພັດທະນາອື່ນໆ ແລະຮັບຄໍາຄິດເຫັນ.
ມັນເຮັດວຽກແນວໃດ?
ທັນທີທີ່ລະຫັດຖືກພິມ, ຜົນໄດ້ຮັບທາງສາຍຕາຈະເຫັນໄດ້ທັນທີຢູ່ເທິງສຸດຂອງມັນ. JavaScript ແມ່ນການຍົກເວັ້ນຢ່າງດຽວ, ພິຈາລະນາວ່າມັນຈະເປັນການລະຄາຍເຄືອງທີ່ຈະແລ່ນມັນຢູ່ໃນທຸກໆການກົດແປ້ນພິມແລະອາດຈະເຮັດໃຫ້ຕົວທ່ອງເວັບບໍ່ສາມາດໃຊ້ໄດ້ໃນບາງສະຖານະການ.
ການນໍາໃຊ້ທາງເລືອກ "Run JS" ໃນແຖບ JavaScript ຫຼືທາງລັດແປ້ນພິມ (Ctrl + Enter ຫຼື Cmd + Enter) ຈະແລ່ນ JavaScript ເມື່ອ Dabblet ແລ່ນ. ເມນູຕົວເລືອກອະນຸຍາດໃຫ້ທ່ານສາມາດປ່ຽນຮູບແບບນີ້.
ໃນຖານະນັກພັດທະນາ, ທ່ານອາດຈະປ່ຽນລະຫວ່າງການເຂົ້າລະຫັດໃນທັງສາມພາສາເຫຼົ່ານີ້ພ້ອມໆກັນຫຼືເບິ່ງຜະລິດຕະພັນສໍາເລັດຮູບ.
ຄຸນລັກສະນະ
ຕໍ່ໄປນີ້ແມ່ນລັກສະນະຂອງ Dabblet ທີ່ທ່ານຄວນຮູ້ກ່ຽວກັບ:
ການແກ້ໄຂ CSS ດ່ວນ: ທ່ານສາມາດເພີ່ມ, ແກ້ໄຂ ແລະລຶບຄຸນສົມບັດ CSS ໄດ້ຢ່າງວ່ອງໄວ. ການປ່ຽນແປງຈະສະແດງຢູ່ໃນຫນ້າໃນເວລາຈິງ.
ການເນັ້ນໄວຍະກອນ: CSS ແລະ HTML code ແມ່ນ syntax ເນັ້ນ, ເຮັດໃຫ້ມັນງ່າຍຕໍ່ການອ່ານແລະເຂົ້າໃຈ. ລະຫັດຈະຖືກກວດສອບເມື່ອທ່ານພິມ. ທ່ານຍັງສາມາດເລືອກທີ່ຈະເຊື່ອງກ່ອງລະຫັດຖ້າທ່ານຕ້ອງການ.
ຕື່ມຂໍ້ມູນອັດຕະໂນມັດ: Dabblet ສະຫນອງການຕື່ມຂໍ້ມູນອັດຕະໂນມັດສໍາລັບຄຸນສົມບັດ CSS ແລະຄ່າ. ນີ້ສາມາດເປັນປະໂຫຍດຫຼາຍເມື່ອທ່ານສ້າງ ຫຼືແກ້ໄຂສະໄຕລ໌ຊີດ.
CSS Stylesheets ທີ່ສ້າງຂຶ້ນກ່ອນ: ທ່ານສາມາດເຂົ້າເຖິງ stylesheets CSS ທີ່ສ້າງໄວ້ກ່ອນຈາກເວັບໄຊທ໌ທີ່ນິຍົມ. ເຫຼົ່ານີ້ສາມາດນໍາໃຊ້ໄດ້ໄວແລະງ່າຍດາຍເພີ່ມຄໍເຕົ້າໄຂ່ທີ່ເວັບໄຊທ໌ຂອງທ່ານເອງ.
ສະຫນັບສະຫນູນ Gist: Dabblet ສະຫນັບສະຫນູນ GitHub Gists, ຊ່ວຍໃຫ້ທ່ານສາມາດເກັບຮັກສາແລະແບ່ງປັນລະຫັດຂອງທ່ານກັບຜູ້ອື່ນໄດ້ຢ່າງງ່າຍດາຍ.
ເບິ່ງຕົວຢ່າງສົດ: ທ່ານສາມາດເບິ່ງຜົນຂອງການປ່ຽນແປງລະຫັດຂອງທ່ານໃນເວລາທີ່ແທ້ຈິງໂດຍບໍ່ມີການໂຫຼດຫນ້າໃຫມ່. ຕົວຢ່າງ, ຖ້າທ່ານປ່ຽນສີຂອງຂໍ້ຄວາມ, ທ່ານຈະເຫັນການປ່ຽນແປງທີ່ສະທ້ອນຢູ່ໃນຂໍ້ຄວາມໃນຂະນະທີ່ທ່ານພິມ.
ຄີບອດ: Dabblet ມີປຸ່ມລັດແປ້ນພິມສໍາລັບວຽກງານທົ່ວໄປ, ເຊັ່ນ: ການເພີ່ມກົດລະບຽບຮູບແບບໃຫມ່ຫຼືການສະແດງຄວາມຄິດເຫັນ.
ໂໝດເບິ່ງຫຼາຍຮູບແບບ: Dabblet ສະເຫນີຮູບແບບການເບິ່ງຫຼາຍຮູບແບບ, ເຊິ່ງຊ່ວຍໃຫ້ທ່ານເຫັນລະຫັດແລະຜົນໄດ້ຮັບຂ້າງຄຽງຫຼືຂ້າງເທິງແລະຂ້າງລຸ່ມນີ້ເຊິ່ງກັນແລະກັນ.
pros
- CSS ດ່ວນ
- ເຖິງແມ່ນວ່າທ່ານຈະເຂົ້າສູ່ລະບົບແລ້ວ, ທ່ານອາດຈະຍັງບັນທຶກແບບບໍ່ເປີດເຜີຍຕົວຕົນຢູ່.
- ຕົວສະແດງຕົວຢ່າງມູນຄ່າ CSS ໃນແຖວສໍາລັບພາລາມິເຕີຕ່າງໆເຊັ່ນ: ມຸມ, ສີ, ໄລຍະເວລາ, ແລະອື່ນໆ.
- ທຸກສິ່ງທຸກຢ່າງແມ່ນ XHR-ed, ດັ່ງນັ້ນຫນ້າເວັບບໍ່ເຄີຍໂຫຼດຫນ້າຈໍຄືນ, ເຖິງແມ່ນວ່າທ່ານຈະບັນທຶກ.
- ຄີລັດມີຫຼາກຫຼາຍ.
- ລະຫັດທັງຫມົດແມ່ນການຈັດຮູບແບບອັດຕະໂນມັດ (ຍົກເວັ້ນສໍາລັບການ markdown).
- ເອກະສານແຂງຈາກບ່ອນຈອດລົດ.
cons
- ການໂຕ້ຕອບແມ່ນເລັກນ້ອຍ overwhelming ໃນຕອນທໍາອິດ, ແຕ່ວ່າທ່ານໄດ້ຮັບການນໍາໃຊ້ກັບມັນ.
- ບໍ່ມີຄຸນສົມບັດການຈັດການລະດັບໂຄງການ (ເທື່ອ).
ການປະສົມປະສານ Dabblet
ເວທີໃດກໍ່ຕາມຕ້ອງປະສົມປະສານກັບການບໍລິການອື່ນໆ, ແລະ Dabblet ບໍ່ມີຂໍ້ຍົກເວັ້ນ. ຕໍ່ໄປນີ້ແມ່ນບາງສ່ວນຂອງການເຊື່ອມໂຍງທີ່ Dabblet ສະເຫນີ:
ກູໂກວິເຄາະ
ທ່ານສາມາດເພີ່ມລະຫັດຕິດຕາມ Google Analytics ຂອງທ່ານໃສ່ຫນ້າ Dabblet ໄດ້ຢ່າງງ່າຍດາຍ. ນີ້ຈະຊ່ວຍໃຫ້ທ່ານສາມາດຕິດຕາມການເບິ່ງຫນ້າແລະສະຖິຕິອື່ນໆສໍາລັບ Dabblet ຂອງທ່ານ.
Ubuntu
Dabblet ສາມາດຖືກນໍາໃຊ້ເພື່ອສ້າງຫົວຂໍ້ Ubuntu. ທ່ານສາມາດສ້າງ Dabblet ໃຫມ່, ເພີ່ມ CSS ແລະລະຫັດ HTML, ແລະເບິ່ງຕົວຢ່າງຫົວຂໍ້ໃນຕົວທ່ອງເວັບ.
ມະຫາສະຸດດິຈິຕອລ
ບໍລິສັດ cloud hosting ທີ່ເປັນອັນໜຶ່ງອັນດຽວໃຫ້ບໍລິການຄອມພິວເຕີຄລາວແກ່ທຸລະກິດ, ໃຫ້ເຂົາເຈົ້າສາມາດຂະຫຍາຍການດໍາເນີນງານຂອງເຂົາເຈົ້າໄດ້ມີປະສິດທິພາບຫຼາຍຂຶ້ນ.
Dabblet ເຮັດຫຍັງກັບມັນ?
ດຽວນີ້ເຈົ້າສາມາດສ້າງ, ຈັດການ ແລະນຳໃຊ້ Dabblets ຂອງເຈົ້າໄດ້ແລ້ວ DigitalOcean Spaces.
ອັນນີ້ອະນຸຍາດໃຫ້ທ່ານເກັບຂໍ້ມູນຫຍໍ້ຂອງລະຫັດທັງໝົດໄວ້ບ່ອນດຽວ ແລະເຮັດໃຫ້ມັນງ່າຍຕໍ່ການແບ່ງປັນໃຫ້ເຂົາເຈົ້າກັບຜູ້ອື່ນ.
ທາງເລືອກສໍາລັບ Dabblets
ທາງເລືອກແມ່ນມີຢູ່ສະເໝີ, ແລະໃນເສັ້ນດຽວກັນ, ນີ້ແມ່ນບາງອັນສຳລັບຄົນທີ່ຈະໄຕ່ຕອງເມື່ອມັນມາກັບ Dabblet:
Pastebin.com
ຜູ້ຂຽນໂປລແກລມໂດຍທົ່ວໄປໃຊ້ເວັບໄຊທ໌ເພື່ອບັນທຶກລະຫັດແຫຼ່ງຫຼືຊິ້ນສ່ວນຂໍ້ມູນການຕັ້ງຄ່າ. ຢ່າງໃດກໍຕາມ, ທຸກຄົນອາດຈະໃສ່ຂໍ້ຄວາມໃດໆເຂົ້າໄປໃນຊ່ອງທີ່ສະຫນອງໃຫ້.
JS Bin
JS Bin ເປັນເຄື່ອງມືທົດສອບຟຣີສໍາລັບ JavaScript. ຜົນໄດ້ຮັບອາດຈະຖືກແບ່ງປັນຜ່ານ URL ສັ້ນເມື່ອ Javascript ໄດ້ຖືກປ້ອນເຂົ້າໄປໃນແຖບຫນຶ່ງແລະ HTML ໃນອີກອັນຫນຶ່ງ. ໃຊ້ເມນູທີ່ຊ່ວຍໃຫ້ທ່ານເລືອກຈາກບາງຫ້ອງສະຫມຸດ JS ທີ່ໃຊ້ທົ່ວໄປທີ່ສຸດ.
cssDeck
ເຄື່ອງມືນີ້ແມ່ນດີເລີດສໍາລັບການສ້າງແລະແລກປ່ຽນກໍລະນີການທົດສອບກັບຜູ້ອື່ນທີ່ສາມາດຊ່ວຍທ່ານໃນຄວາມພະຍາຍາມລະຫັດຂອງທ່ານ. ດ້ວຍທາງເລືອກຕ່າງໆ, ທ່ານອາດຈະຮ່ວມມືໃນໂຄງການທັນທີກັບນັກຂຽນໂປລແກລມອື່ນ.
Plunker
Plunker ເປັນແພລະຕະຟອມດິຈິຕອນທີ່ຜູ້ພັດທະນາເວັບສາມາດລະດົມຄວາມຄິດ, ຮ່ວມມື, ແລະແບ່ງປັນຄວາມຄິດຂອງເຂົາເຈົ້າ.
ຕົວຢ່າງ, ທ່ານສາມາດເລີ່ມຕົ້ນດ້ວຍ "ສະບາຍດີ, ໂລກ!" ໂປຣແກມໃນພາສາໃດກໍໄດ້ ແລະເພີ່ມຂໍ້ມູນຫຍໍ້ຂອງລະຫັດ, markdowns, ແລະ screenshots ເພື່ອສ້າງປະສົບການການຮຽນຮູ້ທີ່ອຸດົມສົມບູນ.
ຄໍາສຸດທ້າຍ
ສະຫຼຸບແລ້ວ, Dabblet ເປັນເຄື່ອງມືທີ່ເປັນປະໂຫຍດສໍາລັບຜູ້ພັດທະນາເວັບ, ໂດຍສະເພາະແມ່ນຜູ້ທີ່ຊອກຫາວິທີທີ່ຈະໄວແລະງ່າຍດາຍ ທົດສອບລະຫັດຂອງພວກເຂົາ.
ດ້ວຍລັກສະນະຕ່າງໆແລະການເຊື່ອມໂຍງຂອງມັນ, ມັນຍາກທີ່ຈະຊອກຫາການນໍາໃຊ້ສໍາລັບເວທີນີ້.
ໃຫ້ມັນລອງມື້ນີ້!
ອອກຈາກ Reply ເປັນ