COOL IT IDEAS AND STUFF

See the original english version Click here!

 

ในการทำงาน นอกจากเราจะต้องการผลลัพธ์ที่ตรงตามความต้องการแล้ว การทำงานสำเร็จอย่างรวดเร็วก็เป็นสิ่งที่ทุกคนต้องการเช่นกัน ไม่เว้นแม้แต่การพัฒนา Web และบทความนี้จะมาแนะนำ 10 Tools มีประสิทธิภาพที่ช่วยให้คุณพัฒนา Web ได้เร็วยิ่งขึ้น

1. React Glow

สร้างความเปล่งประกายที่น่าสนใจ ด้วย Mouse ของ User สิ่งนี้จะเพิ่มความมหัศจรรย์ให้กับ Interface ของคุณ:

มันจะทำให้ User ที่เห็น Effect แบบนี้บน Page รู้สึกเหมือน Page มีคุณภาพและมีการใช้เทคนิคขั้นสูง

2. Vite

โยนการสร้าง React App ทิ้งไป แล้วทำให้การ Develop เป็นเรื่องที่ง่ายด้วย Vite

พบกับการเปลี่ยน Module ที่รวดเร็วทันใจและมีการรองรับ built-in TypeScript

รวมทั้งไม่จำเป็นต้องกังวลเกี่ยวกับ Dependencies ที่ล้าสมัยหรือ Packages ที่มีช่องโหว่ ซึ่งต่างจาก Create React App:

ในทางกลับกัน นี่คือ ตัวอย่างของสิ่งที่ได้ใน Project จากการใช้ Create React App ที่ค่อนข้างล้าสมัย:

3. TODO Highlight for VS Code

ด้วย TODO Highlight คุณสามารถเพิ่ม TODO Comments ได้ทุกที่ใน Codebase ของคุณ และติดตาม Comments ทั้งหมดได้อย่างง่ายดาย

คุณสามารถเพิ่ม TODO ได้อย่างรวดเร็ว ด้วย Comments ที่นำหน้าด้วยคำว่า TODO:

จากนั้นดูใน Output Window หลังจาก Run คำสั่ง TODO-Highlight: List highlighted annotations:

นี่เป็นอีกหนึ่งทางเลือกที่ดีในการจัดเก็บพวกมันไว้ใน to-do list app โดยเฉพาะอย่างยิ่งเมื่อเป็นสิ่งที่อยู่ใน Low-Level และ Contextual เช่น “TODO: Use 2 map()’s instead of reduce()”

4. Rough Notation

JS Library ที่มีประสิทธิภาพสำหรับการสร้างและทำภาพเคลื่อนไหวให้กับ Annotations ที่มีสีสันบน Web Page ด้วยรูปลักษณ์และความรู้สึกเหมือนภาพวาดด้วยมือ

เมื่อคุณเห็นสิ่งนี้ มันจะทำให้คุณสัมผัสได้ของความเป็นมนุษย์ที่ใช้มือวาดหรือเขียน ซึ่งนั่นทำให้มันมีความโดดเด่น

แน่นอนว่า มันมีสไตล์ของ Annotations ในลักษณะต่าง ๆ เช่น ขีดเส้นใต้, กล่อง, วงกลม, ไฮไลต์, ขีดทับ... และอีกมากมายให้เลือก พร้อมทั้งมี Options ในการปรับแต่งทั้ง Duration และ Color

5. JavaScript (ES6) Code Snippets for VS Code

VS Code Extension ที่มี JavaScript Code Snippets สำหรับ ES6 ที่ช่วยประหยัดเวลาเป็นจำนวนมาก

ตัวอย่างเช่น imp และ imd:

6. Background-removal-js

JavaScript Library ที่ทำงานบน Browser และใช้งานได้ฟรีตัวนี้ จะช่วยให้คุณสามารถลบพื้นหลังออกจากรูปภาพของคุณได้อย่างง่ายดายในขณะที่ยังรักษาความเป็นส่วนตัวของข้อมูลของคุณอีกด้วย

7. VanJS

นี่เป็น Library ขนาดเล็กและเรียบง่ายสำหรับสร้าง User Interfaces

มันใช้ JavaScript ธรรมดาและ Built-in DOM Functionality เช่นเดียวกับ React แต่แตกต่างจาก React ตรงที่ ไม่ต้องใช้ Syntax พิเศษใด ๆ ในการกำหนด UI Elements

8. Mailo

Drag-and-Drop Builder นี้จะช่วยสร้างอีเมลที่ Responsive ได้ง่ายและมีความสวยงาม คุณไม่ต้องปวดหัวกับการเขียน Code อีกต่อไป เพียงแค่ดูอีเมลของคุณทำให้ Inbox ดูมีชีวิตชีวาในทุก Devices

9. Color Names

มาดำดิ่งสู่ขุมสมบัติที่มี Code สีมากกว่า 30,000 รายการ ซึ่งรวบรวมอย่างพิถีพิถันจากอินเตอร์เน็ต และเป็นที่ชื่นชอบจาก User อีกมากมาย

ค้นหาเฉดสีที่สมบูรณ์แบบเพื่อจุดประกายความคิดสร้างสรรค์ของคุณ และทำให้การออกแบบของคุณมีชีวิตชีวายิ่งขึ้น

10. Flowbite Icons

ปลดปล่อยขุมทรัพย์ของ SVG Icons ที่น่าทึ่งกว่า 450 แบบ โดยทั้งหมดนี้เป็น Open-Source และพร้อมที่จะทำให้ Web Projects ของคุณมีชีวิตชีวามากขึ้น

ไม่ว่าคุณจะชอบแบบตัวหนาหรือแบบเส้นที่คมชัด Icons เหล่านี้ สามารถ Integrate เข้ากับ Flowbite และ Tailwind CSS ได้อย่างราบรื่น และทำให้การปรับแต่งเป็นเรื่องที่ทำได้ง่ายขึ้น

สรุป

และทั้งหมดนี้ ก็เป็น 10 Tools ทรงพลังที่ช่วยให้คุณพัฒนา Web ได้เร็วยิ่งขึ้น คุณสามารถใช้ Tools ที่ยอดเยี่ยมเหล่านี้ เพื่อยกระดับประสิทธิภาพการทำงานและทำให้ชีวิตของ Developers ของคุณ “ง่ายขึ้น”

ที่มา: https://medium.com/

 

 

รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert

 

อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ

 

บทความล่าสุด

• 20 VS Code Extensions, Themes, Icons, Shortcuts ที่ช่วยเพิ่ม Productivity ของคุณ
• 15 Chrome Extensions ที่ Product Designers ควรรู้ไว้และใช้งานให้เป็น
• 6 Python Built-in Functions ที่คุณควรรู้จักและศึกษาไว้