ทรัพยากรใหม่สำหรับนักออกแบบและพัฒนาเว็บ (สิงหาคม 2561)
ดูเหมือนว่าชุมชนการพัฒนาจะมีการใช้งานมากขึ้นเมื่อเร็ว ๆ นี้เนื่องจากมีเครื่องมือใหม่ ๆ ออกมามากมายในช่วงไม่กี่เดือนที่ผ่านมา ในชุดนี้ฉันจะเน้นเครื่องมือบางอย่างที่ควรค่าแก่การกล่าวถึง.
ในบรรดารายการเครื่องมือมี ไลบรารี JavaScript เพื่อสร้างข้อมูลจำลองซึ่งเป็นเครื่องมือในการแชร์ไฟล์ภายในเครือข่ายท้องถิ่น, และอีกหนึ่งที่จะช่วยให้คุณสามารถบันทึกเซสชันเทอร์มินัลลงในภาพเคลื่อนไหว SVG ฟังดูดีนะ? ตรวจสอบรายการทั้งหมดด้านล่าง.
Pushbar.js
มันเป็นห้องสมุด JavaScript สำหรับการสร้างลิ้นชักเลื่อน โดยทั่วไปแล้วลิ้นชักเลื่อนจะใช้เพื่อแสดงการนำทางเมนูเว็บไซต์ แต่คุณสามารถใช้ห้องสมุดนี้เพื่อแสดงสิ่งที่เหมาะสมสำหรับเว็บไซต์ของคุณ Pushbar.js คือ ปรับแต่งได้อย่างเต็มที่และการพึ่งพาฟรี jQuery ไม่จำเป็นต้องใช้.

Carbon Now CLI
Carbon CLI เป็นแพ็คเกจของ Node.js สร้างภาพหน้าจอของรหัส สวยงามผ่านอินเตอร์เฟสบรรทัดคำสั่ง เครื่องมือนี้ได้รับแรงบันดาลใจจาก carbon.now.sh ซึ่งคุณสามารถทำได้ผ่าน GUI ที่ดีบนเบราว์เซอร์.

Faker.js
ไลบรารี JavaScript ไปที่ สร้างข้อมูลจำลอง. รองรับการสร้างข้อมูลจำนวนมากเช่นชื่อที่อยู่ทางไปรษณีย์ชื่อ บริษัท หมายเลขโทรศัพท์วันที่และอื่น ๆ อีกมากมาย ข้อมูลทั้งหมดนี้มีประโยชน์มากสำหรับ ทดสอบแอปพลิเคชันเว็บของคุณ.

TermToSVG
TermToSVG เป็น เครื่องบันทึก terminal Linux ที่ทำให้เซสชันบรรทัดคำสั่งของคุณเป็นภาพเคลื่อนไหว SVG มันเป็นเครื่องมือที่มีประโยชน์สำหรับนักพัฒนาสำหรับการเขียนบทช่วยสอน.

ตัวจัดการการสำรองฐานข้อมูล
มันเป็นห้องสมุด PHP และเป็นชื่อที่แสดงถึงมันมีชุดของฟังก์ชั่น จัดการฐานข้อมูลสำรองและคืนค่า. ไลบรารีสนับสนุนบริการต่าง ๆ เพื่อส่งหรือดึงข้อมูลสำรองรวมถึง Dropbox, Amazon S3, FTP และ SFTP และ Rackloud Cloud.

ตอบสนอง Bits
คอลเล็กชั่นเทคนิคและเคล็ดลับ React.js ที่มีขนาดใหญ่โต React Bits ครอบคลุมรูปแบบการออกแบบทั่วไปสไตล์และเคล็ดลับประสิทธิภาพ นี่คือสิ่งที่แท้จริง ทรัพยากรที่ยอดเยี่ยมในการยกระดับทักษะ React.js ของคุณ.

ภาษา DSS
DSS หมายถึง StyleSheets ที่กำหนดได้ซึ่งเป็นเครื่องมือการเขียน CSS ใหม่ มันทำงานอย่างไรและมันสามารถนำไปใช้กับงานประจำวันได้อย่างไร ฉันไม่รู้จริง ๆ จนถึงตอนนี้ แต่มันดูเท่และมันใหม่อยู่ในรายชื่อ ขอบคุณ!

PurgeCSS
PurgeCSS เป็นแพ็คเกจ NPM ที่อนุญาต เพิ่มประสิทธิภาพการส่งออก CSS ในเว็บแอปพลิเคชันของคุณโดยลบสิ่งที่ไม่ได้ใช้งานออก เครื่องมือนี้มีการสนับสนุนเครื่องมือในตัวที่หลากหลายซึ่งรวมถึง Gulp, Grunt, Grunt, Webpack และ PostCSS ดังนั้นคุณจึงสามารถ รวมเข้ากับโครงการของคุณ ทันที.

RFS
RFS ย่อมาจาก Responsive Font Size และเป็นโครงการที่น่าสนใจที่จะจัดการกับหนึ่งในสิ่งที่ยากที่สุดในเว็บนั่นคือการพูดเพื่อ ทำให้ขนาดตัวอักษรตอบสนอง, ในลักษณะที่ขนาดจะเป็นไปตามขนาดวิวพอร์ตของอุปกรณ์ RFS มีให้ในรูปแบบ NPM

SimpleBar
ไลบรารี JavaScript เพื่อสร้างแถบเลื่อนแบบกำหนดเอง SimpleBar ช่วยให้คุณกำหนดสไตล์การเลื่อนได้ จับคู่สไตล์ไซต์ของคุณโดยใช้ CSS เหมือนกับองค์ประกอบ HTML อื่น ๆ บนเว็บไซต์ เนื่องจากข้อ จำกัด ของแพลตฟอร์มและเบราว์เซอร์การจัดแต่งแถบเลื่อนของเบราว์เซอร์ที่เคยซับซ้อน แต่ SimpleBar ทำให้มันง่ายมาก.

Larastan
Larastan เป็นเสื้อคลุมของ PHPStan สำหรับ Laravel. PHPStan เป็นเครื่องมือที่จะช่วยให้คุณตรวจสอบรหัสของคุณเพื่อหาข้อผิดพลาดที่อาจเกิดขึ้นโดยไม่จำเป็นต้องเขียนหน่วยทดสอบ มันตรวจสอบสิ่งต่าง ๆ มากมายรวมถึงการมีอยู่ของวิธีการที่เรียกว่าและฟังก์ชั่นประเภทที่กำหนดให้กับคุณสมบัติจำนวนและประเภทที่กำหนดให้กับตัวสร้างคลาสและตรวจสอบ phpDocs.

PWMetrics
PWMetrics เป็นเครื่องมือที่รวบรวมเมตริก Progressive Web Apps ผ่านอินเตอร์เฟสบรรทัดคำสั่งที่พัฒนาโดย Paul Irish เครื่องมือนี้ขับเคลื่อนโดย Lighthouse และมีให้ในรูปแบบแพ็คเกจ NPM มันมีตัวเลือกมากมายให้ กำหนดค่าการวัดประสิทธิภาพการทดสอบ, และความคาดหวังที่คุณต้องการจากการทดสอบ.

สันติภาพ
Pax เป็นตัวรวม JavaScript เพื่อ รวบรวมโมดูล JavaScript เป็นไฟล์ที่ใช้งานได้สำหรับเบราว์เซอร์. Pax สัญญาความเร็ว มันรวบรวมได้เร็วกว่าผู้รวมกลุ่มอื่น รองรับ ES6 อย่างสมบูรณ์ นำเข้า
และ ส่งออก
ไวยากรณ์และไวยากรณ์ CommonJS นำเข้า
. แตกต่าง สันติภาพ
ถูกเขียนด้วย Rust และมีให้ใช้งานผ่านรีจิสตรีแพ็คเกจเรียกว่า Cargo.

SustyWP
SustyWP คือ ชุดรูปแบบ WordPress มีวัตถุประสงค์เพื่อให้ดีขึ้น; เพื่อลดปริมาณการปล่อยก๊าซคาร์บอนไดออกไซด์โดยลดขนาดให้เล็กที่สุดเท่าที่จะเป็นไปได้ มันมีน้ำหนักเพียง 7-6kb เมื่อโหลดบนเบราว์เซอร์ มัน รวดเร็วและเบา, และในทางกลับกันมันใช้ทรัพยากรน้อยลง (เช่นกระแสไฟฟ้า) ในการโหลดเว็บไซต์ ลองใช้ชุดรูปแบบ backstory ในโพสต์นี้โดย Jack Lenox.

ห้องสมุด Doodle
การรวบรวมภาพวาดเส้นขยุกขยิก, Doodle Library มีภาพวาดมากมายในคอลเลกชันและพวกเขาถูกจัดกลุ่มเป็นหลายประเภทใบหน้าสถานที่สัตว์ ฯลฯ. ภาพวาดมีให้ในรูปแบบ SVG และเผยแพร่ภายใต้ Creative Common Attribution 4.0

Tilt.js
ปลั๊กอิน jQuery ถึง สร้างแฟนซี การเอียง ผล คล้ายกับภาพตัวอย่างขนาดย่อที่เราเห็นบน Apple TV มันไม่ต้องการ CSS เพิ่มเติม พวกเขายังให้ตัวอย่างของการใช้งานในหน้านี้เพื่อใช้มันค่อนข้างตรงไปตรงมา ทำให้แน่ใจว่าคุณ ตรวจสอบผลแสงจ้า; มันเจ๋งจริงๆ.

Fileroom
Fileroom เป็นเว็บแอปพลิเคชันสำหรับ การแชร์ไฟล์แบบเพียร์ทูเพียร์ในเครือข่ายเดียวกัน. คุณสามารถแชร์ไฟล์กับเพื่อนร่วมงานของคุณได้ง่ายๆเพียงแค่ลาก -n-drop โดยไม่คำนึงถึงระบบปฏิบัติการ มันทำงานได้ใน Windows, macOS, Linux.

Coolhue
คอลเลกชันของการไล่ระดับสีที่เลือกด้วยมือ Coolhue ช่วยให้คุณสามารถคว้าชุดจานสีสำหรับแอพ Photoshop และ Sketch หรือ ติดตั้งลงในโครงการของคุณ การใช้ ซุ้มไม้ในสวน
หรือ NPM
. วิธีนี้จะช่วยคุณประหยัดเวลาในการเลือกสีสำหรับเว็บไซต์ที่กำลังจะมาถึง.

โขดหิน
ไลบรารี JavaScript ง่าย ๆ ในการสร้าง UI Reef ไม่มีระฆังและเสียงนกหวีดทั้งหมดจากไลบรารีขนาดใหญ่เช่น React.js หรือ Vue.js แต่ถ้าสิ่งที่คุณต้องการคือ แสดงผล UI เพียงป้อนข้อมูล และเทมเพลตแนวปะการังอาจเป็นทางเลือกที่ยอดเยี่ยม มันมีน้ำหนักเพียง 2Kb

เขียวตลอดปี
คอลเลกชันขององค์ประกอบ UI จาก Segment.io ส่วนประกอบค่อนข้างหลากหลาย นอกเหนือจากองค์ประกอบปกติบางอย่างเช่นปุ่ม, ไอคอน, การป้อนข้อความมีบางอย่างที่ฉันคิดว่าเป็นเอกลักษณ์ของ Evergreen เช่น Toaster, Side Sheet และ Dial Dial.
