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
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Jeremy Yen
October 08, 2013
Technology
100
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
730
SITCON 2017 論壇系統開發分享 @ SITCON 2017 Summer
jeremy5189
0
240
poManeuver: Poland into space
jeremy5189
0
470
How we hacked a forum
jeremy5189
0
520
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
ブラウザの投機的読み込みと投機ルールAPIを理解し、Webサービスのパフォーマンスを最適化する
shuta13
1
210
ボトムアップの改善の火を灯し続けろ!〜支援現場で学んだ、消えないための3つの打ち手〜 / 20260509 Kazuki Mori
shift_evolve
PRO
0
190
MySQL 9.7がやってきた ~これまでのあらすじと基本情報~ @ 日本MySQLユーザ会会2026年04月 / mysql97-yattekita
sakaik
0
150
GitHub Copilot CLI と VS Code Agent Mode の使い分け
tomokusaba
0
120
M5Stack CoreS3とZephyr(RTOS)で Edge AIっぽいことしてみた
iotengineer22
0
400
Scovilleモバイルエンジニア募集中.pdf
julienrudin
0
140
要件定義の精度を高めるための型と生成AIの活用 / Using Types and Generative AI to Improve the Accuracy of Requirements Definition
haru860
0
240
巨大プラットフォームを進化させる「第3のROI」
recruitengineers
PRO
2
2k
UIライブラリに依存しすぎないReact Native設計を目指して
grandbig
0
180
独断と偏見で試してみる、 シングル or マルチエージェント どっちがいいの?
shichijoyuhi
1
220
FessのAI検索モード:検索システムとLLMへの取り組み
marevol
0
150
Forget technical debt
ufried
0
140
Featured
See All Featured
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
2
780
Typedesign – Prime Four
hannesfritz
42
3k
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
270
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.4k
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
270
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
770
Building Flexible Design Systems
yeseniaperezcruz
330
40k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.4k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
530
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
[SF Ruby Conf 2025] Rails X
palkan
2
990
Un-Boring Meetings
codingconduct
0
280
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’] (從網址)