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
0
84
Introduction to Website Programming
Jeremy Yen
October 08, 2013
Tweet
Share
More Decks by Jeremy Yen
See All by Jeremy Yen
dEXonation
jeremy5189
0
110
A day of full stack developer @ NFU
jeremy5189
0
210
Club Mate and Hacker - 34C3 @ SITCON
jeremy5189
2
680
SITCON 2017 論壇系統開發分享 @ SITCON 2017 Summer
jeremy5189
0
220
poManeuver: Poland into space
jeremy5189
0
420
How we hacked a forum
jeremy5189
0
440
Bdecisive - Booking.com Taipei Hack 2nd Prize
jeremy5189
0
550
Social Intelligence Smart-device project
jeremy5189
0
62
IoT made easy @ SITCON x HK
jeremy5189
0
100
Other Decks in Technology
See All in Technology
[トレノケ雲の会 mod.13] 3回目のre:Inventで気づいたこと -CloudOperationsを添えて-
shintaro_fukatsu
0
110
Fanstaの1年を大解剖! 一人SREはどこまでできるのか!?
syossan27
2
270
ネットワーク可視化の世界
likr
6
4.1k
ゼロから創る横断SREチーム 挑戦と進化の軌跡
rvirus0817
3
400
ハイテク休憩
sat
PRO
2
180
非機能品質を作り込むための実践アーキテクチャ
knih
5
1.7k
事業貢献を考えるための技術改善の目標設計と改善実績 / Targeted design of technical improvements to consider business contribution and improvement performance
oomatomo
0
170
React Routerで実現する型安全なSPAルーティング
sansantech
PRO
2
310
サービスでLLMを採用したばっかりに振り回され続けたこの一年のあれやこれや
segavvy
2
580
【re:Invent 2024 アプデ】 Prompt Routing の紹介
champ
0
200
開発生産性向上! 育成を「改善」と捉えるエンジニア育成戦略
shoota
2
680
組織に自動テストを書く文化を根付かせる戦略(2024冬版) / Building Automated Test Culture 2024 Winter Edition
twada
PRO
20
5.8k
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
789
250k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.2k
Writing Fast Ruby
sferik
628
61k
Docker and Python
trallard
42
3.2k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
1
110
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
Measuring & Analyzing Core Web Vitals
bluesmoon
5
180
Visualization
eitanlees
146
15k
Scaling GitHub
holman
459
140k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
6
530
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
169
50k
Automating Front-end Workflow
addyosmani
1366
200k
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’] (從網址)