สวัสดีครับ นานมากแล้วที่ไม่ได้เขียนอะไรเพิ่มเลย งานวุ่นงานยุ่งเช่นเคย แต่ว่าวันนี้ขี้เกียจทำงานมากกกกก เลยมาเขียน blog แทนดีกว่า 55 (ขี้เกียจน้อยกว่า) สำหรับบทความนี้เนี่ยเขียนขึ้นเพื่อไว้
แก้ปัญหาส่วนตัวคือแบบ
- มีเพื่อนร่วมงาน designer อยากรันเว็บหน้าแห้ง(ดูผลงานตัวเอง)
- ทำงาน front-end ตัดรูปจาก photoshop มาทำ html
หลักคือทั้งสอง อย่างที่ว่ามาเนี่ยแม๋งต้องลง XAMP หรือ MAMP หรือจะเครื่องมือใดๆก็ตามเพื่อให้หน้าเว็บออกมาสมบูรณ์แบบ มันก็หนักเครื่องอยู่นะแล้วไหนจะลงแล้วรกเครื่องอีกเกะกะ เปิดใช้ครั้งสองครั้ง (แต่เอาจริงๆใช้ jekyll เนี่ยแม๋งก็ต้องใช้ cli เป็น 5555 ) โอเคไม่เป็นไรเรามารู้จัก jekyll กันดีกว่า
คือจริงๆแค่เข้าเว็บไซต์หลักของ jekyll ก็รู้แล้วว่ามันทำอะไรได้บ้าง – ,- (ไม่ต้องเขียน blog มาอธิบายก็ได้) หลักเลยก็คือมันเอาไว้รันเว็บหน้าแห้ง (*Static HTML บ้านๆเลยไม่มีอะไร) แต่ความเจ๋งอย่างอื่นของมันเนี่ยก็คือ รองรับ markdown(.md) และรองรับ Html template อย่าง liquid ของ shopify ทีนี้พอมันทำได้สองอย่างนี้เนี่ยก็เลย เอามาทำเป็น blog แบบง่ายๆได้เลย
เรามาเริ่มติดตั้งกันก่อนเลยดีกว่า
ก่อนอื่นเนี่ยจะติดตั้ง jekyll ต้องลง ruby ก่อนเพราะนะ เพราะใช้ gem install
|
1 |
gem install jekyll |
ทีนี้เราก็สามารถรันเว็บหน้าแห้งได้แล้ว โดยเราเข้าไปยัง folder เว็บไซต์เราแล้วพิมคำสั่ง
|
1 |
jekyll serve -w |
เพียงเท่านั้น jekyll จะรันเว็บไซต์เราอยู่ที่ port :4000 หรือก็คือเข้าที่ http://localhost:4000 การเราที่ -w หมายถึง watch ถ้าเรามีการแก้ไขไฟล์เว็บไซต์ก็จะเปลี่ยนไปตามที่เราแก้ (แต่จะหน่วงๆเวลาอยู่สองวิ) จบ……
เฮ้ยแต่เดียวก่อนยังไม่จบสำหรับที่ต้องการทำ blog แบบง่ายๆเนี่ย jekyll ก็จะมีคำสั่ง สร้าง project ให้โดย
|
1 |
jekyll new my-blog |
my-blog ในที่นี้คือชื่อ project นะ jekyll ก็จะสร้างโปรเจคให้เราจะประกอบไปด้วยไฟล์ต่างๆ
ตามภาพเลยหลักๆจะเห็นว่ามีโฟลเดอร์ _post ซึ่งข้อมูลบทความแต่ละบทความจะเก็บเป็น .markdown แล้วเดียวตอนเรารัน jekyll serve มันจะมาเก็บข้อมูลของเราที่โฟลเดอร์นี้แล้วนำไปแสดงผลให้ ส่วนของข้อมูลทั่วไปของ blog เราก็สามารถแก้ไขได้ที่ _config.yml
(ถ้าอยากรู้แต่ละไฟล์แต่ละโฟลเดอร์ทำอะไรได้ก็ลองเข้าไปอ่านได้ใน doc ของเค้านะครับจะละเอียดกว่า)
เวลาเรารันจะก็ได้ผลหน้าตาเป็นเว็บ blog ในภาพ
Jekyll-Import
ทีนี้เนี่ย jekyll ไม่ได้ให้มาแค่นี้นะครับ – -, ยังใจดีแถม jekyll-import มาให้เพื่อให้เราแปลง บทความเก่าๆของเราจาก cms มาเป็น .markdown ให้เราเอาไปใช้ต่อได้อีกด้วย จุดวาป สามารถเข้าไปอ่านเพิ่มเติมและวิธีได้นะครับส่วนอันนี้คือรายชื่อที่ jekyll รองรับ
แต่ละตัวก็จะมีวิธี set ไม่เหมือนกันนะครับต้องไล่อ่านนอกจากที่บอกมาทั้งหมดเนี่ย ยังจะมี plugin ของ jekyll เองอีกด้วยนะครับ (ลูกเล่นเค้าเยอะ ฮะๆ)
ก็ในส่วนของบทความนี้น่าจะจบแล้วแต่ยังสามารถอ่านต่อได้ที่ jekyll ที่อธิบายไปเนี่ยยังแค่ 30-40% ของที่เค้าทำได้เองนะ ไม่ได้โม้ ฮะๆยังไงก็หวังว่าจะมีประโยชน์นะครับสำหรับบทความนี้
