{"id":26585119,"url":"https://github.com/reislcb/approute-top","last_synced_at":"2026-04-29T23:03:35.457Z","repository":{"id":281897799,"uuid":"943970089","full_name":"ReisLcb/appRoute-TOP","owner":"ReisLcb","description":"Repositório destinado a ensinar e disponibilizar soluções para projetos ionic ao 3º ano de informática para auxiliar nas disciplinas de Tópicos em programação e do Projeto Integrador.","archived":false,"fork":false,"pushed_at":"2025-03-20T15:31:39.000Z","size":267,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-20T16:37:06.933Z","etag":null,"topics":["angular","app","application","html5","ifsp","informatica","instituto-fede","ionic","ionic-framework","javascript","typescript","web-app"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/ReisLcb.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":"2025-03-06T15:11:05.000Z","updated_at":"2025-03-17T10:39:34.000Z","dependencies_parsed_at":"2025-03-11T18:37:31.789Z","dependency_job_id":"83fdf624-1065-4e93-b7c3-04850496f031","html_url":"https://github.com/ReisLcb/appRoute-TOP","commit_stats":null,"previous_names":["reislcb/approute-top-exemplo"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReisLcb%2FappRoute-TOP","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReisLcb%2FappRoute-TOP/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReisLcb%2FappRoute-TOP/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReisLcb%2FappRoute-TOP/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ReisLcb","download_url":"https://codeload.github.com/ReisLcb/appRoute-TOP/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245085791,"owners_count":20558468,"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":["angular","app","application","html5","ifsp","informatica","instituto-fede","ionic","ionic-framework","javascript","typescript","web-app"],"created_at":"2025-03-23T10:21:32.947Z","updated_at":"2026-04-29T23:03:35.452Z","avatar_url":"https://github.com/ReisLcb.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Clonando repósitório em sua máquina\n- Para clonar este repositório em sua máquina, utilize o seguinte comando:\n   ```bash\n   cd pasta-desejada \n   git clone https://github.com/ReisLcb/appRoute-TOP.git\n   ```\n  - Caso queira clonar a resolução do exercício ou alguma outra branch específica, execute:\n    ```bash\n    git clone -b \u003cbranch-name\u003e https://github.com/ReisLcb/appRoute-TOP.git\n    ## \u003cbranch-name\u003e pode ser substituido por 'exercicio-cadastro'\n    ```\n\n- Para instalar as dependências, basta executar no terminal dentro da pasta local do projeto:\n  ```bash\n  npm install\n\n- Ao final da instalação, execute o projeto:\n  ```bash\n  ionic serve\n  ```\n\n# Criando projeto Ionic\n## Iniciando projeto\n- Primeiro, devemos verificar se o ionic CLI está instalado verificando sua versão:\n    ```bash\n    ionic -v \n    ## Ultima versão: 8.4.x\n- Caso não esteja instalado, instale o ionic CLI com o seguinte comando:\n    ```bash\n    sudo npm install -g @ionic/cli\n\n- Para iniciar, iniciaremos o nosso terminal (pode ser **Linux**, **PowerShell** ou **WSL**):\n    ```bash\n    ionic start nome-do-seu-projeto\n    ```\n    \n   - Para uma inicialização mais rápida, podemos preencher todos os argumentos com o seguinte comando:\n        ```bash\n        ionic start [nome] [template] [opções]\n        ## [nome] será o nome do projeto desejado (ex. meuApp)\n        ## [template] pode ser: 'blank', 'tabs', 'sidemenu', 'list' ou 'my-first-app' (depende do framework)\n        ## [opções] podem ser: --list, --type=\u003ctipo\u003e, --cordova, --capacitor e --id=\u003cid\u003e\n        ```\n     \n   - Como usaremos o angular standalone, podemos escrever:\n       ```bash\n       ionic start meuApp blank --type=angular-standalone\n       ## Considerando que nosso projeto será Blank\n       ```\n    \n- Navegue até a pasta do projeto:\n    ```bash\n    cd nome-do-seu-projeto\n- Para executar seu projeto, execute:\n    ```bash\n    ionic serve\n- E para abrir seu projeto no Visual Studio Code, execute:\n    ```bash\n    code .\n# Definindo novas páginas e rotas\n- Para definir uma nova página, basta executar:\n    ```bash\n    ionic generate\n    ## Usar este comando sem argumentos te dará uma tela para escolher o que deseja gerar\n    ```\n    - Para usar esse comando de forma mais rápida, pode executar:\n      ```Bash\n      ionic generate [schematic] [name]\n      ## [schematic] pode ser: 'page', 'directive', 'component' ou 'service' \n      ```\n\n    - Neste caso, no lugar de ```[schematic]``` escrevemos ```page```, e para ```[name]``` escrevemos o nome da nossa nova página\n## Arquivo de rotas\n![image](https://github.com/user-attachments/assets/8fff08db-8500-45d5-9746-1ade71e08b02)\n\n### Solução simples\n- Caso a navegação seja entre páginas fixas, podemos usar:\n  \n  ![image](https://github.com/user-attachments/assets/c82b3523-60de-411a-8ffb-990b5fef3ba7)\n\n### Solução programática\n- Se precisar de mais controle, como redirecionamento condicional, podemos utilizar o Router no arquivo .ts\n  \n  1°: importamos o Router para o nosso projeto.\n  \n  ![image](https://github.com/user-attachments/assets/c57e8e06-7024-44d1-b629-f0feafcc2506)\n\n  2°: Injetamos o Router na nossa página.\n  \n  ![image](https://github.com/user-attachments/assets/eb8b17f2-24ed-4c84-8f44-5358ee68d560)\n\n  3° criamos um método para nos enviar para a página desejada.\n  ![image](https://github.com/user-attachments/assets/58e92c59-bb1d-414c-a009-d2fc0716983f)\n\n  4°: No arquivo .html de nossa página/componente, Chamamos nosso método abrirAbout() com a diretiva ```click```\n\n  ![image](https://github.com/user-attachments/assets/fd4b7ed4-e315-4046-af8c-9042d25f6d0f)\n\\\n\\\n\\\n\n#\n**Mais informações podem ser obtidas no site __[Ionic Framework](https://ionicframework.com/docs/cli)__**\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freislcb%2Fapproute-top","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Freislcb%2Fapproute-top","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freislcb%2Fapproute-top/lists"}