Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Introduction to Website Programming
Search
Jeremy Yen
October 08, 2013
Technology
98
0
Share
Introduction to Website Programming
Jeremy Yen
October 08, 2013
More Decks by Jeremy Yen
See All by Jeremy Yen
dEXonation
jeremy5189
0
120
A day of full stack developer @ NFU
jeremy5189
0
220
Club Mate and Hacker - 34C3 @ SITCON
jeremy5189
2
720
SITCON 2017 論壇系統開發分享 @ SITCON 2017 Summer
jeremy5189
0
240
poManeuver: Poland into space
jeremy5189
0
470
How we hacked a forum
jeremy5189
0
510
Bdecisive - Booking.com Taipei Hack 2nd Prize
jeremy5189
0
580
Social Intelligence Smart-device project
jeremy5189
0
67
IoT made easy @ SITCON x HK
jeremy5189
0
110
Other Decks in Technology
See All in Technology
BIツール「Omni」の紹介 @Snowflake中部UG
sagara
0
270
AIペネトレーションテスト・ セキュリティ検証「AgenticSec」ご紹介資料
laysakura
0
1.6k
🀄️ on swiftc
giginet
PRO
0
330
Zero Data Loss Autonomous Recovery Service サービス概要
oracle4engineer
PRO
5
14k
試されDATA SAPPORO [LT]Claude Codeで「ゆっくりデータ分析」
ishikawa_satoru
0
360
20260410 - CNTUG meetup #72 - DiskImage Builder 介紹:以 Kubespray CI 打造 RockyLinux 10 Cloud Image 為例
tico88612
0
120
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
1.1k
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
4
23k
DevOpsDays2026 Tokyo Cross-border practices to connect "safety" and "DX" in healthcare
hokkai7go
0
130
Bill One 開発エンジニア 紹介資料
sansan33
PRO
5
18k
DevOpsDays Tokyo 2026 見えない開発現場を、見える投資に変える
rojoudotcom
2
170
プロジェクトマネジメントは AIでどう変わるか?
mkg5383
0
220
Featured
See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
23k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
25k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
300
Chasing Engaging Ingredients in Design
codingconduct
0
160
Large-scale JavaScript Application Architecture
addyosmani
515
110k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Music & Morning Musume
bryan
47
7.1k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.4k
Google's AI Overviews - The New Search
badams
0
960
Documentation Writing (for coders)
carmenintech
77
5.3k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Transcript
NTUST Jeremy Yen
HTML 超文件標示語言 HyperText Markup Language,HTML 純文字
網頁瀏覽器可解讀 用來描述整個網頁的架構
CSS 層疊樣式表 Cascading Style Sheets 簡化HTML裡的樣式語法,實現
HTML >> 處理網頁架構 CSS >> 處理網頁樣式(Style) 網頁瀏覽器會將HTML和CSS一起解讀
JavaScript 昇陽電腦 / Sun Microsystems 內嵌在HTML的一段程式碼
<script language=“javascript”>程式碼</script> 由瀏覽器執行(客戶端)
VBScript Mircorosft 開發 內嵌在HTML的一段程式碼 <script language=“vbscript”>程式碼</script>
由瀏覽器執行(客戶端) 跟VB的語法很相近
ASP ASP: Active Server Page 由Microsoft開發,非開源軟體
僅能於Windows Server上執行 網頁副檔名為 .asp 或 .aspx (.NET 版) 可使用 VB,C#等語言進行開發 開發工具: Visual Web Developer Express (VS)
PHP PHP:Hypertext Preprocessor 腳本語言,主要用途是在於處理動態網頁 語法跟C++幾乎一樣
網頁副檔名為.php Facebook 以此語言開發
PHP運作原理 網站主機 <-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐ 客戶端
<< 要求home.php << POST資料 id,password -‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐-‐> 伺服器解析PHP檔案 依PHP程式碼處理輸入(POST)資料 處理完成,傳回 home.php (僅含HTML)
home.php (伺服器上) • <html> <head>
<title> <?php echo $id; ?> </title> </head> <body> <p> <?php If ($password == $db_data) { echo “登入成功”; } ?> </p> </body> </html>
home.php (客⼾戶端上) <html> <head>
<title> jeremy5189 </title> </head> <body> <p>登入成功</p> </body> </html>
PHP的標準輸⼊入輸出 輸出 echo $變數 輸入
$data = $_POST[‘data’] (從HTML的表單等) $id = $_GET[‘id’] (從網址)