🔥 "สาย 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 ให้การพัฒนาเทคโนโลยีเป็นเรื่องง่ายสำหรับทุกคน
同時也有28部Youtube影片,追蹤數超過9萬的網紅散財小説ドリキン,也在其Youtube影片中提到,ゲストに 深津 貴之 / THE GUILD (@fladdict) さんを迎えて、Cnet山川記者とドリキンの3人でAdobe Max二日目を振り返ります。 今年も驚き満載のSneaksについて深津さんの解説が聞ける貴重なライブになると思います。 Adobe MAXについて詳しく知りたい人はこち...
「font awesome」的推薦目錄:
- 關於font awesome 在 BorntoDev Facebook 的最佳解答
- 關於font awesome 在 卡斯伯 Facebook 的最佳解答
- 關於font awesome 在 青話物 Facebook 的精選貼文
- 關於font awesome 在 散財小説ドリキン Youtube 的精選貼文
- 關於font awesome 在 themblan Youtube 的最佳解答
- 關於font awesome 在 themblan Youtube 的最讚貼文
- 關於font awesome 在 FortAwesome/Font-Awesome: The iconic SVG, font ... - GitHub 的評價
- 關於font awesome 在 Using Font Awesome icons on my site 的評價
- 關於font awesome 在 How to use font awesome icons in angular? - YouTube 的評價
- 關於font awesome 在 html - Font Awesome icons are not working, I have included all ... 的評價
- 關於font awesome 在 Font Awesome - React Icons 的評價
- 關於font awesome 在 Font Awesome - Facebook 的評價
- 關於font awesome 在 How to Add Free Font Awesome Icons to Squarespace in 2023 的評價
font awesome 在 卡斯伯 Facebook 的最佳解答
ICON 大大大集合~~
將數十種 icon 資源整合成一份的 NERD Fonts
包含了 FontAwesom、Material Design 等圖示字體
可自行選用打包,中文文檔及圖示說明:
https://github.com/ryanoasis/nerd-fonts/blob/master/readme_cn.md
font awesome 在 青話物 Facebook 的精選貼文
知名圖示字體服務Font Awesome推出了針對新冠肺炎COVID-19的一系列宣導圖示,其中純色版本的圖示以開源授權免費提供在各平台以及製作物上使用!
All solid COVID-19 icons in Font Awesome
https://fontawesome.com/icons?q=covid-19&s=solid
#FontAwesome
twitter.com/fontawesome
font awesome 在 散財小説ドリキン Youtube 的精選貼文
ゲストに 深津 貴之 / THE GUILD (@fladdict) さんを迎えて、Cnet山川記者とドリキンの3人でAdobe Max二日目を振り返ります。
今年も驚き満載のSneaksについて深津さんの解説が聞ける貴重なライブになると思います。
Adobe MAXについて詳しく知りたい人はこちらのリンクもチェックして見てください
https://note.mu/okitaka_/n/ndf758736cee1?magazine_key=m55ec296b7655
タイムライン (Thank you to 及川健太)
1:44 開始
3:17 2日目基調講演について
8:35 スニークスについて
11:24 スニークス解説1
17:40 スニークス解説2 soundseek
20:50 スニークス解説3 sweet talk
23:29 スニークス解説4 project pronto
28:53 スニークス解説5 project image tango
34:02 スニークス解説6 fantastic font
36:52 スニークス解説7 project go figure
40:00 スニークス解説8 LightRight
44:59 スニークス解説9 awesome audio
51:05 スニークス解説10 grow stick
52:43 スニークス解説11 フェイクニュースバスター
1:00:26 各々が気になったところ
1:01:55 今年の総括
1:05:18 noteへの要望
1:15:58 note開発チームのサイクル
1:27:04 深津さん山川さんとカメラ談義
1:29:06 カメラを変えた理由
1:33:41 ライカについて
1:37:11 大人気Galaxy Fold
1:39:19 ジェイソンさんの写真Twitter投稿
1:42:45 RED見てきた話
1:44:19 noteのドメインがcomになる話
1:46:50 ドリキンさん「カメラ欲しくなった」
1:50:21 まとめ
1:51:26 深津さんの写真撮影テクニック
1:52:24 LightroomはPC?タブレット?
1:54:51 〆コメント
1:55:24 ED映像
ドリキンステッカー販売中
https://backspace.thebase.in/
backspace.fmグッズも販売中
https://www.zazzle.co.jp/s/backspace.fm+%E3%82%AE%E3%83%95%E3%83%88
RX-100M7 : https://amzn.to/2zQqBbc
BMPCC6K : https://amzn.to/2zRt1pW
BMPCC4K : https://amzn.to/2JSAKsH
GH5S : https://amzn.to/2RYd89o
レンズ 12mm/F1.4 : https://amzn.to/2VgQv4U
NDフィルター : https://amzn.to/2vOnVc8
三脚 : https://amzn.to/2N87djq
良かったらこちらもフォローしてください!
Twitter - https://twitter.com/drikin
Instagram - https://www.instagram.com/drikin/
Music By: https://andrewapplepie.com/
#AdobeMAX #イベント #ライブ速報 #ad #アドビ #アドビマックス #クリエイター #drikin #ドリキン #散財 #カメラトーク #デザイン #Photoshop #Illustrator
font awesome 在 themblan Youtube 的最佳解答
On the last episode of "Playing Zelda with Japanese Voices," I prepared for the final battle. I did a Shrine, farmed some arrows and food, and cooked a bunch of dishes so that I would be ready for the fight ahead.
Now the story continues...
----------------------------
Thank you for watching, and have a great day.
----------------------------
Subscribe for more awesome videos! ► https://bit.ly/2M1H2Fy
----------------------------
The song in my intro and outro was done by Hyper Potions, and it is called Time Trials. You can check out the full song here: https://youtu.be/mnfNWe-HHsI.
----------------------------
The font I used in my thumbnail is Hylian Serif, and is from https://zeldauniverse.net/media/fonts/. It was created by Artsy Omni (http://artsyomni.com/hyliaserif).
----------------------------
Did you miss an episode of "Playing Zelda with Japanese Voices"? Check out the full playlist here: https://www.youtube.com/playlist?list=PLDOrSWB5YEl81-MhjNYU5IASf2RM-_kwM
----------------------------
My Socials:
Twitter: http://www.twitter.com/themblan1
Instagram: https://www.instagram.com/themblan1
font awesome 在 themblan Youtube 的最讚貼文
I apologize; this is a reupload. I forgot to burn the subtitles into the video. Oops.
It has been one week since the last Nintendo Direct blew our minds. I want to reflect and give my thoughts on some of the games that were featured.
----------------------------
Thank you for watching, and have a great day.
----------------------------
Subscribe for more awesome videos! ► https://bit.ly/2M1H2Fy
----------------------------
The song in my intro and outro was done by Hyper Potions, and it is called Time Trials. You can check out the full song here: https://youtu.be/mnfNWe-HHsI.
----------------------------
The font I used in my subtitles is Hylian Serif, and is from https://zeldauniverse.net/media/fonts/. It was created by Artsy Omni (http://artsyomni.com/hyliaserif).
----------------------------
My Socials:
Twitter: http://www.twitter.com/themblan1
Instagram: https://www.instagram.com/themblan1
font awesome 在 Using Font Awesome icons on my site 的推薦與評價
Apart from the commercial license you have linked above, Font Awesome also provides fonts, icons and software under free of charge licenses, as ... ... <看更多>
相關內容
font awesome 在 How to use font awesome icons in angular? - YouTube 的推薦與評價
How to use font awesome icons in angular?You will also learn how to install font awesome icons in your angular projectOther useful content ... ... <看更多>
font awesome 在 FortAwesome/Font-Awesome: The iconic SVG, font ... - GitHub 的推薦與評價
Font Awesome is the Internet's icon library and toolkit, used by millions of designers, developers, and content creators. ... <看更多>