{"id":22907366,"url":"https://github.com/ierickaraujo/tutorial-angular","last_synced_at":"2025-04-01T09:08:17.080Z","repository":{"id":266354635,"uuid":"898118754","full_name":"iErickAraujo/tutorial-angular","owner":"iErickAraujo","description":null,"archived":false,"fork":false,"pushed_at":"2024-12-03T20:57:35.000Z","size":855,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-01T09:08:13.815Z","etag":null,"topics":["angular13","bootstrap5","css","html","tutorial","typescript"],"latest_commit_sha":null,"homepage":"","language":"HTML","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/iErickAraujo.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":"2024-12-03T20:26:57.000Z","updated_at":"2024-12-03T20:57:39.000Z","dependencies_parsed_at":"2024-12-03T21:39:24.065Z","dependency_job_id":null,"html_url":"https://github.com/iErickAraujo/tutorial-angular","commit_stats":null,"previous_names":["ierickaraujo/tutorial-angular"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iErickAraujo%2Ftutorial-angular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iErickAraujo%2Ftutorial-angular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iErickAraujo%2Ftutorial-angular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iErickAraujo%2Ftutorial-angular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/iErickAraujo","download_url":"https://codeload.github.com/iErickAraujo/tutorial-angular/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246612485,"owners_count":20805355,"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":["angular13","bootstrap5","css","html","tutorial","typescript"],"created_at":"2024-12-14T03:14:42.383Z","updated_at":"2025-04-01T09:08:17.059Z","avatar_url":"https://github.com/iErickAraujo.png","language":"HTML","readme":"# TUTORIALANGULAR\n\nEste projeto é um exemplo de tutorial em Angular que demonstra a criação de componentes, módulos e a organização de um projeto Angular. \nProjeto desenvolvido com base nos requisitos informados pelo professor.\n\n## Índice\n\n- [Estrutura do Projeto](#estrutura-do-projeto)\n- [Tecnologias Utilizadas](#tecnologias-utilizadas)\n- [Funcionalidades](#funcionalidades)\n- [Como Usar](#como-usar)\n- [Editando Variáveis de Ambiente](#editando-variáveis-de-ambiente)\n- [Servidor de Desenvolvimento](#servidor-de-desenvolvimento)\n- [Geração de Código](#geração-de-código)\n- [Build do Projeto](#build-do-projeto)\n- [Testes Unitários](#testes-unitários)\n- [Testes de ponta a ponta](#testes-de-ponta-a-ponta)\n- [Ajuda Adicional](#ajuda-adicional)\n- [Personalização](#personalização)\n- [Contribuição](#contribuição)\n- [Licença](#licença)\n- [Autores](#autores)\n- [Reconhecimentos](#reconhecimentos)\n\n## Estrutura do Projeto\n\nO projeto está organizado da seguinte forma:\n\n```plaintext\nTUTORIALANGULAR/\n├── .angular/\n├── node_modules/\n├── src/\n│   ├── app/\n│   │   ├── components/\n│   │   │   ├── pagina2/\n│   │   │   │   ├── pagina2.component.css\n│   │   │   │   ├── pagina2.component.html\n│   │   │   │   ├── pagina2.component.spec.ts\n│   │   │   │   ├── pagina2.component.ts\n│   │   ├── paginainicial/\n│   │   │   │   ├── paginainicial.component.css\n│   │   │   │   ├── paginainicial.component.html\n│   │   │   │   ├── paginainicial.component.spec.ts\n│   │   │   │   ├── paginainicial.component.ts\n│   │   ├── services/\n│   │   │   ├── data.service.ts\n│   │   ├── modules/\n│   │   │   ├── pagina2.module.ts\n│   │   │   ├── paginainicial.module.ts\n│   │   ├── app-routing.module.ts\n│   │   ├── app.component.css\n│   │   ├── app.component.html\n│   │   ├── app.component.spec.ts\n│   │   ├── app.component.ts\n│   │   ├── app.module.ts\n│   ├── assets/\n│   │   ├── images/\n│   ├── environments/\n│   │   ├── environment.prod.ts\n│   │   ├── environment.ts\n│   ├── favicon.ico\n│   ├── index.html\n│   ├── main.ts\n│   ├── polyfills.ts\n│   ├── styles.css\n│   ├── test.ts\n├── .browserslistrc\n├── .editorconfig\n├── .gitignore\n├── angular.json\n├── karma.conf.js\n├── package-lock.json\n├── package.json\n├── README.md\n├── tsconfig.app.json\n├── tsconfig.json\n├── tsconfig.spec.json\n```\n\n## Tecnologias Utilizadas\n\n- **Angular**: Framework para construção de aplicações web.\n- **TypeScript**: Superconjunto de JavaScript que adiciona tipagem estática.\n- **HTML5**: Estruturação e conteúdo das páginas.\n- **CSS3**: Estilização e layout responsivo do site.\n- **Bootstrap 5**: Framework CSS para design responsivo e componentes de interface de usuário.\n- **Google Fonts**: Fontes customizadas para uma estética moderna.\n\n## Funcionalidades\n\n- Criação e gerenciamento de componentes.\n- Integração de serviços para manipulação de dados.\n- Roteamento entre diferentes páginas.\n- Layout responsivo e estilização com CSS e Bootstrap.\n\n## Como Usar\n\nInstruções passo a passo sobre como configurar e executar o projeto localmente.\n\n```sh\n# Clone este repositório\ngit clone https://github.com/usuario/projeto.git\n\n# Entre no diretório do projeto\ncd projeto\n\n# Instale as dependências\nnpm install\n\n# Execute o projeto\nng serve\n```\n\n## Editando Variáveis de Ambiente\n\n### Caminho da Pasta\n\n1. Na área de trabalho do Windows, clique no botão iniciar e digite \"Explorador de Arquivos\".\n2. Clique em abrir e procure por Disco Local C:. Busque pela pasta Usuários e abra-a.\n3. Procure pelo seu Usuário e então abra-o.\n4. Dentro do Usuário, procure por AppData e abra.\n5. Em seguida, abra a pasta Roaming.\n6. Dentro de Roaming, busque pela pasta npm e abra.\n7. Na barra superior, clique e copie o caminho das pastas: `C:\\Users\\Usuario\\AppData\\Roaming\\npm`.\n8. Volte para a área de trabalho.\n\n### Adicionando Variável de Ambiente\n\n1. Na área de trabalho do Windows, clique no iniciar e digite \"Variáveis\". Clique em \"Editar variáveis de ambiente para sua conta\".\n2. Na janela que abrir, procure por Path na lista de variáveis para usuário, clique sobre ele e depois em Editar.\n3. Em um espaço vazio, dê dois cliques e cole o caminho das pastas copiado anteriormente. Em seguida, clique em Ok.\n4. Clique em Ok novamente para fechar a janela de variáveis de ambiente.\n\nCom isso, sua variável foi criada. Você pode retornar ao tutorial de instalação do Angular clicando [aqui](#instalação-do-angular).\n\n## Servidor de Desenvolvimento\n\nPara iniciar o servidor de desenvolvimento, execute `ng serve`. Navegue até `http://localhost:4200/`. O aplicativo recarregará automaticamente se você alterar qualquer um dos arquivos de origem.\n\n## Geração de Código\n\nExecute `ng generate component nome-do-componente` para gerar um novo componente. Você também pode usar `ng generate directive|pipe|service|class|guard|interface|enum|module`.\n\n## Build do Projeto\n\nExecute `ng build` para construir o projeto. Os artefatos de construção serão armazenados no diretório `dist/`.\n\n## Testes Unitários\n\nExecute `ng test` para executar os testes unitários via [Karma](https://karma-runner.github.io).\n\n## Testes de ponta a ponta\n\nExecute `ng e2e` para executar os testes de ponta a ponta via uma plataforma de sua escolha. Para usar este comando, você precisa primeiro adicionar um pacote que implemente capacidades de teste de ponta a ponta.\n\n## Ajuda Adicional\n\nPara obter mais ajuda sobre o Angular CLI, use `ng help` ou consulte a [Visão Geral e Referência de Comandos do Angular CLI](https://angular.io/cli).\n\n## Personalização\n\nPara alterar as cores e o layout, edite os arquivos de estilos localizados em `src/app/components/*/*.css`.\n\n## Contribuição\n\n1. Faça um fork do projeto.\n2. Crie uma branch para sua feature (`git checkout -b feature/nova-feature`).\n3. Commit suas alterações (`git commit -m 'Adiciona nova feature'`).\n4. Push para a branch (`git push origin feature/nova-feature`).\n5. Abra um Pull Request.\n\n## Licença\n\nEste projeto está licenciado sob a licença MIT. Veja o arquivo `LICENSE` para mais detalhes.\n\n## Autores\n\n- **Erick Araujo** - _Trabalho inicial_ - [Seu GitHub](https://github.com/iErickAraujo)\n\n## Reconhecimento\n\n- Inspirações, agradecimentos especiais, etc.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fierickaraujo%2Ftutorial-angular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fierickaraujo%2Ftutorial-angular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fierickaraujo%2Ftutorial-angular/lists"}