nuxtjs website boilerplate

nuxt.js เว็บไซต์ beilerplate

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

การสาธิต

คลิกที่นี่เพื่อดูการสาธิต

อ่านว่าแอพนี้สร้างขึ้นได้อย่างไร

คุณสมบัติ

1. ตอบสนองอย่างเต็มที่กับมือถือ w/ bootstrap frontend
   
2. SEO พร้อม
   
3. แบบฟอร์มการติดต่อที่ส่งอีเมลไปยังอีเมลของคุณที่เลือกและไปยัง Cosmic JS เพื่อการอ้างอิงได้ง่าย
   
4. ฟังก์ชั่นการค้นหาแบบเต็มไซต์
   
5. เนื้อหาทั้งหมดได้รับการจัดการอย่างง่ายดายใน Cosmic JS รวมถึงหน้าเว็บบล็อกและข้อมูลการติดต่อ

ลงทะเบียนสำหรับ Cosmic JS เพื่อติดตั้งเนื้อหาตัวอย่างและปรับใช้เว็บไซต์นี้

เริ่มต้น

git clone https://github.com/cosmicjs/nuxtjs-website-boilerplate
cd nuxtjs-website-boilerplate
npm install

# Run in development and serve at localhost:3000
npm run dev

# build for production
npm run build

# Run in production and serve at localhost:3000
COSMIC_BUCKET=your-bucket-slug npm start

นำเข้าไฟล์ bucket.json ลงในถัง Cosmic JS ของคุณ หากต้องการทำสิ่งนี้ไปที่ถังของคุณ> การตั้งค่า> นำเข้า / ส่งออกข้อมูล

การตั้งค่าแบบฟอร์มติดต่อ

ติดตั้งและปรับใช้ฟังก์ชั่นอีเมล SendGrid

แบบฟอร์มการติดต่อในหน้าติดต่อใช้ฟังก์ชันอีเมล SendGrid เพื่อส่งอีเมล หากต้องการปรับใช้ฟังก์ชั่นอีเมลของคุณไปที่ Bucket> การตั้งค่า> ฟังก์ชั่น ติดตั้งและปรับใช้ฟังก์ชัน SendGrid คุณจะต้องมีบัญชีที่มี SendGrid เพื่อเพิ่มคีย์ SendGrid API ของคุณ

เพิ่มจุดสิ้นสุดฟังก์ชัน SendGrid

ในการพัฒนา

ไปที่ config/index.js และแก้ไข SENDGRID_FUNCTION_ENDPOINT เพื่อเพิ่ม URL ด้วยตนเองสำหรับการทดสอบ

ในการผลิต

หากคุณใช้ตัวเลือกเว็บโฮสติ้งที่รวมอยู่ในถังทุกชิ้น:

1. ไปที่ถังของคุณ> การตั้งค่า> เว็บโฮสติ้ง
2. ปรับใช้เว็บไซต์ของคุณ
3. คลิกแท็บ 'ชุดตัวแปรสภาพแวดล้อม' และเพิ่มจุดสิ้นสุดฟังก์ชั่น SendGrid:

สำคัญ	ค่า
sendgrid_function_endpoint	https://your-lambda-endpoint.amazonaws.com/dev/send-email