สร้างแอป Ionic ด้วยแม่แบบและ Back4App ใน 4 ขั้นตอน
11 นาที
เริ่มโปรเจกต์ ionic ของคุณจากแม่แบบแอป บทนำ ในส่วนนี้คุณจะได้เรียนรู้วิธีเริ่มต้นกับแม่แบบ ionic และเตรียมพร้อมใช้งาน back4app ใน 4 ขั้นตอน ข้อกำหนดเบื้องต้น ในการทำให้การเริ่มต้นนี้เสร็จสมบูรณ์ คุณต้อง visual studio code https //code visualstudio com/download (หรือ ide เว็บใดก็ได้ที่คุณชอบ) ionic framework https //ionicframework com/getting started/ แอปที่สร้างขึ้นที่ back4app ติดตาม บทเรียนการสร้างแอป parse ใหม่ https //www back4app com/docs/get started/new parse app เพื่อเรียนรู้วิธีการสร้างแอป parse ที่ back4app 1 รับแม่แบบ ดาวน์โหลดแม่แบบที่ ที่เก็บ github https //github com/back4app/ionic quickstart example , และแตกไฟล์ในโฟลเดอร์โปรเจกต์ของคุณ คุณสามารถทำได้โดยใช้บรรทัดคำสั่งต่อไปนี้ $ curl lok https //github com/back4app/ionic quickstart example/archive/master zip && unzip master zip 2\ ไปที่โฟลเดอร์ที่แตกไฟล์และติดตั้งการพึ่งพาโดยใช้บรรทัดคำสั่งต่อไปนี้ $ cd ionic quickstart example master && npm install 2 เปิดเทมเพลตโปรเจกต์ เปิด visual studio code คลิกที่ \<font color="#2166ae">เปิดโฟลเดอร์\</font> 3\ ไปที่โฟลเดอร์โปรเจกต์และคลิกที่ \<font color="#2166ae">ตกลง\</font> 4\ รอให้ visual studio เปิดขึ้น 3 ตั้งค่าข้อมูลประจำตัวของแอป อัปเดตค่าสตริงของคุณเพื่อตั้งค่าข้อมูลประจำตัวของแอป parse javascript sdk ใช้การตั้งค่าเหล่านี้เพื่อเชื่อมต่อกับเซิร์ฟเวอร์ back4app เพื่อทำเช่นนั้นให้ทำตามขั้นตอนเหล่านี้ เปิดไฟล์ typescript ที่บ้านของคุณ \<font color="#2166ae"> /src/pages/home/home ts\</font> 2\ ไปที่แดชบอร์ดแอปของคุณที่ เว็บไซต์ back4app https //www back4app com/ 3\ ไปที่การตั้งค่าของแอป คลิกที่ \<font color="#2166ae">การตั้งค่าเซิร์ฟเวอร์\</font> > \<font color="#2166ae">การตั้งค่าหลัก\</font> block > \<font color="#2166ae">การตั้งค่า\</font> 4\ กลับไปที่ \<font color="#2166ae">home ts\</font> ไฟล์ของคุณและวาง \<font color="#2166ae">app id\</font> และ \<font color="#2166ae">javascript key\</font> ดูเพิ่มเติมที่ คู่มือแอป parse ใหม่ https //www back4app com/docs/get started/new parse app 4 ทดสอบการเชื่อมต่อของคุณ เรียกใช้แอปของคุณในเบราว์เซอร์ $ ionic serve 1\ รอจนกว่าหน้าใหม่จะเปิดในเบราว์เซอร์ของคุณ ฉัน เพื่อดูหน้าในกรอบโทรศัพท์ ให้กด \<font color="#2166ae">f12\</font> 2\ เข้าสู่ระบบที่ เว็บไซต์ back4app https //www back4app com/ 3\ ค้นหาแอปของคุณและคลิกที่ \<font color="#2166ae">แดชบอร์ด\</font> 4\ คลิกที่ \<font color="#2166ae">หลัก\</font> 5\ ไปที่ \<font color="#2166ae">เบราว์เซอร์\</font> หากทุกอย่างทำงานได้อย่างถูกต้อง คุณควรพบคลาสที่ชื่อว่า \<font color="#2166ae">การติดตั้ง\</font> ดังนี้ เสร็จเรียบร้อย! ในจุดนี้ คุณได้เรียนรู้วิธีเริ่มต้นกับแอป ionic แล้ว