What Is Software Design?

程式設計不是 “building software”,而是 “designing software”。

Is Design Dead?

軟體系統的設計是演進來的,不能一步到位,而是要藉由憑繁與使用者互動得到的回饋來修改系統設計。

Programming is Gardening, not Engineering

與其把程式設計比喻成蓋房子,實際上更像是園藝。

Orthogonality and the DRY Principle

所有程式設計活動其實都是維護,因為絕大部分的時間都在改code,寫一點改一點。即使是新專案,也很快需要回頭作修改。

2014年10月11日 星期六

試玩React facebook 開發的js library !!!

http://facebook.github.io/react/docs/getting-started.html

是一套facebook所創造的 JS library


想要解決的問題!
solve one problem: building large applications with data that changes over time. To do this, React uses two main ideas.



Hello React 範例!!

ps:在<script type="text/jsx">的程式碼內第一行要/** @jsx React.DOM */ 才不會錯誤!!

<!DOCTYPE html>
<html>
  <head>
  <title>Hello React</title>
    <script src="react.js"></script>
    <script src="JSXTransformer.js"></script>
  </head>
  <body>
    <div id="example"></div>
    <script type="text/jsx">
    /** @jsx React.DOM */
    var HelloWorld = React.createClass({
      render: function() {
        return (
          <p>
            Hello, <input type="text" placeholder="Your name here" />!
            It is {this.props.date.toTimeString()}
          </p>
        );
      }
    });
    setInterval(function() {
      React.renderComponent(
        <HelloWorld date={new Date()} />,
        document.getElementById('example')
      );
    }, 500);
    </script>
  </body>
</html>

2014年10月7日 星期二

Sublime Text 3 Compare Tool




http://www.sublimerge.com/

安裝說明

  1. Install the Package Control (if you haven't already)
  2. Open Command Palette ([ctrl]+[shift]+[p] on Windows and Linux, [cmd]+[shift]+[p] on Mac)
  3. Choose Package Control: Install Package
  4. Search for Sublimerge Pro and hit [Enter]


使用方式

 1.[ctrl]+[shift]+[p]
2.Compare to view..

2014年9月18日 星期四

Regular Expression 與 C# Regex 教學

  • a|b*指示{ε, abbbbbb, ...}。
  • (a|b)*指示由包括空串、任意數目個ab字元組成的所有字串的集合。
  • ab*(c|ε)指示開始於一個a接著零或多個b和最終可選的一個c的字串的集合。

編號字元描述
1\將下一個字元標記為一個特殊字元、或一個原義字元、或一個向後參照、或一個八進制轉義符。例如,「n」匹配字元「n」。「\n」匹配一個換行符。序列「\\」匹配「\」而「\(」則匹配「(」。
2^匹配輸入字串的開始位置。如果設定了RegExp物件的Multiline屬性,^也匹配「\n」或「\r」之後的位置。
3$匹配輸入字串的結束位置。如果設定了RegExp物件的Multiline屬性,$也匹配「\n」或「\r」之前的位置。
4*匹配前面的子運算式零次或多次。例如:Gooo*gle 能匹配 Google、Goooooogle。* 等於 {0,}。
5+匹配前面的子運算式一次或多次。例如:Gooo+gle 能匹配 Gooogle、Goooooogle,但不能匹配 Google。+ 等於 {1,}
6?匹配前面的子運算式零次或一次。例如:Gooo?gle 只能匹配 Gooogle 和 Google。? 等於 {0,1}
7{n}n是一個非負整數。匹配確定的n次。例如:o{3} 能匹配 Gooogle 的 ooo,但不能匹配 Google。
8{n,}n是一個非負整數。至少匹配n次。
9{n,m}m和n均為非負整數,其中n<=m。最少匹配n次且最多匹配m次
10?當該字元緊跟在任何一個其他限制符(*,+,?,{n},{n,},{n,m})後面時,匹配範式是非貪婪的。非貪婪範式儘可能少的匹配所搜尋的字串,而預設的貪婪範式則儘可能多的匹配所搜尋的字串。
11.匹配除「\n」之外的任何單個字元。要匹配包括「\n」在內的任何字元,請使用像「[.\n]」的範式。
12(pattern)匹配pattern並獲取這一匹配。( ... ) 有群組的意思。例如:(ab) 能匹配 abc 中的 ab,但不能匹配 acc。
13(?:pattern)匹配pattern但不獲取匹配結果,也就是說這是一個非獲取匹配,不進行儲存供以後使用。例如:run(?:n|ning) 能匹配 running 整個字串,並且從此字串後繼續比對。
13(?=pattern)正向預查,在任何匹配pattern的字串開始處匹配尋找字串。這是一個非獲取匹配,也就是說,該匹配不需要獲取供以後使用。例如:Office(?=2003|2007|2010) 能匹配 Office2003 中的 Office,但不能匹配 Office2005 中的 Office,而從 Office 字串後繼續比對。
14(?!pattern)負向預查,在任何不匹配pattern的字串開始處匹配尋找字串。這是一個非獲取匹配,也就是說,該匹配不需要獲取供以後使用。例如:Office(?!2003|2007|2010) 能匹配 Office2005 中的 Office,但不能匹配 Office2010 中的 Office,而從 Office 字串後繼續比對。
15x|y匹配x或y。
16[xyz]字符集合。匹配所包含的任意一個字元。
17[^xyz]負值字符集合。匹配未包含的任意字元。
18[a-z]字元範圍。匹配指定範圍內的任意字元。
19[^a-z]負值字元範圍。匹配任何不在指定範圍內的任意字元。
20\b匹配一個單詞邊界,也就是指單詞和空格間的位置。
21\B匹配非單詞邊界。
22\cx匹配由x指明的控制字元。例如,\cM匹配一個Control-M或Enter符。x的值必須為A-Z或a-z之一。否則,將c視為一個原義的「c」字元。
23\d匹配一個數位字元。\d 等於[0-9]。
24\D匹配一個非數位字元。\D 等於[^0-9]。
25\f匹配一個換頁符。\f 等於\x0c和\cL。
26\n匹配一個換行符。\n 等於\x0a和\cJ。
27\r匹配一個Enter符。\r 等於\x0d和\cM。
28\s匹配任何空白字元,包括空格、製表符、換頁符等等。\s 等於[\f\n\r\t\v]。
29\S匹配任何非空白字元。\S 等於[^\f\n\r\t\v]。
30\t匹配一個製表符。\t 等於\x09和\cI。
31\v匹配一個垂直製表符。\v 等於\x0b和\cK。
32\w匹配包括底線的任何單詞字元。\w 等於「[A-Za-z0-9_]」。
33\W匹配任何非單詞字元。\W 等於「[^A-Za-z0-9_]」。
34\xn匹配n,其中n為十六進制轉義值。十六進制轉義值必須為確定的兩個數位長。例如,「\x41」匹配「A」。「\x041」則等價於「\x04&1」。正則運算式中可以使用ASCII編碼。
35\num匹配num,其中num是一個正整數。對所獲取的匹配的參照。例如,「(.)\1」匹配兩個連續的相同字元。
36\n標識一個八進制轉義值或一個向後參照。如果\n之前至少n個獲取的子運算式,則n為向後參照。否則,如果n為八進制數位(0-7),則n為一個八進制轉義值。
37\nm標識一個八進制轉義值或一個向後參照。如果\nm之前至少有nm個獲得子運算式,則nm為向後參照。如果\nm之前至少有n個獲取,則n為一個後跟文字m的向後參照。如果前面的條件都不滿足,若n和m均為八進制數位(0-7),則\nm將匹配八進制轉義值nm。
38\nml如果n為八進制數位(0-3),且m和l均為八進制數位(0-7),則匹配八進制轉義值nml。
39\un匹配n,其中n是一個用四個十六進制數位表示的Unicode字元。例如,\u00A9匹配版權符號(©)。



身分證
([A-Z]|[a-z])\d{9}
網址
http(s)?://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?
電子郵件
\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*
郵遞區號
\d{3}((-)?\d{2})? 
電話
[0-9]{2}\-[0-9]{7}
手機
[0-9]{4}\-[0-9]{3}\-[0-9]{3}


正整數
^\d*$ 
整數
^([+-]?)\d*$
小數點
^([+-]?)[1-9]\d*\.\d*$


驗證 IP
^[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}$
驗證時間 (HH:MM:SS)
([0-1][0-9]|2[0-3])\:[0-5][0-9]\:[0-5][0-9]
驗證日期 (YYYY/MM/DD)
^[0-9]{4}/(((0[13578]|(10|12))/(0[1-9]|[1-2][0-9]|3[0-1]))|
(02/(0[1-9]|[1-2][0-9]))|((0[469]|11)/(0[1-9]|[1-2][0-9]|30)))$


HTML 標籤
/^<([a-z]+)([^<]+)*(?:>(.*)<\/\1>|\s+\/>)$/
使用者名
^[a-z0-9_-]{3,16}$
密碼
^[a-z0-9_-]{6,18}$


中日韓符號區。收容康熙字典部首、中日韓輔助部首、注音符號、日本假名、韓文音符,中日韓的符號、標點、帶圈或帶括符文數字、月份,以及日本的假名組合、單位、年號、月份、日期、時間等。
\u2e80~\u33ffh
中日韓認同表意文字擴充a區,總計收容6,582個中日韓漢字。
\u3400~\u4dffh
中日韓認同表意文字區,總計收容20,902個中日韓漢字。
\u4e00~\u9fffh
彝族文字區,收容中國南方彝族文字和字根。
\ua000~\ua4ffh
韓文拼音組合字區,收容以韓文音符拼成的文字。
\uac00~\ud7ffh
中日韓兼容表意文字區,總計收容302個中日韓漢字。
\uf900~\ufaffh
文字表現形式區,收容組合拉丁文字、希伯來文、阿拉伯文、中日韓直式標點、小符號、半角符號、全角符號等。
\ufb00~\ufffdh

2014年3月12日 星期三

asp mvc api 利用ELMAH 第三方原件 架設error log 追蹤套件

step1. 安裝elmah 套件網址如下
https://code.google.com/p/elmah/

step2.ASP.NET 專案中選擇安裝 ELMAH on XML Log 這個 NuGet 套件
http://www.nuget.org/packages/elmah.xml
PM> Install-Package elmah.xml

step3.預設會將所有收集到的錯誤儲存成 XML 格式並置於專案的 ~\App_Data\Elmah.Errors 目錄下。

打開web.config
找到 <errorLog type="Elmah.XmlFileErrorLog, Elmah" logPath="~/App_Data/Elmah.Errors" /> 註解掉

step4.
將以下這段
<!--<modules>
      <add name="ErrorLog" type="Elmah.ErrorLogModule, Elmah" preCondition="managedHandler" />
      <add name="ErrorMail" type="Elmah.ErrorMailModule, Elmah" preCondition="managedHandler" />
      <add name="ErrorFilter" type="Elmah.ErrorFilterModule, Elmah" preCondition="managedHandler" />
    </modules>-->

改為以下這段
    <modules runAllManagedModulesForAllRequests="true">
      <remove name="ErrorLog" />
      <remove name="ErrorMail" />
      <add name="ErrorLog" type="Elmah.ErrorLogModule, Elmah" preCondition="managedHandler" />
      <add name="ErrorMail" type="Elmah.ErrorMailModule, Elmah" preCondition="managedHandler" />

    </modules>

step5. 請設定
<add name="elmah-sqlserver" connectionString= "連線字串請設定"

step6. 設定好後 127.0.0.1/elmah 就可以看到 log了!!

step7.設定將log丟到mail


 <elmah>
    <!--
        See http://code.google.com/p/elmah/wiki/SecuringErrorLogPages for 
        more information on remote access and securing ELMAH.
    -->
    <security allowRemoteAccess="false" />
    <errorLog type="Elmah.SqlErrorLog, Elmah" connectionStringName="elmah-sqlserver" /><!--elmah-sqlserver-->
    <!--<errorLog type="Elmah.XmlFileErrorLog, Elmah" logPath="~/App_Data/Elmah.Errors" />-->

    <errorMail from="test@gmail.com" to="test@gmail.com" subject="enjoyapi 錯誤log :" async="false" smtpPort="0" useSsl="true" />
  </elmah>
  
  <!--System.net Mail setup-->
  <system.net>
    <mailSettings>
      <smtp deliveryMethod="network">
        <network host="smtp.gmail.com" port="587" userName="test@gmail.com" password="test" />
      </smtp>
    </mailSettings>
  </system.net>


2014年2月26日 星期三

利用sublimall來管理您的 sublime text Packages 版本

step1.

先到sublimall來申請帳號密碼

http://sublimall.org/

step2.
安裝 Sublime Text 3 主程式

主控台視窗,或直接按下 Ctrl + ` 組合鍵

view => show console 

  1. 請注意:這段安裝程式碼,僅適用於 Sublime Text 3 版本!
  2. import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by) 

安裝好之後的畫面如下,你可以再按一次 Ctrl + ` 組合鍵以關閉主控台視窗

step3.
 [Preferences] –> [Package Control] 啟用這個 Sublime Text 套件管理員
Ctrl+Shift+P 然後輸入 inst 之後按下 Enter 鍵
Install Package
Ctrl-Shift-P Install Package and type Sublimall to install it.

將sublimall安裝進去


step4.設定您sublimall的email and api key

You just have to click on PreferencesPackage SettingsSublimall and Settings - User.

{
    ////////////////////////////
    //// Sublimall settings ////
    ////////////////////////////
    "api_root_url": "http://sublimall.org",
    "api_upload_url": "/api/upload/",
    "api_retrieve_url": "/api/retrieve/",

    ///////////////////////
    //// User settings ////
    ///////////////////////
    "email": "請輸入您的emil",
    "api_key": "請輸入key",
    // Paths must be: "Packages/SublimeCodeIntel" or "Installed Packages/Sublimall"
    "ignore_packages": [],
    // Set true if you want to exclude packages managed by Package Control
    "exclude_from_package_control": false,
    // Set false if you don't want to encrypt your configuration
    "encrypt": true,
    // Upload timeout in seconds
    "http_upload_timeout": 120,
    // Download timeout in seconds
    "http_download_timeout": 120,
    // Path to 7zip executable, though Sublimall tries to find it out itself
    "7za_path": "",
    // HTTP proxy to use for HTTP requests. Support for authentication
    // Examples: http://user:password@host:port or http://ip:port
    "http_proxy": ""
}




2014年2月6日 星期四

asp.net api mvc4 資料庫 更新 更新.edmx 與 model

step1.尋找已經加入的Model1.edmx的檔案,開啟檔案,找到要更新的table按下右鍵,點選"從資料庫更新模型"進入更新精靈


step2. 更新好後 會發現 .tt檔中的 model沒有跟著更新,請點選.tt檔按右鍵 "執行自動工具"

2014年2月4日 星期二

ASP .NET C# MVC4 寫 Api 自定api說明文件 利用HelpPage套件

STEP1. ASP.NET Web API 的相關路由設定
 App_Start\WebApiConfig.cs 檔案












讓我們的 ASP.NET Web API 永遠只回應 JSON 格式

setp2.替 ASP.NET Web API 的 API 控制器加上註解

我們先為 API 控制器加上 XML 註解,直接在類別上方輸入三條斜線 ( /// ) 就會自動產生 XML 註解範本

























setp3.產生專案的 XML 文件檔案
修改方案總管中的「專案屬性」




切換到「建置」頁籤,再勾選「XML 文件檔案」




預設的 XML 文件檔案會儲存在 bin\ 目錄下,請把內容改成 App_Data\XmlDocument.XML 這個路徑與檔名,之後才能讓 ASP.NET Web API 的說明頁面讀取到這個檔案。



最後執行 建置專案 ( F6 ) 就會自動在 App_Data 目錄下產生 XmlDocument.XML 檔案,而且每次建置都會自動更新此 XML 文件。




step4.透過 NuGet 安裝 Microsoft.AspNet.WebApi.HelpPage 套件


若要安裝 ASP.NET MVC 4 內建的 ASP.NET Web API ( v1 ) 相容的 HelpPage 版本,必須安裝舊版的 HelpPage  套件
安裝舊版套件需要透過套件管理器主控台才能執行安裝命令,如下指令與圖示:
Install-Package Microsoft.AspNet.WebApi.HelpPage -Version 4.0.30506



安裝的過程,它會自動幫你安裝一個名為 HelpPage 的 MVC 子網站 ( Area )

最後,我們開啟 Areas/HelpPage/App_Start/HelpPageConfig.cs 進行設定,把第一行註解取消,即可自動讀入 API 控制器所設定的那些 XML 文件。


config.SetDocumentationProvider(new XmlDocumentationProvider(HttpContext.Current.Server.MapPath("~/App_Data/XmlDocument.xml")));

其重點還是在上述陳述式的路徑與檔名必須正確:

"~/App_Data/XmlDocument.xml"

setp4.

我們測試一下,直接瀏覽到 http://localhost/Help 網址


















接下來你可以到 專案 的view的資料夾內 index中
加入聯接過去的方法
<a href="~/Help">API Document 說明書請點這裡</a>



最後小提醒

在撰寫注解的時候<param name =""  如果沒有出來顯示
表示你在你的mvc 方法中沒有設定輸入的參數  只有寫注解他是不會顯示的





參考網頁:http://blog.miniasp.com/post/2013/11/05/Creating-ASPNET-Web-API-Help-Pages-for-ASPNET-MVC-4.aspx

ios AFNetworking 將token包入 header中 比較安全

setp1.
在api溝通中可以將資料放置 header or body  透過ssl



-(void)modifyWater:(WaterSync*)water uuid:(NSString*)uuid completionHandler:(void (^)(NSDictionary *retDic, NSDictionary *errorDic))handler{

    NSString *path = [NSString stringWithFormat:@"v2/Drinkings"];

    NSDictionary *dic = @{@"uuid": water.uuid, @"cc":water.amount, @"drinked_at":water.time, @"auth_token":[[PassionBeanAccount sharedAccount] authToken]};
    
    [self setDefaultHeader:@"auth_token" value:[[PassionBeanAccount sharedAccount] authToken]]; //將token包入header
    
    [self patchPath:path parameters:dic success:^(AFHTTPRequestOperation *operation, id responseObject) {
        NSLog(@"ok");

        [MyWeb handleJsonResponseWithDataWithCompletionHandler:handler error:nil data:responseObject];
        
    } failure:^(AFHTTPRequestOperation *operation, NSError *error) {
        [MyWeb handleJsonResponseWithDataWithCompletionHandler:handler error:error data:nil errorCode:[operation.response statusCode]];
        
    }];


}

2014年1月23日 星期四

利用Foundation來設計適應的web app ui 版型

本文介紹的是位於美國加州Campbell,一家名叫"Zurb"的設計公司所製作的Foundation框架。Pixar(皮克斯動畫公司)和National Geographic(國家地理頻道)都有採用此框架製作網頁。

從Foundation專案的Features(特色介紹頁),可得知Foundation的三大特色是Grid(格線系統)Rapid Prototyping(快速原型開發)Mobility(支援行動裝置)

HTML Page Markup

<!DOCTYPE html> <!--[if IE 9]><html class="lt-ie10" lang="en" > <![endif]--> <html class="no-js" lang="en" > <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Foundation 5</title> <!-- If you are using CSS version, only link these 2 files, you may add app.css to use for your overrides if you like. --> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/foundation.css"> <!-- If you are using the gem version, you need this only --> <link rel="stylesheet" href="css/app.css"> <script src="js/vendor/modernizr.js"></script> </head> <body> <!-- body content here --> <script src="js/vendor/jquery.js"></script> <script src="js/foundation.min.js"></script> <script> $(document).foundation(); </script> </body> </html>


改變版型請參照docs 設定id
http://foundation.zurb.com/docs/