網頁

2012年2月29日 星期三

ASP.NET MVC 3 使用新的專案樣板–MVC Themed App


雖然說ASP.NET MVC 4會有新的專案預設樣版,不會再是千篇一律的藍色樣式,

ASP.NET MVC 4 Overview - Part 2: Default template changes and Adaptive Rendering using Viewport and CSS Media Queries

但是要等到ASP.NET MVC 4發佈也還需要一段時間,而平常專案開發的時候也不會是去使用預設的專案樣板,

在做一些簡單的專案時,會想要花功夫找樣板套用的工程師應該是不多,

我就是這樣的程式開發人員,對於預設樣板早就看到膩了,但是要花時間找一個免費的樣板來套用…想到就懶呀!

 

前幾天在更新VS2010的Extensions的時候,閒來無事就盯著VS2010擴充管理員的線上圖庫,一頁一頁的看,

看看是不是有新鮮的擴充可以裝來玩玩,因為主要是開發MVC專案,所以就下了關鍵字做搜尋,

然後就看了一個不曾看過的新東西…

SNAGHTML1b04523

練習 jQuery的小工具–jQueryPad


對於jQuery的初學者來說,常常會找不到一個合適的練習工具,我會建議初學者使用瀏覽器以及開發者工具,

使用IE瀏覽器,「各主要瀏覽器的開發者工具( Developer Tool ) Part.2 - IE

使用Google Chrome瀏覽器,「各主要瀏覽器的開發者工具( Developer Tool ) Part.4 - WebKit

使用Firefox瀏覽器的話,也是可以使用內建的開發者工具,而且Firefox 10的開發者工具則是全新面貌,
各主要瀏覽器的開發者工具( Developer Tool ) Part.1 - Firefox
Firefox 10 新增了令人興奮的開發者工具
Firefox 10全新開發者工具,支援網頁3D、HTML、CSS即時檢視

我心中最理想的jQuery Debug以及練習的工具組合則是:Firefox + Firebug,
Firefox 開發前端語言時的偵錯工具 Firebug 以及好用的套件

但是有的人會覺得,只是單純練習個jQuery的指令與操作應該不用大費周章的去搞這些吧?!

尤其是沒有接觸過開發者工具的人,光是要認識如何使用就相當頭大了,

所以可以退而求其次,可以使用「jQueryPad」來當做單純練習的工具。

2012年2月25日 星期六

Sublime Text 2 - 好用的前端程式編輯器 Part.4 更換主題(Theme)

前面兩篇文章說明了 Sublime2 安裝以及 Pack Control 的安裝與使用,而這一篇則是要來介紹如何更換主題,雖然說這並不是什麼多重要的功能,也不會為往後的操作上能帶來多大的效益,但是如果能夠把一個會時常面對的工具讓它的外觀可以變得賞心悅目一些,我相信在使用上以及觀看上可以讓我們更加的順眼,你說是吧!?

2012年2月22日 星期三

ASP.NET MVC 擴充HtmlHelper 加入 CheckBoxList 功能 - 2


距離之前那一篇「ASP.NET MVC 擴充HtmlHelper 加入 CheckBoxList 功能 - 1」都已經超過半年了,

在那篇文章中我們實作出一個水平方向呈現的CheckBoxList,

image

有了水平方向呈現的方式,也應該要有垂直方向顯示的吧?!

因為垂直方向的呈現在那時候於實作的過程中一直處於「卡關」的狀態,一直寫不出來,所以就一直Pending住,

然而就在隔了這麼久之後終於讓我做出來了,也發現到,這垂直方向的呈現並不是那麼難做,

也不需要去參考System.Web.UI.WebControls.RepeatInfoRenderVerticalRepeater」,

總之就是幾個關鍵地方而已,所以就廢話少說,直接進入主題。

2012年2月21日 星期二

Sublime Text 2 - 好用的前端程式編輯器 Part.3 安裝Package Control

Sublime Text 2(以後將會簡稱為 Sublime2)最大的一個特點就是可以安裝多種的 Package,而且 Packages 的種類相當多,有 PHP、Ruby、Java、JavaScript、jQuery 各種相關的 Packages,並不是每一種 Packages 都一定要安裝,當然是安裝對你開發上或是使用上有幫助的 Packages,相信我,這些 Packages 都可以大大地提昇開發與使用的效率,然而新安裝的 Sublime2 要安裝 Packages 是蠻不直覺的,雖然說 Sublime2 的安裝相當簡單,但是如果有一個功能可以簡化安裝步驟的話,將會讓我們使用 Sublime2 會更加隨心所欲。

2012年2月19日 星期日

Sublime Text 2 - 好用的前端程式編輯器 Part.2 安裝與簡單使用說明


上次已經簡單的介紹了「Sublime Text 2」是個什麼樣的工具了,而這一篇將會介紹如何安裝,除了安裝軟體的本身之外,也會簡單的說明幾個使用上的技巧。

內容概要:
  1. 安裝Sublime Text 2
  2. 使用Sublime Text 2的命令面板(Command Palette)
  3. 使用Console命令列
  4. 開啟/關閉側邊欄(Sider Bar)
  5. 文件切換
  6. 更換編輯顯示模式

 


2012年2月13日 星期一

ASP.NET MVC上傳檔案,使用file-uploader : 進階操作 Part.3


這個系列的文章之前有介紹過了基本操作與幾種進階操作的使用方式,本篇文章將會介紹以下內容後來作為收尾,

  • 設定是否可以多選檔案上傳
  • 設定是否可以拖曳檔案?!
  • 修改拖曳時可以上傳一個檔案而不可上傳多個檔案


    P.S.
    1.後兩個項目的進階操作會去修改到file-uploader.js的原始檔。
    2.此三項功能的修改主要是針對非IE瀏覽器。

  • 2012年2月9日 星期四

    Sublime Text 2 - 好用的前端程式編輯器 Part.1 介紹


    這幾天都一邊看「30 Days to Learn jQuery」一邊重新複習 jQuery,看著教學影片時就有個地方讓我引起好奇,教學影片裡編輯 jQuery 環境是在一個叫做「Sublime Text 2」的 Editor 下,

    image

    這個編輯器看起來相當清爽,而且在編輯前端網頁 HTML 或是 jQuery 時都有提示與自動完成的功能,在 Windows 環境下一直無法找到好用的編輯器,而看到這個雖然是在 Mac 作業系統中執行的 Sublime Text 2,到 Google 搜尋「Sublime Text 2」,看到它也有提供 Windows 版本,於是在好奇的心態下就嘗試使用它,而慢慢摸索 Sublime Text 2 的功能後發現到,Sublime Text 2 對我來說是個相當好用以及方便的編輯器。

    2012年2月3日 星期五

    線上學習資源:30天學jQuery(30 Days to Learn jQuery)


    前幾天我有在Google +專頁上分享兩個線上學習jQuery的網站,

    jQuery Fundamentals
    http://jqfundamentals.com/book/index.html


    jQuery Essentials Slideshow, Version 2
    http://marcgrabanski.com/articles/jquery-essentials-slideshow

    這兩個線上學習的資源都相當不錯,對於初學者來說都可以從中學習到很好的基礎,

    很多人(包括我在內)明明知道有這麼好的學習資源,但如果稍微鬆懈或是事情一忙就會忘了這一回事,

    而最近在網路上看到很多朋友分享了一個線上學習jQuery的資源,所以就在這邊介紹給大家。

     

    2012年2月1日 星期三

    ASP.NET MVC上傳檔案,使用file-uploader : 進階操作 Part.2


    繼續進行 valums file-uploader 的進階操作說明,這一篇文章將會說明以下的內容:


  • 更改出現訊息的方式
  • 上傳時也同時傳送其他參數資料
  • 上傳時、上傳完成時的事件處理
  •