網(wǎng)頁(yè)前端開(kāi)發(fā)人員必用在線web工具和應(yīng)用
今天的這篇文章中,我們將繼續(xù)推薦給大家一組我們精挑細(xì)選的web開(kāi)發(fā)設(shè)計(jì)必備的在線工具應(yīng)用。相信會(huì)在web開(kāi)發(fā)和設(shè)計(jì)的過(guò)程中給你帶來(lái)方便和快捷!
前端開(kāi)發(fā)相關(guān)
jsfiddle
jsfiddle是老牌的在線調(diào)試和分享代碼的網(wǎng)站,它可以幫助你在線調(diào)試javascript/css/html代碼, 并且方便的發(fā)布到社區(qū),論壇或者社交媒體上與朋友們分享或者提問(wèn)。整合了很多的不同的類(lèi)庫(kù)供大家選擇。 類(lèi)似的工具還有jsbin.com,也非常不錯(cuò)。更多工具請(qǐng)參考我們以前的文章。
codepen
codepen也是一個(gè)可以幫助你在線調(diào)試和分享前端代碼的地方,和jsfiddle不太一樣的地方,它更像一個(gè)社區(qū),你可以看到最近的用戶(hù)添加的在線演示或者代碼,并且可以更加方便的分享到其它網(wǎng)站或者是fork。和jsfiddle相比,更像一個(gè)幫助展示前端效果的平臺(tái)。如果你常常光顧的話,能夠找到很多很不錯(cuò)的前端效果,包括html5,js,CSS3等等。相當(dāng)不錯(cuò),向大家推薦!
gbdebug
gbdebug是gb標(biāo)簽社區(qū)中整合的前端調(diào)試工具,最初是為了方便社區(qū)的朋友提問(wèn)或者展示jQuery代碼效果而開(kāi)發(fā),如果你使用jsfiddle的話,肯定會(huì)覺(jué)得非常熟悉。最強(qiáng)大的在于和GB社區(qū)內(nèi)容的整合,你可以分享自己開(kāi)發(fā)的前端展示,模板或者教程,并且使用gbdebug來(lái)添加”在線調(diào)試“,更方便大家在線閱讀和調(diào)試。
reFiddle+
如果你是個(gè)正則表單式的狂熱愛(ài)好者的話,這款在線工具肯定是你必備的工具之一,reFiddle+可以幫助你在線的調(diào)試正則表單式,你只需要輸入數(shù)據(jù)和對(duì)應(yīng)的正則表達(dá)式后,就可以看到高亮顯示的結(jié)果,是不是非常直觀和簡(jiǎn)單,相信你肯定會(huì)喜歡!
RubyFiddle
如果你的開(kāi)發(fā)語(yǔ)言是Ruby的話,你可能已經(jīng)知道了這個(gè)在線工具 RubyFiddle,使用這個(gè)在線工具可以幫助你在線的調(diào)試Ruby代碼,有點(diǎn)兒類(lèi)似jsfiddle和codepen,只不過(guò)是Ruby版本的代碼而已。 你只需要粘貼ruby代碼并且點(diǎn)擊”RUN”按鈕即可,甚至支持Vim或者Emacs的輸入方式哦!
CSS3 generator
本文地址:http://m.likemindfilms.com/tutorial/wd1307.html
您可能還喜歡
- jquery Jcrop圖像裁切插件中文api文檔
- @media適配不同尺寸的手機(jī)
- 返回上一頁(yè)代碼的幾種寫(xiě)法
- Dreamweaver CC 2014新功能介紹
- 深入了解viewport和px
- 優(yōu)秀CSS代碼書(shū)寫(xiě)的10個(gè)規(guī)范
- 畫(huà)出你的風(fēng)格:HTML5創(chuàng)意畫(huà)板的設(shè)計(jì)教程
- Div中height:100%無(wú)效的解決辦法
- 網(wǎng)頁(yè)前端-網(wǎng)頁(yè)切圖命名規(guī)范
- 為網(wǎng)頁(yè)設(shè)計(jì)師而生的14個(gè)文本編輯器
- 專(zhuān)訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類(lèi)
- 體驗(yàn)設(shè)計(jì)中的排序問(wèn)題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏