2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練1(20160222)

ASP.NET MVC 4 WEB課程
時間:2016/2/22
報告者:謝政廷

講師資料(I)
2
姓名謝政廷(Duran) 職稱 C# Developer
工作經歷凌網科技開發工程師、資深工程師、專案經理
飛迅設計股份有限公司 C# Developer
學歷逢甲大學資訊工程所碩士
工作總年資 4年
專長 Java Web、C# MVC .Net、PHP
Web程式開發(js, jquery, angularjs, css, SASS)
單元測試、壓力測試、持續整合
關聯式資料庫(SQL、Stored procedure)
Android手機程式開發
SVN、Git
SQL Server、Oracle、MongoDB
Tomcat、IIS
認證 Oracle Certified Professional (Java SE 6 Programmer )
Oracle Certified Associate, Professional (Oracle Database)
Oracle SQL Expert
Programming in HTML5 with JavaScript and CSS3 Specialist

講師資料(II)
姓名賴怡君(Ina) 職稱工程師
工作經歷恆鈦資訊開發工程師
逢甲大學資訊處工程師
凌網科技智慧科技發展事業處研發工程師
學歷逢甲大學資訊工程所碩士
工作總年資 7年
專長 Java Web、C# MVC .Net
Web程式開發(js, jquery, angularjs, css)
關聯式資料庫(SQL、Stored procedure、Trigger)
Android手機程式開發
SVN、Git
SQL Server、Sybase
Tomcat、IIS
認證
The Sun Certified Java Programmer 5
Programming in HTML5 with JavaScript and CSS3 Specialist
3

專案經歷(1/2)
4
• 經濟部中央地質調查所
– 臺灣溫泉露頭資料庫暨網頁建置
• 主計總處
– 家庭收支訪問調查及人力資源調查系統建置
• 台灣自來水股份有限公司
– 102、103年用戶新改裝工程管理系統委外建置案
– 104年用戶新改裝後續擴充案
• 行政院勞工委員會中部辦公室
– 技能職類測驗能力認證資訊系統建置及維護
• 國家實驗研究院國家災害防救科技中心
– 災害事件簿查詢展示系統
– 行動災害調查整合模組(Android)

專案經歷(2/2)
5
• 宜誠資訊
– 國防部史政編譯室史料與軍書影像委外建置
• 國家圖書館
– 國家圖書館「臺灣學術網路資源選介主題資料
庫」建置案
• 入出國與移民署
– 行動查緝服務建置案
• 國家台灣文學館
– 102,103年度文物文學典藏系統維護
• 第三方支付金流介接

推薦書籍與網站
•(書籍)ASP.net MVC 5 網站開發美學
•（網站）MVA
–http://www.microsoftvirtualacademy.com/
•（網站）PluraSight
–http://pluralsight.com
•微軟優惠
–https://www.visualstudio.com/zh-
tw/products/free-developer-offers-vs
6

課程大綱
• 專案運作、軟體開發流程
與網頁程式開發介紹 (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)
7

大綱
•專案運作介紹
•軟體開發流程
–企劃與設計
–程式設計(前端、後端、DBA、QA)
–軟體品質(CodeReview、版本控管、測試、持續整
合)
–應用支援與客服
–專案管理(敏捷開發的逆襲)
•網頁系統運作介紹
•Visual Studio環境認識與操作
8

專案成員介紹
專案主持人
專案經理
(PM)
系統需求分
析
(SA)
系統架構設
計
(SD)
開發工程師
(PG)
測試工程師
(QA)
客服窗口
10
建構管理業務協調
設計師
(UI)
企劃

競標流程
發現標案
業務洽談
• 業務評估選擇開發團隊
• 專案經理需求評估與可行性分析
• 企劃美工進場備標
• 評選資格投標
• 專案經理報告成功評選簡報
11
議價
簽約
失敗
服務
建議書
服務
說明書

專案執行流程
啟動會議需求訪談程式開發
整合測試教育訓練系統上線
12
工作計畫
書
系統分析
文件
系統設計
文件
測試計畫
書
測試報告
書
教育訓練
計畫書
教材

企劃、設計與分析師
•企劃
–專案
–產品
–行銷
–…
14
•設計
–主視覺
–動畫
–版面規劃
–切版
–UI
–…
•分析
–商業分析
–市場分析
–行銷分析
–UX
–…

程式設計
•前端工程師
–設計師的關係
–Html
–CSS
•SASS, Less…
–JavaScript
•Jquery, Angularjs, ReactJs
•NodeJs
•Gulp
•Npm
•IDE
15

程式設計
•後端工程師
–C#, Java, Python…
–Test(覆蓋率)
–ORM
–Deploy
–…
16

程式設計
•DBA
–資料庫最佳化
–預存程序
–Trigger
–SQL
–備援機制
–…
17
•架構、顧問
–…

測試、環境與支援
•QA
–描述
–問題回報
–平台測試
–遞迴測試
–…
18
•IT
–網域管理
–網路設定
–網路安全
–雲端部署
–機房管理
–…
•支援
–客戶服務
–問題處理
–問題回報
–溝通協調
–業務處理
–…

專案管理
•傳統開發
–建築師？
•敏捷式開發
19

開發流程
20
架構、分析
視覺
規格、流程
美工動畫
（設計）視覺元件
CSS Javascript Html
（前端）實作
行銷、企劃

開發流程
21
架構、分析
C#
規格、流程
Java Python
（後端）實作
CSS Javascript Html
（前端）實作

開發流程
22
C# Java Python
（後端）實作
Database
管理
ＩＴ
管理

開發流程
23
C# ＣＳＳ Html
（前端、後端）實作
架構、分析
規格
ＱＡ
管理

程式流程
24
撰寫程式
Code
Review
撰寫測試
版本控管
ＱＡ
持續整合

測試
•單元測試
•整合測試
– NUnit / Rhino Mocks / NSubstitute /
FluentAssertions
•行為測試
–Selenium
•壓力測試
–Jmeter
25

Code Review
• 沒有人一開始就會寫程式
• 沒有人不犯錯
• 沒有一開始最好的方法
• 沒有一開始最好的架構
• 寫人看得懂的程式
26

版本控管軟體
•系統版本更改工作
–誰改了程式碼 ?
–改了哪些程式碼 ?
–程式碼整合 ?
–系統運作測試 ?
–版本管理 ?
•測試開發
•版本整合
27

版本控管軟體
•版本控管軟體:
–Subversion,SVN
–Mercurial
–GIT
28

版本控管軟體
•Subversion Server:
–http://www.visualsvn.com/server/
•Subversion Client
–http://tortoisesvn.net/downloads.html
29

持續整合
•Fake F#
•Team City
30

網頁系統簡介(1/4)
32
使用者 (Client) 網頁伺服器 (Client)
請求
回覆

33
請求
回覆
瀏覽器
JavaScript
ASP
PHP
JSP
….
IIS、Tomcat…

34
請求
回覆
瀏覽器
JavaScript
ASP
PHP
JSP
….
存取
資料庫
(Database)
MS SQL
MY SQL
ORACLE
SYBASE
….
IIS、Tomcat…

Html簡介(1/2)
• 超文件標示語言
• 「網頁建立和其它可在網頁瀏覽器中看到
的資訊」的一種標示語言
• 副檔名.html , .htm
37來源：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="按鈕名稱">

表單標籤
• 輸入框：
<input type="text" value="輸入框文字" name="text>
• 密碼輸入框：
<input type="password" name="password"
value="passwordValue">
• Radio Button：
<input type="radio" name="radio" value="radioValue">
40

表單標籤
• 下拉選單：
<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" >
41

表單標籤
• 隱藏：
<input type="hidden" name="hidden" value="hiddenValue">
• 日期：
input type="date" name="date ">
• 送出：
<input type="submit" name="submit" value="submit">
42

標籤(版面配置)
• <table>
<tr>
<th>標籤</th>
</tr>
<tr>
<td>內容</td>
</tr>
</table>
• <div></div>
• <span></span>
• <p></p>
43

表單應用
表單輸入邏輯
程式
資料庫
送出儲存資
料
輸出邏輯
程式
應用程式
網頁
讀取資
料
顯
示

相關軟體
• Visual studio community
• Sql server express
• svn, git
– tortoisesvn, tortoisegit
– SourceTree
• https://www.visualstudio.com/zh-
tw/products/free-developer-offers-vs
47

2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練1(20160222)

2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練1(20160222)

More Related Content

What's hot

Viewers also liked

Similar to 2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練1(20160222)

More from Duran Hsieh

2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練1(20160222)

Editor's Notes