fireadmin
v0.10.2
แอปพลิเคชันสำหรับการจัดการแอปพลิเคชัน Firebase รวมถึงการสนับสนุนสำหรับสภาพแวดล้อมที่หลากหลายและการย้ายข้อมูลข้อมูล
เร็วๆ นี้
สนใจที่จะเพิ่มคุณสมบัติหรือการสนับสนุน? กรุณาเปิดปัญหา!
เนื่องจากนี่คือซอร์สโค้ดสถานที่ที่ยอดเยี่ยมในการเริ่มต้นคือการตรวจสอบเวอร์ชันที่โฮสต์ของ FireAdmin ที่มีอยู่ที่ fireAdmin.io
ในขณะที่การพัฒนาคุณอาจพึ่งพาส่วนใหญ่ใน npm start ; อย่างไรก็ตามมีสคริปต์เพิ่มเติมในการกำจัดของคุณ:
yarn <script> | คำอธิบาย |
|---|---|
start | ให้บริการแอปของคุณที่ localhost:3000 |
start:dist | สร้างแอปพลิเคชันเป็น ./dist และให้บริการที่ localhost:3000 โดยใช้ firebase serve |
functions:start | เรียกใช้ฟังก์ชั่นการใช้งานในพื้นที่ (ใช้ firebase functions:shell |
functions:build | สร้างฟังก์ชั่นคลาวด์เป็น ./functions/dist |
functions:test | รันฟังก์ชั่นการทดสอบหน่วยด้วยมอคค่า |
build | สร้างแอปพลิเคชันเป็น ./dist |
test | เรียกใช้การทดสอบ E2E กับ Cypress ดูการทดสอบ |
lint | ผ้าสำลีโครงการสำหรับข้อผิดพลาดที่อาจเกิดขึ้น |
lint:fix | ผ้าสำลีโครงการและแก้ไขข้อผิดพลาดที่แก้ไขได้ทั้งหมด |
ฮัสกี้ใช้เพื่อเปิดใช้งานความสามารถของฮุก prepush ขณะนี้สคริปต์ prepush เรียกใช้ eslint ซึ่งจะทำให้คุณไม่สามารถผลักดันได้หากมีผ้าสำลีภายในรหัสของคุณ หากคุณต้องการปิดใช้งานสิ่งนี้ให้ลบสคริปต์ prepush ออกจาก package.json
├── .github # Github Settings + Github Actions Workflows
│ ├── deploy.yml # Deploy workflow (called on merges to "master" and "production" branches)
│ └── verify.yml # Verify workflow (run when PR is created)
├── cypress # UI Integration Tests
├── docs # Docs application (built with Gatsby)
│ ├── content # Content of docs (written in markdown)
│ ├── components # React components used in docs app
│ ├── gatsby-config.js # Gatsby plugin settings
│ └── gatsby-node.js # Gatsby node definitions (how templates are combined with content)
│ └── package.json # Docs package file (docs specific dependencies)
├── functions # Cloud Functions (uses Cloud Functions for Firebase)
│ ├── src # Cloud Functions Source code (each folder represents a function)
│ └── index.js # Functions entry point
├── public # Public assets
│ ├── favicon.ico # Favicon
│ ├── firebase-messaging.sw.js # Messaging Service worker (loaded by Firebase SDK)
│ └── index.html # Main HTML page container for app
├── src # Application source code
│ ├── components # Global Reusable Presentational Components
│ ├── containers # Global Reusable Container Components
│ ├── layouts # Components that dictate major page structure
│ │ └── CoreLayout # Global application layout in which to render routes
│ ├── routes # Main route definitions and async split points
│ │ ├── index.js # Bootstrap main application routes with store
│ │ └── Home # Fractal route
│ │ ├── index.js # Route definitions and async split points
│ │ ├── assets # Assets required to render components
│ │ ├── components # Presentational React Components
│ │ ├── modules # Collections of reducers/constants/actions
│ │ └── routes ** # Fractal sub-routes (** optional)
│ ├── static # Static assets
│ └── utils # Application-wide utils (form validation etc)
├── .firebaserc # Firebase project settings (including settings for CI deployment)
├── cypress.json # Cypress Integration Test settings
├── database.rules.json # Firebase Real Time Database Rules
├── firebase.json # Firebase resource settings (including which folders are deployed)
├── firestore.indexes.json # Firestore Indexes
├── firestore.rules # Firestore Database Rules
└── storage.rules # Cloud Storage Rules
^10.18.0 (โหนด 10 แนะนำเพื่อให้ตรงกับฟังก์ชั่นคลาวด์ใหม่ล่าสุดรันไทม์)npm i -g firebase-tools ติดตั้งการพึ่งพา: yarn install
สร้างเว็บแอปภายในคอนโซล Firebase ของโครงการของคุณ (การกำหนดค่าจะถูกใช้ในขั้นตอนถัดไป)
สร้าง .env.local ที่มีรูปแบบต่อไปนี้ (ด้วยค่าของคุณที่เต็มจากขั้นตอนก่อนหน้า):
REACT_APP_FIREBASE_apiKey= < - api key - >
REACT_APP_FIREBASE_authDomain= < - auth domain - >
REACT_APP_FIREBASE_databaseURL= < - database URL - >
REACT_APP_FIREBASE_projectId= < - project ID - >
REACT_APP_FIREBASE_storageBucket= < - storageBucket - >
REACT_APP_FIREBASE_messagingSenderId= < - message sender ID - >
REACT_APP_FIREBASE_appId= < - project app id - >
REACT_APP_FIREBASE_PUBLIC_VAPID_KEY= < - project app id - >
REACT_APP_ALGOLIA_APP_ID= < - - >
REACT_APP_ALGOLIA_API_KEY= < - - > สร้างไฟล์ functions/.runtimeconfig.json ที่ดูเหมือนว่า:
{
"algolia" : {
"api_key" : " <- your API KEY -> " ,
"app_id" : " <- your Algolia APP ID -> "
},
"gmail" : {
"email" : " <- gmail account for sending invite emails -> " ,
"password" : " <- password for ^ email -> "
},
"encryption" : {
"password" : " <- your own made up encryption password for service accounts -> "
}
}ตั้งค่าตัวแปรการกำหนดค่าฟังก์ชันเพื่อให้ตรงกับไฟล์ที่คุณเพิ่งทำ (สำหรับฟังก์ชั่นเวอร์ชันที่ปรับใช้ของคุณ):
firebase functions:config:set $( jq -r ' to_entries[] | [.key, (.value | tojson)] | join("=") ' < functions/.runtimeconfig.json ) สร้างโครงการ: yarn build
ปรับใช้กับ Firebase: firebase deploy (ปรับใช้, ฟังก์ชั่นคลาวด์, กฎและโฮสติ้ง)
เริ่มการพัฒนาเซิร์ฟเวอร์: npm start หมายเหตุ: คุณสามารถใช้ yarn start:dist เพื่อทดสอบว่าแอปพลิเคชันของคุณจะทำงานอย่างไรเมื่อปรับใช้กับ Firebase
ดูเวอร์ชันที่ปรับใช้ของไซต์โดยใช้ firebase open hosting:site
หมายเหตุ : การกำหนดค่าสำหรับสิ่งนี้อยู่ใน .github/workflows/app-deploy.yml firebase-ci ได้รับการเพิ่มเพื่อลดความซับซ้อนของกระบวนการปรับใช้ CI โดยรับการตั้งค่าจาก. .firebaserc สิ่งที่จำเป็นทั้งหมดคือการให้การรับรองความถูกต้องด้วย Firebase:
มีโครงการ Firebase อย่างน้อยสองโครงการที่พร้อมใช้งานหนึ่งโครงการสำหรับแต่ละสภาพแวดล้อม (การจัดเตรียมและการผลิต)
แทนที่ข้อมูลภายใน .firebaserc ภายใต้ทั้ง projects ci และส่วน targets
เข้าสู่ระบบ: firebase login:ci เพื่อสร้างโทเค็นการตรวจสอบสิทธิ์ โทเค็นนี้จะถูกใช้เพื่อให้สิทธิ์ผู้ให้บริการ CI ในการปรับใช้ในนามของคุณ การตั้งค่ามีให้สำหรับ Gitlab แต่สามารถใช้ผู้ให้บริการ CI ได้
ตั้งค่าตัวแปรสภาพแวดล้อม FIREBASE_TOKEN ภายในความลับการกระทำของ GitHub
เพิ่มตัวแปรสภาพแวดล้อมต่อไปนี้ในตัวแปรการกระทำของ GitHub (ภายใน /settings/ci_cd ):
FIREBASE_TOKEN ; // Used to deploy to Firebase (token generated in last step)
CYPRESS_RECORD_KEY ; // Record key for Cypress Dashboard
SERVICE_ACCOUNT ; // Used to authenticate with database to run hosted testsเรียกใช้การกระทำของ GitHub โดยการผลักรหัสไปยังระยะไกล Git ของคุณ (ส่วนใหญ่เป็นไปได้ GitHub)
สำหรับตัวเลือกเพิ่มเติมเกี่ยวกับการตั้งค่า CI Checkout เอกสาร Firebase-CI
yarn buildfirebase deploy Note: คุณสามารถใช้ firebase serve เพื่อทดสอบว่าแอปพลิเคชันของคุณจะทำงานอย่างไรเมื่อปรับใช้กับ Firebase แต่ให้แน่ใจว่าคุณเรียกใช้ yarn build ก่อนเอกสารมีอยู่ที่ fireadmin.io/docs
ซอร์สโค้ดและเนื้อหาทั้งหมดสำหรับเอกสารอยู่ในโฟลเดอร์ docs เอกสารถูกสร้างขึ้นจาก markdown เป็นไฟล์คงที่โดยใช้ Gatsby ตามการตั้งค่าใน gatsby-config.js
เยี่ยมชมเอกสาร readme สำหรับข้อมูลเพิ่มเติม
หมายเหตุ : หากคุณมีการตั้งค่าการปรับใช้ CI การทดสอบ E2E และการทดสอบหน่วยสามารถทำงานกับสภาพแวดล้อมการจัดเตรียมของคุณโดยอัตโนมัติก่อนที่จะเรียกใช้งานการผลิต
การทดสอบหน่วยฟังก์ชั่นคลาวด์ถูกเขียนในมอคค่าด้วยการครอบคลุมรหัสที่สร้างโดยอิสตันบูล การทดสอบเหล่านี้ครอบคลุม "ฟังก์ชั่นแบ็กเอนด์" ที่จัดการโดยฟังก์ชั่นคลาวด์โดยการตีสภาพแวดล้อมของฟังก์ชั่น (รวมถึงการพึ่งพา)
cd functionsnpm inpm testyarn test:cov การทดสอบจากต้นจนจบทำได้โดยใช้ Cypress และพวกเขาอาศัยอยู่ภายในโฟลเดอร์ cypress การทดสอบเหล่านี้ครอบคลุมฟังก์ชั่น UI และทำงานโดยตรงบนสภาพแวดล้อมที่โฮสต์ของ FireAdmin แอปพลิเคชัน end to end tests จะทำงานโดยอัตโนมัติในการดำเนินการของ GitHub หลังจากปรับใช้กับสภาพแวดล้อมการจัดเตรียมก่อนที่จะปรับใช้กับการผลิต
สร้างบัญชีบริการภายในคอนโซล Firebase
บันทึกบัญชีบริการเป็น serviceAccount.json ภายในรูทของโครงการ
รับ UID ของผู้ใช้ที่คุณต้องการใช้ขณะทดสอบจากแท็บการรับรองความถูกต้องของคอนโซล Firebase
สร้าง cypress.env.json ด้วยรูปแบบต่อไปนี้:
{
"TEST_UID" : " <- user account's UID -> "
} เรียกใช้ yarn emulators สิ่งนี้จะบู๊ตอีมูเลเตอร์ (ชี้ไปที่ระหว่างการทดสอบ)
ในเทอร์มินัลที่แตกต่างกัน yarn start:emulate สิ่งนี้จะบู๊ตแอปพลิเคชันที่ชี้ไปที่อีมูเลเตอร์
ในแท็บเทอร์มินัลอื่นให้เรียกใช้ yarn test:emulate:run สิ่งนี้จะเรียกใช้การทดสอบการรวมไซเปรสชี้ไปที่อีมูเลเตอร์ (สำหรับการเพาะและการตรวจสอบ)
ในการเปิด UI นักวิ่งทดสอบท้องถิ่นของ Cypress ซึ่งคุณสามารถทำการทดสอบเดี่ยวหรือทดสอบทั้งหมดใช้ yarn test:emulate
12 แทนที่จะเป็นรุ่นใหม่ ฟังก์ชั่นคลาวด์รันไทม์รองรับได้มากถึง 12 ซึ่งเป็นเหตุผลว่าทำไมจึงเป็นสิ่งที่ใช้สำหรับรุ่น CI Build สิ่งนี้จะถูกสลับเมื่อมีการอัพเดตฟังก์ชั่นรันไทม์
