Embed Size (px)
Citation preview
ASP.NET MVC 4 WEB 課程時間 :2016/2/22報告者 : 謝政廷
2
講師資料 (I)
姓 名 謝政廷 (Duran) 職 稱 C# Developer
工作經歷 凌網科技 開發工程師、資深工程師、專案經理飛迅設計股份有限公司 C# Developer
學 歷 逢甲大學資訊工程所 碩士工作總年資 4 年專 長 Java Web 、 C# MVC .Net 、 PHP
Web 程式開發 (js, jquery, angularjs, css, SASS)單元測試、壓力測試、持續整合關聯式資料庫 (SQL 、 Stored procedure)Android 手機程式開發SVN 、 GitSQL Server 、 Oracle 、 MongoDBTomcat 、 IIS認 證 Oracle Certified Professional (Java SE 6 Programmer )Oracle Certified Associate, Professional (Oracle Database)Oracle SQL ExpertProgramming in HTML5 with JavaScript and CSS3 Specialist
3
講師資料 (II)
姓 名 賴怡君 (Ina) 職 稱 工程師工作經歷 恆鈦資訊 開發工程師
逢甲大學 資訊處 工程師凌網科技 智慧科技發展事業處 研發工程師
學 歷 逢甲大學資訊工程所 碩士工作總年資 7 年專 長 Java Web 、 C# MVC .Net
Web 程式開發 (js, jquery, angularjs, css)關聯式資料庫 (SQL 、 Stored procedure 、 Trigger)Android 手機程式開發SVN 、 GitSQL Server 、 SybaseTomcat 、 IIS
認 證The Sun Certified Java Programmer 5Programming in HTML5 with JavaScript and CSS3 Specialist
4
專案經歷 (1/2)• 經濟部中央地質調查所
– 臺灣溫泉露頭資料庫暨網頁建置• 主計總處
– 家庭收支訪問調查及人力資源調查系統建置• 台灣自來水股份有限公司
– 102 、 103 年用戶新改裝工程管理系統委外建置案– 104 年用戶新改裝後續擴充案
• 行政院勞工委員會中部辦公室– 技能職類測驗能力認證資訊系統建置及維護
• 國家實驗研究院國家災害防救科技中心– 災害事件簿查詢展示系統– 行動災害調查整合模組 (Android)
5
專案經歷 (2/2)• 宜誠資訊
– 國防部史政編譯室史料與軍書影像委外建置• 國家圖書館
– 國家圖書館「臺灣學術網路資源選介主題資料庫」建置案• 入出國與移民署
– 行動查緝服務建置案• 國家台灣文學館
– 102,103 年度文物文學典藏系統維護• 第三方支付 金流介接
6
推薦書籍與網站• (書籍 )ASP.net MVC 5 網站開發美學• （網站） MVA
– http://www.microsoftvirtualacademy.com/
• （網站） PluraSight– http://pluralsight.com
• 微軟優惠– https://www.visualstudio.com/zh-tw/products/free-developer-offers-vs
7
課程大綱• 專案運作、軟體開發流程與網頁程式開發介紹 (2/24)• Html, Css, JavaScript, C# 介紹 (3/2)• C# MVC .Net Part 1(3/9)• C# MVC .Net Part 2(3/16)• Database, Linq, Entity Framework(3/23)• 程式發布 (IIS 設定 , Azure, 其他工具 )
(3/30)
8
大綱• 專案運作介紹• 軟體開發流程
– 企劃與設計– 程式設計 ( 前端、後端、 DBA 、 QA)– 軟體品質 (CodeReview 、版本控管、測試、持續整合 )– 應用支援與客服– 專案管理 ( 敏捷開發的逆襲 )
• 網頁系統運作介紹• Visual Studio 環境認識與操作
9
凌網科技介紹專案運作介紹
10
專案成員介紹專案主持人
專案經理(PM)
系統需求分析(SA)
系統架構設計(SD)
開發工程師(PG)
測試工程師(QA) 客服窗口
建構管理業務協調
設計師(UI)
企劃
11
競標流程發現標案業務洽談
• 業務評估選擇開發團隊• 專案經理 需求評估與可行性分析• 企劃 美工進場備標• 評選資格投標• 專案經理報告 成功評選簡報 議價簽約
失敗服務建議書
服務說明書
12
專案執行流程啟動會議 需求訪談 程式開發
整合測試教育訓練系統上線
工作計畫書 系統分析文件 系統設計文件
測試計畫書 測試報告書教育訓練計畫書 教材
13
軟體開發流程
14
企劃、設計與分析師• 企劃
– 專案– 產品– 行銷– …
• 設計– 主視覺– 動畫– 版面規劃– 切版– UI– …
• 分析– 商業分析– 市場分析– 行銷分析– UX– …
15
程式設計• 前端工程師
– 設計師的關係– Html– CSS
• SASS, Less…– JavaScript
• Jquery, Angularjs, ReactJs• NodeJs• Gulp• Npm• IDE
16
程式設計• 後端工程師
– C#, Java, Python…– Test( 覆蓋率 )– ORM– Deploy– …
17
程式設計• DBA
– 資料庫最佳化– 預存程序– Trigger– SQL– 備援機制– …
• 架構、顧問– …
18
測試、環境與支援• QA
– 描述– 問題回報– 平台測試– 遞迴測試– …
• IT– 網域管理– 網路設定– 網路安全– 雲端部署– 機房管理– …
• 支援– 客戶服務– 問題處理– 問題回報– 溝通協調– 業務處理– …
19
專案管理• 傳統開發
– 建築師？• 敏捷式開發
20
開發流程
架構、分析
視覺
規格、流程
美工 動畫
（設計）視覺元件
CSS Javascript Html
（前端）實作
行銷、企劃
21
開發流程
架構、分析
C#
規格、流程
Java Python
（後端）實作
CSS Javascript Html
（前端）實作
22
開發流程C# Java Python
（後端）實作
Database
管理ＩＴ
管理
23
開發流程C# ＣＳＳ Html
（前端、後端）實作
架構、分析規格
ＱＡ管理
24
程式流程
撰寫程式Code
Review
撰寫測試
版本控管ＱＡ
持續整合
25
測試• 單元測試• 整合測試
– NUnit / Rhino Mocks / NSubstitute / FluentAssertions
• 行為測試– Selenium
• 壓力測試– Jmeter
26
Code Review• 沒有人一開始就會寫程式• 沒有人不犯錯• 沒有一開始最好的方法• 沒有一開始最好的架構
• 寫人看得懂的程式
27
版本控管軟體• 系統版本更改工作
– 誰改了程式碼 ? – 改了哪些程式碼 ?– 程式碼整合 ?– 系統運作測試 ?– 版本管理 ?
• 測試開發• 版本整合
28
版本控管軟體• 版本控管軟體 :
– Subversion,SVN– Mercurial– GIT
29
版本控管軟體• Subversion Server:
– http://www.visualsvn.com/server/
• Subversion Client– http://tortoisesvn.net/downloads.html
30
持續整合• Fake F#• Team City
31
網頁系統介紹
32
網頁系統簡介 (1/4)
使用者 (Client) 網頁伺服器 (Client)
請求
回覆
33
網頁系統簡介 (2/4)
使用者 (Client) 網頁伺服器 (Client)
請求
回覆
瀏覽器 JavaScript
ASPPHPJSP….
IIS 、 Tomcat…
34
網頁系統簡介 (3/4)
使用者 (Client) 網頁伺服器 (Client)
請求
回覆
瀏覽器 JavaScript
ASPPHPJSP….
存取
資料庫(Database)
MS SQLMY SQLORACLESYBASE
….
IIS 、 Tomcat…
35
網頁系統簡介 (4/4)
36
Html 介紹
37
Html 簡介 (1/2)• 超文件標示語言• 「網頁建立和其它可在網頁瀏覽器中看到的資訊」的一種標示語言• 副檔名 .html , .htm
來源： http://zh.wikipedia.org/wiki/HTML
例 1 ： <body></body>例 2 ： <title>123</title>例 3 ： <input type="text" value=" 輸入框文字 " name="text">
Html 簡介 (2/2)<!DOCTYPE html><html><head> <meta charset="utf-8"> <script src="/jquery.js"></script> <link rel="stylesheet" type="text/css" href="/stdtheme.css"> <title>JS Bin</title></head><body>
</body></html>
檔案類型宣告
主體區 表頭區通常是用來描述和整份文件有關的基本內容
基本標籤• 標題：
<h3>常用 </h3>
• 按鈕：<input type="button" value="按鈕名稱 ">
40
表單標籤• 輸入框：
<input type="text" value=" 輸入框文字 " name="text>
• 密碼輸入框：<input type="password" name="password" value="passwordValue">
• Radio Button ： <input type="radio" name="radio" value="radioValue">
41
表單標籤• 下拉選單：
<select> <option value="yellow">黃色 </option> <option value="blue">藍色 </option> <option value="gree">綠色 </option> </select>
• checkbox:<input type="checkbox“ value="checkboxValue" name="checkbox">
• 檔案上傳：<input type="file" name="file" >
42
表單標籤• 隱藏：
<input type="hidden" name="hidden" value="hiddenValue">
• 日期：input type="date" name="date ">
• 送出：<input type="submit" name="submit" value="submit">
43
標籤 ( 版面配置 )• <table>
<tr><th> 標籤</th></tr><tr><td>內容</td></tr>
</table>
• <div></div>• <span></span>• <p></p>
表單
表單應用
表單 輸入邏輯程式資料庫
送出 儲存資料
輸出邏輯程式
應用程式
網頁 讀取資料顯示
表單標籤
47
相關軟體 • Visual studio community• Sql server express• svn, git
– tortoisesvn, tortoisegit– SourceTree
• https://www.visualstudio.com/zh-tw/products/free-developer-offers-vs
