Solicitud de administración de aplicaciones Firebase. Incluye soporte para múltiples entornos y migraciones de datos
muy pronto
¿Interesado en agregar una función o contribuir? ¡Abra un problema!
Dado que este es el código fuente, un excelente lugar para comenzar es verificar la versión alojada de Fireadmin disponible en Fireadmin.io.
Mientras se desarrolla, probablemente confiará principalmente en npm start
; Sin embargo, hay scripts adicionales a su disposición:
yarn <script> | Descripción |
---|---|
start | Sirve su aplicación en localhost:3000 |
start:dist | Construye la aplicación a ./dist y la sirve en localhost:3000 usando firebase serve |
functions:start | Ejecuta funciones replical (utiliza firebase functions:shell |
functions:build | Construye funciones en la nube a ./functions/dist |
functions:test | Ejecuta pruebas unitarias de funciones con moca |
build | Construye la aplicación a ./dist |
test | Ejecuta pruebas E2E con ciprés. Ver prueba |
lint | Pelillas el proyecto para posibles errores |
lint:fix | Pelillas el proyecto y corrige todos los errores correctables |
Husky se usa para habilitar la capacidad de gancho prepush
. El script prepush
actualmente ejecuta eslint
, que le impide presionar si hay alguna pelusa dentro de su código. Si desea deshabilitar esto, elimine el script prepush
del 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
(nodo 10 sugerido para igualar las nuevas funciones de nube en el tiempo de ejecución)npm i -g firebase-tools
Dependencias de instalación: yarn install
Cree una aplicación web dentro de la consola Firebase de su proyecto (la configuración se utilizará en el siguiente paso)
Cree un .env.local
que tenga el siguiente formato (con sus valores llenos del paso anterior):
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= < - - >
Crear functions/.runtimeconfig.json
Archivo que parece así:
{
"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 -> "
}
}
Establezca variables de configuración de funciones para que coincidan con el archivo que acaba de hacer (para la versión implementada de sus funciones):
firebase functions:config:set $( jq -r ' to_entries[] | [.key, (.value | tojson)] | join("=") ' < functions/.runtimeconfig.json )
Proyecto de construcción: yarn build
Implementar en Firebase: firebase deploy
(implements, funciones en la nube, reglas y alojamiento)
Iniciar servidor de desarrollo: npm start
Nota de inicio: también puede usar yarn start:dist
para probar cómo funcionará su aplicación cuando se implementa en Firebase
Vea la versión implementada del sitio ejecutando firebase open hosting:site
Nota : La configuración para esto se encuentra dentro de .github/workflows/app-deploy.yml
. firebase-ci
se ha agregado para simplificar el proceso de implementación de CI al obtener configuraciones del .firebaserc
. Todo lo que se requiere es proporcionar autenticación con Firebase:
Tenga al menos dos proyectos de Firebase para usar, uno para cada entorno (puesta en escena y producción)
Reemplace la información dentro de .firebaserc
en las secciones de projects
, ci
y targets
las secciones
Iniciar sesión: firebase login:ci
para generar un token de autenticación. Este token se utilizará para darle al proveedor de CI derechos a implementar en su nombre. Se proporcionan configuraciones para GITLAB, pero se puede utilizar cualquier proveedor de CI.
Establezca la variable de entorno FIREBASE_TOKEN
dentro de los secretos de las acciones de Github
Agregue las siguientes variables de entorno a las variables de GitHub Actions (dentro /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
Ejecute una compilación sobre las acciones de GitHub enviando el código a su control remoto Git (probablemente GitHub)
Para obtener más opciones en la configuración de CI, consulte los documentos Firebase-CI.
yarn build
firebase deploy
Nota: Puede usar firebase serve
para probar cómo funcionará su aplicación cuando se implementa en Firebase, pero asegúrese de ejecutar yarn build
primero.La documentación está disponible en fireadmin.io/docs
Todo el código fuente y el contenido para DOCS se encuentra dentro de la carpeta docs
. Los documentos se generan desde Markdown en archivos estáticos utilizando Gatsby basado en configuraciones en gatsby-config.js
.
Visite el ReadMe de los documentos para obtener más información.
Nota : Si tiene implementación de CI de configuración, las pruebas de E2E y las pruebas unitarias pueden ejecutarse automáticamente contra su entorno de puesta en escena antes de ejecutar la compilación de producción.
Las pruebas unitarias de las funciones de nubes se escriben en Mocha con cobertura de código generada por Estambul. Estas pruebas cubren la "funcionalidad de back -end" manejada por las funciones de la nube mediante el robo del entorno de funciones (incluidas las dependencias).
cd functions
npm i
npm test
yarn test:cov
Las pruebas de extremo a extremo se realizan con Cypress y viven dentro de la carpeta cypress
. Estas pruebas cubren la funcionalidad de la interfaz de usuario y se ejecutan directamente en el entorno alojado de Fireadmin. Las pruebas de extremo a extremo de la aplicación se ejecutan automáticamente en las acciones de GitHub, después de implementar el entorno de puesta en escena antes de implementar en la producción.
Crear una cuenta de servicio dentro de la consola Firebase
Guarde la cuenta de servicio como serviceAccount.json
dentro de la raíz del proyecto
Obtenga el UID del usuario que desea usar mientras se prueba desde la pestaña de autenticación de la consola Firebase para
Crear cypress.env.json
con el siguiente formato:
{
"TEST_UID" : " <- user account's UID -> "
}
Ejecutar yarn emulators
. Esto iniciará a los emuladores (señalados durante la prueba)
En una terminal diferente, yarn start:emulate
. Esto iniciará la aplicación apuntando a los emuladores
En una pestaña terminal diferente, ejecute yarn test:emulate:run
. Esto ejecutará pruebas de integración de ciprés apuntadas a los emuladores (para siembra y verifique)
Para abrir la interfaz de usuario de la prueba local de Cypress, donde puede ejecutar pruebas individuales o todas las pruebas, use yarn test:emulate
.
12
en lugar de una versión más nueva? El tiempo de ejecución de las funciones en la nube admite hasta 12
, por lo que eso es lo que se usa para la versión de compilación de CI. Esto se cambiará cuando se actualice el tiempo de ejecución de las funciones