🔥 "สาย Front-End ต้องแชร์ !!" กับสรุปรวมเครื่องมือ และ Framework ดี ๆ ที่ต้องบอกต่อสำหรับคนทำหน้าเว็บ <3
.
ต้องบอกว่าวันนี้แอดและทีมงานได้รวบรวมเครื่องมือเครื่องไม้ ที่จะทำให้งานยาก ๆ กลายเป็นงานง่าย ๆ ไว้ในที่เดียวให้แล้วว
.
⭐️ ใครที่กำลังเริ่มสาย Front-End หรือ ต้องการหาของดีรีบเข้ามาดูได้เลย สำหรับลิงก์ในการเข้าไปดาวน์โหลด / อ่าน Doc / วิธีการใช้งาน ดูด้านล่างได้เลยคร้าบผมมม ^__^
.
👩🎨เครื่องมือเด็ดที่คุณต้องแชร์ของสาย Frontend
.
📚 JavaScript Framework
.
Vue.js
https://vuejs.org/
.
Angular
https://angular.io/
.
React
https://reactjs.org/
.
Backbone.js
https://backbonejs.org/
.
🎨 CSS Framework
.
Bootstrap
https://getbootstrap.com/
.
Materialize
https://materializecss.com/about.html
.
Pure.css
https://purecss.io/
.
Bulma
https://bulma.io/
.
Semantic UI
https://semantic-ui.com/
.
📖 Library
.
sweetalert2 : สำหรับสร้าง Alert สวยๆได้ง่ายๆ
https://sweetalert2.github.io/
.
AlertifyJS : สร้าง Alert สวยๆเหมือนกัน
https://alertifyjs.com/
.
Chart.js : สำหรับสร้าง Chart แบบมี animation
https://www.chartjs.org/
.
jQuery : ใช้งาน JS และจัดการ DOM ได้ง่ายขึ้น
https://jquery.com/
.
DataTables : เปลี่ยน Table แบบเดิมๆให้ดูดีมี function ได้ง่ายๆ
http://fredsarmento.me/frontend-tools/
.
Quill editor : Text Editor สำหรับใส่ในเว็บเครื่องมือครบๆ
https://quilljs.com/
.
🧰 Developing & Debugging Tools
.
Chrome DevTools : เครื่องมือ Debug เว็บ เพียงแค่กด F12 เบราเซอร์อื่นๆก็มีเหมือนกัน
https://developers.google.com/web/tools/chrome-devtools
.
CodePen : Online Editor ที่สามารถจำลอง enviroment ที่เหมาะสมได้เขียนแล้วเห็นผลทันที
https://codepen.io/
.
WebStorm : Web Editor ที่รองรับ Framework ที่หลากหลาย
https://www.jetbrains.com/webstorm/
.
🍱 Other (Asset)
.
Google Fonts : font ฟรีสวยๆของ google
https://fonts.google.com/
.
awesome : Icon ฟรีสวยๆ
https://fontawesome.com/
.
figma : สำหรับออกแบบหน้าเว็บ จัดวางองค์ประกอบหรือแม้แต่สร้าง Prototype
https://www.figma.com/files/recent
.
Visual Inspector : extension chrome ที่ช่วยให้ตรวจสอบองค์ประกอบต่างๆของเว็บได้ค่อนข้างครบถ้วน
https://chrome.google.com/webstore/detail/visual-inspector/efaejpgmekdkcngpbghnpcmbpbngoclc
.
CSS Peeper : extension chromeอีกหนึ่งตัวที่ใช้ตรวจสอบองค์ประกอบเว็บ
https://chrome.google.com/webstore/detail/css-peeper/mbnbehikldjhnfehhnaidhjhoofhpehk
.
" หรือถ้าใครเคยใช้ตัวไหนมาแล้ว สามารถมาแบ่งปันประสบการณ์ในการใช้งานใน Comment กับแอดได้เลยยย ใครมีตัวไหนแนะนำใส่มาได้เต็มที่เลยคร้าบผมม <3 "
.
#BorntoDev - 🦖 Coding Academy ให้การพัฒนาเทคโนโลยีเป็นเรื่องง่ายสำหรับทุกคน
同時也有10000部Youtube影片,追蹤數超過2,910的網紅コバにゃんチャンネル,也在其Youtube影片中提到,...
「chrome extension js」的推薦目錄:
- 關於chrome extension js 在 BorntoDev Facebook 的精選貼文
- 關於chrome extension js 在 卡斯伯 Facebook 的最佳解答
- 關於chrome extension js 在 コバにゃんチャンネル Youtube 的最讚貼文
- 關於chrome extension js 在 大象中醫 Youtube 的最佳貼文
- 關於chrome extension js 在 大象中醫 Youtube 的最佳解答
- 關於chrome extension js 在 Chrome extension - GitHub 的評價
- 關於chrome extension js 在 Running JavaScript File in Google Chrome Extension 的評價
- 關於chrome extension js 在 How to Build a Chrome Extension that will Make Your ... 的評價
- 關於chrome extension js 在 Script 環境| Chrome 套件開發學習筆記 的評價
- 關於chrome extension js 在 DIY guide to writing your very own Chrome extension | Cloudify 的評價
chrome extension js 在 卡斯伯 Facebook 的最佳解答
線上問答:【JS 設計模式,一個轉念 Vue 就輕鬆學】
直播教學,同時測試直播新工具
Vue 學習卡卡的嗎?
這可能是對於 JS 的掌握度不足,但也可能是對於此設計模式不熟悉
前端框架的演進,近期越來越偏向「關注點分離」
本次線上問答會使用「心法」的方式引導大家
透過「關注點分離」來拆解、學習 JavaScript 應用
用不同的思維模式,來重新看待 JS
掌握以後,無論是 Vue、Angular、React 都能快速理解
直播時間:4/15 19:30
直播連結:https://hex.school/J3Adh
會議室密碼:mPui6pca7E8
這次同時會測試新的直播軟體 Webex
欲加入的同學請先下載此工具
加入會議的方式:
1. 下載 Webex Meetings:https://www.webex.com/downloads.html/
2. 點選上方連結進入會議
3. 依據提示安裝 Chrome Extension
4. 輸入個人 Mail、姓名、會議密碼(上方提供)
5. 進入會議
注意事項:
- *本次錄影無法確認是否釋出,會視 Webex 錄製結果而定
- 會議結束後會提供問卷,詢問大家對於直播工具的心得,作為我們接下來的評估
chrome extension js 在 コバにゃんチャンネル Youtube 的最讚貼文
chrome extension js 在 大象中醫 Youtube 的最佳貼文
chrome extension js 在 大象中醫 Youtube 的最佳解答
chrome extension js 在 How to Build a Chrome Extension that will Make Your ... 的推薦與評價
popup.js'); bolderizeButton.click(); expect(spy).toHaveBeenCalled(); }); });. In the code above, we are testing our extension's popup script ... ... <看更多>
chrome extension js 在 Chrome extension - GitHub 的推薦與評價
https://easonwang.gitbook.io/web_advance/. Contribute to EasonWang01/Node.js-and-React-Notes development by creating an account on GitHub. ... <看更多>