Modo Avião

Porque mobile? 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”. Vamos lá:

modo_aviao

O mobile é uma extensão da gente, ele é um facilitador da nossa vida. Ele conecta você com o mundo. É um caminho sem volta, uma ponte para informação.

Modo Mobile (Isso muda tudo!)

Mobile Life.

A resposta em gráfico, para ficar mais impactante:

webapp

Porque mobile?

  • As oportunidades estão abraçando o mobile
  • Brasil, quinto maior mercado de smartphone do mundo
  • Buscas via app já ultrapassaram 52%
  • Crescimento populacional da classe C em 204%, contra apenas 10% do Brasil
  • Em 2015, o celular ultrapassou o dektop

Modo Carioca

O Rio de Janeiro será a grande inspiração para desenvolver webapps.

modo_rio

Porque Rio de Janeiro?

  • Segunda maior economia do País
  • A cidade mais lembrada pelos turistas estrangeiros
  • A porta de entrada do Brasil
  • Berço do Samba, Bossa Nova, Funk, Praias e Belezas naturais

Modo Cross Mobile

Este blog também irá trazer algumas abordagens de arquitetura e seus serviços que utilizam as plataformas cross mobile: React, Ionic, Xamarin e Flutter.

modo_cross

Road to Cross

O React é a lib JS mais famosa e popular para o desenvolvimento de UI. Tem como características o seu modo declarativo, eficiente e flexível.

Modo Cloud

Quer um bom motivo para desenvolver para a nuvem? FICAMOS FOCADO NO APP!

Modo Mobile Services

Vamos entender os tipos estratégicos sobre o Mobile Services.

O mundo sob demanda de serviços de APPs:

modo_appservices

Road to Services::

  • Geolocalização
  • Notificações
  • Serviços REST
  • APIs
  • etc….

Modo AAS

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

  • SAAS
  • PAAS
  • IAAS

mean_modo_aas

Modo MongoDB

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

mongo_mean

mongo_mean_document

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_arch

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)

Iremos discorrer bastante sobre o famoso framework do Google.

Por ser um framework front-end e não uma lib, 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.

modo_front

Vamos abordar também sobre como organizar melhor uma web app Angular2:

ang2_basico_arquitetura

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

Vamos entender como tornar fácil a conversação entre esses dois universos (front/back).

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

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 Mean (Macro)

modo_stackexpert

Modo React

Este blog também irá trazer algumas abordagens sobre o React, a lib JS mais famosa e popular para o desenvolvimento de UI. Tendo como características o modo declarativo, eficiente e flexível.

mean_react

Modo Xamarin

Este blog também irá trazer algumas abordagens de arquitetura e seus serviços que utilizam a plataforma Xamarin:

xam_basico_frontback

 

Modo MVVM

Este blog irá explorar muito sobre este design pattern.

modo_mean_mvvm

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.

modo_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

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

modo_design

Road to Design Estratégico

  • Escolha o formato certo
  • E a mensagem certa
  • Enxergue valor além do último click

Modo Clean

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

modo_cleancode

 

O surgimento do Mobile no Brasil.

app_base_01

app_base_02  

app_base_03

app_base_04

app_base_05 

app_base_06

app_base_07 

app_base_08 

app_base_09

app_base_10

app_base_11  

app_base_12

Modo Bye!!!!

Antes de encerrar, inspire-se em frases motivadoras de alguns bilionários::

Mark Zuckerberg (Facebook)

“O maior risco é não assumir nenhum risco… Em um mundo que muda tão rápido, a única estratégia de fracasso garantido é não se arriscar.”

Larry Page (Google)

“É geralmente mais fácil progredir com sonhos mega-ambiciosos. Como ninguém é maluco o suficiente para tentar fazer isso, a concorrência é menor.”

Sergey Brin (Google)

“Resolver os grandes problemas é mais fácil que resolver pequenos problemas.”

Jeff Bezos (Amazon)

“Tivemos três grandes ideias na Amazon nas quais insistimos por 18 anos e foram o motivo de nosso sucesso: consumidor em primeiro lugar, inovar e ser paciente.”

Jack Ma (Alibaba)

“Nunca desista. Hoje é difícil, amanhã será pior, mas depois de amanhã o sol vai brilhar.”

Larry Ellison (Oracle)

“Tive todas as desvantagens que são necessárias para o sucesso.”

Oprah Winfrey (Apresentadora)

“A chave para realizar um sonho é concentrar-se não no sucesso, mas no significado, então todas as pequenas vitórias, cada pequeno passo terá um enorme sentido.”

Warren Buffett (Mega-Investidor)

“Você precisa acertar muito pouco na vida se não errar demais.”

Michael Bloomberg (Bloomberg)

“Você precisa ter disposição de fracassar e precisa da coragem para seguir independente disso.”

Bernard Arnault (Louis Vuitton)

“Nos negócios você precisa aprender a ser paciente. Talvez eu mesmo não seja muito paciente. Mas acredito que meu maior aprendizado é que se deve ser capaz de aguardar alguma coisa no tempo certo.”

Carlos Slim (Mega Investidor)

“A competição o torna melhor sempre, mesmo que o competidor seja vitorioso.”

Charles Koch (Koch Industries)

“Precisamos medir o que leva ao resultado, não apenas medir o que é fácil de medir.”

George Soros (Mega Investidor)

“Quanto pior se torna a situação, mais fácil é para dar a volta por cima e maior é o lado positivo.”

Amancio Ortega (Inditex)

“Não podemos nos limitar a seguir por uma trilha que já abrimos.”

Azim Premji (Wipro)

“O sucesso é alcançado duas vezes. Primeiro no pensamento e depois no mundo real.”

modo_bye

Keep Programming.