[Pitch] - TabNews Mobile - React Native

Apresento à vocês o TabNews Mobile. Iniciei ele para renovar meus conhecimentos em RN com expo, pois estava há 1 ano sem desenvolver nada para mobile. Claro! Longe de estar perfeito, mas dá pra fazer o básico: Ler, publicar, comentar, votar e responder. Não cheguei a botar contra o fogo e utilizar no dia a dia, mas quero muito a opnião de vocês.

Ficam aí algumas imagens

Desenvolvendo

Bom, antes de qualquer, vou colocar alguns pontos:

  • O projeto não é comercial! Esta mais para uma POC, porém quero sim subir nas lojas para uso público, assim como é o site tabnews.com.br!
  • Não tenho nenhum vínculo com o site oficial, logo, pelo menos por enquanto, talvez não consiga dar o suporte necessário. Caso venha se tornar útil para comunidade, minha ideia é adicionar colaboradores, assim podemos todos dar suporte e adicionar melhorias.
  • O app ainda pode ter falhas, algumas já são conhecidas (mais abaixo), mas a ideia de postar aqui, é essa mesmo: descobrir problemas e pontos de melhora.

Caso queira ver o app rodando

O projeto foi desenvolvido em React Native + Expo, o que torna o desenvolvimento e publicação extremamente mais prático. Por estar em modo público, qualquer um com o link e o app Expo Go, consegue abrir a última versão (03/01/2023):

IOS

exp://u.expo.dev/update/93b983ce-b4c4-4d22-b356-3d572cdf4b08

Android

exp://u.expo.dev/update/90e9d479-70ca-4f84-8bb2-600e94d3ba58

Caso queira conhecer o app

Pra quem quiser acompanhar o desenvolvimento ou sugerir novas feature, este é o repositório do app: https://github.com/danielkv/tabnews-mobile

Falhas conhecidas

  • O conteúdo de algumas publicações foram convertidas incorretamente ou parcialmente convertidas. Como o markdown aceita também html acredito que a lib utilizada não soube lhe dar muito bem com isso.
  • A navegação ficou um pouco lenta. Em alguns testes entre páginas a navegação engasgou em alguns momentos no emulador. Não percebi isso no dispositivo.
  • Não foi testado em dispositivo IOS ainda

Finalizando

Espero que gostem!

meiraPhhá 2 anos

UI simples e fiel ao site, muito bom!

Dada2010591há 2 anos

Parabéns é uma ótima ideia talvez você consiga apoio dos criadores do tabnews para continuar esse projeto.

danielkvhá 2 anos
Boa, seria muito legal se conseguir! Acho que os leitores iriam curtir bastante também!
blopeshá 2 anos

Clean, exatamente como deveria ser. Está muito bom visualmente o projeto! Parabéns pela iniciativa, vou seguir no GitHub.

CristianoSwordhá 2 anos

wow! Que massa! Gostei do UI apresentado nas imgs, com certeza um projeto promissor!

vagnerlandiohá 2 anos

Que show man, parabéns.

Já pensei em iniciar um projeto como esse do tabnews, mas sabe como é programador, a gente tem muitos projetos na cabeça mas não damos o primeiro passo hehe.

Trabalho diariamente com React Native faz alguns anos. Vou seguir o projeto no Github, talvez eu possa contribuir com algo.

danielkvhá 2 anos
Com certeza vagner. Manda ideias aew. Quanto mais gente colaborar melhor vai ficar o app.
ThiagoBragahá 2 anos

Baita projeto Daniel. Comecei a programar a pouco para mobile e escolhi React Native (Expo) pelas suas facilidades para quem já tinha experiência com JavaScript/React.

danielkvhá 2 anos
Boa Thiago, há 8 anos atrás comecei com React Native pelo mesmo motivo, eu já tinha uns 10 anos de JS o que ajudou muito. Acredito que optei pelo caminho certo hehe! Gosto muito do Flutter também, mas minha paixão mesmo ta no JS. Pra web já estudei de tudo um pouco: Angular, Svelte, Vue, etc, algumas muito promissoras, como o próprio Svelte, que PARECE ser mais performático que React, mas é uma mudança de paradigma bem grande. Mas cara, força nos estudos que vamos longe! Precisando de ajuda em algo ae, só chamar, podemos trocar experiências.
ThiagoBragahá 2 anos
Estou focado em aprender react, next e react native para ter um bom conhecimento em web e mobile. Mas tenho planos de estudar node para agregar o backend nos estudos também. Aprendizado tem que ser contínuo.
danielkvhá 2 anos
Boa, tenta focar bastante na linguagem e estruturas. Typescript também é uma boa estudar. Na verdade eu iniciei com PHP, como era pra web acabei precisando do JS, mas depois o backend foi tranquilo.
MathRodri25há 2 anos

Ficou sensasional, vou seguir o projeto e me aprofundar em React Native. Parabéns !!!

marquissantoshá 2 anos

Excelente conteúdo, Baita projeto Daniel! Gostaria de ver esse projeto na loja(google play ou apple store), acredito que será um baita aprendizado para vc. abraço.

danielkvhá 2 anos
opa, claro! vou colocar nas lojas sim, porém para apple é mais complicado, é caro a conta de desenvolvedor. Como ja coloquei alguns apps nas lojas a conta para Android já tá habilitada, é bem mais baixo o custo, mas da Apple além de ser mais caro, tem recorrência anual.
Matrixs0beithá 2 anos

sem duvida um otimo app, pelo que percebi você ta acessando a pagina web recomendo acessar via API que a latencia e o erro com o markdown vai ser resolvido... parabens pelo app

danielkvhá 2 anos
Opa, é realmente pela API, estou utilizando uma lib chamada `react-native-markdown-display` pra converter e mostrar o conteúdo. Eu acredito que com algumas configurações eu faça funcionar, não me dediquei ainda muito pra esse erro, quis terminar e lançar aqui pra mostrar pra galera. Mas já agradeço pela dica!
DiegoRamosGomeshá 2 anos
Eu estava fazendo um app do tabnews em react native também e testei essa mesma lib que vc porém não curti muito ela, optei eu usar a `react-native-github-markdow`, com ela a parte de html fica tranquila e o markdown também porém isso acontece por que ela gera uma webview com o conteudo Na minha opinião, se a ideia é uma POC não teria problema em ter a webview por traz apenas do conteudo
danielkvhá 2 anos
oi Diego, inicialmente eu coloquei uma webview, porém percebi que a performance caiu muito e algumas vezes crashou o app. Acho que por conta de exibir vários conteúdos na mesma rota acaba pesando muito ter várias webview. também se quiser sugerir algo através de uma issue, fica a vontade, de verdade. é um app pra galera usar mesmo.
Matrixs0beithá 2 anos
achei que vc estava acessando via web pois o template e igual, ficou bom o app
danielkvhá 2 anos
Ah sim, segui o mesmo layout pra não variar mesmo, mas tô aberto a sugestões de mudanças. É um app para a comunidade, então a ideia é pra ficar o melhor possível pra todo mundo.
Matrixs0beithá 2 anos
baixei o codigo e sem duvida você mandou bem na programação parabens, precisa implementar uma segurança maior no token que e atribuida como string.
danielkvhá 2 anos
Esse token é gerado pela própria API do tabnews, eu apenas guardo ela com AsyncStorage. Não sei se há alguma maneira de adicionar alguma camada de segurança pelo lado do `client`, pelo menos desconheço. Caso saiba algum jeito de fazer, podemos abrir uma issue lá no repositório, acho que fica até mais fácil discutir lá coisas mais específicas. Depois colocamos o link aqui nos comentários pra quem quiser acompanhar. ___ ## Update Achei essa lib que talvez ajude com isso: https://github.com/oblador/react-native-keychain, mas há alguns pontos pra considerar. Como náo estou salvando username e password, teria que adptar pra essa lib. Outra coisa também é que o token ele expira (se não me engano em 24h), logo o usuário teria que logar novamente. Não sei se é um grande risco manter no AsyncStorage apenas. De qualquer forma, do jeito que montei o código seria fácil pra alterar usando essa lib.
codecompanybrasilhá 2 anos

Interessante. Só um adendo, estava dando uma olhada no app pelo expo android e vi ele não está interpretando algumas tags HTML nos posts, como IMG ou A. Foi as que eu achei.

Fiz o teste no meu próprio post:

https://www.tabnews.com.br/codecompanybrasil/notificacao-de-publicacoes-do-tabnews-no-discord-como-fiz-essa-integracao-discord-py

Mas parabéns pelo projeto e boa sorte no desenvolvimento! Ganhou meu like

danielkvhá 2 anos
Isso mesmo codecompanybrasil. Já é um bug conhecido hahaha. eu to tentando resolver aqui, acho até que ja cheguei em uma solução, mas nao consegui implementar ainda hoje. Acho que até dou volta nisso!
VictorManhanihá 2 anos
Parabéns pelo baita projeto! Já vários clientes aqui no TN desde Python, Flutter, etc... e me alegro todas as vezes que vejo mais um projeto destes! Tem muito valor! Contribui adicionando uma estrela no repo 🙂😝 Só uma coisa que acho que pode fazer sentido é colocar [Pitch] no título da publicação, pois assim fica mais fácil identificar publicações valorosas como essas de projetos. Muito obrigado pelo projeto mais uma vez!
danielkvhá 2 anos
Pow valeu Victor, que legal qur gostou. Vou ver a possibilidade de alterar o título pra adicionar [Pitch].
tarcisiodelmondeshá 2 anos

Daniel você consegue colocar o QR Code do link para acessar o app com Expo? Assim quem ta no computador poderia apontar o celular para o QR Code e baixar o app no Expo.

Em relação a o app estar lento no emulador, acredito que seja normal ja que o emulador do Android não é do melhores, se no celular estiver bem é o que importa

danielkvhá 2 anos
Opa vou pegar o qrcode aqui, ja coloco ae. 10min 😅
danielkvhá 2 anos

Aew galera, mals não ter mais atualizado o app no expo, hoje não consegui dar atenção, surgiu muita coisa no trampo. Prometo que até segunda trago alguma novidade!