{"id":19511102,"url":"https://github.com/jsamuelap/farepassage-app","last_synced_at":"2026-04-11T01:17:37.529Z","repository":{"id":173218660,"uuid":"650380610","full_name":"JSamuelAP/farepassage-app","owner":"JSamuelAP","description":"PWA para llevar un seguimiento del saldo de tu tarjeta del transporte público","archived":false,"fork":false,"pushed_at":"2023-06-20T05:36:07.000Z","size":250,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-25T23:14:01.579Z","etag":null,"topics":["bus","bus-card","fare","firebase","firebase-auth","firebase-firestore","firebase-hosting","gh-actions","passage","prop-types","pwa","react","react-router","side-project","single","tailwindcss","tailwindcss-plugin","vite","vite-plugin-pwa"],"latest_commit_sha":null,"homepage":"https://farepassage-app.web.app","language":"JavaScript","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/JSamuelAP.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-06-07T00:33:04.000Z","updated_at":"2023-11-22T00:31:32.000Z","dependencies_parsed_at":null,"dependency_job_id":"9657b639-f3fa-4cd7-a7eb-17f1286ad70a","html_url":"https://github.com/JSamuelAP/farepassage-app","commit_stats":null,"previous_names":["jsamuelap/farepassage-app"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/JSamuelAP/farepassage-app","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JSamuelAP%2Ffarepassage-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JSamuelAP%2Ffarepassage-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JSamuelAP%2Ffarepassage-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JSamuelAP%2Ffarepassage-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/JSamuelAP","download_url":"https://codeload.github.com/JSamuelAP/farepassage-app/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JSamuelAP%2Ffarepassage-app/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279000729,"owners_count":26082862,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-08T02:00:06.501Z","response_time":56,"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":["bus","bus-card","fare","firebase","firebase-auth","firebase-firestore","firebase-hosting","gh-actions","passage","prop-types","pwa","react","react-router","side-project","single","tailwindcss","tailwindcss-plugin","vite","vite-plugin-pwa"],"created_at":"2024-11-10T23:19:27.938Z","updated_at":"2025-10-08T23:06:49.431Z","avatar_url":"https://github.com/JSamuelAP.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# FarePassage App 🚍\n\nAplicación Web Progresiva que facilita el seguimiento del saldo de tu tarjeta de transporte público.\n\n![Screenshot](./src/assets/screenshot.png)\n\n## El problema ⚠️\n\nEn muchas ciudades de México la única forma de conocer el saldo de las tarjetas preferenciales para el transporte público es al momento de usarla o realizar una recarga, por lo que es común tener que recordar la última cantidad de saldo disponible o simplemente olvidarlo, y esto puede causar momentos donde la tarjeta se queda sin saldo en los momentos menos convenientes.\n\n## ¿Cómo lo soluciona? 🤔\n\nFarePassage App es una aplicación sencilla e intuitiva que permite mostrar el saldo de la tarjeta y la cantidad de pasajes restantes, de esta manera el usuario tendrá esta información accesible en todo momento y tomar decisiones a tiempo.\n\nEntre las características de FarePassage App se encuentran:\n\n- Mostrar el saldo actual\n- Descontar pasaje\n- Calcular el número de pasajes restantes\n- Registrar recargas a la tarjeta\n- Modificar el saldo actual\n- Modificar la tarifa de pasaje\n- Iniciar sesión con una cuenta de Google\n- Persistencia de los datos\n- Instalable en dispositivos móviles\n- Offline\n- Es una PWA\n\nEn resumen, el usuario cada vez que consuma un pasaje, podrá registrarlo fácilmente en la app para actualizar su saldo y pasajes restantes. Podrá hacerlo desde cualquier momento ya que la app se puede instalar como una aplicación nativa en su dispositivo móvil y funcionar sin conexión.\n\n## Enlaces 🔗\n\n- App: [FarePassage App](https://farepassage-app.web.app)\n- Repositorio: [Github](https://github.com/JSamuelAP/farepassage-app)\n\n## Tecnologías 🧰\n\n- [React](https://reactjs.org/) - Librería de javascript\n  - [React Router](https://reactrouter.com/en/main) - Enrutador para React\n  - [PropTypes](https://www.npmjs.com/package/prop-types) - Validador de tipos de props\n  - Hooks y Hokks personalizados\n  - Context API\n- [Tailwind CSS](https://tailwindcss.com/) - Framework CSS\n  - [Prettier plugin Tailwind CSS](https://tailwindcss.com/blog/automatic-class-sorting-with-prettier) - Plugin para ordenar clases de Tailwind\n- [Firebase](https://firebase.google.com) - Plaforma para el desarrollo de aplicaciones\n  - Authentication\n  - Firestore Database\n  - Hosting\n- [Vite](https://main.vitejs.dev/) - Herramienta de compilación\n  - [PWA vite](https://vite-pwa-org.netlify.app/) - Plugin para la integración con PWA\n\n## Qué aprendí 🧠\n\nPrincipalmente aprendí dos cosas; **Firebase** y **PWA**. Utilicé Firebase ya que mi aplicación necesitaba persistir los datos del usuario, además de autenticación para que cada usuario tuviera acceso a sus datos, por lo que desarrollar un backend resultaría mayor trabajo, por lo que opte por un **BaaS** (Backend as a Service) como lo es Firebase que ya me proporciona las herramientas, así que tuve que aprender a integrarlo con mi aplicación, aprender la autenticación con Google y aprender Firestore, lo que a su vez me llevo a aprender más sobre las bases de datos **NoSQL**.\n\nY en cuanto a PWA aprendí más sobre su definición, sus utilidades, como configurar el **manifest.json**, sobre el **Service Worker**, los **iconos** necesarios para la aplicación y aprendí sobre el **plugin de vite** para convertir la app en una Progressive Web App.\n\n## Autor ✒️\n\n- Website - [JSamuel](https://jsamuelap.github.io)\n- Github - [@JSamuelAP](https://github.com/JSamuelAP)\n- Frontend Mentor - [@JSamuelAP](https://www.frontendmentor.io/profile/JSamuelAP)\n- LinkedIn - [@JSamuelAP](https://www.linkedin.com/in/jsamuelap)\n- Twitter - [@JSamuelAP](https://www.twitter.com/yourusername)\n- Email - [sp4619168@gmail.com](mailto:sp4619168@gmail.com)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjsamuelap%2Ffarepassage-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjsamuelap%2Ffarepassage-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjsamuelap%2Ffarepassage-app/lists"}