bitrock website

เว็บไซต์ bitrock

เว็บไซต์นี้เป็นอินสแตนซ์ VuePress ที่ใช้ธีมแบบกำหนดเอง คุณสามารถอ่านเอกสารอย่างเป็นทางการเพื่อเรียนรู้วิธีแก้ไขเนื้อหาหรือวิธีการทำงานของธีม

ข้อกำหนด

คุณต้องติดตั้งซอฟต์แวร์ต่อไปนี้ในเครื่องของคุณเพื่อเริ่มต้น:

• Node.js เสถียรล่าสุด
• ตัวจัดการแพ็คเกจ Yarn สามารถติดตั้งทั้งสองผ่าน Homebrew บนสภาพแวดล้อม MacOS และ Linux

สร้างสภาพแวดล้อมการพัฒนาท้องถิ่น

โคลน repo ในเครื่อง

$ git clone [email protected]:bitrockteam/bitrock-website.git

ย้ายไปที่โฟลเดอร์และติดตั้งการอ้างอิงด้วย Yarn

$ cd bitrock-website && yarn

เริ่มการพัฒนาเว็บเซิร์ฟเวอร์บน localhost:8080

$ yarn start

การเขียน

เนื้อหามีให้ผ่านไฟล์ Markdown ในโฟลเดอร์ ./src ไม่มีโปรแกรมแก้ไขภาพในตัว จึงสามารถเขียนได้ทุกที่ที่คุณต้องการ แต่เรียงตามลำดับ คอมโพเนนต์ Vue ได้รับการสนับสนุนภายในเนื้อหา Markdown และอาจได้รับการพิจารณาให้เพิ่มคอมโพเนนต์ที่กำหนดเองบางอย่างเพื่อให้ผู้เขียนมีความสามารถพิเศษ ข้อมูลเมตาจัดทำขึ้นโดยใช้ข้อกำหนดของ Frontmatter

เพิ่มหน้า

สร้างโฟลเดอร์ย่อยในพา ./src จากนั้นสร้างไฟล์ readme.md ภายในโฟลเดอร์นั้น โดยเพิ่มข้อมูลต่อไปนี้ที่ด้านบนของไฟล์:

---
layout : Page
---

ตัวอย่าง : ไฟล์ ./src/about-us/readme.md จะกลายเป็นหน้า https://bitrock.it/about-us

หากต้องการเพิ่มเพจในเมนูการนำทาง จะต้องอัปเดต ./src/.vuepress/config.js

เพิ่มโพสต์บล็อก

สร้างโฟลเดอร์ย่อยในพา ./src/blog จากนั้นสร้างไฟล์ readme.md ภายในโฟลเดอร์นั้น โดยเพิ่มข้อมูลต่อไปนี้ที่ด้านบนของไฟล์:

---
title : Hello world!
image : /img/hello.jpg
author : writer
publish : 2018-12-21
layout : Post
category : news
tags :
  - greetings
  - hello
---

ตัวอย่าง : ไฟล์ ./src/blog/hello-world/readme.md จะกลายเป็นหน้า https://bitrock.it/blog/hello-world

โพสต์จะแสดงตามลำดับเวลาย้อนกลับ (ล่าสุดก่อน) ในหน้าหลัก

รูปภาพ

ต้องเพิ่มรูปภาพทั่วทั้งไซต์ในโฟลเดอร์ ´./src/.vuepress/public/img´ โปรดทราบว่าหากคุณเพิ่มรูปภาพภายในโฟลเดอร์โพสต์หรือเพจ จะไม่สามารถเข้าถึงได้ภายนอก URL ของเพจโดยใช้พาธแบบสัมพันธ์

ไม่มีกระบวนการปรับให้เหมาะสมอัตโนมัติ ดังนั้นโปรดระมัดระวังขนาดของภาพที่คุณกำลังเผยแพร่

การพัฒนา

ไฟล์ต้นฉบับการพัฒนาทั้งหมดอยู่ภายในโฟลเดอร์ . ./src/.vuepress/theme

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

ปลั๊กอิน Vuepress

• @vuepress/plugin-google-analytics ให้รหัสการตรวจสอบ Google Analytics โดยจะแทรกโค้ดที่จำเป็นลงในหน้าเว็บ
• @vuepress/plugin-pwa สร้าง Services Worker บนเฟสบิลด์ที่แมปสินทรัพย์คงที่ทั้งหมดสำหรับการแคชออฟไลน์ จะ ไม่ สร้างไฟล์ Manifest ที่จำเป็นสำหรับการทริกเกอร์ฟังก์ชัน PWA ซึ่งเขียนด้วยตนเองและให้บริการในโฟลเดอร์สาธารณะ
• @vuepress/plugin-back-to-top เพียงเพิ่มปุ่มลูกศรกลับไปด้านบนหลังจากเลื่อนลงเล็กน้อยจากวิวพอร์ตเริ่มต้น
• @vuepress/nprogress เพิ่มแถบความคืบหน้าที่ด้านบนของหน้าเมื่อโหลดเนื้อหาใหม่ คล้ายกับสิ่งที่เกิดขึ้นใน YouTube

ยูทิลิตี้ JS

การพึ่งพาหลักที่นี่คือไลบรารี Vue.js ซึ่งใช้ในการสร้างส่วนประกอบ ที่เหลือทั้งหมดคือ Vanilla Javascript

ยูทิลิตี้ CSS

เรากำลังใช้ไลบรารี CSS นี้:

• Normalize.css ทำให้เบราว์เซอร์เรนเดอร์องค์ประกอบทั้งหมดได้สอดคล้องกันมากขึ้นและสอดคล้องกับมาตรฐานสมัยใหม่
• typebase.css จุดเริ่มต้นสำหรับการพิมพ์เว็บ
• แฮมเบอร์เกอร์ เมนูแฮมเบอร์เกอร์แบบเคลื่อนไหว CSS

นโยบายการแยกสาขา

โปรเจ็กต์นี้เป็นไปตามนโยบายการแยกย่อยแบบง่าย:

• master มีเฉพาะโค้ดที่เสถียรเท่านั้น และไม่ควรอัปเดตโดยตรง
• development ที่มีการเขียนโค้ดที่พัฒนาหรือทดลอง
• gh-pages ที่มีการปรับใช้ไฟล์สแตติกที่สามารถแจกจ่ายได้ แต่ ** คุณควรหลีกเลี่ยงการส่ง / พุชที่นี่โดยตรง **

อย่า รวม development โดยตรงเข้ากับ master ( มันถูกล็อคโดยผู้ดูแลระบบ... ) โปรดส่ง PR เพื่อให้มีการตรวจสอบเสมอ

อัปเดตและปรับใช้

ทุกครั้งที่สาขา master ได้รับการอัปเดต (การคอมมิตโดยตรงหรือ PR แบบรวม) งาน Travis CI ใหม่จะถูกทริกเกอร์และประกอบด้วยขั้นตอนเหล่านี้:

1. ติดตั้งการพึ่งพา
2. Vuepress สร้างเว็บไซต์ด้วยไฟล์ที่เกี่ยวข้องทั้งหมดในโฟลเดอร์ /dist
3. หากบิลด์สำเร็จ โฟลเดอร์ /dist จะถูกปรับใช้บน GitHub Pages
4. การปรับใช้ใหม่มีให้ที่ bitrock.it

มีสคริปต์ NPM ที่พร้อมใช้งานด้วยตนเองในสาขา gh-pages จากเครื่องท้องถิ่นของคุณ (ก่อนอื่นคุณต้องสร้างโครงการในเครื่อง):

$ yarn gh:pages

แต่โปรดใช้มันเฉพาะเมื่อจำเป็น จริงๆ เท่านั้น

ใบอนุญาต

โลโก้ Databiz Group, Bitrock และ Radicalbit เป็นเครื่องหมายการค้าจดทะเบียน รหัสเผยแพร่ภายใต้ใบอนุญาต GNU AGPLv3 ภาพถ่ายสต็อกที่รวมไว้จัดทำโดย Unsplash