iT邦幫忙

第 11 屆 iT 邦幫忙鐵人賽

DAY 2
0
Modern Web

ASP.NET Web Form 入門30天系列 第 2

[ASP.NET] 新增Web表單(網頁)實例 + 網頁畫面如何產生?(在伺服器中的處理流程) + 工程師必須養成的良好命名習慣


本篇擷取重點
一、 建立Web表單(.aspx / .aspx.cs)
二、 網頁畫面如何產生?(在伺服器中的處理流程)
三、 範例,HELLO WORLD
四、 工程師必須養成的良好命名習慣


一、建立Web表單(.aspx / .aspx.cs)

檢視-方案總管-專案(test123)-滑鼠右鍵-加入-新增新項目- Web- Web表單( index.aspx )

https://ithelp.ithome.com.tw/upload/images/20190903/20120056BSaFXp5XXF.png

https://ithelp.ithome.com.tw/upload/images/20190903/20120056rRzufaU3ig.png

https://ithelp.ithome.com.tw/upload/images/20190903/20120056gfHE23kQFw.png

ASP.NET的Web表單,屬於動態編譯網頁

.aspx: Code File,也有人將它稱為ASP.NET的HTML,主要儲放版面設計相關的程式碼,修改程式碼後不用整體編譯,只重新整理頁面就可以看到效果。(下方貼心小補充有稍微解釋HTML)

.aspx.cs: Code Behind File後置程式碼,主要儲放含運算程序及連接資料庫相關的程式碼。是微軟在伺服器端運行的動態網頁檔案,須經由編譯而產生頁面。

==================================================================
貼心小補充:

1.在建置網頁時,我們會習慣將首頁命名為index.aspx。

命名的規則如下:建議以英文小寫數字、及限定的符號組成。 (_底線、- 連字號、~ 滑號、. 點)。

p.s 建議不要以中文命名,以免有些伺服器無法辨識,而讀不到網頁。

2.靜態網頁:
.html (Hyper Text Markup Language超文本標記語言):靜態網頁內容的標籤語法,透過瀏覽器的解讀呈現在網頁上。

==================================================================


二、網頁畫面如何產生?(在伺服器中的處理流程)

下圖解釋客戶端請求頁面時,伺服器端的處理流程圖:

https://ithelp.ithome.com.tw/upload/images/20190914/20120056fdJujPQ1eP.png

  1. DLL類別庫,是包含程式碼及可由多個程式在同一時間使用的資料的程式庫。這有助於提升重複使用程式碼和記憶體使用更有效率。藉由使用 DLL,程式可以是模組化成個別的元件。
  2. 最終回傳的都是已處理成最終顯示型態的html檔案

參考資料:
https://dzone.com/refcardz/core-aspnet?chapter=3
https://www.itread01.com/content/1546515036.html
https://www.itread01.com/content/1546515036.html


三、範例,HELLO WORLD

終於要進入寫程式的序章Hello World了!!

由於目前是要學習ASP.NET,程式就不放在設計畫面(.aspx)中,所以直接進入後置程式碼(.aspx.cs)。

一開始學習時,都是將程式碼設計在Page_Load事件裡面。

第一個要學習的是在畫面上顯示我們想要顯示的文字

首先介紹的是Response物件的Write()方法,它是ASP.NET程式回應給瀏覽器的網頁資料輸出物件。

1.直接將文字放入方法,純文字的話需要用""之間的文字轉成字串

Response.Write("Hello World by string<br>");  //br是HTML的換行符號,方便閱讀而以

2.先宣告一個字串變數,方法裡面放入字串變數,由於是變數所以不用使用""

string hello = "Hello World by Variables";  
Response.Write(hello);

3.網址部分會顯示網頁的程式名稱(index.aspx)

https://ithelp.ithome.com.tw/upload/images/20190903/20120056fTkWhIkz86.png

參考資料:
http://sosla78.pixnet.net/blog/post/15416971-%E3%80%90asp.net%E5%AD%B8%E7%BF%92%E6%97%A5%E3%80%91%E7%AC%AC%E4%B8%89%E6%AD%A5%EF%BC%8C%E5%BB%BA%E7%AB%8Basp.net%E8%A7%80%E5%BF%B5%E8%88%87resp

==================================================================
貼心小補充:

  1. 在.aspx.cs檔案中的註解方式為:
    //註解法,效果僅侷限於該橫列中,故不需要搭配結尾符號
    /* 此註解方式為區段概念,單純認註解的開頭符號及結尾符號,適合大篇幅多行式的註解 */

  2. 在.aspx / .html檔案中的註解方式為:
    https://ithelp.ithome.com.tw/upload/images/20190903/20120056VBJAp1zoJU.png

==================================================================


四、工程師必須養成的良好命名習慣

一眼就看出其中的含意,以及變數名稱的種類,整個架構也會比較清楚。不過在實務上,若團隊有規範就要依團隊為準,沒有規範才用慣例 XDD。

  1. 類別命名:
    英文大寫字母開頭,若有多個英文單字組成,採取大寫駝峰型
    EX:SimpleGame、MyStory、

  2. 變數、方法、屬性及參數等命名:
    英文小寫字母開頭,若有多個英文單字組成,採取大寫駝峰型
    (其中,全域變數:前方加上底線_,如_全域變數 )

內容一樣以英文數字、及限定的符號組成為主。 (_底線、- 連字號、~ 滑號、. 點)。

參考資料:
https://codertw.com/%E7%A8%8B%E5%BC%8F%E8%AA%9E%E8%A8%80/555937/


上一篇
[ASP.NET] Visual studio 2019安裝 + ASP.NET Web Form基礎介紹 + 黑夜模式(護眼)
下一篇
[ASP.NET] 如何使用 「開放資料( Open Data ) 」? + (預備篇:介接前,應該準備好的三件事情) + 如何簡單解釋 API ?
系列文
ASP.NET Web Form 入門30天30

2 則留言

2
YoChen
iT邦研究生 5 級 ‧ 2019-09-03 13:30:26

多行註解那一段的*變成斜體了~XDDD

真的欸,感謝你的提醒,馬上更正一下XDDD

1
小朱
iT邦新手 4 級 ‧ 2019-09-13 17:41:01

流程圖怪怪的,ASP.NET的處理器不是asp.dll,那是給傳統的ASP(.asp)用的。
ASP.NET的處理器是aspnet_wp.exe (Worker Process Hosting) 以及 aspnet_isapi.dll,由這兩個 DLL 先行處理後再轉送給 .NET 的 System.Web.dll 處理。

至於命名習慣,若團隊有規範就要依團隊為準,沒有規範才用慣例。

對欸,流程圖是拿ASP(.asp)流程圖改的,不過那部分好像比較底層,當時就沒深入了,所以自己錯了也不知道QQ,真的很感謝大大提供的更正訊息及觀念確立XDD

我要留言

立即登入留言