โฮสต์และแก้ไขเว็บไซต์บน Windows ฟรีโดยใช้ XAMPP

โฮสต์และแก้ไขเว็บไซต์บน Windows ฟรีโดยใช้ XAMPP

คุณต้องการสร้างเว็บไซต์ แต่ไม่รู้ว่าจะเริ่มต้นจากตรงไหน?





ดูเหมือนว่าพื้นที่ฝึกอบรมการพัฒนาเว็บทั่วไปจะมีราคาแพงที่สุดเช่นกัน: ซื้อโดเมน โฮสต์เซิร์ฟเวอร์ บัญชี WordPress ธีม ฯลฯ แต่ถ้าคุณไม่ใช่เจ้าของธุรกิจขนาดเล็กหรือพยายามสร้างแบรนด์ล่ะ เกิดอะไรขึ้นถ้าคุณแค่พยายามเรียนรู้การพัฒนาเว็บแต่ไม่เกะกะล่ะ





อ่านต่อไปเพื่อเรียนรู้วิธีโฮสต์เว็บไซต์ของคุณเอง ซึ่งคุณสามารถสร้างได้ตั้งแต่เริ่มต้นหรือด้วยเทมเพลตที่สร้างไว้ล่วงหน้า บนคอมพิวเตอร์ของคุณ และฟรี โอ้ นั่นรวมถึงการโฮสต์บัญชี WordPress ของคุณเองด้วย!





XAMPP: บทนำ

XAMPP . ของ Bitnami คือ 'การแจกจ่าย Apache ที่มี PHP และ Perl' เพื่อจุดประสงค์ของเรา เราเพียงต้องเข้าใจว่า XAMPP เป็นโปรแกรมฟรีที่ใช้งานง่าย ซึ่งช่วยให้ผู้ใช้สามารถโฮสต์เว็บไซต์บนพีซีของตนได้

แม้ว่าการตั้งค่าเซิร์ฟเวอร์ภายในเครื่องโดยใช้ XAMPP จะค่อนข้างเป็นเรื่องทางเทคนิค แต่กระบวนการนี้ก็ค่อนข้างง่ายและตรงไปตรงมา เมื่อตั้งค่าทุกอย่างเรียบร้อยแล้ว คุณจะพบว่าการจัดการและแก้ไขเว็บไซต์ทำได้ง่าย



จากนั้นก็เป็นเรื่องของการควบคุมที่รวดเร็วและสมบูรณ์ การใช้ XAMPP เพื่อสร้างและแก้ไขเว็บไซต์ คุณจะสามารถเปลี่ยนเว็บไซต์ได้มากหรือน้อยตามที่คุณต้องการ ที่กล่าวว่าพลังอันยิ่งใหญ่มาพร้อมกับความรับผิดชอบที่ยิ่งใหญ่ คุณมีความเสี่ยงที่จะสูญเสียเว็บไซต์ของคุณเช่นกัน โดยเฉพาะอย่างยิ่งหากคุณไม่ทำ สร้างการสำรองข้อมูล .

ทำไมข้อความไม่แจ้งว่าส่งแล้ว

หากคุณต้องการโครงการหลักสูตรเริ่มต้นอย่างแท้จริงใน web dev XAMPP นั้นเหมาะสำหรับคุณ ซึ่งรวมถึงโครงการที่เกี่ยวข้องกับ HTML, CSS, Javascript และอื่นๆ!





กำลังติดตั้ง XAMPP

มุ่งหน้าสู่ XAMPP เว็บไซต์และดาวน์โหลดแพ็คเกจ ทำตามขั้นตอนการตั้งค่าเริ่มต้น เมื่อคุณดาวน์โหลด XAMPP แล้ว แผงควบคุม XAMPP ของคุณควรเปิดขึ้นโดยอัตโนมัติ หากไม่เป็นเช่นนั้น คุณสามารถค้นหาโปรแกรม XAMPP ได้เช่นเดียวกับการค้นหาอื่นๆ (ผ่านการค้นหาเมนูเริ่ม)

ในหน้าต่างแผงควบคุม XAMPP ของคุณ คุณควรเห็นเลย์เอาต์ง่ายๆ ที่กระบวนการ XAMPP กำลังทำงานอยู่ สำหรับจุดประสงค์ของเรา เราจะเน้นที่สองตัวเลือกแรก: Apache และ MySQL





Apache -- หัวใจสำคัญของ XAMPP ตัวเลือก Apache จะสร้างเซิร์ฟเวอร์ Apache บนพีซีของคุณ นี่คือสิ่งที่จะช่วยให้คุณสามารถเรียกใช้และแก้ไขเว็บไซต์บนพีซีของคุณผ่านเว็บเบราว์เซอร์ได้ เช่นเดียวกับเว็บไซต์ แน่นอนว่าเว็บไซต์นี้ทำงานบนพีซีของคุณ ยกเว้นเซิร์ฟเวอร์ที่เชื่อมต่อกับอินเทอร์เน็ต

MySQL -- SQL อนุญาตให้มีการสื่อสารระหว่างฐานข้อมูลและเว็บไซต์ ทำให้ผู้ใช้สามารถทดสอบและจัดเก็บอีเมล รหัสผ่าน และอินพุตข้อมูลอื่นๆ เราจะใช้ข้อมูลนี้สำหรับบัญชี WordPress ในพื้นที่ของคุณ

กด เริ่ม ปุ่มในแผงควบคุม XAMPP ของคุณภายใต้ การกระทำ สำหรับทั้ง Apache และ MySQL รอจนกว่าทั้ง Apache และ MySQL จะถูกเน้นเป็นสีเขียวภายใต้ส่วนโมดูลของคุณ เมื่อเปิดใช้งานแล้ว คุณสามารถใช้ XAMPP ได้อย่างอิสระ

Localhost และ phpMyAdmin

เพื่อให้แน่ใจว่าทุกอย่างทำงานได้ดี ให้เปิดเว็บเบราว์เซอร์ ป้อน http://localhost/ ลงในแถบที่อยู่ของคุณและกด เข้า . คุณควรถูกเปลี่ยนเส้นทางไปที่ http://localhost/dashboard/ ซึ่งเป็นหน้า XAMPP เริ่มต้น

จากนั้นคลิกที่ phpMyAdmin ปุ่มบนเมนูนำทางด้านบน คุณจะถูกนำไปยังหน้า phpMyAdmin เริ่มต้นของคุณ

ปล่อยสิ่งเหล่านี้ไว้ก่อน แต่ถ้าทั้งคู่ใช้งานได้ คุณก็พร้อมที่จะเริ่มสร้างเว็บไซต์แล้ว!

การสร้างเว็บไซต์โดยใช้ XAMPP

ตอนนี้มาถึงส่วนที่สนุก ไปที่โฟลเดอร์ XAMPP ที่อยู่ในไดเร็กทอรีรูทไดรฟ์ของคุณ ( C:xampp โดยค่าเริ่มต้น). จากนั้นมุ่งหน้าไปที่ htdocs . นี่จะเป็นที่เก็บเว็บไซต์หลักที่คุณจะใช้เพื่อดูเว็บไซต์

ก่อนที่เราจะสร้างและแก้ไขเว็บไซต์ คุณจะต้องมีโปรแกรมแก้ไขข้อความ แม้ว่าคุณจะใช้โปรแกรมแก้ไขข้อความเริ่มต้น เช่น Notepad ได้ แต่โดยทั่วไปแล้ว วิธีที่ดีที่สุดคือดาวน์โหลดโปรแกรมแก้ไขของบริษัทอื่นที่สร้างขึ้นสำหรับโค้ดและมาร์กอัปโดยเฉพาะ ข้อความประเสริฐ เป็นหนึ่งในสิ่งที่ดีที่สุด ดังนั้นให้ไปที่เว็บไซต์และดาวน์โหลดซอฟต์แวร์เพื่อเริ่มต้น

ตอนนี้คุณสามารถเริ่มดาวน์โหลดและติดตั้งเว็บไซต์ลงใน XAMPP ได้แล้ว ฉันจะใช้ โรดทริป เทมเพลต แต่คุณสามารถใช้เทมเพลตใดก็ได้ที่คุณต้องการ ดาวน์โหลดไฟล์ zip ของเว็บไซต์และเก็บไว้ในตำแหน่งที่คุณจะจำได้ จากนั้น สร้างโฟลเดอร์ภายในโฟลเดอร์ htdocs ของ XAMPP สำหรับเว็บไซต์ของคุณ ฉันชื่อของฉัน โรดทริป - พยายามทำให้ชื่อของคุณเรียบง่าย จากนั้นแตกไฟล์และแตกเนื้อหาของไฟล์ zip ของคุณไปยังโฟลเดอร์ htdocs นี้

เมื่อคุณแตกไฟล์แล้ว ให้ไปที่ที่เก็บเว็บไซต์ของคุณภายใน htdocs เพื่อให้แน่ใจว่าได้แตกไฟล์อย่างถูกต้อง

สุดท้าย ไปที่หน้าเว็บของคุณในเว็บเบราว์เซอร์ ของคุณ เว็บไซต์ พูดได้เลยว่าสามารถเข้าถึงได้โดยใช้ localhost ที่กล่าวถึงก่อนหน้านี้พร้อมกับชื่อโฟลเดอร์ที่เก็บไฟล์เพจของคุณ นี่เป็นเพราะว่าโดยพื้นฐานแล้วเว็บไซต์เป็นไฟล์ที่อยู่ในโฟลเดอร์ ทั้งหมดอยู่ภายใต้โดเมนเดียว หรือชื่อรูท คุณกำลังเรียนรู้อยู่แล้ว!

โฟลเดอร์ที่เราสร้างไว้ก่อนหน้านี้มีชื่อว่า roadtrip ดังนั้นที่อยู่เว็บไซต์แบบเต็มคือ http://localhost/roadtrip .

คุณทำเสร็จแล้ว! ตอนนี้คุณสามารถเริ่มแก้ไขเว็บไซต์ในเครื่องได้

การแก้ไขเว็บไซต์

เปิดข้อความประเสริฐ มุ่งหน้าสู่ ไฟล์ และเลือก เปิดโฟลเดอร์ . ค้นหาและเลือกโฟลเดอร์เว็บของคุณภายในโฟลเดอร์ XAMPP ตอนนี้คุณสามารถแก้ไขหลายหน้าของเว็บไซต์เดียวกันภายในโปรแกรมแก้ไข Sublime Text ของคุณ

Sublime Text ยังมีอินเทอร์เฟซที่ยอดเยี่ยมสำหรับคุณในการดูทุกไฟล์และโฟลเดอร์ในเว็บไซต์ของคุณ หากต้องการสร้างการเปลี่ยนแปลงบนเว็บไซต์ ให้แก้ไขโค้ดของเว็บไซต์ บันทึก (โดยใช้คำสั่งแป้นพิมพ์ Ctrl + S ) และรีเฟรชเว็บไซต์ของคุณภายในเบราว์เซอร์

กระบวนการนี้ง่ายและตรงไปตรงมา: แก้ไขหน้าเว็บ จากนั้นตรวจดูว่าโค้ดของคุณใช้งานได้หรือไม่ ในขณะที่คุณก้าวหน้าในการพัฒนาเว็บ คุณจะต้องพยายามฝังคุณลักษณะที่ซับซ้อนมากขึ้นลงในหน้าเว็บของคุณ ไม่ว่าระดับทักษะจะเป็นอย่างไร รูปแบบพื้นฐานในการแก้ไขหน้ายังคงเหมือนเดิม

ใช้ WordPress กับ XAMPP

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

ใช้รูปแบบเดียวกันเพื่อสร้างเว็บไซต์เหมือนที่เคยทำมา โดยที่โฟลเดอร์ WordPress ที่แยกออกมาจะแสดงอยู่ในไดเร็กทอรี htdoc ภายในโฟลเดอร์ เวิร์ดเพรส . รักษาชื่อโฟลเดอร์เพื่อความชัดเจน

การใช้ phpMyAdmin

เนื่องจาก WordPress ต้องการให้คุณสร้างข้อมูลการเข้าสู่ระบบ คุณจะต้องสร้างรายการในไดเร็กทอรี PHP ของคุณสำหรับหน้าเว็บ มุ่งหน้าสู่ หน้า phpMyAdmin ของคุณ - http://localhost/phpmyadmin/ โดยค่าเริ่มต้น -- เพื่อเริ่มต้น

จากหน้านี้ ให้คลิกที่ ฐานข้อมูล . ภายใต้ สร้างฐานข้อมูล พารามิเตอร์ enter เวิร์ดเพรส แล้วก็ตี สร้าง . คุณควรเห็นป๊อปอัปแจ้งว่าฐานข้อมูลถูกสร้างขึ้น ถัดไป ปิดหน้าต่างเบราว์เซอร์นี้และเข้าสู่โฟลเดอร์ WordPress ของคุณภายในไดเร็กทอรี XAMPP htdocs โฟลเดอร์นี้ควรมีเนื้อหาของไฟล์ WordPress ที่คลายซิป

การกำหนดค่าการเข้าสู่ระบบ

เราจำเป็นต้องกำหนดค่าเว็บไซต์ WordPress จริงเพื่อให้คุณสามารถเข้าสู่ระบบและใช้งานเว็บไซต์ได้ ทำได้ผ่านไฟล์กำหนดค่า PHP หลักของ WordPress ภายในโฟลเดอร์ WordPress ของคุณ ให้ค้นหาไฟล์ที่มีข้อความว่า wp-config-sample.php , คลิกขวาที่ไฟล์ เลือก แก้ไข (หรือ เปิดด้วย สำหรับตัวแก้ไขข้อความแยกต่างหาก) Notepad ควรทำงานได้ดี

นี่คือรหัสที่เราจะเน้น:

// ** MySQL settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define('DB_NAME', ' database_name_here ');
/** MySQL database username */
define('DB_USER', ' username_here ');
/** MySQL database password */
define('DB_PASSWORD', ' password_here ');

คุณจะต้องทำการเปลี่ยนแปลงสามครั้งในโค้ดด้านบน ภายใน เครื่องหมายคำพูด

ฐานข้อมูล_name_here -- เปลี่ยนพารามิเตอร์นี้เป็น เวิร์ดเพรส . จากนั้นเว็บไซต์จะใช้ฐานข้อมูลที่สร้างไว้ก่อนหน้านี้ใน phpMyAdmin ที่มีป้ายกำกับดังกล่าว

username_here -- เปลี่ยนสิ่งนี้เป็น ราก . ชื่อผู้ใช้รูทจะมีสิทธิ์ของผู้ดูแลระบบที่เหมาะสมตามค่าเริ่มต้น ดังนั้นจะได้รับอนุญาตผ่าน phpMyAdmin ชื่อผู้ใช้อื่นจะไม่ทำงานเว้นแต่จะได้รับสิทธิ์ที่เหมาะสม

รหัสผ่าน_ที่นี่ -- เปลี่ยนเป็นรหัสผ่านที่ระบุได้ง่าย หากคุณไม่ต้องการใช้รหัสผ่าน ให้ลบพารามิเตอร์

บันทึกไฟล์นี้เป็น wp-config.php -- ตรงข้ามกับก่อนหน้านี้ wp-config-sample.php -- และออกไป จากนั้นไปที่ที่อยู่ localhost ต่อไปนี้: http://localhost/wordpress .

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

คุณทำเสร็จแล้ว! ตอนนี้คุณสามารถใช้หัวใจของคุณในการแก้ไข แก้ไข และสร้างหน้าเว็บทั้งจากศูนย์และ ผ่าน WordPress ออฟไลน์และฟรี !

จะเป็นอย่างไรถ้าฉันไม่อัพเกรดเป็น windows 10

การพัฒนาเว็บเริ่มต้นด้วยหน้าเดียว

ก่อนหน้านี้ คุณเพิ่งเริ่มต้นเส้นทางการพัฒนาเว็บ ตอนนี้ คุณได้สร้างเซิร์ฟเวอร์ภายในเครื่องบนพีซีของคุณแล้ว ซึ่งคุณสามารถสร้าง แก้ไข และปรับเปลี่ยนหน้าเว็บได้ตามต้องการ เหนือสิ่งอื่นใด คุณเป็นผู้ควบคุมอย่างสมบูรณ์ สิ่งเดียวที่เหลือคือการเริ่มการทดลองของคุณ ไปได้เลย!

ตัดสินใจว่าคุณไม่ต้องการที่จะผ่านงานนี้ทั้งหมด? ลองหนึ่งใน บริการโฮสต์เว็บไซต์ฟรีที่ดีที่สุด แทนที่.

เครดิตรูปภาพ: Dmitry Tishchenko/Shutterstock

แบ่งปัน แบ่งปัน ทวีต อีเมล 6 ทางเลือกที่ได้ยิน: แอพหนังสือเสียงฟรีหรือราคาถูกที่ดีที่สุด

หากคุณไม่ต้องการจ่ายค่าหนังสือเสียง นี่คือแอพดีๆ ที่ให้คุณฟังได้ฟรีและถูกกฎหมาย

อ่านต่อไป
หัวข้อที่เกี่ยวข้อง
  • Windows
  • การเขียนโปรแกรม
  • เวิร์ดเพรส
  • การพัฒนาเว็บ
  • เว็บโฮสติ้ง
  • เครื่องมือของผู้ดูแลเว็บ
  • Apache Server
  • เว็บเซิร์ฟเวอร์
เกี่ยวกับผู้เขียน คริสเตียน โบนิลลา(83 บทความที่ตีพิมพ์)

Christian เป็นสมาชิกล่าสุดในชุมชน MakeUseOf และเป็นนักอ่านตัวยงทุกเรื่องตั้งแต่วรรณกรรมหนาแน่นไปจนถึงการ์ตูนเรื่อง Calvin และ Hobbes ความหลงใหลในเทคโนโลยีของเขานั้นตรงกับความต้องการและความเต็มใจที่จะช่วยเหลือเท่านั้น หากคุณมีคำถามใด ๆ เกี่ยวกับ (ส่วนใหญ่) ใด ๆ โปรดส่งอีเมลถึงเรา!

เพิ่มเติมจาก Christian Bonilla

สมัครรับจดหมายข่าวของเรา

เข้าร่วมจดหมายข่าวของเราสำหรับเคล็ดลับทางเทคนิค บทวิจารณ์ eBook ฟรี และดีลพิเศษ!

คลิกที่นี่เพื่อสมัครสมาชิก