{"id":21971787,"url":"https://github.com/cristopher1/frontend_app_colmena_abeja","last_synced_at":"2026-04-16T07:35:07.835Z","repository":{"id":181532886,"uuid":"666383343","full_name":"cristopher1/frontend_app_colmena_abeja","owner":"cristopher1","description":"Frontend usado para el trabajo de titulo de ingeniería civil informática","archived":false,"fork":false,"pushed_at":"2023-11-02T17:20:41.000Z","size":1215,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-22T23:11:52.188Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cristopher1.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-07-14T11:29:34.000Z","updated_at":"2023-07-14T11:30:52.000Z","dependencies_parsed_at":null,"dependency_job_id":"df12afa3-dce9-4c2e-9d5b-2a161a833872","html_url":"https://github.com/cristopher1/frontend_app_colmena_abeja","commit_stats":null,"previous_names":["cristopher1/frontend_app_colmena_abeja"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/cristopher1/frontend_app_colmena_abeja","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cristopher1%2Ffrontend_app_colmena_abeja","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cristopher1%2Ffrontend_app_colmena_abeja/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cristopher1%2Ffrontend_app_colmena_abeja/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cristopher1%2Ffrontend_app_colmena_abeja/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cristopher1","download_url":"https://codeload.github.com/cristopher1/frontend_app_colmena_abeja/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cristopher1%2Ffrontend_app_colmena_abeja/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31876696,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-15T15:24:51.572Z","status":"online","status_checked_at":"2026-04-16T02:00:06.042Z","response_time":69,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-29T14:55:58.138Z","updated_at":"2026-04-16T07:35:07.808Z","avatar_url":"https://github.com/cristopher1.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# [FRONTEND APP COLMENA ABEJA](#indice)\n\nEl presente proyecto fue desarrollado durante el ramo **trabajo de titulo**, para optar al titulo de **ingenierío civil informático** en la Universidad Técnica\nFederico Santa María (UTFSM). Frontend que se conecta con la [API COLMENA ABEJA](https://github.com/cristopher1/api_colmena_abeja). Si quiere facilitar el\ndespliegue del sistema, mediante automatización, vaya al repositorio [APP_COLMENA_ABEJA](https://github.com/cristopher1/app_colmena_abeja)\n\n### \u003ca id=\"indice\"\u003e\u003c/a\u003e Índice\n\n* \u003ca id=\"introduccion\"\u003e\u003c/a\u003e[Introducción](#Introducción)\n* \u003ca id=\"pre-rrequisitos\"\u003e\u003c/a\u003e [Prerrequisitos](#Prerrequisitos)\n* \u003ca id=\"descarga\"\u003e\u003c/a\u003e [Descargar el repositorio](#Descargar-el-repositorio)\n* \u003ca id=\"entorno\"\u003e\u003c/a\u003e[Variables de entorno](#Variables-de-entorno)\n* \u003ca id=\"dockerfile\"\u003e\u003c/a\u003e[Docker](#Docker)\n* \u003ca id=\"run\"\u003e\u003c/a\u003e[Ejecutar la aplicación](#Ejecutar-la-aplicación)\n\n## \u003ca id=\"Introducción\"\u003e\u003c/a\u003e [Introducción](#introduccion)\n\nEl presente repositorio contiene el Frontend utilizado por el sistema APP COLMENA ABEJA. Este Frontend contiene toda la interfaz gráfica\n(basada en un diseño de startbootstrap) que permite al usuario realizar peticiones web a la API COLMENA ABEJA mediante `axios`, los resultados y ventanas emergentes informativas son desplegados usando `sweetalert2`.\n\n## \u003ca id=\"Prerrequisitos\"\u003e\u003c/a\u003e [Prerrequisitos](#pre-rrequisitos)\n\nEl sistema ha sido probado en SO Windows 11.\n\n* Docker Desktop con Servidor WSL 2. Ver documentación sobre [Docker Desktop para Windows](https://docs.docker.com/desktop/install/windows-install/)\n\n## \u003ca id=\"Descargar-el-repositorio\"\u003e\u003c/a\u003e [Descargar el repositorio](#descarga)\n\nPara descargar el repositorio use:\n\n```console\ngit clone git@github.com:cristopher1/frontend_app_colmena_abeja.git\n```\n\n## \u003ca id=\"Variables-de-entorno\"\u003e\u003c/a\u003e [Variables de entorno](#entorno)\n\nLa información de las variables de entorno se encuentra dentro del archivo .env.example.\nhttps://github.com/cristopher1/frontend_app_colmena_abeja/blob/e40f08b27ad304aee5951bce663e31e9584840cf/.env.example#L1-L30\n\n* ```VUE_APP_API_PROTOCOL```: Protocolo usado para conectarse con la API.\n  \n* ```VUE_APP_API_HOST```: Nombre de host donde se hospeda la API.\n  \n* ```VUE_APP_API_PORT```: Puerto donde la API escucha las peticiones.\n  \n* ```VUE_APP_API_PATH```: PATH donde la API responde las peticiones.\n\n## \u003ca id=\"Docker\"\u003e\u003c/a\u003e [Docker](#dockerfile)\n\nEl sistema incluye un archivo **Dockerfile**, para poder facilitar su despliegue.\nhttps://github.com/cristopher1/frontend_app_colmena_abeja/blob/dc908da991da06bbf0ee49a10c84531820cb2b2b/Dockerfile#L1-L56\n\ndividido en 4 etapas: base, development, build y production.\n\n* En la etapa development: Se incluyen herramientas para desarrollo, como nano. Tambíén se despliega el sistema usando el servidor de desarrollo de VUE\nutilizando el puerto 8080 para escuchar las peticiones web.\nhttps://github.com/cristopher1/frontend_app_colmena_abeja/blob/e40f08b27ad304aee5951bce663e31e9584840cf/Dockerfile#L22-L25\n\n* En la etapa production:\n  * Primero se llama a la etapa build, donde se empaquetarán todos los archivos necesarios para que el sistema pueda funcionar en modo producción.  \n    https://github.com/cristopher1/frontend_app_colmena_abeja/blob/e40f08b27ad304aee5951bce663e31e9584840cf/Dockerfile#L27-L44\n    \n    Generando una carpeta dist dentro del directorio de trabajo actual (WORKDIR). \n    https://github.com/cristopher1/frontend_app_colmena_abeja/blob/e40f08b27ad304aee5951bce663e31e9584840cf/Dockerfile#L30\n    \n  * En la etapa de producción se usará nginx para desplegar el sistema, usando el puerto 80 para recibir las peticiones web.\n    https://github.com/cristopher1/frontend_app_colmena_abeja/blob/e40f08b27ad304aee5951bce663e31e9584840cf/Dockerfile#L52-L56\n    \n    El contenido de la carpeta dist se coloca dentro de nginx/html.\n    https://github.com/cristopher1/frontend_app_colmena_abeja/blob/e40f08b27ad304aee5951bce663e31e9584840cf/Dockerfile#L50\n\n## \u003ca id=\"Ejecutar-la-aplicación\"\u003e\u003c/a\u003e [Ejecutar la aplicación](#run)\n\nPara ejecutar la aplicación siga los siguientes pasos.\n\n* **Nota: El archivo Dockerfile de este repositorio utiliza multi-stage, por lo que no debe olvidar habilitar el docker BuildKit al momento de**\n**ejecutar la aplicación.**\n\n* **Nota: A partir de la versión 23.0 de Docker Desktop y Docker Engine se usa de forma predeterminada el BuildKit por lo que no es necesario habilitarlo**\n**de forma manual.**\n\n1. Ingrese a la carpeta frontend_app_colmena_abeja (por la teminal o interfaz gráfica)\n2. Cree un archivo llamado .env (en la misma carpeta donde esta el archivo .env.example)\n3. Copie el contenido del archivo .env.example a .env\n4. Si gusta, modifique los valores del archivo .env\n6. Abra una terminal e ingrese a la carpeta frontend_app_colmena_abeja\n8. Ejecute los siguientes comandos:\n   * Para modo desarrollo:\n     * Crear la imagen:\n       ```console\n       docker build --target development -t frontend_app_colmena_abeja_dev .\n       ```\n     * Ejecutar el contenedor:\n       ```console\n       docker run -p host_port:8080 --env-file .env frontend_app_colmena_abeja_dev\n       ```\n       Reemplace **host_port** por el puerto en su host, por el cual las peticiones web serán redirigidas al contenedor docker.\n       \n   * Para modo producción:\n     * Crear la imagen:\n       ```console\n       docker build --target production -t frontend_app_colmena_abeja_prod .\n       ```\n     * Ejecutar el contenedor:\n       ```console\n       docker run -p host_port:80 --env-file .env frontend_app_colmena_abeja_prod\n       ```\n       Reemplace **host_port** por el puerto en su host, por el cual las peticiones web serán redirigidas al contenedor docker.\n\nUna vez completados los pasos, el sistema debería estar ejecutandose en `http://localhost:host_port`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcristopher1%2Ffrontend_app_colmena_abeja","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcristopher1%2Ffrontend_app_colmena_abeja","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcristopher1%2Ffrontend_app_colmena_abeja/lists"}