個人把這段時間稱為「放生期」。這現象還蠻奇妙的，出社會前不曾想過會有這種情況，明明身處其中卻又像是隱形的存在一樣，除了說「真的很妙」外我還真心想不到太多形容詞。
不過人生會發生什麼事有時候也不是自己能選的，往好處想：至少有段空檔能思考近況然後投資些不同事情的時間，其實也不壞。
最後決定重新練習一下之前唸完沒機會用然後就忘的一乾二淨的CSS，近年因為前端和UI相關技術聲勢大漲的原因，網頁技術成了一種基本門檻，雖然我到現在還是不曉得究竟網頁技術和UI設計有什麼關係，但學會總是不吃虧。
說不定還有可能從遊戲開發這個無間地獄解放出來，但對這個圈子的心得有點難整理，也許留待後話吧。
目前開發網頁的工具而言雖然大部份還是使用Dreamweaver，不過因為前端用到JavaScript、後端用到PHP之類的語言，加上Dreamweaver在程式編輯和預覽的部份有些缺陷一直跟不上時代，身邊走這行的朋友慢慢都轉而投向比較純粹的程式編輯器。
一方面也是因為喜歡不同工具帶來的新鮮感，所以稍微搜尋了一下。
目前這方面的主流似乎是Sublime Text，之前玩的Visual Code也是類似的設計，沒有太多額外的功能，特色便是同樣的輕便單純，而且提供安裝客製化的外掛以強化原本較為陽春的核心，進而打造出偏個人化的Coding環境。
但Sublime Text下載來用了一陣子後覺得… 介面實在蠻陽春的，當然這種工具本身就是以簡單為主，要什麼都作到的話整個IDE難免就會像Visual Studio那麼誇張，也就不是太易用了。
 |
| Sublime Text3 |
另一個是雖然可以更換佈景，但只會影響到編輯頁而已，側欄部份基本上就維持一樣的色系，雖然可以把側欄的部份收起來，但強迫症如我總是覺得哪裡不對勁。
後來再搜尋相關工具的時候意外找到原來Adobe也有製作一款叫作Barckets的編輯工具（是說那為什麼不把Dreamweaver也整修一下…），整體看上去和前述的Sublime Text相似，而且網路上有提到的文章大多也一片好評，所以就跟著下載來玩玩看。
安裝完成後，初次啟動會打開一頁Getting Started，簡介Brackests是個什麼樣的東西。
 |
| Brackests Getting Started頁。 |
我下載的Brackests是1.8版，在網路上雖然有提到先前的版本沒有中文化，不過這版已經有了，安裝後可以在「除錯」的項目中找到「切換語言」的選項。切換語系後除了介面所有選項都會轉換成繁中外，包括原本的Getting Started也會跟著換成中文，個人覺得還蠻細心的，而且用詞還挺活潑有趣的。
 |
| 繁體中文語系切換。 |
雖然Brackets如同其它編輯器也支援一眾多到滿出來的語言，不過目前看起來最大的特色及用途還是用於網頁開發上。
 |
| Brackets所支援的語言。 |
最重要的是它擁有即時預覽的功能，除了Google Chrome外，只要在選項中開啟「啟用實驗版即時預覽」，也能開啟Firefox來預覽。
和Dreamweaver相似，只要在原始碼中指定到某個區塊，即時預覽的頁面也會以閃一下爍底色來回應，能很容易知道目前編輯的區塊是影響哪個部份。
 |
| 即時預覽功能按鈕。 |
 |
| 顯示<p>標記的區塊範圍。 |
另一個很不錯的特色是只要在對應的tag上按ctrl+e快速鍵，就會拉開一個這樣的視窗，可以在色盤中快速調整需要的顏色或透明度，系統也會直接修改原始碼，不用再拼貼一次。
 |
| 快速編輯面板 |
CSS在語法上需要輸入提示的時候，以色碼來說Brackets會有個簡單的標示，像background-image的話也會在syntax中彈出像url()之類的提示，Sublime Text就好像沒有了（但不曉得是否能透過套件強化）。
 |
| color參數提示 |
 |
| 開啟套件管理頁面的按鈕。 |
好像是因為我安裝了Tab相關的套件，所以原本位於右側的功能鍵被移到底下去了（紅框處），點擊可以開啟套件管理的視窗。這部份不曉得如果未來像官網那樣，在右側因新增功能而增加按鈕時，整體版面會不會因此有所衝突，不過目前就先這樣了。
Brackets的套件管理不像Sublmie Text要再作額外的設定，本身就已經視覺化而且相當清楚，在各分類中可以看到對應的內容並管理，如果要安裝的話，只要在選項欄位中貼上套件安裝網址，或是在GitHub下載套件後開啟Brackets→說明→ 顯示擴充功能資料夾，然後將檔案拖放到User資料夾中重開就行了。
 |
| Brackets套件管理頁面。 |
不過套件管理功能的開啟比較慢一些，稍微瀏覽了一下在數量上也比Sublime Text來得少。
目前有使用的相關套件：
Shizimily Multi-Encoding for Brackets
Brackests不支援UTF-8之外的編碼，Sublime Text 似乎還是可以開啟的，但Brackests會直接彈出錯誤然後拒絕。可以透過安裝這個套件來解決。
Brackets Extension-UTF8 converter
Sublime Text也有的語系轉存用套件。
 |
| 可以將現有文件作語系轉換。 |
可以快速生成HTML、 HTML5等基礎框架，方便快速開發。
 |
| HTML Templates可以選擇基礎框架。 |
Custom Work：Tabs-Custom Working
Brackets沒有分頁功能，可以用這個套件開啟相關的功能。
 |
| 開啟分頁功能。 |
換佈景裝逼用，對個人開發實力及速度和經驗完全沒有任何關聯，但就是爽。
 |
| Themes for Barckets提供不少佈景可選。 |
*
基礎的安裝、調整和相關的外掛參考：
MUKI SPACE：我的 Brackets 編輯器設定 (佈景與外掛)
YAO WARK：Brackets 網頁開發軟體
*
使用到現在雖然是個人感覺，Brackets視覺上顯得較為一體化，從編輯區到側欄、切換頁面的彈出視窗以及功能列都是同一個色系，不會看起來一塊一塊的。
整體在設計上比較沒有那麼偏程式人員，介面和彈出視窗等動畫上甚致還有安排緩衝動畫，這點用心讓我還蠻喜歡的。
沒有留言:
張貼留言
路過留個言