สำหรับ Web Developer แล้วนั้น ไม่ว่าจะเป็น APIs, Hosting Platforms, Cheat Sheets, Icons, Templates, Fonts, Color Resources, Learning Platforms, CSS Games, Code Editors และ JavaScript Animation Libraries ถือเป็นเครื่องมือที่ต้องใช้อยู่เป็นประจำ ดังนั้นบทความนี้ได้มัดรวมแหล่งข้อมูลมาไว้ให้คุณแล้ว กับ แจกฟรี! 100+ Websites แหล่งรวมเครื่องมือ สำหรับ Web Developer แถมสามารถใช้กันได้แบบฟรี ๆ อีกด้วย
แหล่งเรียนรู้ Web Development ฟรี
Websites
- freeCodeCamp
- MDN Web Docs
- W3Schools
- Scrimba
- Codecademy
- TheOdinProject
- Frontend Mentor
- Javascript30
- Coursera
- Khan Academy
YouTube Channels
- Traversy Media
- The Net Ninja
- Code with Harry (ภาษาฮินดี)
- Web Dev Simplified
- Coder Coder
- The Coding Train
- FreeCodeCamp
Hosting Platforms ฟรี สำหรับ Websites ของคุณ
- Netlify: ตัวช่วย Deploy Web Projects ของคุณได้อย่างง่ายดาย
- Render: ตัวช่วย Host Web Applications และ Static Sites ได้อย่างง่ายดาย
- GitHub Pages: คุณสามารถ Host Static Websites โดยตรงจาก GitHub Repository ของคุณ
- Firebase Hosting: ปรับขนาด Web Apps ของคุณได้อย่างง่ายดาย ด้วย Firebase
- Vercel: ตัวช่วย Deploy Websites และ Applications อัตโนมัติ
- Cyclic.sh: Host Static Sites ของคุณ ด้วยการทำ Zero Configuration
- Appwrite: Open-source Backend Server สำหรับ Web และ Mobile Developers
- Supabase: สร้าง Apps ที่ทันสมัย ด้วย Backend ที่สามารถปรับขนาดได้
- InfinityFree: Web Hosting แบบฟรีและไม่จำกัด แถมยังมี PHP, MySQL และอื่น ๆ อีกมากมาย
- Surge: Web Publishing สำหรับ Front-end Developers
APIs ฟรี สำหรับ Projects ของคุณ
- OpenWeatherMap API: ให้คุณเข้าถึงข้อมูลสภาพอากาศแบบ Live ได้ทุกที่บนโลก
- News API: ช่วยคุณดึงบทความข่าวสดจากแหล่งต่าง ๆ ได้อย่างง่ายดาย
- REST Countries API: ช่วยคุณดึงข้อมูลเกี่ยวกับประเทศต่าง ๆ ทั่วโลก ได้อย่างง่ายดาย
- Chuck Norris Jokes API: ทำให้ Projects ของคุณ เต็มไปด้วยรอยยิ้ม ด้วยเรื่องตลกของ Chuck Norris
- Open Food Facts API: เข้าถึงข้อมูลผลิตภัณฑ์อาหารและส่วนผสมต่าง ๆ ได้จากที่นี่
- GitHub API: ตัวช่วยรวม GitHub Functionalities เข้ากับ Applications ของคุณ
- Reddit API: ช่วยคุณดึงข้อมูล Reddit รวมถึง Posts และ Comments
- OneDrive API: จัดการไฟล์และโฟลเดอร์บน Microsoft OneDrive
- Dogs API: ตัวช่วยดึงภาพสุนัขน่ารัก ๆ และข้อมูลสุนัข มาไว้ใน Projects ของคุณ
- GIPHY API: ตัวช่วยรวม GIFs และ Stickers เข้ากับ Applications ของคุณ
- OMDb API: เข้าถึงฐานข้อมูลภาพยนตร์และรายการทีวีต่าง ๆ
- VirusTotal API: วิเคราะห์ Files และ URLs ที่น่าสงสัย เพื่อหา Malware
- PokeAPI: ดึงข้อมูล Pokémon สำหรับ Projects ที่เกี่ยวข้องกับ Game ของคุณ
- NASA API: คุณสามารถเข้าถึงข้อมูลมากมายของ NASA รวมถึงภาพและข้อมูลต่าง ๆ
เว็บไซต์ฟรี สำหรับ รูปภาพ, Vectors และ Illustrations
- Freepik: ค้นหา Vectors, รูปภาพ, PSDs และไอคอนต่าง ๆ ได้ฟรี
- Vecteezy: ค้นหา Vector Art, Graphics, และ Illustrations คุณภาพสูง
- Unsplash: คุณสามารถเข้าถึงภาพถ่ายความละเอียดสูง แบบฟรี ๆ กว่า 1 ล้านภาพ
- Pixabay: คลังรูปภาพและวิดีโอ แบบฟรี ๆ มากมาย
- Flaticon: ดาวน์โหลด Icons ฟรี ไม่ว่าจะเป็นไฟล์แบบ SVG, PSD, PNG หรือ EPS
- Openclipart: แหล่งรวม Clipart และรูปภาพแบบฟรี ๆ
- SVGRepo: ดาวน์โหลด SVGs ได้ฟรี
- Vectorportal: แหล่งรวม Vectors, Clip Art และ Icons แบบฟรี ๆ
- SVGBackgrounds: SVG Patterns และ Backgrounds ที่ปรับแต่งได้
- FreeDesignFile: แหล่งรวม Graphic Design คุณภาพสูง
- Pexels: แหล่งรวมภาพและวิดีโอแบบฟรี ๆ โดย Creator มากมาย
- Vectorian: แหล่งรวม Vector Art, ภาพ และวิดีโอ แบบปลอดค่าลิขสิทธิ์
Icons ฟรี สำหรับ Projects ของคุณ
- FontAwesome
- Flaticon
- Iconfinder
- Material Icons
- Icons8
- BoxIcons
- Feather Icons
- IcoFont
- SVGHUB
- Tabler Icons
- Iconsmind
- Iconmonstr
- SVGRepo
Fonts ฟรี สำหรับ Projects ของคุณ
- Google Fonts
- 1001FreeFonts
- Fontjoy
- Fontsly
- FontSpace
- AbstractFonts
- FontZone
- DevFonts
- DaFont
- FontSquirrel
- FontFabric
Color ฟรี สำหรับ Projects ของคุณ
- Coolors
- Paletton
- Colorion
- ColorHunt
- ColorHexa
- Adobe Color
- Colormind
- ColorPicker
- ColorKit
- MyColor
- ColorHub
เว็บไซต์ฟรี สำหรับ Cheat Sheet
- HTML Cheat Sheet: คู่มือฉบับย่อ สำหรับ HTML Elements และ Attributes
- CSS Cheat Sheet: คำแนะนำเกี่ยวกับ CSS Properties และ Selectors จบครบในที่เดียว
- JavaScript Cheat Sheet: แหล่งข้อมูลที่มีประโยชน์ สำหรับ JavaScript Syntax และ Concepts
- Git Cheat Sheet: Commands และ Workflows ที่จำเป็น สำหรับ Git
- Markdown Cheat Sheet: คำแนะนำ Markdown Syntax ในการสร้างการจัดรูปแบบ Rich Text
- React Cheat Sheet: Overview ของ React Concepts และ Syntax
- Learn x in y minutes: Tutorials สำหรับ เรียนรู้ภาษา Programming ที่หลากหลาย และเครื่องมือต่าง ๆ
- SQL Cheat Sheet: แหล่งเรียนรู้ SQL Commands และ Queries ที่ครอบคลุม
- OverAPI: เว็บไซต์รวบรวม Cheat Sheets สำหรับภาษา Programming Languages และ Frameworks
เว็บไซต์ฟรี สำหรับ HTML/CSS Templates
- HTML5UP
- HTMLRev
- Free-CSS
- Templated
- FreeHTML5
- Start Bootstrap
- BootstrapMade
- Bootswatch
- BootstrapTaste
- Cruip
- Tooplate
- HTML5xCSS3
แหล่งเรียนรู้ CSS ด้วยการเล่น Game
- CSS Diner: ฝึกฝน CSS Selectors กับ Game สนุก ๆ
- Flexbox Froggy: เรียนรู้ CSS Flexbox โดยการเล่น Game นี้
- Grid Garden: ฝึกฝน CSS Grid ให้เชี่ยวชาญกว่าเดิม โดยการเล่น Game นี้
- Flexbox Defense: Game ที่จะช่วยให้คุณเรียนรู้ CSS Flexbox
- CSSBattle: แข่งขันทดสอบความรู้กับเพื่อน ๆ ด้วยการเขียน CSS Code
- Flexbox Zombies: เรียนรู้ CSS Flexbox โดยการเล่น Game นี้
เว็บไซต์ฟรี Code Editors
- Visual Studio Code (VS Code)
- Sublime Text
- Brackets
- Vim
JavaScript Animation Libraries
- Anime.js: JavaScript Animation Library ที่มีขนาดไฟล์ค่อนข้างเล็ก แถมใช้งานง่าย
- ScrollReveal.js: สำหรับสร้างภาพและเคลื่อนไหวองค์ประกอบต่าง ๆ ได้อย่างง่ายดาย ขณะที่เข้า/ออกจาก Viewport
- Popmotion: JavaScript Library ที่เกี่ยวกับการเคลื่อนไหว ที่ใช้งานได้ดีและยืดหยุ่น
- AniJS: Library สำหรับ CSS Animations
- Wow.js: คุณสามารถนำ CSS Animation ไปใช้กับองค์ประกอบต่าง ๆ ได้
- Typed.js: ใช้ JavaScript Library นี้เพื่อจำลองลักษณะของข้อความที่กำลังพิมพ์ ทีละอักขระ พร้อมตัวเลือกที่ปรับแต่งได้
- Velocity.js: ช่วยคุณสร้างภาพเคลื่อนไหวที่ราบรื่นและรวดเร็วยิ่งขึ้น
- GSAP: Animation ระดับมืออาชีพสำหรับ เว็บไซต์ที่ทันสมัย
และทั้งหมดนี่ก็คือ แจกฟรี! 100+ Websites แหล่งรวมเครื่องมือ สำหรับ Web Developer
เมื่อ หางาน IT ให้ ISM Technology Recruitment เป็นอีกหนึ่งตัวช่วย เพื่อให้คุณได้ “ชีวิตการทำงานในแบบที่คุณต้องการ” เพียงส่ง Resume มาที่นี่
ISM เชี่ยวชาญในธุรกิจ IT Recruitment & IT Outsourcing โดยเฉพาะ ได้เปิดทำการมาแล้วกว่า 30 ปี มีพนักงานทุกสายและทุกระดับทางด้าน IT ที่ได้ร่วมงานกับลูกค้าองค์กรใหญ่ที่มีชื่อเสียงและบริษัทข้ามชาติมากมาย
Source: https://blog.stackademic.com/