這里給大家介紹一個個人覺得最好用的Web開發(fā)工具：Hbuilder。HBuilder是DCloud推出的一款支持HTML5的Web開發(fā)IDE，該軟件能夠幫助用戶快速完成開發(fā)，內(nèi)置最全的的語法庫，搭配上瀏覽器兼容性數(shù)據(jù)，不會再對瀏覽器碎片化而煩惱。HBuilder的編寫用到了Java、C、Web和Ruby。HBuilder本身主體是由Java編寫，它基于Eclipse，所以順其自然地兼容了Eclipse的插件。

Hbuilder最好用的Web開發(fā)工具圖一

1. HBuilder軟件中內(nèi)置有一個非常完善的hello HBuilder的工程，用戶只需要通過敲這幾十行代碼，就會直接感受到HBuilder比其他開發(fā)工具至少快5倍。

2. HBuilder軟件的生態(tài)系統(tǒng)，擁有現(xiàn)目前非常豐富的Web IDE生態(tài)系統(tǒng)。該軟件同時兼容Eclipse插件和Ruby Bundle。

3. HBuilder擁有的Eclipse插件非常豐富，如SVN、PHP、git、ftp、less等各種技術(shù)。

1. 打開軟件之后，我們依次點(diǎn)擊【文件】-【新建】-【選擇Web項(xiàng)目】，我們可以直接按下快捷鍵Ctrl+N、W，能夠?qū)崿F(xiàn)快速新建項(xiàng)目。如果是MacOS系統(tǒng)，快捷鍵為Command+N，然后左鍵直接點(diǎn)擊Web項(xiàng)目即可。

Hbuilder最好用的Web開發(fā)工具圖二

2. 我們需要在A處填寫新建項(xiàng)目的名稱，B處填寫(或選擇)項(xiàng)目保存路徑。如果更改路徑之后，HBuilder會記錄，下次登錄使用之后，會直接默認(rèn)使用更改后的路徑。

Hbuilder最好用的Web開發(fā)工具圖三

3. 在C處可選擇使用的模板，用戶也可以選擇自定義模版。

1. 打開下載好的HBuilder軟件，在項(xiàng)目資源管理器中選擇新建好的項(xiàng)目，接下來依次點(diǎn)擊【文件】-【新建】-【選擇HTML文件】。

2. 同樣的，我們也可以使用快捷鍵快捷鍵Ctrl+N、W，能夠?qū)崿F(xiàn)快速新建項(xiàng)目，如果是MacOS系統(tǒng)，快捷鍵為Command+N，然后左鍵直接點(diǎn)擊HTML文件即可，同時也可以選擇空白文件模版，如下圖所示。

Hbuilder最好用的Web開發(fā)工具圖四

1. 如果是Windows系統(tǒng)的用戶，直擊按按下快捷鍵Ctrl+P；如果是MacOS系統(tǒng)的用戶，可以按Command+P快捷鍵，就能夠邊改邊看模式。

2. 在此模式下，如果當(dāng)前打開的是HTML文件，這樣每次保存指揮員，就會完成自動刷新，來顯示當(dāng)前頁面的效果。如果是JS、CSS文件，如與當(dāng)前瀏覽器視圖打開的頁面有引用關(guān)系，也能夠進(jìn)行刷新。