ดาวน์โหลด laravel react sample app - ดาวน์โหลดซอร์สโค้ด laravel react sample app

laravel react sample app

ซอร์สโค้ดอื่น ๆ

2.0

ดาวน์โหลด

แอป Laravel React สำหรับ BigCommerce

นี่คือแอป BigCommerce พื้นฐานที่มีสองหน้าจอ มุมมองสรุปแคตตาล็อก และรายการคำสั่งซื้อที่สามารถยกเลิกได้ สร้างโดยใช้ Laravel และ React

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

สามารถอ่านคำแนะนำโดยละเอียดเกี่ยวกับขั้นตอนที่ดำเนินการเพื่อสร้างแอปนี้ พร้อมด้วยขั้นตอนที่จำเป็นในการสร้างแอปใน BigCommerce ได้ที่นี่

ข้อกำหนดเบื้องต้นและการติดตั้ง

ก่อนที่จะเริ่มดำเนินการ คุณจะต้องตรวจสอบให้แน่ใจว่าคุณมีคุณสมบัติตรงตามข้อกำหนดของระบบ:

PHP (คู่มือการติดตั้ง)
ผู้แต่ง (คู่มือการติดตั้ง)
Laravel (คู่มือการติดตั้ง)

เพื่อให้การพัฒนา PHP ง่ายขึ้นและทำให้แอปที่คุณพัฒนาสามารถแชร์ได้อย่างง่ายดาย คุณจะต้องใช้ Valet หรือ Homestead ขึ้นอยู่กับระบบปฏิบัติการของคุณ:

Local SSL Cert (แนะนำ Valet หรือ Homestead เพื่อความสะดวกในการตั้งค่า)
- Mac OS: บริการนำรถไปจอด (คู่มือการติดตั้ง)
- Windows / Linux: Homestead (คู่มือการติดตั้ง)

เราจะใช้ Valet สำหรับขั้นตอนบางส่วนด้านล่าง แต่ฟังก์ชันในการโฮสต์และแชร์ไซต์จะคล้ายกันกับทั้ง Valet และ Homestead สิ่งที่สำคัญกว่าในบทช่วยสอนนี้คือวิธีกำหนดค่า Laravel ให้ใช้ React และเชื่อมต่อกับ BigCommerce

ในการติดตั้งการพึ่งพา PHP:

composer install

และการพึ่งพา JS:

npm install

หากต้องการทดสอบบนร้านค้า BigCommerce คุณสามารถสร้างการทดลองใช้ฟรีบน bigcommerce.com หรือขอร้านค้าแซนด์บ็อกซ์ฟรีโดยสมัครเป็นพันธมิตรด้านเทคโนโลยี

การรวม Laravel และ React เข้าด้วยกัน

นี่คือจุดที่เราจะสร้างพื้นฐานสำหรับการพัฒนาในอนาคต: แอปพลิเคชันง่ายๆ ที่โหลดที่ URL เฉพาะในเบราว์เซอร์ของคุณและโหลดส่วนประกอบ React แทนหน้าจอ Laravel เริ่มต้น

สร้างโค้ดเบส Laravel ใหม่ คุณสามารถใช้คำสั่ง Laravel ที่สร้างต้นแบบเริ่มต้นสำหรับแอปในไดเร็กทอรี ~/Sites หรือใช้ Composer:

composer global require laravel/installer
laravel new laravel-react-bigcommerce-app

หรือ

composer create-project laravel/laravel laravel-react-bigcommerce-app

ไปที่ที่อยู่ของแอปเพื่อให้แน่ใจว่าแอปพร้อมใช้งานในเครื่อง:

หลังจากคำสั่งข้างต้นเสร็จสิ้น เราจะต้องตั้งค่าไดเร็กทอรีเพื่อให้ Valet สามารถให้บริการแอปได้อย่างปลอดภัย

 cd laravel-react-bigcommerce-app
valet link
valet secure

ตอนนี้คุณควรจะสามารถเยี่ยมชม URL ต่อไปนี้ในเบราว์เซอร์ของคุณและดูหน้าจอต้อนรับ Laravel เริ่มต้น:

https://laravel-react-bigcommerce-app.test

ตั้งค่า React เป็นเฟรมเวิร์ก JS โดยใช้ Breeze และ Inertia

Larvel Breeze มอบจุดเริ่มต้นที่เรียบง่ายและเรียบง่ายสำหรับการสร้างแอปพลิเคชัน Laravel พร้อมคุณสมบัติการตรวจสอบสิทธิ์ ขับเคลื่อนโดย Blade และ Tailwind แต่สามารถกำหนดค่าเป็น SPA ได้โดยใช้ความเฉื่อย ในตัวอย่างนี้ เราจะเพิ่มประสิทธิภาพให้กับส่วนหน้าของเราด้วยการตอบสนอง

ก่อนอื่นมาติดตั้ง Breeze: