{"id":16903685,"url":"https://github.com/acacha/casteachingionic","last_synced_at":"2025-04-11T14:32:47.488Z","repository":{"id":42568383,"uuid":"426364730","full_name":"acacha/casteachingIonic","owner":"acacha","description":"Ionic/Mobile app for casteaching. Laravel REST API server side at https://github.com/acacha/casteaching","archived":false,"fork":false,"pushed_at":"2022-03-31T15:26:55.000Z","size":2718,"stargazers_count":3,"open_issues_count":1,"forks_count":15,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-25T10:42:32.817Z","etag":null,"topics":["axios","ionic","laravel"],"latest_commit_sha":null,"homepage":"https://casteachingionicstatic.onrender.com","language":"Vue","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/acacha.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}},"created_at":"2021-11-09T19:47:01.000Z","updated_at":"2022-02-10T17:46:01.000Z","dependencies_parsed_at":"2022-09-21T21:02:35.953Z","dependency_job_id":null,"html_url":"https://github.com/acacha/casteachingIonic","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/acacha%2FcasteachingIonic","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/acacha%2FcasteachingIonic/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/acacha%2FcasteachingIonic/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/acacha%2FcasteachingIonic/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/acacha","download_url":"https://codeload.github.com/acacha/casteachingIonic/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248419704,"owners_count":21100233,"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","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":["axios","ionic","laravel"],"created_at":"2024-10-13T18:15:06.618Z","updated_at":"2025-04-11T14:32:47.461Z","avatar_url":"https://github.com/acacha.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Screencasts\n\nVisiteu:\n- https://tubeme.acacha.org/ionic_real | https://tubeme.acacha.org/ionic_realworld | https://tubeme.acacha.org/ionic_real_world\n\nCodi en producció:\n- https://casteachingionicstatic.onrender.com\n\n![IonicRealWorldApp](https://user-images.githubusercontent.com/4015406/144209735-7ba351cf-c145-4d21-a5c1-a9350c33b9fa.png)\n\n\n# Casteaching\n\nCasteaching és una aplicació desenvolupada per Sergi Tur Badenas. Es tracta d'una web app i REST API per a ensenyar utilitzant screencasts.\n\nL'aplicació està desenvolupada amb Laravel i utilitzant TDD (Test Driven Development). Podeu veure com s'ha realitzat aquesta aplicació a la sèrie de vídeos:\n\nhttps://tubeme.acacha.org/tdd\n\n## TODO\n\n- Casteaching Landing Page -\u003e Descarrega app a Google Play\n\n# Coneixements Previs\n\n- API REST que utilitzem -\u003e Videos 124 i 15 de https://tubeme.acacha.org\n- Coneixements bàsics de vue. Recomano haver fet la sèrie: https://www.vuemastery.com/courses/intro-to-vue-3/intro-to-vue3\n- Coneixement Vue real world: https://www.vuemastery.com/courses/real-world-vue3/rwv3-orientation\n- Opcional (paquet casteaching javascript): TODO\n\n## Vue\n\nSi no coneixeu les bases de Vue us recomano el curs:\n\nhttps://www.vuemastery.com/courses/intro-to-vue-3\n\n\n## Casteaching Ionic\n\nAquest repositori conté el codi de la versió per a Ionic/Mòbils de casteaching. Es tracta d'una versió de la web app casteaching adaptada a mòbils i creada amb Ioni i VueJs.\nL'aplicació Ionic és una aplicació Frontend que utilitza Axios per comunicar-se amb el backend (REST API de l'aplicació casteaching) \n\n# Autor\n\n- Sergi Tur Badenas: https://acacha.github.io\n- Instagram: https://instagram.com/acacha_dev\n- Github: https://github.com/acacha\n\n![image](https://user-images.githubusercontent.com/4015406/140644527-e186bf90-e556-4970-98ed-3f00c5f1af11.png)\n\n# Codi font dels alumnes\n\n- Audí Bielsa, Daniel: https://github.com/daudi44/casteaching-ionic\n- Avante Caballé, Marc: https://github.com/AvanteCaballe/casteaching_ionic\n- Brusca Manchón, Albert: https://github.com/Albert-Brusca/casteachingIonic\n- Goncear, Tudor: https://github.com/tgoncear/casteaching-ionic\n- Moreno Giraldo, Jhon: Jhon1348: https://github.com/Jhon1348/casteachingIonic\n- Muñoz Zafra, Ferran | https://github.com/Fmunozzafra/casteachingIonic\n- Pont Lopez, David: Palanka777: https://github.com/Palanka777/casteaching_ionic.git\n- Rius Rivas, Alba: AlbaRiius: https://github.com/AlbaRiius/casteachingIonic\n- Tomas Altadill, Axel: AxelTomas99: https://github.com/AxelTomas99/casteaching_Ionic\n- Gabriel Urs. Gabriel: l3lackJack https://github.com/l3lackJack/casteachingIonic\n- Tur Badenas, Sergi: Alumne DAM Prova: https://github.com/acacha/casteachingIonic\n\n# Com publicar els projectes?\n\nSimilar a com vam fer amb el projecte ionic-comptador: https://www.youtube.com/watch?v=e03ea9TQ6lg\u0026list=PLyasg1A0hpk0Z60Jg0kMpjP_Nw5ZTA7My\u0026index=8\n\nCurs de vue mastery: https://www.vuemastery.com/courses/real-world-vue3/deploying-with-render/\n\nAneu a render.com i entreu amb el vostre usuari de Github:\n\n- Feu click a botó New.\n- Escolliu new static\n- Poseu la URL de vostre projecte Github (és posible que tingueu que donar permisos o fer el projecte public)\n- Nom del projecte: CasteachingIonic (o quelcom similar identificatiu, per exemple el vostre nom)\n- branch: production\n- comanda: npm run build\n- carpeta: dist\n\nCaptura exemple:\n\n![image](https://user-images.githubusercontent.com/4015406/150368269-3d107053-6378-49ab-bc07-67f00bc66ba1.png)\n\nFeu click a create new service.\n\n# Projectes en explotació dels alumnes\n\n- Audí Bielsa, Daniel: https://casteaching-ionic-daniel-audi-bielsa.onrender.com\n- Avante Caballé, Marc: https://casteachingionicavante.onrender.com/\n- Brusca Manchón, Albert: https://casteachingionicalbert.onrender.com\n- Goncear, Tudor: https://casteaching-ionic.onrender.com/\n- Moreno Giraldo, Jhon: Jhon1348: https://jhon-casteaching-ionic.onrender.com\n- Pont Lopez, David: Palanka777: https://casteachingionic-palanka.onrender.com\n- Rius Rivas, Alba: https://casteachingionic-fvju.onrender.com\n- Tomas Altadill, Axel: AxelTomas99: https://casteaching-ionic-1ykr.onrender.com/\n- Muñoz Zafra, Ferran | https://casteachingionicfmz.onrender.com\n- Urs, Gabriel: l3lackJack: http://TODO.gabriel.alumnedam.me/\n- Tur Badenas, Sergi: Alumne DAM Prova: https://casteachingionicstatic.onrender.com\n\n# Sèries\n\nhttps://tubeme.acacha.org/ionic_real | https://tubeme.acacha.org/ionic_realworld | https://tubeme.acacha.org/ionic_real_world\n\n# Coneixements previs\n\n- NodeJs i NPM i Ionic 101: https://tubeme.acacha.org/ionic\n- Casteaching REST API: https://tubeme.acacha.org/tdd vídeos 124 i 125\n\n# Vídeo 101\n\nExplicació:\n\n- Versió per a mòbils casteaching\n- Comunicació amb el frontend via XHR/Fetch/Axios. REST API casteaching és un coneixement previ\n- Utilitzarem la llibreria npm casteaching -\u003e https://www.npmjs.com/package/casteaching -\u003e Servei que connecta el frontend amb el backend.\n- Utilitzem una plantilla Github com a inici de l'aplicació Ionic en comptes de ionic start -\u003e Us proporciono una versió sense Typescript\n- Plantilles Github vs Forks\n- Vue Router. Client Side Routing Vs Server Side Routing -\u003e SPA -\u003e https://www.vuemastery.com/courses/real-world-vue3/vue-router-essentials\n\n## Esborrar typescript\n\nVeieu els commits:\n\n- Eliminació de typescript: https://github.com/acacha/casteachingIonic/commit/12639bcc0a0c4ff28aa8e0ee20023c60d11bcd9b\n- Eliminació de Typescript als testos: https://github.com/acacha/casteachingIonic/commit/d9ccc28cfe200de451b008843745535fffd84253\n\nLa documentació de ionic no explica com arreglar els testos, la poseu trobar a:\n\nhttps://ionicframework.com/docs/vue/quickstart\n\nSecció:\n\nhttps://ionicframework.com/docs/vue/quickstart#build-your-way-with-typescript-or-javascript\n\n# Vídeo 104\n\n- Intro amb exemples User Experience:\n- Feedback que es proporciona als usuaris. Tailwind UI té un apartat feedback: Alerts / Empty states\n- Empty States | Skeletons | Placeholders: llista buida de vídeos | que mostrar quan la llista encara s'està carregant\n  - Tailwind UI: https://tailwindui.com/components/application-ui/feedback/empty-states\n  - Ionic: https://ionicframework.com/docs/api/skeleton-text\n- Progress indicators: molt relacionats amb la programació concurrent/asincrona i processos que a priori no sabem quan poden tardar\n  - Spinners| Barras de progrés:https://ionicframework.com/docs/api/loading | https://ionicframework.com/docs/api/progress-bar\n  - Placeholders texts: https://ionicframework.com/docs/api/skeleton-text\n\nLlistes:\n- Simples ion-list: https://ionicframework.com/docs/api/list\n- Pull to refresh: especific de mòbils: ion-refresher\n- Llistes infinites | infinite-scroll: relacionades amb la paginació\n\nCasos ús:\n- Llista de vídeos: tots\n- Pull to refresh al show del video\n- Un cop la api tingui paginació podem implementar llista infinita\n- Mostrar un truc per omplir amb dades inventades la Api\n\n# 106. Auth amb backend Laravel\n\nVídeos Previs:\n- Un de casteaching com a backend explicant que és Laravel Sanctum\n- Recordar que de moment hem fet una \"xapuza\" a nivel authenticació i seguretat que és Token Hardcoded  https://github.com/acacha/casteaching_package/blob/main/index.js#L10\n- Al reiniciar amb fresh la base de dades el token s'esborrar i ja no va Videos per Vue\n- Funciona amb Laravel Sanctum?\n\nTODO:\n- Afegir Formulari de login a aplicació Ionic\n- Link a registre al backend Laravel: no cal/bo farem fer registre Ionic\n\nCasteaching package:\n- Ara té hardcoded un valor de api token: https://github.com/acacha/casteaching_package/blob/main/index.js#L10\n- S'ha de poder indicar aquest valor al crear la llibreria\n\nAquest valor s'ha d'obtenir amb:\n\nLaravel Sanctum: \n- SPA: al mateix domini o subdomini: Utilitzant cookies, no calen tokens\n- Mobile apps: https://laravel.com/docs/8.x/sanctum#mobile-application-authentication\n- \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Facacha%2Fcasteachingionic","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Facacha%2Fcasteachingionic","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Facacha%2Fcasteachingionic/lists"}