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
110
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Introduction to Website Programming
Jeremy Yen
October 08, 2013
More Decks by Jeremy Yen
See All by Jeremy Yen
dEXonation
jeremy5189
0
130
A day of full stack developer @ NFU
jeremy5189
0
220
Club Mate and Hacker - 34C3 @ SITCON
jeremy5189
2
750
SITCON 2017 論壇系統開發分享 @ SITCON 2017 Summer
jeremy5189
0
240
poManeuver: Poland into space
jeremy5189
0
490
How we hacked a forum
jeremy5189
0
530
Bdecisive - Booking.com Taipei Hack 2nd Prize
jeremy5189
0
590
Social Intelligence Smart-device project
jeremy5189
0
72
IoT made easy @ SITCON x HK
jeremy5189
0
110
Other Decks in Technology
See All in Technology
推論の観測、できていますか? 〜 Google Cloud Gemini Enterprise Agent Platformで 3つの Gemini モデルを実測して踏んだ、評価の罠 〜
shukob
PRO
0
150
AIエージェントの開発・提供におけるセキュリティリスクの論点と対策
flatt_security
1
570
AI-DLCって実際どう? 〜聞きたいこと全部聞いてみる〜
news_it_enj
0
220
Bet AI Day 2026丨How We Bet AI: AIとともに働く場をつくる
layerx
PRO
2
2.2k
[RSJ26] NarrativeFlow: Flow-Based Vision-Language-Action Model Using Robot Velocity Fields
keio_smilab
PRO
0
160
DMMブックスのNext.js化を加速させるAI活用 / Migrating DMM Books to Next.js with AI
kentarom
1
330
こんなアーキテクチャ図は嫌だ BEYOND THE TIME: 半年後の自分へ贈る15のメッセージ / 15 of Anti-pattern in AWS Architecture Diagrams
naospon
3
230
プロダクトエンジニアに必要な「いい感じ」に作る能力 〜たくさん作れる時代に、どこまで作るかの決め方〜
jnishime_dresscode
2
1.4k
AI 駆動 Terraform 開発/SRE_BizReach_MIXI_2
visional_engineering_and_design
0
330
Level Up Your CDK DX: 5 Tools I’ve Been Building
gotok365
2
190
リージョンの壁を越える、 ちょっと変わったAWSサービスの話
falken
PRO
0
240
[RSJ26] Building a VLA Model Based on Self-Distilled Classification
keio_smilab
PRO
0
190
Featured
See All Featured
How Software Deployment tools have changed in the past 20 years
geshan
1
34k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
3
1.2k
Speed Design
sergeychernyshev
33
2.1k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
4.2k
Principles of Awesome APIs and How to Build Them.
keavy
128
18k
We Are The Robots
honzajavorek
0
330
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
63
45k
[SF Ruby Conf 2025] Rails X
palkan
2
1.3k
A Soul's Torment
seathinner
7
3.5k
Music & Morning Musume
bryan
47
7.4k
Embracing the Ebb and Flow
colly
88
5.2k
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
920
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’] (從網址)