ข้อมูลบทเรียน

เนื้อหา : 8 บท

เรียนรู้ & Workshop : 6 ชั่วโมง

Assignment :

3 ชั่วโมง (1 แบบฝึก)

ระดับ : พื้นฐาน

ดูทบทวนย้อนหลัง : 2 ปี

ปรึกษาการเรียน : Discord Community

รายละเอียดบทเรียน

ปูพื้นฐานสร้างเว็บไซต์ด้วย CSS

ทำไมถึงควรเรียน Web Foundation : CSS กับเรา

การสร้างเว็บไชต์ให้น่าดึงดูด ทั้งเรื่อง สี ขนาด รูปร่าง และตำแหน่งขององค์ประกอบต่างๆ บนหน้าเว็บ คุณสามารถเรียนรู้ได้ในบทเรียนนี้ ที่จะสอนคุณใช้งาน CSS เพื่อสร้างเว็บไซต์ให้ดูดีและยังเป็นพื้นฐานสำคัญของการพัฒนาเว็บไซต์ โดยเราจะเน้นการเรียนรู้ควบคู่ไปกับการทำความเข้าใจผ่านการฝึกทำ Workshop

Web Foundation : CSS เหมาะกับใคร

ผู้ที่ต้องการปูพื้นฐานการเป็น Front-End Developer
ผู้ที่ต้องการเริ่มต้นเรียนรู้พื้นฐานการสร้างเว็บด้วย CSS
นักศึกษา ครู อาจารย์ ที่ต้องการความรู้พื้นฐาน CSS
คนทั่วไปที่ต้องการเพิ่มความรู้เรื่อง CSS

สิ่งที่คุณจะได้จาก Unit นี้

สามารถสร้างและตกแต่งหน้าเว็บจาก CSS ได้ด้วยตนเอง
เข้าใจพิ้นฐานการสร้างและตกแต่งเว็บด้วย CSS
ฝึกฝนการการประเมิน วางแผน และได้ลงมือทำไปพร้อมกับบทเรียน
Workshop งานจริงจาก Enterprise

ที่ปรึกษาการเรียน

สามารถเข้า Discord เพื่อสอบถามแลกเปลี่ยนความรู้ ให้คุณได้เรียนรู้และสอบถามข้อสงสัยเพิ่มเติม
กับ Developer ตัวจริง พร้อมคำปรึกษาด้านการเรียน และการทำงาน

ผู้สอน

ประวัติและผลงาน
- - Instructor บริษัท Code-D 789 มากกว่า 5 ปี
    ออกแบบพัฒนา Software Architecture ธุรกิจการเงิน ธนาคาร โทรคมนาคม มากกว่า 20 ปี
    – Mobile banking app, ธ.กรุงศรี
    – ระบบตู้บริการอัตโนมัติ, AIS
    – Real Time Trading App, SET
    – ระบบรายงานผลเลือกตั้ง, Nation
    – ออกแบบพัฒนาเว็บไซต์, Amway
  - จบวิศวกรรมคอมพิวเตอร์ จุฬาลงกรณ์ มหาวิทยาลัย เกียรตินิยมอันดับ 1

เนื้อหาคอร์ส

U2.1 ทำความเข้าใจ CSS

11 PART

28:28 นาที
- CSS และ CSS3 คืออะไร
  
  01:52 นาที
- การใช้ CSS ร่วมกับ HTML
  
  05:42 นาที
- ส่วนประกอบของ CSS
  
  00:27 นาที
- CSS Selector
  
  00:07 นาที
- Selector เบื้องต้น
  
  01:52 นาที
- Class
  
  01:07 นาที
- Grouping
  
  00:49 นาที
- กรณีหลายเงื่อนไข
  
  02:28 นาที
- Combinators - ระบุความสัมพันธ์
  
  07:55 นาที
- Pseudo-Class
  
  03:39 นาที
- Pseudo-Element
  
  02:30 นาที
U2.2 CSS Properties

7 PART

22:48 นาที
- Introduction
  
  01:42 นาที
- Text Properties
  
  01:21 นาที
- Color
  
  06:27 นาที
- Font
  
  05:02 นาที
- Decoration / Transformation
  
  02:18 นาที
- Alignment / Wrap / Overflow
  
  04:15 นาที
- Spacing
  
  01:43 นาที
U2.3 CSS Layout

10 PART

28:58 นาที
- Box Properties
  
  01:52 นาที
- Background
  
  07:02 นาที
- Border
  
  04:48 นาที
- Shadow
  
  00:27 นาที
- Size
  
  02:43 นาที
- Margin / Padding
  
  04:27 นาที
- Positioning
  
  01:34 นาที
- Float
  
  03:03 นาที
- Overflow
  
  01:16 นาที
- Table Properties
  
  01:46 นาที
U2.4 Workshop ปรับหน้าเว็บโดยใช้ CSS

1 PART

26:14 นาที
- Workshop : ปรับ HTML+CSS สำหรับหน้าเว็บแสดงข้อมูลลูกค้า
  
  26:14 นาที
U2.5 การใช้ Bootstrap

7 PART

23:21 นาที
- ทำไมถึงใช้ Bootstrap
  
  02:00 นาที
- Bootstrap Container
  
  01:29 นาที
- Bootstrap Breakpoints
  
  02:36 นาที
- Bootstrap Grid System
  
  06:28 นาที
- Bootstrap Theme Color
  
  03:57 นาที
- Bootstrap Form & Button
  
  02:20 นาที
- Bootstrap Spacing
  
  04:31 นาที
U2.6 Workshop ปรับหน้าเว็บโดยใช้ Bootstrap Part 1

3 PART

19:31 นาที
- อธิบาย Workshop : ปรับหน้าเว็บข้อมูลลูกค้าโดยใช้ Bootstrap
  
  02:43 นาที
- ส่วนวิเคราะห์งาน
  
  03:08 นาที
- ปรับส่วนสร้างหน้าเข้าสู่ระบบ
  
  13:40 นาที
U2.7 Workshop ปรับหน้าเว็บโดยใช้ Bootstrap Part 2

1 PART

24:24 นาที
- ปรับส่วนหน้ารายชื่อลูกค้า
  
  24:24 นาที
U2.8 Workshop ปรับหน้าเว็บโดยใช้ Bootstrap Part 3

2 PART

21:04 นาที
- ปรับสร้างหน้าเพิ่มลูกค้าใหม่
  
  12:20 นาที
- ปรับสร้างหน้าแก้ไขข้อมูลลูกค้า
  
  12:20 นาที
Assignment

ใช้เวลาประมาณ 3 ชั่วโมง
- Assignment: ทำ HTML+CSS สำหรับแก้ไขข้อมูลพนักงาน ให้มี Design ตามที่กำหนด
  
  Assignment นี้คุณจะได้ใช้ CSS และ Bootstap เพื่อปรับหน้าเว็บให้ดูเป็นระเบียบสวยงาม โดยจะเป็นการปรับหน้าเว็บ 4 หน้า คือ หน้า login หน้าแสดงข้อมูลพนักงาน หน้าเพิ่มข้อมูลพนักงาน และหน้าแก้ไขข้อมูลพนักงาน เพื่อให้หน้าเว็บดูสวยงามและอ่านได้อย่างสบายตา นำไปใช้งานได้จริงด้วยตนเอง และสุดท้ายคุณจะได้วิธีการคิดวิเคราะห์งานเพื่อให้คุณสามารถตรวจสอบงานเองได้ หลังคุณได้ฝึกฝนและส่งงานแล้ว
  
  3 ชั่วโมง