Modo Avião

Web / App – Saga

Senhores passageiros apertem o cinto e ponham o seu mobile em modo avião. Começa agora a minha “SAGA WEB APP”, a jornada Cross Mobile | Rio de Janeiro para construir APPS incríveis. Vamos lá:

O objetivo deste blog é mitigar, dissecar, explorar, esmiuçar, descobrir, aprender um “bocado” sobre o mundo das novas tecnologias. Espero compartilhar minhas aventuras com pessoas que amam criar APPs Cross Mobile.

mob_modo_air

Modo Cross Mobile

Rio & Cross Mobile | Melhor Juntos!

Native, Native, Native. O foco do blog é mobile (até o fim) e todo o seu ecosistema. Não importa a tecnologia utilizada, o foco são esses caras.

modo_cross

Abordarei conceitos e técnicas das principais plataformas Cross Mobile como:

  • React
  • Flutter
  • Ionic
  • Xamarin

Vivendo o “Style Cross”. Todo dia assim, HTML5, PWA, JS, MEAN, Cloud, etc.

modo_cross_approach

Road to Cross

  • Explorar conceitos e tecnologias
  • Acessar as APIs disponíveis

 

Modo Mobile Services

Entre no jogo, eles resolvem!

Os dispositivos móveis são uma ótima oportunidade para divulgar uma mensagem de marketing mais segmentada, porque temos uma compreensão melhor do contexto, como hora, localização e proximidade do cliente.

O mundo sob demanda de serviços de APPs:

modo_appservices

Road to Apis Services::

  • Geolocalização
  • Notificações
  • Camera
  • Bluetooth
  • Audio
  • Sensors
  • Etc…

mob_apis_magia

A Magia das Apis

  • Material Design
  • GMaps
  • Serviços REST
  • Support Library
  • Play Services
  • Firebase
  • NDK, NFC
  • App Engine
  • inApp Purchase
  • Beacon

Modo Foda 

Arsenal de dev! 

Não tem pra onde correr, esses caras resolvem e ninguém segura. A Briga vai ser feia pra dominar esses caras.

mob_stack

Modo Mean 

Dia-sim e Dia-sim!

Abordagens sobre a arquitetura/stack MEAN e MERN. Estudar o mecanismos dessas tecnologias emergentes:

mob_stack_mearn

BackEnd / FrontEnd 

O blog irá explorar o mini mundo (front-back). Entendendo como acontece a conversa entre esses dois mundos.

Entender esses dois lados ao desenvolver um APP, irá nos permitir criar uma separação (distribuição) melhor das responsabilidades.

mob_stack_mean_conversa

Modo Cloud

Quer um bom motivo para desenvolver para a nuvem? FICAMOS FOCADO NO APP, no código do negócio. Ou seja, temos uma Apollo 11 disponível para criar nossos apps.

O AWS por exemplo, é uma plataforma CLOUD que oferece soluções para armazenamento, análise, segurança etc.

mob_stack_cloud

Um exemplo de diagrama de arquitetura permite entender a comunicação claramente o design e a implantação de nossa infraestrutura.

Abordarei um pouco sobre as principais ferramentas CLOUD:

  • Google Cloud
  • Azure
  • AWS 

Modo AAS

Vamos explorar os modelos estratégicos do “Tudo AAS”. O mundo sob demanda:

  • SAAS
  • PAAS
  • IAAS

mean_modo_aas

Modo MongoDB

“Dados são o novo Petróleo”

O blog irá explanar bastante sobre a moderna arquitetura do MongoDB. O DB No-SQL orientado à documentos.

mob_stack_mongo

Road to Mongo::

  • boas práticas (hardware, app, modelagem e index)
  • mongoose, library para mapeamento de objetos no Mongo
  • etc…

Modo Express

Vamos explanar bastante sobre este framework (conjunto de recursos) de desenvolvimento web para Node.

mean_basico_structure

Road to 5.0

  • Native promise support in routing
  • Improved template redering system
  • Improved query string handling
  • Improved cookie handling
  • New route syntax additions
  • Decomposed project structure

Modo Angular (Front)

O desenvolvimento Front-End em viés de alta! 

Foco maior na camada de interface que “toca” o usuário (site, dektotp ou mobile). Crie a maior experiência ao usuário em sua plataforma.

O front evolui a passos largos com mudanças num piscar de olhos. Olha o sucesso do ReactJS, AngularJS, Vue, etc…

Iremos discorrer bastante sobre o famoso framework do Google e cada um desses bloquinhos.

ang2_basico_eigthblocks

O Angular por ser um framework front-end e não uma library, por padrão ela nos oferece templates declarativos, injeção de dependência, boas práticas. Por isso, este carinha é quem dita o “MODO” de desenvolvimento de web apps, com uma arquitetura moderna e pré-estabelecida, diminuindo as possibilidades de erros simples.

mob_cross-plat_rendering

Road to Angular:: 

  • Components
  • Diretivas
  • Roteamento
  • Serviços
  • Template
  • MetaDada
  • DataBinding
  • Injeção Dependência
  • Consumir uma API em Angular no servidor
  • Organização em projetos web app Angular

 

SPA

modo_mean_spa

Road to Angular:: 

  • Components
  • Diretivas
  • Roteamento
  • Serviços
  • Template
  • MetaDada
  • DataBindgin
  • Injeção Dependência
  • Consumir uma API em Angular no servidor

Modo Node

O desenvolvimento do lado de lá! 

Tudo o que está por trás da app, age no que o nosso usuário não pode ver. Vamos entender como tornar fácil a conversação entre esses dois universos (front/back).

Foco na persistência dos dados, regras de negócio, segurança, performance, etc…

mob_stack_node

node_basico_arch

Road to Back::

  • Saídas do servidor
  • View-Mobile e a Server (API)
  • Conectar-se à uma base (MongoDB) com Rest API e HttpClient

Modo Architect (Strategic)

Também irei mitigar muito sobre arquitetura de web apps.

modo_node_rest

  • Boas práticas restful(métodos, nomenclaturas, headers…)
  • Integrações entre front-end e serviços restful com autenticações como basic authentication e tokenização

modo_node_restapi

Modo API Design

Vamos esmiuçar bastante sobre design de API.

Aprender como consumir uma API (escrita em NodeJS WebAPI), que irá gerar um JSON e será consumido por um app.

modo_mean_api_design

Road to API::

  • As responsabilidades REST
  • API RestFull / EndPoint
  • Serviços REST & SOAP (Postman/SoapUI)

Modo MVVM

Este blog irá explorar muito sobre os principais design patterns.

modo_mean_mvvm

Road to::

  • SOLID

Modo Clean

Clean Code Saves Devs. Be well, write good code, and stay in touch.

Em busca do código perfeito! 

Não é legal se deparar com código mal escrito. Siga a filosofia do dia-a-dia do Clean Code e tenha um código lindo. Onde todos os detalhes importam. Não esqueça, até código ruim funciona. Então, siga as dicas.

Todo dev, independente do recurso utilizado, “deveria” escrever um código robusto, de fácil entendimento e manutenção. Tecnologias atuais como: TDD, DDD, React Native, Angular, Node, Html5, Jquery, Android e Cordova, são exemplos que requer a aplicação do “Modo Clean Code”.

Modo Web Analytics

Sim, “Dados Falam”, também iremos nos debruçar no universo do Web Analytics, e entender que ele é muito mais do que um gráfico bonitinho.

mob_webanalytics

O que o Analytics diz:

  • Padrões/Tendências do tráfego do site
  • Origem/comportamento dos usuários no site
  • As páginas mais utilizadas
  • Tipos de usuários e segmentos mais lucrativos
  • Transformar usuários em clientes
  • Iniciativas de marketing online mais eficazes
  • etc…

Modo PWA

O blog irá discorrer bastante sobre o PWA, a Web virando APP.

modo_pwa

Modo Mobile Friendly

O Google prioriza websites adaptáveis (versão mobile) ao acesso via smartphone, além do mais, dados recentes afirmam que usuários estão passando cada vez mais tempo na internet via mobile.

modo_mobilesites

Road to Mobile Site

  • Entenda as principais diretrizes para a criação de um bom posicionamento mobile.

 

Modo Mobile Design

All eyes on me!

App não é só design. Repense a experiência.

Exercite a empatia. Tenha a capacidade de se colocar no lugar do usuário. Implemente a melhor jornada/experiência para o seu usuário.

Construa APPS perseguindo as melhores práticas de UI/UX, mantendo nos processos o usuário no centro dos sistemas (User Centered Design), isso nos garante apps intuitivos, lindos e com ótima usabilidade.

modo_uiux

Road to Design Estratégico

  • O mais importante é a experiência do usuário
  • Escolha o formato certo
  • E a mensagem certa
  • Enxergue valor além do último click

 

Modo Bye!!!!

modo_bye

Keep Programming.