Mr.Warawut KhangkhanFacebook: http://www.facebook.com/AjWarawut           Twitter: http://twitter.com/awarawut            ...
- F                                F          F (Client-Server)                                     F (Client-Side Scripti...
Mr.Warawut Khangkhan   3   F   3
F- F   FMr.Warawut Khangkhan   3   F              4
- F                                   F     F            F              FMr.Warawut Khangkhan   3       F             5
- F                                   F     F            F              FMr.Warawut Khangkhan   3       F             6
FMr.Warawut Khangkhan   3   F       7
Mr.Warawut Khangkhan   3   F   8
Static (Static Programming)                           Dynamic (Dynamic Programming)Mr.Warawut Khangkhan   3           F   ...
Static (StaticProgramming)Mr.Warawut Khangkhan   3    F               10
Dynamic (DynamicProgramming)Mr.Warawut Khangkhan   3    F                 11
Mr.Warawut Khangkhan   3   F   12
F (Client-Side                                                         (Client-Scripting)                                 ...
F           F     F    HTML – HyperText Markup Language    XHTML – eXtensible HyperText Markup Language    DOM (Document O...
HTML      F         HyperText Markup Language                                           F    (Hypermedia Document Descript...
F                             HTML (HTML Elements)               HTML –                      F                  <  >      ...
F                   HTML (HTML Elements)Mr.Warawut Khangkhan   3       F              17
F                  HTML <html> <head>    <title>            </title> </head> <body>     F     F </body> </html>Mr.Warawut ...
HTML 1.                        F (Heading)Mr.Warawut Khangkhan   3         F       19
HTML (Cont.) 2.                        F   F (Paragraps)Mr.Warawut Khangkhan   3            F          20
HTML (Cont.) 3.        <br> - F              F    F   F F F   F F          F FMr.Warawut Khangkhan   3     F              ...
HTML (Cont.) 4.          <a> -         F   F       HTML,              ,        Web DesignMr.Warawut Khangkhan   3         ...
HTML (Cont.) 5.          <frame> - F         HTML   F   F              FMr.Warawut Khangkhan   3     F                  23
HTML (Cont.)6.   <table> -            F            F    <tr> F                         <td> F       F F   F               ...
HTML (Cont.) 7.                F        (List) –   HTML   F       -   Unordered Lists       -   Ordered Lists       -   De...
HTML (Cont.)       Unordered List –      F       F      F       F      F              ( )     F     F List    F         F ...
HTML (Cont.)       Ordered List –    List                          F             F         F                              ...
HTML (Cont.)       Definition List –     List        F                F                   F     F    <dl>   F         2 F ...
HTML (Cont.)Nested List –       F List F   List     F        F F         F           F                                    ...
HTML (Cont.) 8.          <img> -       F          HTMLMr.Warawut Khangkhan   3       F             30
HTML                   F   F 1.          <form> -           F           F   F   F         F      F FMr.Warawut Khangkhan  ...
HTML                      F   F (Cont.) 2.          <input> -     F F            F   F      F       (     <form>) 6       ...
HTML                                  F                 F (Cont.)       Text –                F   F                       ...
HTML                    F             F (Cont.)       Radio –             F                          F F F F       Checkbo...
HTML                                                    F             F (Cont.)       Submit –                            ...
HTML                  F        F (Cont.) 3.          <select> -    F F              F  F                                  ...
HTML                      F         F (Cont.) 4.          <textarea> -            F F               F   F   F             ...
XHTML      F eXtensible HyperText Markup Language                                         HTML    XML     F F     F F F   ...
Mr.Warawut Khangkhan   3   F   39
F                      XHTML 1.                    DOCTYPE 2.                    Namespace 3.                      “Encodi...
1.                         DOCTYPE                    F          XHTML         F               F                 XHTML    ...
2.                          Namespace                              F F       F      XHTML       F           F           DT...
3.                         “Encoding”     F F      F F   F             F    F F    XHTML               Encoding F     <met...
XHTML 1.          F                   DOCTYPE                                                   F       F               F ...
XHTML (Cont.) 6.            F F           F        F F F F     F         Slash (/)         F <br />          F 7.         ...
F              XHTMLMr.Warawut Khangkhan   3     F     46
F           XHTML   BrowserMr.Warawut Khangkhan   3      F              47
DOM & JavaScript    DOM F      Document Object Model           F              F          F F     F          Content     F ...
DOM & JavaScript (Cont.)    JavaScript                F               F F (Client)       F                F               ...
F          F       DOM & JavaScriptMr.Warawut Khangkhan       3     F                50
DOM & JavaScript (Cont.)    CSS – Cascading Style Sheet    CSS                     F             Style Sheet              ...
F             F                    F   F            HTML           XHTML       F                            F             ...
F   (Cont.)Mr.Warawut Khangkhan   3   F                 53
Mr.Warawut Khangkhan   3   F   54
F           F (Server-SideScripting)                               F       F     F              F F F (Dynamic)      F    ...
PHP      F    Hypertext Preprocessor       F                         F           HTML    F         PHP F                 F...
F       PHP       F F                              F      F             FF            PHP           F       HTML   F   F S...
F           PHP (Cont.)       F                           F                           F           F       F Unix, Windows ...
F       PHP (Cont.)                 F        F                  F Oracle,    FilePro, MS SQL, mSQL     MySQL           F  ...
PHPMr.Warawut Khangkhan   3    F    60
F                          F               PHP 1. HTML                   F           F             Static    Language     ...
F                      F         PHP (Cont.) 2.          PHP ( F )               SCRIPT Style        F     HTML           ...
F                   F       PHP (Cont.) 3. PHP Statement  F   F    F                    F     F       Semicolon ( ; ) F   ...
F                   F       PHP (Cont.) 5.           (Comments)       F F                      PHP    F     F /* … */     ...
-- File form.html --Mr.Warawut Khangkhan   3   F                    65
-- File simple.php --Mr.Warawut Khangkhan   3   F                           66
Mr.Warawut Khangkhan   3   F   67
ASP, ASP.NET    ASP F              Active Server Pages    ASP                     F                                       ...
ASP                               ASP.NETMr.Warawut Khangkhan   3   F         69
JSP    JSP F             Java Server Pages                       F   F      F    JSP             F    F           <% … %> ...
JSP 1.    JSP F                        Java     F              F                        F FF     Windows, Linux      Mac O...
JSP (Cont.) 4.                    F                   F                          F   F       F                           F...
Mr.Warawut Khangkhan   3   F   73
Ruby On Rails (ROR)                                               F (Web Application Framework)    Ruby              F    ...
MVCMr.Warawut Khangkhan   3   F         75
Mr.Warawut Khangkhan   3   F   76
Mr.Warawut Khangkhan   3   F   77
Mr.Warawut Khangkhan   3   F   78
F F       F    XML    WML    WML ScriptMr.Warawut Khangkhan   3     F       79
XML      F        eXtensible Markup Language                                                F W3C         F           F   ...
WML                  F                           HTML    WML                   F       F                          XML    W...
WML Script                                       F        JavaScript    WML Script                 Server-Side     F F   F...
Mr.Warawut Khangkhan   1   F   F   F   83
Web Site              F        F                    . (2554).               .F    F    7   , 2554,    http://dit.dru.ac.th...
Book                         . (2554).              F .   : F   F F                       F         F     .FMr.Warawut Kha...
Upcoming SlideShare
Loading in...5
×

พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์

775

Published on

การทำงานของ Client-Server ประเภทของโปรแกรมบนเว็บ ภาษาที่ทำงาน Client-Side Scripting ภาษาที่ทำงาน Server-Side Scripting ภาษาอื่นที่ใช้สร้างเว็บไซต์

Published in: Education, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
775
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
20
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์

  1. 1. Mr.Warawut KhangkhanFacebook: http://www.facebook.com/AjWarawut Twitter: http://twitter.com/awarawut E-Mail: awarawut@hotmail.com Mobile: 089-461-9591
  2. 2. - F F F (Client-Server) F (Client-Side Scripting) F F (Server-Side Scripting) F F FMr.Warawut Khangkhan 3 F 2
  3. 3. Mr.Warawut Khangkhan 3 F 3
  4. 4. F- F FMr.Warawut Khangkhan 3 F 4
  5. 5. - F F F F FMr.Warawut Khangkhan 3 F 5
  6. 6. - F F F F FMr.Warawut Khangkhan 3 F 6
  7. 7. FMr.Warawut Khangkhan 3 F 7
  8. 8. Mr.Warawut Khangkhan 3 F 8
  9. 9. Static (Static Programming) Dynamic (Dynamic Programming)Mr.Warawut Khangkhan 3 F 9
  10. 10. Static (StaticProgramming)Mr.Warawut Khangkhan 3 F 10
  11. 11. Dynamic (DynamicProgramming)Mr.Warawut Khangkhan 3 F 11
  12. 12. Mr.Warawut Khangkhan 3 F 12
  13. 13. F (Client-Side (Client-Scripting) F (Script) F F JavaScript DOM F F F HTML F F F F F F F F F F F F F F AJAX F F F FMr.Warawut Khangkhan 3 F 13
  14. 14. F F F HTML – HyperText Markup Language XHTML – eXtensible HyperText Markup Language DOM (Document Object Model) & JavaScriptMr.Warawut Khangkhan 3 F 14
  15. 15. HTML F HyperText Markup Language F (Hypermedia Document Description Language) F F www (World Wide Web) F (Markup Tag) F F F F (Web Browser) (Tag) F (Attribute) World Wide Web Consortium (W3C) F SGML (Standard Generalized Markup Language)Mr.Warawut Khangkhan 3 F 15
  16. 16. F HTML (HTML Elements) HTML – F < > F tag F F F tag F tag F F F F / 2 F F F F F F Slash (/) F F F F (Attribute) – F tag F HTML F F F (Name = “Value”)Mr.Warawut Khangkhan 3 F 16
  17. 17. F HTML (HTML Elements)Mr.Warawut Khangkhan 3 F 17
  18. 18. F HTML <html> <head> <title> </title> </head> <body> F F </body> </html>Mr.Warawut Khangkhan 3 F 18
  19. 19. HTML 1. F (Heading)Mr.Warawut Khangkhan 3 F 19
  20. 20. HTML (Cont.) 2. F F (Paragraps)Mr.Warawut Khangkhan 3 F 20
  21. 21. HTML (Cont.) 3. <br> - F F F F F F F F F FMr.Warawut Khangkhan 3 F 21
  22. 22. HTML (Cont.) 4. <a> - F F HTML, , Web DesignMr.Warawut Khangkhan 3 F 22
  23. 23. HTML (Cont.) 5. <frame> - F HTML F F FMr.Warawut Khangkhan 3 F 23
  24. 24. HTML (Cont.)6. <table> - F F <tr> F <td> F F F F F F F 24
  25. 25. HTML (Cont.) 7. F (List) – HTML F - Unordered Lists - Ordered Lists - Definition Lists - Nested ListsMr.Warawut Khangkhan 3 F 25
  26. 26. HTML (Cont.) Unordered List – F F F F F ( ) F F List F F <ul> F List F <li>Mr.Warawut Khangkhan 3 F 26
  27. 27. HTML (Cont.) Ordered List – List F F F F F F Unordered Lists F F <ol> <ul>Mr.Warawut Khangkhan 3 F 27
  28. 28. HTML (Cont.) Definition List – List F F F F <dl> F 2 F F F <dt> <dd>Mr.Warawut Khangkhan 3 F 28
  29. 29. HTML (Cont.)Nested List – F List F List F F F F F 29
  30. 30. HTML (Cont.) 8. <img> - F HTMLMr.Warawut Khangkhan 3 F 30
  31. 31. HTML F F 1. <form> - F F F F F F FMr.Warawut Khangkhan 3 F 31
  32. 32. HTML F F (Cont.) 2. <input> - F F F F F ( <form>) 6 Text Password Radio Checkbox Submit ResetMr.Warawut Khangkhan 3 F 32
  33. 33. HTML F F (Cont.) Text – F F F F F F F Password – F F Text F (*) F F F F F FMr.Warawut Khangkhan 3 F 33
  34. 34. HTML F F (Cont.) Radio – F F F F F Checkbox – F F F F F F 1Mr.Warawut Khangkhan 3 F 34
  35. 35. HTML F F (Cont.) Submit – F F F F F F F F F F Reset – F F F F F F F F FMr.Warawut Khangkhan 3 F 35
  36. 36. HTML F F (Cont.) 3. <select> - F F F F Drop-Down F F F FMr.Warawut Khangkhan 3 F 36
  37. 37. HTML F F (Cont.) 4. <textarea> - F F F F F F F F F F F FMr.Warawut Khangkhan 3 F 37
  38. 38. XHTML F eXtensible HyperText Markup Language HTML XML F F F F F F F syntax XML F HTMLMr.Warawut Khangkhan 3 F 38
  39. 39. Mr.Warawut Khangkhan 3 F 39
  40. 40. F XHTML 1. DOCTYPE 2. Namespace 3. “Encoding” HTML F FMr.Warawut Khangkhan 3 F 40
  41. 41. 1. DOCTYPE F XHTML F F XHTML F F F F F F XHTML FMr.Warawut Khangkhan 3 F 41
  42. 42. 2. Namespace F F F XHTML F F DTD Namespace XHTML F F URLMr.Warawut Khangkhan 3 F 42
  43. 43. 3. “Encoding” F F F F F F F F XHTML Encoding F <meta> F F “http-equiv” “Content-Type” F F “content”Mr.Warawut Khangkhan 3 F 43
  44. 44. XHTML 1. F DOCTYPE F F F F F F HTML 2. F F F F F <html>, <p> F 3. F F F F F F F F F F F F F F F F 4. F F F F F ‘ ’ “ ” 5. F F <p> … </p> FMr.Warawut Khangkhan 3 F 44
  45. 45. XHTML (Cont.) 6. F F F F F F F F Slash (/) F <br /> F 7. F F F “Double Dashes (--)” F XHTML F F F F F (- -) F F (=) 8. F F F “&lt;” “&gt;” F < >Mr.Warawut Khangkhan 3 F 45
  46. 46. F XHTMLMr.Warawut Khangkhan 3 F 46
  47. 47. F XHTML BrowserMr.Warawut Khangkhan 3 F 47
  48. 48. DOM & JavaScript DOM F Document Object Model F F F F F Content F F XHTML (HTML) F DOM F F Object Oriented Model DOM element tag F Node F F F DOM F object methodMr.Warawut Khangkhan 3 F 48
  49. 49. DOM & JavaScript (Cont.) JavaScript F F F (Client) F F F F JavaScript F web browser F F F F F F F F F F JavaScript Engine F FMr.Warawut Khangkhan 3 F 49
  50. 50. F F DOM & JavaScriptMr.Warawut Khangkhan 3 F 50
  51. 51. DOM & JavaScript (Cont.) CSS – Cascading Style Sheet CSS F Style Sheet F (Style) (Content) F F F F F F F F F F F F F F FMr.Warawut Khangkhan 3 F 51
  52. 52. F F F F HTML XHTML F F F F F F F F (.css) F F F F F HTML id F F HTML id F F F FMr.Warawut Khangkhan 3 F 52
  53. 53. F (Cont.)Mr.Warawut Khangkhan 3 F 53
  54. 54. Mr.Warawut Khangkhan 3 F 54
  55. 55. F F (Server-SideScripting) F F F F F F (Dynamic) F (Web Application) F F F F F (E-Commence) F (Online Banking) F F Search Engine F F F F F PHP ASP, ASP.NET JSP Ruby On Rails (ROR)Mr.Warawut Khangkhan 3 F 55
  56. 56. PHP F Hypertext Preprocessor F F HTML F PHP F F HTML F <?php … ?> <? … ?> F F Dynamic HTML F F F F F F F F F F F FMr.Warawut Khangkhan 3 F 56
  57. 57. F PHP F F F F FF PHP F HTML F F Syntax F F FF XML F F F F F F F F F F F F Scalar, Array, Associative ArrayMr.Warawut Khangkhan 3 F 57
  58. 58. F PHP (Cont.) F F F F F Unix, Windows Mas OS (Object-Oriented) F F F F Personal Web Server (PWS), Apache, Tomcat, OmniHttpd Internet Information Service (IIS)Mr.Warawut Khangkhan 3 F 58
  59. 59. F PHP (Cont.) F F F Oracle, FilePro, MS SQL, mSQL MySQL F F F F F F F F F LDAP, IMAP, POP3 HTTP FMr.Warawut Khangkhan 3 F 59
  60. 60. PHPMr.Warawut Khangkhan 3 F 60
  61. 61. F F PHP 1. HTML F F Static Language F F 2. PHP Short Style F SGML (Standard Markup Language) <? echo “ PHP Short Style”; ?> XML Style F XML (eXtensible Markup Language) <?php echo “ PHP XML Style”; ?>Mr.Warawut Khangkhan 3 F 61
  62. 62. F F PHP (Cont.) 2. PHP ( F ) SCRIPT Style F HTML F JavaScript VBScript <SCRIPT LANGUAGE=‘php’> echo “ PHP SCRIPT Style”; </SCRIPT> ASP Style F ASP (Active Server Pages) <% echo “ PHP ASP Style”; %>Mr.Warawut Khangkhan 3 F 62
  63. 63. F F PHP (Cont.) 3. PHP Statement F F F F F Semicolon ( ; ) F echo “PHP Statement”; 4. Whitespace F F F F F F F Carriage Return ( F ), Space Tabs PHP HTML F Whitespace echo “PHP Statement”; echo “PHP Statement”; echo “PHP Statement”; echo “PHP Statement”;Mr.Warawut Khangkhan 3 F 63
  64. 64. F F PHP (Cont.) 5. (Comments) F F PHP F F /* … */ F // echo “PHP Statement”; // F PHP Statement /* F */ echo “ (Comments)”;Mr.Warawut Khangkhan 3 F 64
  65. 65. -- File form.html --Mr.Warawut Khangkhan 3 F 65
  66. 66. -- File simple.php --Mr.Warawut Khangkhan 3 F 66
  67. 67. Mr.Warawut Khangkhan 3 F 67
  68. 68. ASP, ASP.NET ASP F Active Server Pages ASP F F ASP ASP F F <% … %> ASP F ASP.NET ASP.NET .NET Framework F F F ASP.NET F F .aspx ASP.NET Server Control ( F F F ) F F element F HTML F F F F F F F F FMr.Warawut Khangkhan 3 F 68
  69. 69. ASP ASP.NETMr.Warawut Khangkhan 3 F 69
  70. 70. JSP JSP F Java Server Pages F F F JSP F F <% … %> F JAVA JSP .jspMr.Warawut Khangkhan 3 F 70
  71. 71. JSP 1. JSP F Java F F F FF Windows, Linux Mac OS 2. F Java API F Java API F F F FF F F F F F 3. F (Component) F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 3 F 71
  72. 72. JSP (Cont.) 4. F F F F F F F XML F F 5. JSP F F FF F F F F F F FMr.Warawut Khangkhan 3 F 72
  73. 73. Mr.Warawut Khangkhan 3 F 73
  74. 74. Ruby On Rails (ROR) F (Web Application Framework) Ruby F F F F Rails F F F F ROR F F F Rails F F Model-View-Controller (MVC) M– (Status) V– F F F User Interface C-Mr.Warawut Khangkhan 3 F 74
  75. 75. MVCMr.Warawut Khangkhan 3 F 75
  76. 76. Mr.Warawut Khangkhan 3 F 76
  77. 77. Mr.Warawut Khangkhan 3 F 77
  78. 78. Mr.Warawut Khangkhan 3 F 78
  79. 79. F F F XML WML WML ScriptMr.Warawut Khangkhan 3 F 79
  80. 80. XML F eXtensible Markup Language F W3C F F F HTML F F HTML F F F F F F F F “DTD (Document Type Definition)” F F F XML F XML Parser F XML F F F F F F F F F F F F F F F F HTML F F F F F F F WMLMr.Warawut Khangkhan 3 F 80
  81. 81. WML F HTML WML F F XML WML F F F F F F F WML F (Web Pages) F F F F (Card) F F F (Deck)Mr.Warawut Khangkhan 3 F 81
  82. 82. WML Script F JavaScript WML Script Server-Side F F F binary F F F F clientMr.Warawut Khangkhan 3 F 82
  83. 83. Mr.Warawut Khangkhan 1 F F F 83
  84. 84. Web Site F F . (2554). .F F 7 , 2554, http://dit.dru.ac.th/home/004/tachakorn/WEBDE/Ch apter3.pdf Thai WBI, Website. (2554). Homepage HTML. F 27 , 2554, http://www.thaiwbi.com/course/html/index2.htmlMr.Warawut Khangkhan 1 F F F 84
  85. 85. Book . (2554). F . : F F F F F .FMr.Warawut Khangkhan 1 F F F 85
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×