การติดตั้งและตั้งค่า Bedrock ในสภาพแวดล้อม ServBay

ภาพรวม

เอกสารนี้จะแนะนำคุณเกี่ยวกับวิธีติดตั้งและตั้งค่า Bedrock บนสภาพแวดล้อมการพัฒนาแบบ Local ของ ServBay โดย Bedrock เป็นโครงสร้างโปรเจกต์ WordPress ยุคใหม่ที่ใช้ Composer ในการจัดการ Dependencies เพิ่มความปลอดภัยและจัดการคอนฟิกได้ตาม Best Practice ซึ่งช่วยให้พัฒนา ทดสอบ และดูแล WordPress ได้อย่างมีประสิทธิภาพและปลอดภัย ร่วมกับฟีเจอร์บริหารจัดการที่ง่ายและทรงพลังของ ServBay คุณสามารถตั้งค่าพื้นฐานเพื่อเริ่มต้นกับ Bedrock ได้อย่างรวดเร็ว

Bedrock คืออะไร?

Bedrock สร้างโดยทีม Roots เพื่อปรับปรุงประสบการณ์พัฒนา WordPress โดยมีความแตกต่างจากโครงสร้าง WordPress แบบเดิมๆ คุณสมบัติหลักได้แก่

• จัดการ Dependencies ด้วย Composer: ทั้งแกน WordPress ธีม และปลั๊กอินสามารถจัดการผ่าน Composer ได้ สะดวกต่อการอัปเดตและลดปัญหา Dependency Conflict
• การจัดการคอนฟิกที่ดีขึ้น: ใช้แนวคิด Twelve-Factor App โดยใช้ไฟล์ .env ในการแยก Environment Variables ออกจากโค้ด เพิ่มความปลอดภัยและความยืดหยุ่น
• โครงสร้างโปรเจกต์เป็นระบบ: วาง Core WordPress ไว้ในโฟลเดอร์ย่อย (web/wp), ส่วนธีมและปลั๊กอินใน web/app ช่วยให้โครงสร้างชัดเจนเป็นระเบียบ
• เพิ่มความปลอดภัย: มีมาตรการด้านความปลอดภัย เช่น ซ่อนเส้นทางไฟล์ที่สำคัญด้วยค่าเริ่มต้น

Bedrock เหมาะสำหรับผู้ที่ต้องการสร้างเว็บไซต์ WordPress ที่ทันสมัย มีความแข็งแกร่งและดูแลง่าย

ทำไมต้องใช้ ServBay ในการพัฒนา Bedrock?

ServBay คือเครื่องมือจัดการสภาพแวดล้อมเว็บสำหรับ macOS ที่ติดตั้งเซิร์ฟเวอร์ยอดนิยม (Caddy/Nginx/Apache), PHP ได้หลายเวอร์ชัน, ฐานข้อมูล (MySQL/PostgreSQL/MongoDB) รวมถึงภาษาพัฒนาต่างๆ เช่น Node.js, Python, Go, Java เมื่อนำมาใช้ร่วมกับ Bedrock จะช่วยให้คุณ

• ติดตั้งสภาพแวดล้อมได้ทันที: ServBay มี PHP, Composer และ Database ที่จำเป็นต่อ Bedrock ติดตั้งมาให้แล้ว ไม่ต้องจัดการแยกเอง
• สลับเวอร์ชันได้ยืดหยุ่น: ลองเปลี่ยนเวอร์ชัน PHP ทดสอบการรองรับ Bedrock กับ PHP หลายเวอร์ชัน
• จัดการฐานข้อมูลแบบบูรณาการ: สร้างและบริหาร Database ด้วย phpMyAdmin หรือ Adminer ในตัว ServBay ได้ง่าย
• ตั้งค่าเว็บไซต์ด้วย GUI: กำหนดเว็บไซต์ (Virtual Host) ให้ Bedrock ด้วยอินเทอร์เฟซแบบกราฟิก ชี้ไปยัง Directory ที่ถูกต้องได้ในคลิกเดียว
• จัดการศูนย์กลาง: บริหารแพ็คเกจซอฟต์แวร์และเว็บไซต์ Local ทั้งหมดภายใต้แอปเดียว

ข้อกำหนดเบื้องต้น

ก่อนเริ่ม ให้คุณเตรียมสิ่งต่อไปนี้

• ติดตั้งและรัน ServBay บน macOS เรียบร้อย
• มีพื้นฐานใช้งาน Command Line
• มีพื้นฐานการใช้ Composer (เอกสารนี้มีตัวอย่างคำสั่งให้)

ขั้นตอนการติดตั้ง Bedrock

รายละเอียดแต่ละขั้นตอนของการติดตั้งและตั้งค่า Bedrock บน ServBay มีดังนี้

ขั้นตอนที่ 1: สร้างโฟลเดอร์โปรเจกต์

ไปยังเว็บไซต์ Root Directory ของ ServBay /Applications/ServBay/www แล้วสร้างโฟลเดอร์ใหม่สำหรับโปรเจกต์ แนะนำให้ตั้งชื่อให้สื่อความหมาย เช่น servbay-bedrock-app

cd /Applications/ServBay/www
mkdir servbay-bedrock-app
cd servbay-bedrock-app

โฟลเดอร์นี้จะเป็น Root ของโปรเจกต์ Bedrock ของคุณ

ขั้นตอนที่ 2: สร้างโปรเจกต์ Bedrock ด้วย Composer

ServBay มี Composer ติดตั้งมาให้แล้ว คุณสามารถใช้คำสั่ง composer ใน Terminal ได้เลย หลังเข้า Directory โปรเจกต์ (/Applications/ServBay/www/servbay-bedrock-app) ให้รันคำสั่งนี้เพื่อสร้าง Bedrock ใหม่

composer create-project roots/bedrock .

คำสั่งนี้จะดาวน์โหลด Bedrock และ Dependencies ที่เกี่ยวข้องไว้ใน Directory ปัจจุบัน (.) ระยะเวลาอาจขึ้นกับความเร็วอินเทอร์เน็ตของคุณ

ขั้นตอนที่ 3: สร้างฐานข้อมูลและผู้ใช้

Bedrock และ WordPress ต้องมีฐานข้อมูลเพื่อเก็บข้อมูลและ Setting ต่างๆ คุณจะใช้ phpMyAdmin ที่มากับ ServBay ในการสร้างฐานข้อมูลและผู้ใช้งาน

1. เข้าสู่เครื่องมือ phpMyAdmin ที่มาพร้อม ServBay

   เปิด Browser ไปที่ https://servbay.host/ ที่หน้า Welcome ของ ServBay ให้คลิกที่ลิงก์ "phpMyAdmin" เพื่อเข้าไปยังเครื่องมือบริหารจัดการฐานข้อมูล

2. สร้างผู้ใช้ฐานข้อมูล

   เพื่อความปลอดภัยและจัดการได้ง่าย แนะนำให้สร้างฐานข้อมูลและ User สำหรับแต่ละโปรเจกต์โดยเฉพาะ

   1. ไปที่หน้าบัญชีผู้ใช้

      ที่หน้าแรกของ phpMyAdmin คลิกที่เมนูนำทางด้านบน เลือก "ผู้ใช้บัญชี"

   2. เพิ่มผู้ใช้ใหม่

      คลิก "เพิ่มผู้ใช้บัญชี" แล้วกรอกข้อมูลต่อไปนี้:

      • ชื่อผู้ใช้: ใส่ชื่อสำหรับโปรเจกต์ เช่น bedrock_user
      • โฮสต์: เลือก localhost เพื่ออนุญาตให้ผู้ใช้นี้เข้าถึงจากเครื่อง Local เท่านั้น
      • รหัสผ่าน: ตั้งรหัสผ่านที่ ปลอดภัย สำหรับ User นี้ จดรหัสนี้ไว้ เช่น password123 ในกรณีทดสอบ Local แต่ Production ควรใช้รหัสที่แข็งแรง
      • ป้อนอีกครั้ง: ยืนยันรหัสผ่านอีกครั้ง

      ในส่วน "ฐานข้อมูลสำหรับผู้ใช้" ให้เลือก "สร้างฐานข้อมูลที่มีชื่อเดียวกับผู้ใช้และให้สิทธิ์ทั้งหมด" ระบบจะสร้างฐานข้อมูลชื่อ bedrock_user และอนุญาตสิทธิ์เต็มให้ User นี้โดยอัตโนมัติ

      ตรวจสอบให้แน่ใจว่าติ๊ก "ให้สิทธิ์ทั้งหมด" เพื่อความสมบูรณ์

      คลิก "ดำเนินการ" ที่ด้านล่างเพื่อตั้งค่าผู้ใช้และฐานข้อมูล

ขั้นตอนที่ 4: ตั้งค่า Bedrock

Bedrock ใช้ไฟล์ Environment Variable (.env) สำหรับจัดการคอนฟิกต่างๆ

1. แก้ไขไฟล์ตั้งค่าสภาพแวดล้อม

   ใน Root โปรเจกต์ของ Bedrock (/Applications/ServBay/www/servbay-bedrock-app) จะมีไฟล์ตัวอย่างชื่อ .env.example ให้ Copy และเปลี่ยนชื่อเป็น .env

   cp .env.example .env

   ไฟล์ .env นี้จะถูกใช้จริงในโปรเจกต์ ขณะที่ .env.example ใช้เป็นตัวอย่างและไม่มีข้อมูลลับ

2. แก้ไขไฟล์ .env

   เปิด .env ที่สร้างขึ้นด้วย Text Editor ที่คุณชอบ (VS Code, Sublime Text, Nano ฯลฯ) แล้วแก้ไขค่าที่เกี่ยวกับฐานข้อมูลให้ตรงกับข้อมูลที่สร้างไว้ในขั้นตอนที่ 3

   # Database
   DB_NAME='bedrock_user' # ชื่อฐานข้อมูล (ตรงกับชื่อผู้ใช้)
   DB_USER='bedrock_user' # ชื่อผู้ใช้ฐานข้อมูล
   DB_PASSWORD='password123' # รหัสผ่านฐานข้อมูล
   DB_HOST='localhost' # โฮสต์ของฐานข้อมูล ปกติใช้ localhost สำหรับ ServBay
   DB_PREFIX='wp_' # คำนำหน้าตาราง เปลี่ยนได้หรือใช้ค่าเริ่มต้น
   
   # WordPress Environment
   WP_ENV='development' # สภาพแวดล้อม เช่น development, staging, production
   
   # Site URLs
   WP_HOME='http://servbay-bedrock.local' # URL เว็บไซต์เต็ม
   WP_SITEURL='${WP_HOME}/wp' # URL ของ WordPress Core

   เปลี่ยนค่าตามสถานการณ์จริง โดยเฉพาะ DB_PASSWORD ต้องเป็นรหัสที่คุณตั้งใน phpMyAdmin

   WP_HOME และ WP_SITEURL คือ URL ที่คุณจะใช้เข้าถึงไซต์ใน Browser servbay-bedrock.local เป็นโดเมนสำหรับ Dev คุณสามารถปรับเปลี่ยนได้ ส่วน WP_SITEURL ให้ชี้ไปยัง Subdirectory ของ WordPress (web/wp)

   คุณยังสามารถคอนฟิกค่าอื่นๆ ที่เกี่ยวข้องกับ Bedrock หรือ WordPress เพิ่มเติมใน .env ได้ เช่น การกำหนด Constants หรือตั้งค่าการส่งอีเมล

ขั้นตอนที่ 5: ตั้งค่า Web Server (เว็บไซต์ใน ServBay)

เพื่อให้ Web Server ของ ServBay สามารถให้บริการโปรเจกต์ Bedrock ได้ จำเป็นต้องเพิ่มเว็บไซต์ (Virtual Host) ใหม่ใน ServBay

1. เพิ่มเว็บไซต์ใหม่

   เปิดแอป ServBay แล้วคลิกที่แท็บ "เว็บไซต์" ทางซ้ายมือ เลือก "+" หรือ "เพิ่มเว็บไซต์" เพื่อสร้างการตั้งค่าใหม่ กรอกข้อมูลตามนี้

   • ชื่อ: ตั้งชื่อเพื่ออ้างอิงใน ServBay เช่น My Bedrock Site ใช้เพื่อการจัดการเท่านั้น
   • โดเมน: ใส่โดเมนตามที่ตั้งไว้ใน WP_HOME ของไฟล์ .env เช่น servbay-bedrock.local ServBay จะมอบโดเมนนี้ไปที่ 127.0.0.1 อัตโนมัติ
   • ประเภทเว็บไซต์: เลือก PHP
   • เวอร์ชัน PHP: เลือก PHP เวอร์ชันที่รองรับกับ Bedrock แนะนำใช้เวอร์ชันล่าสุดที่เสถียรใน ServBay
   • โฟลเดอร์รากเว็บไซต์: จุดสำคัญ! รากเว็บไซต์ของ Bedrock ไม่ใช่รากโปรเจกต์ แต่เป็นโฟลเดอร์ web ในโปรเจกต์ ดังนั้นให้ตั้งเป็น /Applications/ServBay/www/servbay-bedrock-app/web

2. บันทึกการตั้งค่า

   เมื่อกรอกข้อมูลครบ คลิกบันทึก ServBay จะรีโหลดการตั้งค่า Web Server ให้โดยอัตโนมัติ หากมี Prompt ให้รีสตาร์ท Service ให้รีสตาร์ทตามคำแนะนำ

ขั้นตอนที่ 6: ติดตั้ง WordPress ให้เสร็จสมบูรณ์

เมื่อการตั้งค่าทั้ง Bedrock และเว็บไซต์ใน ServBay เสร็จแล้ว คุณสามารถติดตั้ง WordPress ผ่าน Web Interface ได้เหมือนปกติ

1. เข้าไปที่หน้าติดตั้ง

   เปิดเว็บเบราว์เซอร์ ไปที่ URL ตาม .env และที่ตั้งใน ServBay เช่น http://servbay-bedrock.local/wp หากตั้งค่าสำเร็จจะเจอหน้าติดตั้งของ WordPress

2. กรอกข้อมูลฐานข้อมูล

   ระบบจะถามข้อมูลการเชื่อมต่อฐานข้อมูล ให้นำค่าจากขั้นตอนที่ 3 มากรอก

   • ชื่อฐานข้อมูล: bedrock_user
   • ชื่อผู้ใช้: bedrock_user
   • รหัสผ่าน: รหัสผ่านที่ตั้งไว้ (เช่น password123)
   • โฮสต์ฐานข้อมูล: localhost
   • คำนำหน้าตาราง: wp_ (ใช้ค่าดั้งเดิมก็ได้)

   กด "ส่งข้อมูล" WordPress จะพยายามเชื่อมต่อฐานข้อมูล

3. ตั้งค่าข้อมูลเว็บไซต์

   หากเชื่อมต่อสำเร็จ ระบบจะให้กรอกข้อมูลเว็บไซต์

   • ชื่อเว็บไซต์: ใส่ชื่อเว็บที่ต้องการ
   • ชื่อผู้ใช้: สำหรับผู้ดูแลระบบ
   • รหัสผ่าน: สำหรับ Admin (ควรเป็นรหัสที่แข็งแรง)
   • อีเมลของคุณ: สำหรับผู้ดูแลระบบ
   • การมองเห็นของเครื่องมือค้นหา: กรณีพัฒนา Local แนะนำให้ติ๊ก "ห้ามเครื่องมือค้นหาจัดทำดัชนีไซต์นี้"

4. เสร็จสิ้นการติดตั้ง

   กด "ติดตั้ง WordPress" ระบบจะสร้างตารางในฐานข้อมูลและดำเนินการเสร็จสิ้น หลังเสร็จสิ้นจะมีลิงก์เข้าสู่ระบบหลังบ้านให้ใช้งาน

ขั้นตอนที่ 7: ติดตั้งธีมและปลั๊กอิน (ผ่าน Composer)

Bedrock สนับสนุนให้จัดการธีมและปลั๊กอินผ่าน Composer แทนการติดตั้งจากหลังบ้าน

1. ค้นหาชื่อแพ็กเกจของธีมหรือปลั๊กอิน

   ธีมหรือปลั๊กอินยอดนิยมส่วนมากจะมีแพ็กเกจ Composer อยู่บน Packagist (packagist.org) หรือ WordPress Packagist (wpackagist.org) รูปแบบชื่อแพ็กเกจคือ vendor/package-name ตัวอย่างเช่น wpackagist-theme/twentytwentyone หรือ wpackagist-plugin/wordpress-seo

2. ติดตั้งผ่าน Composer

   ไปยัง Root โปรเจกต์ Bedrock (/Applications/ServBay/www/servbay-bedrock-app) แล้วใช้ Composer ติดตั้งเช่น

   ติดตั้งธีม:

   composer require wpackagist-theme/your-theme-name

   ติดตั้งปลั๊กอิน:

   composer require wpackagist-plugin/your-plugin-name

   แทนที่ your-theme-name หรือ your-plugin-name ด้วยชื่อจริงของแพ็กเกจ Composer เมื่อสำเร็จ ธีมและปลั๊กอินจะถูกติดตั้งไปที่ web/app/themes และ web/app/plugins ตามลำดับ

3. เปิดใช้งานในหลังบ้าน WordPress

   เข้าสู่ระบบหลังบ้าน (http://servbay-bedrock.local/wp/wp-admin/) จากนั้น:

   • ธีม: ไปที่ "รูปลักษณ์" -> "ธีม" เลือกธีมที่ติดตั้งและกดเปิดใช้
   • ปลั๊กอิน: ไปที่ "ปลั๊กอิน" -> "ปลั๊กอินที่ติดตั้ง" เลือกปลั๊กอินแล้วเปิดใช้

   แม้ Bedrock จะรองรับการติดตั้งด้วย Composer เป็นหลัก คุณยังใช้การอัปโหลดไฟล์ .zip จากหน้าหลังบ้านได้ แต่แนวทางของ Bedrock จะเน้นการจัดการแบบ Composer เพื่อความทันสมัยและสามารถควบคุม Dependency ได้เหนือกว่า

การสร้างเว็บไซต์ด้วย Bedrock

เมื่อคุณได้ติดตั้งและตั้งค่า Bedrock กับ ServBay เรียบร้อยแล้ว คุณสามารถเริ่มต้นสร้างเว็บไซต์แบบเดียวกับ WordPress ปกติ ทั้งยังได้ประโยชน์จากฟีเจอร์ยุคใหม่ของ Bedrock

• สร้างหน้า/บทความ: ล็อกอินหลังบ้าน WordPress แล้วใช้เมนู "หน้า" หรือ "บทความ" เพื่อสร้างเนื้อหาได้เหมือนปกติ
• ตั้งค่าเมนูนำทาง: ตั้งค่าที่ "รูปลักษณ์" -> "เมนู"
• บริหาร Widget: ไปที่ "รูปลักษณ์" -> "วิดเจ็ต" สำหรับจัดด้านข้างหรือส่วนต่างๆ
• พัฒนา/ปรับแต่งธีมหรือปลั๊กอิน: ถ้าคุณเป็นนักพัฒนา สามารถพัฒนาได้ที่ web/app/themes และ web/app/plugins
• จัดการคอนฟิก: ใช้ .env ในการตั้งค่าสิ่งต่างๆ แยกแต่ละ Environment ตาม Dev, Staging, Production

คำถามที่พบบ่อย (FAQ)

• ถาม: เข้า http://servbay-bedrock.local แล้วเจอ Error 404 ต้องทำอย่างไร?

  • ตอบ: ตรวจสอบโดเมนเว็บไซต์ใน ServBay ว่าตรงกับโดเมนที่เข้าหรือไม่
  • ตอบ: ตรวจสอบ Directory รากเว็บไซต์ถูกตั้งเป็น /Applications/ServBay/www/servbay-bedrock-app/web หรือไม่
  • ตอบ: ตรวจสอบว่า Web Server ของ ServBay กำลังทำงาน
  • ตอบ: เช็คค่า WP_HOME ในไฟล์ .env ว่าถูกต้อง

• ถาม: เข้า http://servbay-bedrock.local/wp แล้วเจอ Error การเชื่อมต่อฐานข้อมูล?

  • ตอบ: ตรวจสอบค่าต่อไปนี้ใน .env (DB_NAME, DB_USER, DB_PASSWORD, DB_HOST) ว่าตรงกับที่ตั้งไว้ใน phpMyAdmin
  • ตอบ: ตรวจสอบบริการฐานข้อมูลเช่น MySQL ใน ServBay ว่าทำงานอยู่
  • ตอบ: ตรวจสอบว่าผู้ใช้ใน phpMyAdmin ได้รับสิทธิ์ทั้งหมดกับฐานข้อมูลดังกล่าว

• ถาม: ติดตั้งธีมหรือปลั๊กอินแล้วไม่เจอใน Backend ของ WordPress?

  • ตอบ: ถ้าติดตั้งผ่าน Composer ให้แน่ใจว่ารันคำสั่ง composer install หรือ composer require ใน Root โปรเจกต์และดำเนินการสำเร็จ
  • ตอบ: ไฟล์ธีมต้องอยู่ใน web/app/themes และปลั๊กอินใน web/app/plugins
  • ตอบ: ไปที่ Backend "รูปลักษณ์" -> "ธีม" หรือ "ปลั๊กอิน" -> "ปลั๊กอินที่ติดตั้ง" และเปิดใช้งาน

• ถาม: อัปเดต Bedrock, WordPress, ธีมหรือปลั๊กอินอย่างไร?

  • ตอบ: Bedrock จัดการ Dependency ด้วย Composer ให้ไปรันคำสั่ง composer update ใน Root โปรเจกต์เพื่ออัปเดตทั้งหมด หรือ composer update vendor/package-name เพื่ออัปเดตเฉพาะเจาะจง หลังจากนั้นอาจมีขั้นตอนอัปเดตฐานข้อมูลใน Backend

สรุป

จากขั้นตอนทั้งหมดนี้ คุณจะสามารถติดตั้งและตั้งค่า Bedrock ได้สำเร็จในสภาพแวดล้อมการพัฒนาแบบ Local ของ ServBay ด้วยวิธีที่ทันสมัย ปลอดภัย และมีประสิทธิภาพยิ่งขึ้น พร้อมช่วยจัดการดูแล WordPress Project ได้ง่ายและสะดวกขึ้น ถึงเวลาเริ่มต้นใช้ Bedrock ร่วมกับ ServBay เพื่อสร้างเว็บไซต์ WordPress ยุคใหม่ของคุณ!