คู่มือการทำโปรเจ็ค 2560
เว็บไซต์สำหรับเรียนรู้ (แนะนำ)
Post by Goborijung at 2018-10-11 00:00:00
https://www.w3schools.com/ https://www.w3schools.com/bootstrap/default.asp
สิ่งที่ต้องรู้ ในการทำโปรเจ็ค
Post by Goborijung at 2018-10-11 00:00:00
1. Web Application คืออะไร ประกอบไปด้วยอะไรบ้าง 2. การพัฒนาเว็บ ต้องรู้จักอะไรบ้าง 2.1 ระบบฐานข้อมูล เครื่องมือจักการฐานข้อมูล - ฐานข้อมูล Mysql ชื่อฐานข้อมูลคือ MySQL - โปรแกรม Mysql Workbense - ชุดจัดการฐานข้อมูล PhPMyAdmin 2.2 โปรแกรมประมวลผล Client. และ Server - Apache Server เว็บเซอร์ฟเวอร์ชื่อ Apache - เว็บบราวเซอร์ 2.3 ภาษาที่ใช้ในการพัฒนาเว็บ - HTML - CSS - Javascript - PHP - JQuery - Bootstraps (Framwork) 2.4 เครื่องมือในการพัฒนาเว็บ - Sublime Text - USBWebserver - Mysqlworkbense - Bootstrap. Framwork - Chrome Browser
ขั้นตอนการสร้าง Website
Post by Goborijung at 2018-12-27 00:00:00
Step 1 เขียนโครงสร้างของ HTML5 <!DOCTYPE html> <html> <head> <meta charset='utf-8'> <title>This title</title> </head> <body> This content. </body> </html> Step 2 เอา CDN ของ Bootstraps มาใส่ข้างล่าง Tag Title <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> Step 3 สร้างคลาส Container,row,columns เอาไว้ใน Tag Body <div class="container"> <!-- Header --> <div class="row"> <div class="col-sm-12 text-left"> <div style="background-color: lightgray;"> <h1>This Website Header</h1> </div> </div> </div><!--/row--> <!-- Content --> <div class="row"> <div class="col-sm-2"> <div style="background-color:lightgray"> เมนูฝั่งซ้าย </div> </div> <div class="col-sm-8"> <div style="background-color:lightgray"> ส่วนเนื้อหาของเว็บไซต์ </div> </div> <div class="col-sm-2"> <div style="background-color:lightgray"> เมนูฝั่งขวา </div> </div> </div><!---/row-> <!-- Footer --> <div class="row"> <div class="col-sm-12"> <div style="background-color:lightgray"> This Footer </div> </div> </div><!--/Footer--> </div><!-- /container -->