工具推薦 | 線上工具分享

Draw.io

連結：https://www.draw.io/
說明：線上繪製流程圖
優點：無須註冊即可使用，亦可將檔案儲存於雲端，並支持多國語系

Code Beautify

連結：https://codebeautify.org/
說明：各種語言代碼進行格式檢查和排版
優點：線上、多種語言​‌‌‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​​‌​​‌‌‌​​‌​​‌‌​​​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌‌​​‌​​‌​‌‌​‌​‌​‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​​​

Responsive Design Testing - Matt Kersley

連結：http://mattkersley.com/responsive/
說明：響應式網頁設計測試工具
優點：線上、直接看到多個不同尺寸的裝置

​‌‌‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​​‌​​‌‌‌​​‌​​‌‌​​​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌‌​​‌​​‌​‌‌​‌​‌​‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​​​

Regular expression editor

連結：https://rubular.com/r/0bK8HSHwwK
說明：正規表達式編輯器
優點：可直接驗證正規表達式是否符合自己希望的條件

VvvebJs

連結：http://www.vvveb.com/vvvebjs/editor.html
說明：簡單拖拽即生成網頁
優點：直接拖拉物件並且預覽編輯快速生成前端網頁​‌‌‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​​‌​​‌‌‌​​‌​​‌‌​​​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌‌​​‌​​‌​‌‌​‌​‌​‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​​​

GTmetrix

連結：https://gtmetrix.com/
說明：查看你網站的效果，揭示網站運行緩慢的原因，並發現優化機會
優點：線上檢測、線上說明

​‌‌‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​​‌​​‌‌‌​​‌​​‌‌​​​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌‌​​‌​​‌​‌‌​‌​‌​‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​​​

Alexa

連結：https://www.alexa.com/
說明：查看你網站排名，可以針對區域或是全球的分析，亦可針對關鍵字和CEO做分析。
優點：線上檢測、線上說明

總結

網路上提供了很多類似的線上工具，這邊僅僅列出幾個自己較為常用的工具。
之後如果有更多線上工具，會在這邊持續更新分享。 ​‌‌‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​​‌​​‌‌‌​​‌​​‌‌​​​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌‌​​‌​​‌​‌‌​‌​‌​‌​‌​​​‌‌​‌‌‌‌​‌‌​‌‌‌‌​‌‌​‌‌​​​‌‌‌​​‌‌​​‌​‌‌​‌​​‌‌​​​​