Curso Angular 9 #09 Obtendo dados da API externa (back-end)

[@celofoliveira]

Ótimas aulas! Consegui um estágio por causa delas!

[@MichelliBrito]

uaaauu que ótimo, parabéns!!

[@luciopereirabrito3154]

Ótima didática, parabéns pelo conteúdo!

[@lucianofragalopes]

Ao se deparar com o código HTTP 404 ao fazer a requisição em "/lives?flag=previous", é compreensível que os usuários fiquem confusos quanto ao motivo do erro na API. Seria mais adequado se a API retornasse uma mensagem de erro explicativa em vez de apenas o código de status, para evitar confusões e auxiliar na solução do problema. Uma sugestão de melhoria seria fornecer uma mensagem de erro indicando que o usuário da API precisa inserir um valor antes de solicitar a opção "previous". Isso ajudaria a esclarecer a necessidade de um parâmetro válido antes de fazer essa requisição específica. No entanto, é importante ressaltar que, se você não tem controle sobre os códigos da API e não pode fazer alterações diretamente, essa sugestão de solução alternativa pode ajudar temporariamente os usuários a contornar o problema. Enviando um POST para a rota "/lives" com o corpo da mensagem conforme o exemplo fornecido, você pode obter um resultado funcional, mas isso não resolve diretamente o erro na rota "/lives?flag=previous" e pode não ser uma solução sustentável a longo prazo. Para resolver o problema de forma mais efetiva, seria necessário revisar e modificar o código da API para tratar adequadamente a requisição em "/lives?flag=previous" e fornecer mensagens de erro informativas aos usuários. Exemplo: POST: /lives { "liveName": "xyz live", "channelName": "Canal xyz", "liveDate": "2023-04-20T11:24:14.616", "liveLink": "kzbin.info/www/bejne/r4PRmYhslLeIosU", "registrationDate": "2023-05-20T11:25:18.092" }

[@Ederdoalmeida]

Parabéns pela didatica... consegui prosseguir com estudo pois estava encontrando dificuldades com observables e promise.. parabens!

[@andradenegociodigital9649]

Olá Michelli, excelente conteúdo de Angular e Angular Material. Venho acompanhando e aprendendo muito com seus vídeos. Parabéns pela iniciativa e sua didática. Muito sucesso pra você.

[@FlavioCorinthiano]

Ganhou mais um inscrito, me salvou agora

[@Will9947]

maravilha suas aulas, tem meu apoio, programo em php, mas irei assistir suas aulas, pois são muito didáticas

[@claudioernandes9083]

Excelente playlist de introdução ao Angular, muito boa sua didática, só faltou um pouca questão do back-end, no mais... parabéns pela iniciativa.

[@luissilva1270]

Deveria adicionar um video na playlist , explicando o backend. Se olhar os comentarios, vai ver que muitas pessoas tiveram dificuldade.

[@paulorodrigues8475]

como dar start no backend java? exemplo com node: npm start.

[@JoaoGabriel-su9xg]

Like , ja me inscrevi no seu canal . To gostando muito !!!

[@ga_ts]

Não consegui conectar com o Back-end. Uma sugestão para os próximos minicursos seria um vídeo em separado apenas preparando o ambiente back-end!

[@whitewolflinepretae-sport_2992]

Man se tu tá fazendo curso de angular e não tem uma apo da net pra usar ou não sabe fazer uma é meio tenso

[@kebinho007]

Parabéns, gosto de suas aulas

[@dakota5350]

Voz meiga, inteligente e linda, tô apaixonado !????

muito bom, acompanhando!

[@paulinobritomascarenhas2472]

Muito Bom, Obrigada

[@rogerioadrianosilva5360]

Qual a diferença entre classe e interface que você usou no no model ?, No seu caso usou classe mais vi alguns vídeos falando para usar interface.

[@danielgirardi]

Não sei se vai falar disso ainda, mas não faltou um unsubscribe? ou fazer a chamada com um pipe(take(1)) no service? Eu uso pipe(take(1)) por ser mais prático, mas não sei qual seria melhor.

[@gabrielbarbosa8293]

Como eu faço para poder utilizar essa variável depois? Porque depois que faço o subscribe, a variável fica como undefined

[@CrônicaSombriasata]

tão linda apaixonado por vc kakaka ganhou 1 escrito kk

[@viniciusrossi3078]

Olá Michelli, poderia me dar um norte de como rodar a API no Back-End? Realmente não tenho conhecimento nessa parte.

[@MichelliBrito]

Vc tem que baixar a aplicação back-end no Github, importar para uma IDE e executar a aplicação.

[@viniciusrossi3078]

@@MichelliBrito Oi Michelli, tentei de várias maneiras mas não consegui. Fica dando o seguinte erro: "Failed to load resource: the server responded with a status of 500 ()" Cheguei a pesquisar na internet uma solução, mas não consegui resolver. :(

[@ryanmoreira8356]

@@MichelliBrito o application.properties está correto? Basta essa linha? mongodb://mongodb:[e-mail]:21960/live-database

[@THIAGOKSR1]

Pessoal, vi que muitas pessoas, além de mim, estão com dúvida com relação a como subir a API. Li alguns comentários explicando o que deve ser feito, porém não funciona. Estou abrindo a API no eclipse, faço o download de todas as dependências do projeto pelo Maven e depois tento executar o projeto utilizando a opção "AgendaliveApplication - com.spring.agendalive", o que aparentemente ocorre sem erros. Porém, quando vou no browser e tento acessar o caminho "localhost:8080/lives?flag=previous", recebo 404. Michelli ou alguém pode me ajudar? Ou indicar qual playlist do canal posso seguir para conseguir construir uma API exatamente nos moldes do presente curso.. OBS.: tem pelo menos 3 playlists sobre construção de API, mas não consegui enxergar qual vai me permitir construir a API nos moldes da que foi construída para esse curso (não estou falando de construir exatamente a API AgendaLive, mas sim usando as mesmas tecnologias necessárias para esse projeto). Desde já agradeço a atenção!

[@GuilhermeSilva-un8gd]

Comigo funcionou quando eu tirei o "'?flag=' + flag" do método getLivesWithFlag(). Acho que ela colocou a flag pq na url dela tinha, como no meu caso não tinha esse comando e acredito q no seu tbm não é só tirar. Espero ter ajudado!

[@cbckakaroto]

Parabéns pelas aulas só recomendo substituir o 404 NOT_FOUND por 204 NO_CONTENT.

[@erickandrade7142]

Adoro estudar com você! Minha mãe tá te chamando pra vir tomar café aqui em casa qualquer dia :)

[@MichelliBrito]

hehehe adoro café!

[@RubensLeme]

Boa Tarde Michelli, o backend esta dando erro ao conectar o mongoDB, " Caused by: java.net.ConnectException: Connection refused: connect " será que mudou alguma coisa?

[@augustomoreira7403]

Property 'content' has no initializer and is not definitely assigned in the constructor.ts(2564) export class ResponsePageable{....} Dá error...pq?

[@ernilsonsouza3894]

Vlw

[@Ultratecnologia1]

Michelli baixei o backend do seu git e importei para dentro do Eclipse, porém acredito que esteja faltando algumas pasta e arquivos no projeto. Pergunta é preciso criar a pasta WebContent? e outra coisa estou tentando executar o projeto no tomcat mais na hora que é para mover o projeto na janela Add end Remove de Available: para Configured: o projeto não aparece em nenhum dos dois lados.

[@Kobaif]

to com o mesmo problema, se conseguiu resolver, me dá uma dica, por favor

[@SoldierDan]

Obrigado!

[@juliocesarrosetim1697]

Bem legal as suas vídeo aulas, mas deixa eu te perguntar uma coisa, nesse caso do liveNext, ao invéz de retornar 404 - NOTFOUND, se retornasse 204 - NOCONTENT, não ficaria mais intuitivo? Acho que 404 é quando não encontra a pagina em si, sei la, é só uma pergunta/sugestão!

[@MichelliBrito]

Poderia ser tbm =) realmente ficaria mais intuitivo!

[@wilsonqueiroz9778]

Olá Michelli parabéns pelo conteudo!! uma duvida eu preciso criar o meu banco aqui ou eu consigo me conectar usando o que esta no applications.properties?

[@MichelliBrito]

Esse banco que está no properties é o que eu criei na minha conta no mlab, não sei se tem limite de conexões pois estou usando a conta free. Seria bom vc criar um no mLab mesmo ou no Azure para não ter problemas e ter um banco exclusivo para sua API =)

[@brenobcsilva]

Valeuuuu!!

[@Brunoalves-wi5bk]

Michelli não sei se funcionaria mas pra não repetir o subscribe 2 vezes vc acha que seria uma boa criar um observeble em um metodo fazendo um subscribe e então chamar esse metodo no retorno onde vc passa o previous e o next (não sei se daria certo)

[@MichelliBrito]

Teria que planejar uma outra implementação para isso, mas resolvi fazer da maneira mais simples para ser mais fácil de visualizar.

[@gustavocarvalho7988]

Olá na sua linha 23 vc atribui os dados vindos de um subscribe para seu array livePrevious, correto? Faço isso direto no meu ERP, mas há casos que quando eu vou usar o meu array fora do subricribe ele está e o data não. É impressionante!!!!!. Aí o que eu faço: chamo um método qualquer passando "data" e setando meu array. Aí passa a funcionar. Já teve desse problema?

[@augusto1997]

isso acontece por conta que o subscribe é assincrono assim como as promises. Caso tu precisa trabalhar com esse dado vindo do observable é interessante antes se certificar de alguma maneira que ele já estará lá. Em promises por exemplo colocamos a palavra chave 'await' que seria pra esperar ela ser resolvida

[@MichelliBrito]

A resposta do augusto1997 está perfeita, isso mesmo... neste caso vc tem um processo assíncrono e precisa garantir que a variável tem um valor atribuído antes de chamá-la.

[@gustavocarvalho7988]

@@augusto1997 Hmmmmmm, vou fazer uns testes aqui, então valeu pela dica.

[@Fenderoutside]

Qual linguagem de programação vc usou, para executar a chamada pro back-end? Pois n entendi nada 😂. Achei q era JS, mas o script é totalmente diferente.

[@edgarfagundes8108]

É typescript

[@rafaellelias]

Muito bom, mas seria mais interessante, vc estourar uma exceção quando não tiver lives cadastradas em vez de retornar 404, assim informando ao front que ainda não tem live cadastradas.

[@moacirjunior1346]

Também acho isso. Poderia retornar um vetor vazio também.

[@ryanmoreira8356]

Michelli, basta essa linha no application.properties? mongodb://mongodb:[e-mail]:21960/live-database Grato.

[@ryanmoreira8356]

Sempre da esse erro: com.mongodb.MongoSocketOpenException: Exception opening socket at com.mongodb.internal.connection.SocketStream.open(SocketStream.java:70) ~[mongodb-driver-core-3.11.2.jar:na] at com.mongodb.internal.connection.InternalStreamConnection.open(InternalStreamConnection.java:128) ~[mongodb-driver-core-3.11.2.jar:na] Consegue disponibilizar o json?

[@ilss13]

@@ryanmoreira8356 Aqui até conecta, mas parece que tá sem resultados.. Conseguiu o json ?

[@mathgsouza]

Eu não estou conseguindo puxar os dados da API, pois eu não sei como startar meu backend, então ele dá conflito na requisição GET do localhost:8080. Lendo o código, por intuição reparei que (posso estar errado) o backend foi desenvolvido em Java. Preciso preparar meu ambiente para rodar minha API? (como em NodeJs). Fiquei um pouco perdido nessa aula. Vou tentar resolver aqui, caso eu não consiga...por favor se puderem me ajudar ficaria muito feliz ❤

[@dani.pishinin]

ward pq também estou com essa dúvida :/

[@SabrinaAndrade88]

Tambem nao estou conseguindo rodar o back end. Alguem conseguiu???

[@yancarlos5662]

Sim amigo, o backend foi desenvolvido com spring(java), nesse caso vc precisara de uma ide para dar start no servidor.

[@ThiagoSouza-xp2rc]

infelizmente vo desistir desse curso na metade,tb não consegui subir o back e quando subi gera uns erro de mongoDB.

[@BrunoCosta_88]

@@ThiagoSouza-xp2rc eu tbm mano :(

[@pedroselestrim]

Segundo a comentar!!!

[@matheustheulislee8671]

Essa aplicação ensinada está totalmente errada para quem usar o Angular 12 ou 13, não ? meio que parece que está fazendo como se fosse java...

[@ricas-tv]

Boa noite pessoal, não estou conseguindo rodar o backend da aplicação, ele retorna um 404 quando faço o get pra rota localhost:8080/lives... configurei o projeto java pra rodar no vscode. é preciso criar um banco de dados no mongodb pra ele funcionar? Alguem consegue me ajjudar?