ฉันตัดสินใจที่จะเปิดเว็บไซต์พอร์ตโฟลิโอล่าสุดของฉัน! มันมีการจัดการเนื้อหาแบบไดนามิกเพื่อเพิ่มโครงการและโพสต์โดยใช้ CMS ที่มีเนื้อหาและถูกสร้างขึ้นโดยใช้ Next.js และ Chakra UI
อ้างถึงเอกสาร Next.js และ Chakra UI เพื่อเรียนรู้เพิ่มเติม
อย่าลังเลที่จะแยกที่เก็บนี้เพื่อสร้างพอร์ตโฟลิโอของคุณเองและถ้าคุณชอบ repo โปรดสนับสนุนมันด้วยการให้ดาว!
สร้าง .env.local และติดตามชื่อตัวแปรตาม .env.example และรับปุ่ม API ตามขั้นตอนด้านล่าง
1. สร้างบัญชีที่มีเนื้อหา
2. เพิ่มพื้นที่ชุมชน (ฟรี!)
3. เลือก "ฉันสร้างเนื้อหา"
4. ไปที่โมเดลเนื้อหาและเริ่มเพิ่มประเภทเนื้อหา
- ในเว็บไซต์พอร์ตโฟลิโอนี้มีเนื้อหา 5 ประเภทซึ่งก็คือ:
1. บล็อกโพสต์
หลังจากการอัปเดต⚡2.0.0ฉันใช้ปัญหา GitHub เป็นเนื้อหาบล็อก!
รายละเอียดเพิ่มเติมเกี่ยวกับเรื่องนี้ใน: https://abdulrahman.id/blog/unleash-your-dev-blog-write-more-with-github-issues-as-your-cms
- โปรเจ็กต์ FIARDEUGHTS
- โครงการ
- การแนะนำ
- contactme
คุณต้องเพิ่มชื่อที่แน่นอนนี้เนื่องจากเป็นรหัสที่ใช้ในรหัส
เพิ่มประเภทเนื้อหาตามฟิลด์เหล่านี้: 

ไปที่การตั้งค่า -> คีย์ API -> การจัดส่งเนื้อหา / ดูตัวอย่างโทเค็น -> "ชื่ออวกาศของคุณ" คัดลอก ID พื้นที่และโทเค็นการเข้าถึงเนื้อหา API การส่งมอบเนื้อหา API
ใส่ลงในตัวแปรสภาพแวดล้อมตาม .env.example และคุณพร้อมแล้ว!
1. สร้างโครงการ Firebase
2. หลังจากตั้งค่าสิ่งต่าง ๆ คุณจะได้รับปุ่ม API
3. ไปที่ฐานข้อมูล Firestore
4. เพิ่มคอลเลกชันชื่อ views
5. จากนั้นใส่ปุ่ม API เหล่านั้นมาก่อนตาม .env.example และนั่นคือ!
1. สร้างบัญชี Google Analytics ในส่วน การตั้งค่าคุณสมบัติ อย่าลืม เปิดการวิเคราะห์สากล
2 หลังจากนั้นคุณจะเห็นรหัสเริ่มต้นด้วย UA-
3. คัดลอกรหัสเหล่านั้นและใส่ลงในตัวแปรสภาพแวดล้อมตาม env.example และทำ!
ติดตั้งการพึ่งพาด้วย npm i หรือ yarn
เริ่มโครงการโดย npm run dev หรือ yarn dev
คุณสามารถปรับใช้ได้อย่างง่ายดายโดยใช้ vercel?
pages/index.js = หน้าแรก
pages/projects/index.js = โครงการเก็บถาวร
pages/blog/index.js = หน้ารายการบล็อก
pages/blog/[slug].js = หน้าโพสต์บล็อก
pages/api/views = api เพื่อดึงมุมมองโพสต์บล็อกจาก Firebase