ในการเริ่มต้นอย่างรวดเร็วนี้ คุณจะได้ศึกษาวิธีทำสิ่งต่อไปนี้
- เพิ่ม Firebase Data Connect ลงในโปรเจ็กต์ Firebase
- ตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์ซึ่งรวมถึงส่วนขยายโค้ด Visual Studio เพื่อทำงานร่วมกับอินสแตนซ์เวอร์ชันที่ใช้งานจริง
- จากนั้น เราจะแสดงวิธีทำสิ่งต่อไปนี้
- สร้างสคีมาสำหรับแอปอีเมลและทำให้ใช้งานได้เป็นเวอร์ชันที่ใช้งานจริง
- กำหนดคำค้นหาและการกลายพันธุ์สำหรับสคีมาของคุณ
- ทำให้ต้นแบบสุดท้ายใช้งานได้จริง
สิ่งที่ต้องดำเนินการก่อน
ในการใช้การเริ่มต้นอย่างรวดเร็วนี้ คุณจะต้องมีสิ่งต่อไปนี้
- Linux, macOS หรือ Windows
- โค้ด Visual Studio
เพิ่ม Data Connect ในโปรเจ็กต์และสร้างแหล่งข้อมูล
- สร้างโปรเจ็กต์ Firebase หากยังไม่มี
- ในคอนโซล Firebase ให้คลิกเพิ่มโปรเจ็กต์ แล้วทำตามวิธีการบนหน้าจอ
อัปเกรดโปรเจ็กต์เป็นแพ็กเกจ Blaze ซึ่งจะช่วยให้คุณสร้างอินสแตนซ์ Cloud SQL สำหรับ PostgreSQL ได้
ไปที่ส่วน Data Connect ของคอนโซล Firebase แล้วทำตามเวิร์กโฟลว์การตั้งค่าผลิตภัณฑ์
เลือกตำแหน่งที่ตั้งของฐานข้อมูล CloudSQL สำหรับ PostgreSQL
จดชื่อและรหัสโปรเจ็กต์ บริการ และฐานข้อมูลไว้เพื่อยืนยันในภายหลัง
ทำตามขั้นตอนการตั้งค่าที่เหลือ แล้วคลิกเสร็จสิ้น
เลือกและตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์
Data Connect รองรับประสบการณ์การพัฒนา 2 แบบสำหรับการสร้างต้นแบบ ดังนี้
- หากคุณเป็นนักพัฒนาซอฟต์แวร์ของ Kotlin Android หรือเว็บ คุณสามารถใช้การพัฒนาโค้ด VS เพื่อสร้างต้นแบบของสคีมาและการดำเนินการในเครื่องขณะเชื่อมต่อกับอินสแตนซ์ Cloud SQL สำหรับ PostgreSQL ได้
หากคุณเป็นนักพัฒนาซอฟต์แวร์เว็บ คุณสามารถใช้ IDX Development เพื่อสร้างต้นแบบในพื้นที่ทำงาน IDX โดยใช้เทมเพลต IDX ที่กำหนดค่าล่วงหน้าด้วย PostgreSQL, ส่วนขยาย VS Code ที่มีโปรแกรมจำลอง Data Connect และการสร้างโค้ดอย่างรวดเร็วให้คุณ
การพัฒนา VS Code
ถ้าอยากพัฒนาในเครื่องแทนการใช้ IDX ให้ตั้งส่วนขยาย Firebase VS Code เพื่อช่วยปรับปรุงการพัฒนาอย่างรวดเร็ว
- สร้างไดเรกทอรีใหม่สำหรับโปรเจ็กต์ในเครื่อง
- เปิด VS Code ในไดเรกทอรีใหม่
ดาวน์โหลดส่วนขยายซึ่งรวมอยู่ในแพ็กเกจ VSIX จากพื้นที่เก็บข้อมูลของ Firebase
ใน VS Code ให้เลือกส่วนขยายจากเมนูมุมมอง
ในแถบชื่อแผงส่วนขยาย ให้คลิกไอคอนเมนู more_horiz จากนั้นทำตาม ติดตั้งจาก VSIX...
การพัฒนา IDX
IDX เป็นสภาพแวดล้อมที่ได้รับการเพิ่มประสิทธิภาพสำหรับการพัฒนาเว็บแอป หากคุณเป็นนักพัฒนาซอฟต์แวร์ Android ของ Kotlin โปรดทำตามขั้นตอนในแท็บการพัฒนาโค้ด VS
วิธีตั้งค่าเทมเพลต Data Connect IDX
- เข้าถึงเทมเพลตที่เว็บไซต์ Project IDX
- ทำตามขั้นตอนการตั้งค่า
นอกจากนี้ คุณยังติดตั้งฐานข้อมูล PostgreSQL ในเครื่องสำหรับการพัฒนาในเครื่องได้ด้วยโปรแกรมจำลอง Data Connect โดยการตั้งค่านี้มีอยู่ในตอนท้ายของ คู่มือการเริ่มต้นอย่างรวดเร็วนี้
ตั้งค่าโปรเจ็กต์ที่อยู่ในเครื่อง
ติดตั้ง CLI โดยทําตามวิธีการทั่วไป หากคุณติดตั้ง npm ไว้แล้ว ให้เรียกใช้คำสั่งต่อไปนี้
npm install -g firebase-tools
เริ่มต้นไดเรกทอรีโปรเจ็กต์เพื่อตั้งค่าโปรเจ็กต์ในเครื่อง
ตั้งค่าไดเรกทอรีโปรเจ็กต์
เริ่มต้นไดเรกทอรีโปรเจ็กต์เพื่อตั้งค่าโปรเจ็กต์ในเครื่อง
ในแผงด้านซ้ายมือของ VS Code ให้คลิกไอคอน Firebase เพื่อเปิด UI ของส่วนขยาย Firebase VS Code
ใน UI ของส่วนขยาย Firebase ให้ทำดังนี้
- ตรวจสอบว่าคุณได้ลงชื่อเข้าใช้แล้ว
- คลิกปุ่มเรียกใช้ firebase init
- ตรวจสอบข้อความแจ้งที่แท็บ Terminal ในแผง VS Code ด้านล่าง
- เลือก Data Connect เป็นฟีเจอร์ที่จะใช้ในไดเรกทอรีนี้
- เมื่อมีข้อความแจ้ง ให้ระบุรหัสโปรเจ็กต์ บริการ และฐานข้อมูลของโปรเจ็กต์ Data Connect ที่คุณสร้างไว้ก่อนหน้านี้ในคอนโซล
สร้างสคีมา Data Connect และการค้นหา
เริ่มใช้ GraphQL เพื่อสร้างแบบจำลองของผู้ใช้และอีเมล คุณจะได้อัปเดตแหล่งที่มาใน
/dataconnect/schema/schema.gql
/dataconnect/default-connector/queries.gql
เริ่มสร้างสคีมา
ในไดเรกทอรีโปรเจ็กต์ Firebase ให้จดโฟลเดอร์ dataconnect
ไว้ ซึ่งจะเป็นที่ที่คุณกำหนดโมเดลข้อมูลสำหรับฐานข้อมูล Cloud SQL โดยใช้ GraphQL
ในไฟล์ /dataconnect/schema/schema.gql
ให้เริ่มกำหนดสคีมาที่มีผู้ใช้และอีเมล
ผู้ใช้
ใน Data Connect ระบบจะแมปช่อง GraphQL กับคอลัมน์ ผู้ใช้จะมี uid
, name
และอีเมล address
Data Connect รู้จักประเภทข้อมูลพื้นฐานหลายประเภท ได้แก่ String
และ Date
คัดลอกข้อมูลโค้ดต่อไปนี้หรือยกเลิกการเลือกบรรทัดที่เกี่ยวข้องในไฟล์
# File `/dataconnect/schema/schema.gql`
type User @table(key: "uid") {
uid: String!
name: String!
address: String!
}
โดยค่าเริ่มต้น Firebase Data Connect จะเพิ่มคีย์ UUID id
หากไม่มีให้ไว้ แต่ในกรณีนี้ คุณต้องการให้ uid
เป็นคีย์หลัก ซึ่งทำผ่านคำสั่ง @table(key: "uid")
ได้
อีเมล
เมื่อมีผู้ใช้แล้ว คุณก็สร้างแบบจำลองอีเมลได้ คุณสามารถเพิ่มช่องทั่วไป (หรือคอลัมน์) สำหรับข้อมูลอีเมลได้ที่นี่ คราวนี้คุณไม่ต้องเพิ่มคีย์หลัก เพราะใช้ Data Connect จัดการได้
# File `/dataconnect/schema/schema.gql`
type Email @table {
subject: String!
sent: Date!
text: String!
from: User!
}
โปรดสังเกตว่าฟิลด์ from
แมปกับประเภท User
แล้ว
Data Connect เข้าใจว่านี่คือความสัมพันธ์ระหว่าง Email
กับ User
และจะจัดการความสัมพันธ์นี้ให้คุณ
ทำให้สคีมาใช้งานได้เป็นเวอร์ชันที่ใช้งานจริง
หากใช้ส่วนขยายโค้ด Firebase VS เพื่อทำงานกับฐานข้อมูลเวอร์ชันที่ใช้งานจริง คุณต้องทำให้สคีมาใช้งานได้ก่อนที่จะดำเนินการต่อ หลังจากทำให้สคีมาใช้งานได้ในฐานข้อมูลที่ใช้งานจริงแล้ว คุณควรดูสคีมาในคอนโซลได้
- คุณสามารถใช้ส่วนขยาย Firebase VS Code เพื่อทำให้ใช้งานได้
- ใน UI ของส่วนขยาย ในแผง Firebase Data Connect ให้คลิกทำให้ใช้งานได้ทั้งหมด
- คุณอาจต้องตรวจสอบการเปลี่ยนแปลงสคีมาและอนุมัติการแก้ไขที่อาจเป็นผลเสีย ระบบจะแจ้งให้คุณดำเนินการต่อไปนี้
- ตรวจสอบการเปลี่ยนแปลงสคีมาโดยใช้
firebase dataconnect:sql:diff
- เมื่อพอใจกับการเปลี่ยนแปลงแล้ว ให้นำการเปลี่ยนแปลงไปใช้โดยใช้ขั้นตอนที่เริ่มต้นภายในวันที่
firebase dataconnect:sql:migrate
- ตรวจสอบการเปลี่ยนแปลงสคีมาโดยใช้
ดำเนินการเปลี่ยนแปลงเพื่อเพิ่มข้อมูลลงในตาราง
ในแผงตัวแก้ไข VS คุณจะเห็นปุ่ม CodeLens ปรากฏขึ้นเหนือประเภท GraphQL ใน /dataconnect/schema/schema.gql
เนื่องจากคุณได้ทำให้สคีมาใช้งานได้จริงแล้ว คุณจึงใช้ปุ่มเพิ่มข้อมูลและปุ่มเรียกใช้ (เวอร์ชันที่ใช้งานจริง) ในไฟล์ที่สร้างขึ้นเพื่อดำเนินการเหล่านี้ได้บนแบ็กเอนด์
วิธีเพิ่มระเบียนลงในตาราง User
และ Email
- ใน
schema.gql
ให้คลิกปุ่มเพิ่มข้อมูลด้านบนการประกาศประเภทUser
- ในไฟล์
User_insert.gql
ที่สร้างขึ้น ข้อมูลแบบฮาร์ดโค้ดสำหรับทั้ง 3 ช่อง - คลิกปุ่มเรียกใช้ (เวอร์ชันที่ใช้งานจริง)
- ทำตามขั้นตอนก่อนหน้าซ้ำเพื่อเพิ่มระเบียนลงในตาราง
Email
โดยระบุuid
ของผู้ใช้ในช่องfromUid
ตามที่มีข้อความแจ้งในการเปลี่ยนแปลงEmail_insert
ที่สร้างขึ้น
เขียนคำค้นหาเพื่อใส่รายชื่ออีเมล
ทีนี้ก็ถึงส่วนที่สนุก นั่นคือการค้นหา ในฐานะนักพัฒนาซอฟต์แวร์ คุณคุ้นเคยกับการเขียนคำค้นหา SQL แทนที่จะใช้คำค้นหา GraphQL การเขียนจึงอาจดูแตกต่างไปเล็กน้อยในครั้งแรก อย่างไรก็ตาม GraphQL มีความเข้มงวดและปลอดภัยมากกว่า SQL แบบข้อมูลดิบมาก และส่วนขยาย VS Code ของเรา ก็ช่วยลดความซับซ้อนในการพัฒนาซอฟต์แวร์
เริ่มแก้ไขไฟล์ /dataconnect/default-connector/queries.gql
หากต้องการรับอีเมลทั้งหมด ให้ใช้คำค้นหาแบบนี้
# File `/dataconnect/default-connector/queries.gql`
query ListEmails @auth(level: NO_ACCESS) {
emails {
id, subject, text, sent
from {
name
}
}
}
ดำเนินการค้นหาโดยใช้ปุ่ม CodeLens ที่อยู่ใกล้เคียง
คุณลักษณะที่น่าสนใจอย่างหนึ่งคือความสามารถในการจัดการความสัมพันธ์ของฐานข้อมูล
ให้เหมือนกับกราฟ เนื่องจากอีเมลมีช่อง from
ที่อ้างอิงผู้ใช้ คุณจึงฝังไว้ในช่องดังกล่าวและรับข้อมูลเกี่ยวกับผู้ใช้อีกครั้งได้
ติดตั้งใช้งานต้นแบบที่เสร็จสมบูรณ์แล้วไปยังเวอร์ชันที่ใช้งานจริง
คุณได้ผ่านการปรับปรุงเพื่อการพัฒนา ตอนนี้คุณสามารถทำให้สคีมา ข้อมูล และคำค้นหาใช้งานได้ในเซิร์ฟเวอร์ที่มี UI ของส่วนขยาย Firebase หรือ Firebase CLI เช่นเดียวกับที่ทำกับสคีมา
หากคุณใช้ส่วนขยาย Firebase VS Code ในการทำให้ใช้งานได้ ให้คลิกปุ่มทำให้ใช้งานได้ทั้งหมด
เมื่อทำให้ใช้งานได้แล้ว คุณควรจะดูและเรียกใช้การดำเนินการในคอนโซลได้ด้วย บริการ Data Connect จะพร้อมประมวลผลการดำเนินการจากลูกค้า ระบบจะอัปเดตอินสแตนซ์ Cloud SQL สำหรับ PostgreSQL ด้วยสคีมาและข้อมูลที่สร้างขึ้นซึ่งทำให้ใช้งานได้ขั้นสุดท้าย
(ไม่บังคับ) ติดตั้ง PostgreSQL ในเครื่อง
การติดตั้ง PostgreSQL ในเครื่องและการผสานรวมกับโปรแกรมจำลองช่วยให้คุณสร้างต้นแบบได้ในสภาพแวดล้อมในการพัฒนาซอฟต์แวร์ภายในระบบเต็มรูปแบบ
คุณจะติดตั้งอินสแตนซ์ใหม่ของ PostgreSQL หรือใช้อินสแตนซ์ที่มีอยู่ก็ได้
ติดตั้ง PostgreSQL
ติดตั้ง PostgreSQL เวอร์ชัน 15.x ตามวิธีการสำหรับแพลตฟอร์มของคุณ
- macOS ดาวน์โหลดและติดตั้ง Postgres.app
- Windows: ใช้โปรแกรมติดตั้ง EDB จากหน้าดาวน์โหลด PostgreSQL
- Docker: ดึงและเรียกใช้อิมเมจ
pgvector/pgvector:15
ซึ่งมาพร้อมกับการรองรับ PostgreSQL 15.x และเวกเตอร์ - Linux: เราขอแนะนำให้ใช้ Docker กับรูปภาพก่อนหน้า แต่คุณสามารถทำตามวิธีการสำรองสำหรับรูปแบบที่ได้รับความนิยมได้
จดบันทึกชื่อโฮสต์ พอร์ต ชื่อผู้ใช้และรหัสผ่าน และพารามิเตอร์ที่เกี่ยวข้องเอาต์พุตระหว่างลำดับการติดตั้ง
หากต้องการเชื่อมต่อกับอินสแตนซ์ PostgreSQL โปรแกรมจำลองจะต้องมีสิ่งต่อไปนี้
- พารามิเตอร์การกำหนดค่าการตั้งค่าเหล่านี้
- ชื่อฐานข้อมูลจาก
dataconnect.yaml
และฐานข้อมูลที่มีชื่อที่สอดคล้องกันซึ่งเริ่มต้นในอินสแตนซ์ในเครื่อง
อัปเดต .firebaserc
ด้วยสตริงการเชื่อมต่อ
ใช้รายละเอียดการกำหนดค่า PostgreSQL ในเครื่อง รวมถึงชื่อผู้ใช้และรหัสผ่าน PostgreSQL ในเครื่องสำหรับสตริงการเชื่อมต่อเพื่อเพิ่มคีย์ต่อไปนี้ในไฟล์ .firebaserc
{
"projects": {},
...,
...,
"dataconnectEmulatorConfig": {
"postgres": {
"localConnectionString": "postgresql://postgresusername:postgrespassword@localhost:5432?sslmode=disable"
}}
}
เชื่อมต่อกับอินสแตนซ์ PostgreSQL ในเครื่อง
เมื่อกำหนดค่าเสร็จแล้ว หากต้องการเชื่อมต่อกับฐานข้อมูลภายในเครื่อง ให้ทำดังนี้
- คลิกไอคอน Firebase ใน VS Code ในแผงด้านซ้ายเพื่อเปิด UI ของส่วนขยาย Firebase VS Code
- คลิกปุ่มเชื่อมต่อกับ PostgreSQL ในเครื่อง