ASP.NET MVC - 線上相簿

課程創作: MIS2000 Lab.

課程適合地區:全球

課程影片總長度: 5.8小時

最後更新日期:2019-10-05

分享課程:
方案一
單購本課程
NT3,800

課程介紹

ASP NET MVC PhotoSharing MIS2000Lab 1

你是否也曾有疑惑,學會了 ASP.NET MVC 之後,能應用在什麼地方呢?本課程特別採用了一個公開的範例 -「線上相簿」,讓學員從線上網站的運作中,拆解每個功能與步驟。

ASP NET MVC PhotoSharing MIS2000Lab title
ASP NET MVC PhotoSharing MIS2000Lab 2

對已經上過「ASP.NET MVC 教學 - 由零開始的入門課」的學員而言,本課程是一個挑戰,也是一種複習。在經過這個專案解說後,相信您會恍然大悟,發現將以前學過的功能套用在實際網站上,原來是這麼容易的事!利用入門課程所學的「零散」招式,立即實戰應用,並加以「整合」,絕對能大幅提升您的學習成效。

ASP NET MVC PhotoSharing MIS2000Lab title
ASP NET MVC PhotoSharing MIS2000Lab 3

傳統的書籍與課程,常用留言板、部落格這些以「文字」為主的範例來解說,本範例搭配檔案上傳(FileUpload)的功能以「圖片、線上相簿」為主體,應用更廣泛,成果也更生動活潑。尤其是(1) 將圖片存入(新增、Insert Into)資料表,(2)再將二進位內容取出,還原成圖片檔案。這樣進階的範例,相信是初學者真正需要的。

除了原本的範例以外,額外添加的「分頁(Paging)」、「搜尋」、搭配檔案上傳的「編輯」功能,都是原廠範例沒有的,加上搭配了兩個家庭作業,讓您學到的東西比原本的專案還要多!

ASP NET MVC PhotoSharing MIS2000Lab 4

以Google為例,當您搜尋的關鍵字有上千筆紀錄時,您必須把搜尋結果分頁展示,每一頁展示二十筆記錄,一頁一頁呈現,才能縮減反應時間,減低網站負擔,所以「分頁」與「搜尋」兩種功能的合併,是每個網站必備的!

搭配檔案上傳的「編輯」功能,可能因為難度又提升了一些,所以原廠範例並不包含在內。只要有基礎,隨手增補上去,一點也不難,這三個額外提供的功能也是老師堅持給您的補充教材。讓各位能從真正的專案中,重新思維並複習自己以前學過的基礎招式,真正轉化成實戰經驗!

ASP NET MVC PhotoSharing MIS2000Lab title

0_Starter

課程介紹與目標學員的基礎能力。 在您進入課程之前,請先評估自己的能力。建議已經完成前三天ASP.NET MVC入門課程的學員,參與本課程才能真正學到經驗。這是一個簡化的課程,透過拆解一個線上相簿的網站,為您解說各種功能,對應您以前學過的招式。對於已經入門ASP.NET MVC的學員來說,是一種挑戰也是一種複習。

1_DB

先介紹「線上相簿」會用到的資料表架構與特點。這個專案會把上傳的圖檔存入資料表,所以用到了一些特別的設定。

2_Model

如何將資料庫轉換成Context,並把資料表對應為ViewModel、類別檔。要存放二進位的資料表欄位,變成類別檔會是怎樣的資料型態。

2-1_Model_HomeWork

提供一個家庭作業,讓老師陪著您一起完成,透過自己動手做,親自複習課程重點。

3-1_Action_View

MVC的控制器裡面,如何撰寫Action動作,並產生對應的Viewer檢視畫面是非常重要的基礎。

3-2_Route

Route路由的設定與應用。

3-3_Action_PartialView

PartialView的應用。

3-4_HomeWork

提供一個家庭作業,讓老師陪著您一起完成,透過自己動手做,親自複習課程重點。

3-5_Master_List

網站首頁,多筆記錄(報表)的資料展示,從資料庫讀取並展示記錄。介紹List範本。 如何把資料表裡面的二進位內容,還原成一張圖片檔並呈現在網頁上,是本範例的重點。

3-6_Details

單一筆記錄(明細檔)的資料展示,從資料庫讀取並展示記錄。介紹Details範本。

3-7_Create

新增一筆記錄並上傳圖片。因為本專案「線上相簿」需要搭配檔案上傳(FileUpload),所以這個新增(Create)功能的難度較高。要將上傳的圖片以二進位的型態存入資料表,程式會繁瑣一些。

3-8_Search

[本課程額外加入] 搜尋,以關鍵字進行模糊搜尋,是所有網站必備的基礎功能。由於原本的範例不提供,這是老師額外的補充教材。

3-9_Page

[本課程額外加入] 分頁,不管是網站首頁或是搜尋的結果,倘若資料量太大,就必須透過「分頁」展示,節省網站資源。這也是所有網站必備的基礎功能。由於原本的範例不提供,這是老師額外的補充教材。

3-10_FileUpload01

檔案上傳的基本範例。檔案上傳搭配CRUD的功能,在當今網站中是非常重要的,沒有圖片的搭配,只有文字的網站很難受到關注與喜愛。

3-11_FileUpload02

檔案上傳有不少變化,所以我們準備了兩段影片為您介紹其中的特點。並為您解析兩種不同的檔案上傳作法,各有哪些優缺點?

3-12_Delete_Edit

刪除與編輯。[本課程額外加入] 「編輯」與 檔案上傳(FileUpload) 的綜合應用,由於原本的範例不提供,這是老師額外的補充教材。編輯的檢視畫面,需要呈現圖片。編輯(修改資料表中既有的紀錄)時,該如何搭配檔案上傳,取代圖片呢?您必須融合前面學過的 Create、Details兩種功能,才能在「編輯」功能中妥善的搭配檔案上傳(FileUpload)。

ASP NET MVC PhotoSharing MIS2000Lab title
  • 以實作優先:減少理論說明,大量練習範例,講求從做中學。
  • 錯誤學習法:透過錯誤的範例從中學習,並找出自己的盲點。
  • 採用網路公開的專案,讓學員從真正的專案中,重新思維並複習自己以前學過的基礎招式,真正轉化成實戰經驗。
ASP NET MVC PhotoSharing MIS2000Lab 5

凡購買「ASP.NET MVC 教學 - 由零開始的入門課」與「ASP.NET MVC 教學 - 由入門到進階」兩課程的學員,即可獲得本課程 NT 2,800 元的超值優惠!(本優惠適用方案一)

優惠代碼(購買後顯示):

ASP NET MVC PhotoSharing MIS2000Lab 6

凡以「方案二」三課合購方式購買「ASP.NET MVC 教學 - 由零開始的入門課」、「ASP.NET MVC 教學 - 由入門到進階」與本課程的學員,將以超划算的價格同時取得三門課程!

ASP NET MVC PhotoSharing MIS2000Lab title
ASP NET MVC PhotoSharing MIS2000Lab 7
ASP NET MVC PhotoSharing MIS2000Lab title

0_Starter
1_DB
2_Model
2-1_Model_HomeWork
3-1_Action_View
3-2_Route
3-3_Action_PartialView
3-4_HomeWork
3-5_Master_List
3-6_Details
3-7_Create
3-8_Search
3-9_Page
3-10_FileUpload01
3-11_FileUpload02
3-12_Delete_Edit

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

  • 以實際上線的網站專案 - ASP.NET MVC「線上相簿」為例。用實際網站為您解說MVC各種功能。從實戰中拆解範例與學習,更具成效。
  • 以實際網站來解說ASP.NET MVC的架構與觀念,搭配Routing路由。為您解析Model-Viewer-Controller三者的關連。
  • 除了基礎CRUD必備功能之外,本課程更加入原本專案沒有的「分頁」與「搜尋」、搭配檔案上傳的「編輯」功能,讓您學到的比原本專案更多。
  • 檔案上傳(FileUpload)後,將相片(圖片)轉成二進位並存入資料表。
  • 將資料表裡面二進位的內容,恢復成圖片格式,重新呈現在HTML網頁上。

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

  • 建議已完成前面三天的入門課 - 「ASP.NET MVC 教學 - 由零開始的入門課」的學習。
  • 知道資料庫(DataBase)與簡單的 T-SQL 指令,如:CRUD。 課程所需軟體皆可免費下載。
  • Visual Studio 2015~2019或後續新版,請下載社群版(Community版)。
  • 建議使用 Windows 作業系統。因為 Visual Studio Code 與 Visual Studio for Mac 與教學畫面仍有差異。
  • SQL Server Express 版(免費)。建議使用 SQL Server 2012(Express版)或後續新版。

課程適合對象

  • 本課程屬於進階課程,建議完成「ASP.NET MVC 教學 - 由零開始的入門課」課程後再來學習。
  • 需要撰寫網頁系統、或對於網頁與資料庫的開發有興趣的朋友。
  • 未來的程式設計師 -- 希望將來進入業界寫程式,開發網頁系統。
  • 曾寫過 ASP、ASP.NET(Web Form)、PHP、JSP 的朋友,現在想學習 ASP.NET MVC 5。

老師介紹

ASP.NET MVC instructor MIS2000Lab
MIS2000 Lab.
  • 若有問題,歡迎來信聯繫 mis2000lab (at) yahoo.com.tw 謝謝您
  • 國立大學資管碩士畢業。
  • 微軟 MVP(2008/4/1~2017/7/1)
  • 2001 年至今,均負責網頁程式與微軟平台與技術之相關工作。
  • 資策會七年工作經歷與(南區)專任講師。
  • 撰寫 20 本以上的電腦書籍。
  • 現任職某大資通訊上市公司軟體開發團隊,擔任技術經理。
  • 2009 年起,工作之餘並在台中市電腦公會與民間補習班兼任講師。
  • 2015 年起,參與網路教學(直播、遠距教學影片)。
  • 自教學以來,實體課程與線上教學之學員已逾千人次。

課程評語與問答