ASP.NET MVC 教學 — 由零開始的三天入門課

閱讀時間約 14 分鐘

ASP.NET MVC 教學 — 由零開始的三天入門課

課程介紹

MVC 是一種「設計模式」,理論上應該先學好物件導向(OOP)之後,才適合學習「設計模式」。微軟 ASP.NET MVC 提供了完善的開發架構,讓普羅大眾也有能撰寫符合 MVC 規範的網頁程式。

專為初學者設計的課程

市面上的 MVC 書籍與微軟官方教材,鎖定的讀者通常是寫過程式、有經驗的人。造成許多想學習 ASP.NET MVC 卻沒有經驗的人無門可入。甚至有人反應「上課第一天就聽不懂」、「書本看不到三章就放棄」。有鑑於此,《ASP.NET MVC 教學 — 由零開始的入門課》即是專門為初學者所設計的課程,即便先前沒有接觸過,也能輕易入門。但建議學習者最好具備基礎的程式設計能力,並知道資料庫(DataBase)與簡單的 T-SQL 指令,對本課程會有較佳的理解。
系統化教學
本課程規劃成三天的進度,前兩天的階段是為了補強學員的基礎。尤其是類別(class)的學習與使用,先用簡單的範例讓學員們練習,慢慢將基礎墊高,日後才有辦法銜接得上坊間的 MVC 書本與範例。等到打好基礎後,即會進入第三天的階段,學習更進階的功能。
第一天
從零開始告訴大家,市面上的商業網站由哪些功能組合而成,哪些功能學員也能從這堂課學到。MVC 的觀念與流程,直接用一個範例讓學員恍然大悟。並且帶領大家知道網頁的「前端」「後端」的差異。讓您親自動手撰寫第一個控制器(Controller)。
第二天
帶領各位熟悉網頁表單、Razor 的各種變化,並學習基本的 C# 語法(不用學到多深,夠用就好)。路由(Routing)與 MVC 的網址(URL)彼此關連。類別(class)入門與實作,全數讓學員親自動手做。到了第二天的課程,就已經在不知不覺中接觸過 M、V、C 三者,並且可以做出「資料新增」、「資料展示」的基本功能。
第三天
ASP.NET MVC 網頁正式搭配資料庫,做出商業網站的實用功能。不管是關鍵字(多重條件)搜尋、資料分頁(不採用現成套件,而是親自動手寫)、資料管理(新增、刪除、修改),各種功能一應俱全。最特別的是,為學員整理出「三個基本招式」,只要學會基礎三招,就可以衍生變化出各種功能,以簡馭繁,讓您學習更輕鬆!

課程特色

  • 以實作優先:減少理論說明,大量練習範例,講求從做中學。
  • 錯誤學習法:透過錯誤的範例從中學習,並找出自己的盲點。
  • 購買課程 https://9vs1.com/go/?i=20d6bc23f633

學員上課後會學到什麼或能做什麼

  • 瞭解 MVC 的基本觀念與流程。建立類別、屬性來描述您的物件、資料記錄。
  • 瞭解資料庫的應用、常見的網頁系統(購物商城、媒體網站、部落格 Blog、社群網站)相關功能是如何開發的。
  • Visual Studio 開發工具、SQL Server(資料庫)Management Studio 的基本操作。
  • 課程完成後,您將擁有一套簡單的網頁系統,可作為公佈欄、部落格 Blog 文章發表、產品說明與展示之用。
  • 此網頁系統包含以下功能:資料管理(新增、刪除、修改)、關鍵字搜尋(多重條件的搜尋)、網站首頁(主表明細 Master-Detail 資料展示)、分頁展示…等等必備功能。

學員上課前需具備哪些軟、硬體設備或常識

  • 基礎的程式設計能力,如 if 判別式、for / while 迴圈就夠了。
  • 知道資料庫(DataBase)與簡單的 T-SQL 指令,如:CRUD。 課程所需軟體皆可免費下載:
  • Visual Studio 2015、2017 或後續新版,請下載社群版(Community版)。
  • 建議使用 Windows 作業系統。因為 Visual Studio Code 與 Visual Studio for Mac 與教學畫面仍有許多差異。
  • SQL Server Express 版(免費)。建議使用 SQL Server 2012(Express版)或後續新版。

課程適合對象

  • 需要撰寫網頁系統、或對於網頁與資料庫的開發有興趣的朋友。
  • 未來的程式設計師 — 希望將來進入業界寫程式,開發網頁系統。
  • 曾寫過 ASP、ASP.NET(Web Form)、PHP、JSP 的朋友,現在想學習 ASP.NET MVC 5。
  • 購買課程 https://9vs1.com/go/?i=20d6bc23f633

學員見證

請輸入七折優惠代碼 xKeXP6p

課程綱要

第ㄧ天
1–1 初學者的第一門課
  • 大部分的商業網站,有哪些功能?
  • 後台管理區(登入後才能看見)
  • ASP.NET MVC 課程需要哪些軟體工具?
  • 從零開始,操作 Visual Studio (建立一個新專案 / New Project)
  • 初學者,學習程式的幾個階段
  • 網頁基本觀念,Response 與 Request
  • 講解 MVC
  • Case Study — 動手做!做中學!(一個範例讓你秒懂,瞬間開悟)
  • 檢視畫面(網頁)的基本架構
  • 執行並檢視成果(網頁、檢視畫面)
  • 用錯誤,找出自己盲點。瞭解 MVC 就靠這個範例!
  • 糾正錯誤、也糾正自己的觀念
  • 現在,您終於看得懂 MVC 的流程與運作
  • 動手寫自己的第一個控制器
  • 為動作「新增」一個檢視畫面
補充說明:
  • 網頁的「前端與後端」有何差異?
  • 路由(Routing)的簡單介紹
  • 商業網站使用路由、URL的範例
  • 如何使用本課程提供的範例?
1–2 Controller 與 View
  • 開啟原有的專案(MVC_Starter)
  • 從動作(Action)產生與新增「檢視畫面(View)」
  • 檢視畫面(View)的目錄,位於「 /Views/控制器名稱」的目錄下
  • 三種方式,執行與觀賞檢視畫面(View)的成果
  • 執行成果的「網址」代表什麼意思?
  • 簡單介紹,路由(Routing)
  • 修改路由的預設值
  • 回到控制器,練習 Index1A~1B 這兩個動作,有「動作」卻沒有對應「同名的」檢視畫面,這樣行嗎?
  • 輸出字串,練習 Index1C~1D 這兩個動作
  • 重新導向
  • 控制器的 HandleUnknowAction 方法(注意關鍵字 — override)
  • ViewBag、ViewData、 TempData,練習 Index3 動作
  • 錯誤示範,練習 Index3A 動作
1–3 Model 與 Class,第一個類別檔
  • 加入第一個類別檔
  • 類別檔的簡單示範(屬性、Property)
  • 自助餐的「餐盤」與類別檔
  • 註解符號 // 與 /// 的使用
  • 為自己定義的 Class1 小類別,給一個啟始值
  • MVC 三者都出現了,綜合練習!
  • 搭配類別檔,產生「Details」檢視畫面
  • Razor 與表單元件
  • 新的寫法與改良。IDE 開發工具出來幫忙。
  • 進一步解說檢視畫面,第一列的 @model
  • Lambda 的 goto 符號
  • 再一次練習,Index4 與 5
  • Index5 動作(展示多筆記錄)網站首頁,List 範本
  • 課後作業
第二天
2–1 檢視畫面(View)、Razor入門&表單
  • Razor入門。範例 Index6
  • 網頁裡的「前端」與「後端」技術
  • 簡介 Razor 後端語法(以 DateTime 為例)
  • Response、字串與整數
  • 超連結(Href)、Html.ActionLink
  • 字串、特殊符號、Raw、HTML 編碼。範例 Index7
  • Form 表單
  • Submit、Form 表單內外的 Button 有何差異與變化
  • Form 表單(Razor 的 HTML Helper)
  • POST 與 GET
  • String.Format() 方法、如何查詢字典(關鍵字與 MSDN 範例)
  • Razor 的 HTML Helper 與表單(BeginForm)
  • TextBox、TexBoxFor…等等
  • Lesson2Form 控制器 的 Index11Create 動作(新增一筆記錄,搭配類別檔)
  • AntiForgeryToken,防止 CSRF 攻擊
  • Label、LabelFor、EditorFor
  • MVC 與 Web Form 的差異,以「新增」一筆記錄為例
  • 簡介 MVC 的 Model Binding,以「新增」一筆記錄為例
2–2 觀念澄清 與 實作(複習 & 小考)
  • Lesson2 控制器的 Index11Create 動作(資料新增,搭配 Model)
  • 「資料新增」的檢視畫面 — Html.BeginForm 的各種變化
  • Lesson2 控制器的 Index12Create 動作(資料新增,搭配 List 集合)
  • Model Binding 的說明(對照以前 WebForm 的 Data Binding)
  • 題外話 — 介紹 Telerik 公司為 MVC 打造的控制項
  • class(類別)與 List 集合
  • 課後複習
  • Index13Create動作(資料新增,傳統HTML表單,FormCollection)
  • 題外話 — Visual Studio 造成的 Log 檔(可刪除)
第三天
3–1 從資料庫產生 Context、對應的類別檔
  • 從微軟官方網站的範例講起
  • 安裝 SQL Server 資料庫的範例
  • Context,從資料庫轉成類別檔(Code First)
  • Model,第一次搭配資料庫(操作步驟)
  • ADO.NET 實體資料模型
  • 來自資料庫的 Code First
  • 第一,資料庫連結字串
  • 第二,挑選資料表
  • 產生 /Models 目錄下的 Context檔案(.cs檔)
  • 重點複習
  • /Models 目錄下的 UserTable.cs(對應 UserTable 資料表)
  • System.ComponentModel 命名空間
  • 觀念解析,沒事搞一個類別檔幹嘛??
  • 回到我們熟悉的控制器,搭配資料庫與 Model
  • 資料庫連結 & 命名空間 + Model
  • 對比微軟官方教學範例,您現在懂了嗎?
3–2 「基礎篇」 — 新增、主表明細(Master-Details)
  • **基礎篇**。很重要!請多練習幾次!
  • (1)網站首頁(List,列出所有紀錄、資料列表)
  • 產生檢視畫面(List範本)
  • 重點!檢視畫面 與 @model
  • 執行成果,進一步解說 Razor 與檢視畫面
  • 課後複習
  • (2)網站首頁、主表明細(Detail,單一筆紀錄的明細)
  • 四種不同的寫法
  • 產生檢視畫面(Detail範本)
  • 進一步解說Razor與檢視畫面(幾種不同的寫法)
  • 日期與時間(DateTime)的輸出格式
  • (3)新增一筆記錄(Create),難度增加一點點。
  • 第一個Create動作
  • 產生空白的新增表單(檢視畫面,Create 範本)
  • Submit 之後,送給第二個 Create 動作來處理
  • 第二個 Create 動作,無須產生檢視畫面,只負責處理資料
  • 課後複習
3–3 「衍生篇」 — 編輯、刪除、搜尋、分頁
  • **衍生篇**
  • 先看成果(Delete 的檢視畫面,執行時的錯誤與更正)
  • 第二個 Delete 動作跟第一個有何不同?
  • 控制器裡面的第一個 Delete 動作 & 產生 Delete 的檢視畫面
  • Delete 的檢視畫面,有哪些奧妙?
  • 第二個 Delete 動作(不需產生檢視畫面)
  • 三種寫法,刪除這一筆記錄
  • 課後複習
  • Edit 編輯。
  • 控制器裡面的第一個 Edit 動作 & 產生 Edit 的檢視畫面
  • 先看成果(執行時的錯誤與更正)
  • Edit的檢視畫面,有哪些奧妙?
  • 總複習,Create / Delete / Edit / Detail 各種動作的檢視畫面,有何差異?
  • 第二個 Edit 動作(不需產生檢視畫面)
  • [Bind(Include=…白名單…)]、[Bind(Exclude=…白名單…)]黑名單
  • 過多發佈(OverPosting)攻擊
  • 第二個 Edit 動作(輸入一個物件),程式有兩種寫法
  • 另一種「編輯」的寫法 — Edit2。第二個 Edit2 動作(輸入一個 ID 數字),程式有兩種寫法
  • 「單一條件」的搜尋,兩種寫法。.Contains() 模糊搜尋與 .Where() 方法
  • IQueryable 簡介
  • 產生 Search 的檢視畫面(請用 List範本)
  • MVC 的路由(Route)
  • 「多個」條件的搜尋。(註:難度提升一些)
  • 多條件的搜尋,有哪些困難與注意事項?
  • 兩個動作,類似 Create(新增)的作法
  • 第二個搜尋動作,關鍵程式寫在這裡。兩種寫法。
  • 分頁(Paging)。(註:難度提升一些)
  • 分頁的原理&寫法。不同的 T-SQL 指令。
  • 控制器裡面的 IndexPage 動作(分頁)
  • 「補充教材」- ADO.NET 與 MVC
  • ADO.NET與參數
  • 查詢、讀取記錄,搭配 SQL 指令的 Select
  • ADO.NET 與 MVC 裡面的資料庫存取,寫法有何異同?
  • 觀察資料庫的操作(查詢、讀取記錄 — Select)
  • Web Form 快速開發,以 GridView 為例
  • 新增、刪除、修改的 SQL 指令
  • MVC 搭配 ADO.NET
  • 以 List(網站首頁,資料列表)為例,查詢、讀取記錄 — SQL 指令的 Select
  • MVC 的 GridView 控制項?第三方軟體 Telerik
  • 新增、刪除、修改的 SQL 指令
  • 預告,更多精彩的在後面!

購買課程 https://9vs1.com/go/?i=20d6bc23f633

為什麼會看到廣告
    4會員
    120內容數
    留言0
    查看全部
    發表第一個留言支持創作者!
    兩千MIS的沙龍 的其他內容
    隔壁部門搞了一個案子,三五年了,沒有成果。 今年 “又” 虧損一億多…….為什麼他們沒有被火(fire)? 就像日本的達摩(不倒翁),七倒八起?? 每一年,大家都看著他們(嘿嘿嘿!你們今年一定捲包袱走路) 但很奇怪,人家就是屹立不搖 人家說「債多不愁」 我嚇出一身冷汗 怎麼說呢? 我突然發現:
    以前沒做過,但臨時被要求 ASP.NET Web Service 要傳回 JSON格式 找到網路上兩篇好文章,為自己做筆記。 如果您寫過 Web Service的話 直接看程式碼就會做了,淺顯易懂。只有很細微的修改: 點選圖片可連回原文出處…. 如果您的(Client端)要用 jQuery來接收
    ASP.NET Web Service 與 jQuery AJAX [ 讀書筆記 ] 這裡蒐集了幾個很棒的範例,適合初學者入門 依照難易度(由淺入深) 第一階段,您需要先瞭解 jQuery的AJAX用法(應該說是程式範例、雛形,大概長什麼樣子?) 範例下載(VB & C#都有) — 相關文章:
    目前已上線的 ASP.NET MVC 內容(課程大綱) 累積時數 約 95小時 ​ 第一天的影片,免費給您評估: 您可以在 Youtube看見第一天(第一節)的內容,這裡只有 1–1 & 1–2 的內容。 1–1小節 https://youtu.be/9spaHik87-A ​ 願意練,就學得會!
    Youtube教學影片 — JSON, 20分鐘 快速入門 這是 Web Service、WCF、WebAPI課程中的一小段。 JSON與jQuery都是我們使用網頁服務時 “必備”的知識…… 影片網址 https://www.youtube.com/watch?v=8-1Fu9gWpfY
    第一天的ASP.NET MVC 影片,免費給您評估: 您可以在 Youtube看見第一天(第一節)的內容,這裡只有 1–1 & 1–2 的內容。 1–1課程(ASP.NET MVC) https://youtu.be/9spaHik87-A MVC的學習不簡單,上完課後,務必自己動手練!
    隔壁部門搞了一個案子,三五年了,沒有成果。 今年 “又” 虧損一億多…….為什麼他們沒有被火(fire)? 就像日本的達摩(不倒翁),七倒八起?? 每一年,大家都看著他們(嘿嘿嘿!你們今年一定捲包袱走路) 但很奇怪,人家就是屹立不搖 人家說「債多不愁」 我嚇出一身冷汗 怎麼說呢? 我突然發現:
    以前沒做過,但臨時被要求 ASP.NET Web Service 要傳回 JSON格式 找到網路上兩篇好文章,為自己做筆記。 如果您寫過 Web Service的話 直接看程式碼就會做了,淺顯易懂。只有很細微的修改: 點選圖片可連回原文出處…. 如果您的(Client端)要用 jQuery來接收
    ASP.NET Web Service 與 jQuery AJAX [ 讀書筆記 ] 這裡蒐集了幾個很棒的範例,適合初學者入門 依照難易度(由淺入深) 第一階段,您需要先瞭解 jQuery的AJAX用法(應該說是程式範例、雛形,大概長什麼樣子?) 範例下載(VB & C#都有) — 相關文章:
    目前已上線的 ASP.NET MVC 內容(課程大綱) 累積時數 約 95小時 ​ 第一天的影片,免費給您評估: 您可以在 Youtube看見第一天(第一節)的內容,這裡只有 1–1 & 1–2 的內容。 1–1小節 https://youtu.be/9spaHik87-A ​ 願意練,就學得會!
    Youtube教學影片 — JSON, 20分鐘 快速入門 這是 Web Service、WCF、WebAPI課程中的一小段。 JSON與jQuery都是我們使用網頁服務時 “必備”的知識…… 影片網址 https://www.youtube.com/watch?v=8-1Fu9gWpfY
    第一天的ASP.NET MVC 影片,免費給您評估: 您可以在 Youtube看見第一天(第一節)的內容,這裡只有 1–1 & 1–2 的內容。 1–1課程(ASP.NET MVC) https://youtu.be/9spaHik87-A MVC的學習不簡單,上完課後,務必自己動手練!
    你可能也想看
    Google News 追蹤
    Thumbnail
    這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
    Thumbnail
    美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
    Thumbnail
    Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...
    Thumbnail
    這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
    Thumbnail
    美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
    Thumbnail
    Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...