ເນື້ອຫາ
- ເຮັດວຽກກັບຮູບພາບ
- 01. ຈັດການພາບ
- 02. ຮູບພາບການປຸງແຕ່ງ
- 03. ສ້າງແຜ່ນພັບ
- ວັນທີ, ສາຍ, ສີ
- 04. ວັນທີຮູບແບບ
- 05. ຢັ້ງຢືນສາຍເຊືອກ
- 06. ເຮັດວຽກກັບຄຸນຄ່າສີ
- ເຮັດວຽກກັບຮູບແບບຕ່າງໆ
- 07. ສ້າງເອກະສານ PDF
- 08. ປະມວນຜົນເອກະສານ HTML
- 09. ປະມວນຜົນເອກະສານ CSV
- 10. ຂະບວນການເຮັດເອກະສານ ໝາຍ ເຖິງ
ໃນຊຸມປີມໍ່ໆມານີ້ Node.js ໄດ້ຮັບຄວາມນິຍົມຫຼາຍຂື້ນ. ປະຈຸບັນມັນຖືກ ນຳ ໃຊ້ເລື້ອຍໆ ສຳ ລັບການພັດທະນາດ້ານ server ຂອງໂປແກມ ນຳ ໃຊ້ເວັບໄຊທ໌, ຫຼືໂດຍທົ່ວໄປໃນໄລຍະການພັດທະນາ. ໃນເວລາຂຽນ, ໜ້າ ທຳ ອິດຂອງ npm - ຜູ້ຈັດການຊຸດ ສຳ ລັບ Node.js - ລົງລາຍຊື່ຫລາຍກວ່າ ໜຶ່ງ ສ່ວນສີ່ຂອງ ຈຳ ນວນໂມດູນ.
- 15 ເຄື່ອງມືທີ່ນັກອອກແບບເວັບທຸກຄົນຕ້ອງການໃນປີ 2017
ຂ້າພະເຈົ້າໄດ້ລວມເອົາບັນຊີລາຍຊື່ທີ່ຂ້ອຍເຫັນວ່າມີປະໂຫຍດໃນການເຮັດວຽກປະ ຈຳ ວັນຂອງຂ້ອຍເປັນຜູ້ພັດທະນາເວບໄຊທ໌ແລະຊອບແວ, ຕັ້ງແຕ່ການ ໝູນ ໃຊ້ຮູບພາບ, ການກວດສອບຄວາມຖືກຕ້ອງຂອງສາຍແລະການຜະລິດແບບ PDF ຈົນເຖິງການແກ້ໄຂ ໜ້ອຍ, ການຕັດໄມ້ແລະການສ້າງໂປແກຼມສາຍ ຄຳ ສັ່ງ.
ເຮັດວຽກກັບຮູບພາບ
01. ຈັດການພາບ
GraphicsMagick ແລະ ImageMagick ແມ່ນສອງເຄື່ອງມືທີ່ມີຄວາມນິຍົມໃນການສ້າງ, ການດັດແກ້, ການຂຽນແລະການປ່ຽນຮູບພາບ. ຂໍຂອບໃຈກັບໂມດູນ Node.js gm ທີ່ທ່ານສາມາດໃຊ້ທັງສອງເຄື່ອງມືໂດຍກົງຈາກພາຍໃນລະຫັດ JavaScript ຂອງທ່ານ. ໂມດູນສະ ໜັບ ສະ ໜູນ ການ ດຳ ເນີນງານຂອງຮູບພາບປົກກະຕິທັງ ໝົດ - ການປັບຂະ ໜາດ, ການປິດແລະການເຂົ້າລະຫັດເພື່ອຕັ້ງຊື່ໃຫ້ພຽງສອງສາມຄົນ.
const gm = ຕ້ອງການ ('gm'); gm ('/ path / to / image.webp') .resize (500, 250) .autoOrient () .write (ຄຳ ຕອບ, ຂໍ້ຜິດພາດ => {});
02. ຮູບພາບການປຸງແຕ່ງ
Sharp ແມ່ນອີງໃສ່ຫໍສະ ໝຸດ ປະມວນຜົນພາບທີ່ໄວທີ່ສຸດ, ແລະອ້າງວ່າໄວກ່ວາ 4 ຫາ 5 ເທົ່າຂອງ ImageMagick ຫຼື GraphicsMagick ເມື່ອເວົ້າເຖິງການບີບອັດແລະປັບຂະ ໜາດ ຮູບພາບ. ມັນສະຫນັບສະຫນູນຮູບພາບ JPEG, PNG, WebP, TIFF, GIF ແລະ SVG, ແລະຂໍ້ມູນຜົນໄດ້ຮັບເຂົ້າໄປໃນທັງ JPEG, PNG, WebP ຫຼືກະແສ pixel ທີ່ບໍ່ຖືກບີບອັດ.
03. ສ້າງແຜ່ນພັບ
ແຜ່ນ Sprite ແມ່ນເອກະສານ bitmap ທີ່ປະກອບດ້ວຍຮູບພາບຂະ ໜາດ ນ້ອຍທີ່ແຕກຕ່າງກັນຫຼາຍ (ເຊັ່ນ: ໄອຄອນ), ແລະພວກມັນມັກຈະຖືກໃຊ້ເພື່ອຫຼຸດຜ່ອນສ່ວນເກີນຂອງການດາວໂຫລດຮູບພາບແລະເລັ່ງການໂຫຼດ ໜ້າ ລວມ. ການຜະລິດແຜ່ນ Sprite ດ້ວຍຕົນເອງແມ່ນມີຄວາມຫຍຸ້ງຍາກຫຼາຍ, ແຕ່ວ່າດ້ວຍ spritesmith ທ່ານສາມາດອັດຕະໂນມັດຂະບວນການນີ້. ໂມດູນນີ້ໃຊ້ເວລາໂຟນເດີເປັນວັດສະດຸປ້ອນແລະປະສົມຮູບພາບທັງ ໝົດ ໃນນັ້ນເຂົ້າໃນເອກະສານສະເປັກ. ມັນຍັງສ້າງເອກະສານ JSON ເຊິ່ງປະກອບມີຈຸດປະສານງານທັງ ໝົດ ສຳ ລັບແຕ່ລະຮູບໃນຮູບພາບຜົນທີ່ທ່ານສາມາດຄັດລອກໂດຍກົງໃສ່ລະຫັດ CSS ຂອງທ່ານ.
ວັນທີ, ສາຍ, ສີ
04. ວັນທີຮູບແບບ
ມາດຕະຖານ JavaScript API ມາພ້ອມກັບວັດຖຸ Date ສຳ ລັບເຮັດວຽກກັບວັນແລະເວລາ. ເຖິງຢ່າງໃດກໍ່ຕາມ, ວັດຖຸນີ້ແມ່ນບໍ່ເປັນມິດກັບຜູ້ຄົນຫຼາຍເມື່ອເວົ້າເຖິງວັນທີການພິມແລະການຈັດຮູບແບບ. ໃນທາງກົງກັນຂ້າມ, Moment.js ສະ ໜອງ API ທີ່ສະອາດແລະມີນໍ້າ, ແລະລະຫັດທີ່ໄດ້ຮັບແມ່ນສາມາດອ່ານໄດ້ງ່າຍແລະເຂົ້າໃຈງ່າຍ.
ປັດຈຸບັນ () .add (7, 'ມື້') .subtract (1, 'months') .year (2009) .hours (0) .minutes (0) .seconds (0);
ນອກຈາກນັ້ນ, ຍັງມີໂປແກຼມຕື່ມທີ່ມີໄວ້ ສຳ ລັບການແຍກແລະການ ກຳ ນົດວັນທີໃນເຂດເວລາຕ່າງໆ.
05. ຢັ້ງຢືນສາຍເຊືອກ
ເມື່ອສະ ໜອງ ແບບຟອມຕ່າງໆໃນ ໜ້າ ເວບໄຊທ໌, ທ່ານຄວນຢັ້ງຢືນຄຸນຄ່າທີ່ຜູ້ ນຳ ໃຊ້ເຂົ້າມາສະ ເໝີ - ບໍ່ພຽງແຕ່ຢູ່ໃນ ໜ້າ ລູກຄ້າເທົ່ານັ້ນ, ແຕ່ຍັງຢູ່ໃນ ໜ້າ server ອີກເພື່ອປ້ອງກັນຂໍ້ມູນທີ່ເປັນອັນຕະລາຍ. ໂມດູນທີ່ສາມາດຊ່ວຍທ່ານໄດ້ທີ່ນີ້ແມ່ນ validator.js. ມັນສະຫນອງຫຼາຍວິທີການສໍາລັບການຊ່ອຍແນ່, ຈາກ isEmail () ແລະ isURL () ເຖິງ isMobilePhone () ຫຼື isCreditCard (), ບວກກັບທ່ານສາມາດໃຊ້ມັນຢູ່ໃນເຊີບເວີ - ແລະດ້ານລູກຄ້າ.
06. ເຮັດວຽກກັບຄຸນຄ່າສີ
ການປ່ຽນຄຸນຄ່າສີຈາກຮູບແບບ ໜຶ່ງ ໄປເປັນອີກ ໜຶ່ງ ວຽກງານ ໜຶ່ງ ທີ່ນັກພັດທະນາ frontend ຕ້ອງເຮັດຄັ້ງດຽວໃນຂະນະດຽວກັນ. TinyColor2 ເບິ່ງແຍງໂປແກຼມນີ້ຢ່າງເປັນລະບົບ, ແລະມັນສາມາດໃຊ້ໄດ້ ສຳ ລັບ Node.js ເຊັ່ນດຽວກັນ ສຳ ລັບ browser. ມັນສະ ໜອງ ຊຸດວິທີການປ່ຽນໃຈເຫລື້ອມໃສ (ເຊັ່ນ: toHexString (), toRGBString ()), ພ້ອມທັງວິທີການ ສຳ ລັບການ ດຳ ເນີນງານສີທຸກປະເພດ (ເຊັ່ນ: ເບົາບາງລົງ (), saturate (), ປະກອບ ()).
ເຮັດວຽກກັບຮູບແບບຕ່າງໆ
07. ສ້າງເອກະສານ PDF
ທ່ານຕ້ອງການສ້າງເອກະສານ PDF ແບບເຄື່ອນໄຫວບໍ? ຈາກນັ້ນ PDFKit ແມ່ນໂມດູນທີ່ທ່ານ ກຳ ລັງຊອກຫາ. ມັນສະ ໜັບ ສະ ໜູນ ການຝັງປະເພດຕົວອັກສອນ, ການຝັງຮູບແລະ ຄຳ ນິຍາມຂອງຮູບພາບ vector, ບໍ່ວ່າຈະເປັນໂປແກຼມ (ໃຊ້ໂປແກຼມຄ້າຍຄື Canvas API) ຫຼືໂດຍ ກຳ ນົດເສັ້ນທາງຂອງ SVG. ຍິ່ງໄປກວ່ານັ້ນ, ທ່ານສາມາດກໍານົດການເຊື່ອມໂຍງ, ລວມທັງບັນທຶກ, ຂໍ້ຄວາມທີ່ໂດດເດັ່ນແລະອື່ນໆ. ວິທີທີ່ດີທີ່ສຸດທີ່ຈະເລີ່ມຕົ້ນແມ່ນການສາທິດການທ່ອງເວັບແບບໂຕ້ຕອບ, ເຊິ່ງມີຢູ່ທີ່ນີ້.
08. ປະມວນຜົນເອກະສານ HTML
ເຄີຍຕ້ອງການທີ່ຈະປຸງແຕ່ງລະຫັດ HTML ຢູ່ດ້ານ server ແລະພາດວິທີການ ນຳ ໃຊ້ jQuery? ແລ້ວCheerioແມ່ນ ຄຳ ຕອບ. ເຖິງແມ່ນວ່າມັນປະຕິບັດພຽງແຕ່ສ່ວນຍ່ອຍຂອງຫໍສະຫມຸດ jQuery ຫຼັກ, ມັນເຮັດໃຫ້ການປຸງແຕ່ງ HTML ຢູ່ດ້ານ server. ມັນຖືກສ້າງຂື້ນຢູ່ເທິງສຸດຂອງໂມດູນ htmlparser2, ເຄື່ອງເຈາະ HTML, XML ແລະ RSS. ຍິ່ງໄປກວ່ານັ້ນ, ອີງຕາມເກນມາດຕະຖານ, ມັນໄວກວ່າ jsdom ແປດຄັ້ງ, ອີກໂມດູນ ສຳ ລັບເຮັດວຽກກັບ DOM ຢູ່ເບື້ອງເຊີບເວີ.
09. ປະມວນຜົນເອກະສານ CSV
ຮູບແບບ CSV (ຄຸນຄ່າທີ່ແຍກດ້ວຍເຄື່ອງ ໝາຍ ຈຸດ) ແມ່ນໃຊ້ເລື້ອຍໆໃນເວລາທີ່ແລກປ່ຽນຂໍ້ມູນກັບຕາຕະລາງ. ຕົວຢ່າງ, Microsoft Excel ຊ່ວຍໃຫ້ທ່ານສາມາດສົ່ງອອກຫລື ນຳ ເຂົ້າຂໍ້ມູນຂອງທ່ານໃນຮູບແບບນັ້ນ. node-cvg ເຮັດໃຫ້ຂັ້ນຕອນການເຮັດວຽກກັບຂໍ້ມູນ CSV ໃນ JavaScript ງ່າຍຂື້ນ, ແລະສະ ໜອງ ການເຮັດວຽກ ສຳ ລັບການຜະລິດ, ການແຍກ, ການປ່ຽນແລະການ ກຳ ນົດຄວາມໄວຂອງ CSV. ມັນມາພ້ອມກັບໂປແກຼມ callback API, stream API ແລະ synchronous API, ດັ່ງນັ້ນທ່ານສາມາດເລືອກແບບທີ່ທ່ານຕ້ອງການ.
10. ຂະບວນການເຮັດເອກະສານ ໝາຍ ເຖິງ
Markdown ແມ່ນຮູບແບບທີ່ໄດ້ຮັບຄວາມນິຍົມເມື່ອສ້າງເນື້ອຫາ ສຳ ລັບເວັບ. ຖ້າທ່ານຕ້ອງການ ດຳ ເນີນງານເນື້ອຫາ markdown ເປັນໂປແກຼມຢ່າງເປັນລະບົບ (ເຊັ່ນ: ຂຽນບັນນາທິການເຄື່ອງ ໝາຍ ຂອງຕົວທ່ານເອງ), ເຄື່ອງ ໝາຍ ແມ່ນຄຸ້ມຄ່າ. ມັນໃຊ້ເວລາລະຫັດຂອງລະຫັດ markdown ເປັນການປ້ອນຂໍ້ມູນແລະຜົນໄດ້ຮັບລະຫັດ HTML ທີ່ ເໝາະ ສົມ. ມັນຍັງເປັນໄປໄດ້ທີ່ຈະປັບແຕ່ງຜົນຜະລິດ HTML ນັ້ນຕື່ມອີກໂດຍໃຫ້ຜູ້ຕອບສະ ໜອງ ຕາມ ທຳ ນຽມ.
ໜ້າ ຕໍ່ໄປ: ສຳ ຫລວດ minifiers ທີ່ດີທີ່ສຸດແລະໂມດູນປະໂຫຍດ
