Post on 16-Apr-2017
Laravel e aplicações real time
Eu sou Michael Douglas Barbosa AraujoCriador da Laravel PagSeguro, um dos responsáveis pela Laravel Conference Brasil e Full Stack Developer na Atitude.
▷ http://www.facebook.com.br/groups/silexbrasil▷ http://www.facebook.com.br/groups/laravelsp▷ http://www.facebook.com.br/groups/phingbrasil▷ http://www.facebook.com.br/groups/sonicpibrasil▷ http://www.facebook.com.br/groups/doctrinebrasil
Criador e mantenedor:
https://github.com/michaeldouglas
https://twitter.com/mdba_araujo
https://facebook.com/mdba.araujo
Livro: Zend Certified Engineer - Descomplicando a certificação PHP.
Laravel PagSeguro:
https://github.com/michaeldouglas/laravel-pagseguro - Atualmente entrando como pacote oficial Pagseguro e Laravel.
Laravel Conference Brasil
http://laraconfbrasil.com.br
Todos vocês ganharam 15% de desconto na Laravel Conference Brasil 2017
Concluindo juntamente com o Matheus Marabesi o livro de Laravel pela Novatec!
1.Aplicação em tempo
Real?
“Geralmente você assim como eu criamos nossas
páginas com base no conhecido paradigma de solicitação e resposta do HTTP.
O cliente carrega nossa página, em seguida, nada acontece até que o usuário clique na próxima página?
Ajax !
▷ Por volta de 2005, Ajax começou a deixar a web mais dinâmica!
▷ Mesmo assim, ainda não tínhamos o poder de criar aplicações real-time efetivamente!
▷ Porém, veja existiam mesmo na época outras soluções. ○ Todo mundo aqui conhece o placar UOL ?○ Quais soluções possuímos?
Apache PoolingSolução que fica a todo momento perguntando, se já existe uma nova atualização?
Nginx HTTP_PUSH_MODULE
Utiliza uma solução um pouco melhor de pooling que é o Long Pooling é o cliente que fica perguntando e o server não responde a não ser que se tenha a resposta!
Legal tudo isso !
Mas então qual é a solução para essa questão dos dados estarem em real-time para mais de um local de conexão?
WebSockets !
WebSocket, é uma tecnologia que permite comunicação bidirecional por canais full-duplex sobre um único soquete TCP!
Soluções que você pode utilizar?
2.Por que utilizar o
Pusher?
Pusher !
Pusher é muito simples de utilizar basta você criar sua conta no Pusher.
Em seguida basta você consumir a API do Pusher que já adiciona funcionalidade de escala em tempo real para aplicações Web e Mobile!
Vamos a um exemplo de criação de APP Pusher!
3.Por que utilizar o
Socket.IO?
12,462Quantidade de repositórios GitHub que utilizam Socket.IO!
“Socket.io diferente do seu primo Pusher não é pago
porém toda a gestão do Servidor de Socket é seu, por exemplo, na Amazon é mais interessante você utilizar o novo Load Balancer para o Socket.IO pois já possui
suporte a WebSockets e HTTP2!
Show MeThe Code - Chat com Socket!
Legal tudo isso !
Mas e o PHP ? - Repare que ao entrar no chat minhas mensagens não são persistidas, não existe lógica de login e entre outros pontos. E nesse momento, que entra nosso Back-end com PHP!
4.Por que utilizar o
Laravel?
33,640Quantidade de repositórios GitHub que utilizam Laravel!
Comparativo Google Trends sobre o interesse entre: Laravel, Zend e Symfony!
“Laravel pode ser uma boa escolha para você pelo seguintes motivos: Laravel é simples de utilizar,
instalar, possui uma documentação simples e atualmente é um bom framework para integração
com o FrontEnd!
Por que Laravel ?
Instalação do Laravel
É simples e você pode optar por duas opções: Via Laravel Installer ou via Composer!
Via Laravel Installer permite que você utilize: laravel new (Nome do seu APP)
Laravel e o mundo FrontEnd !
Laravel diferente de muitos Frameworks PHP se preocupa e muito com o FrontEnd pois traz consigo bibliotecas Javascripts escritas para o Framework.
Muitos dos Frameworks PHP são fantásticos para o mundo BackEnd porém para o mundo FrontEnd deixam e muito a desejar!
Gulp + VueJS
O Laravel já traz consigo tecnologias que irão ajudar e muito você no seu dia a dia no FrontEnd que são: Gulp, Elixir, Cache Busting, Web Components e VueJS!
Legal tudo isso !
Mas como iniciar essa tal integração com o FrontEnd que o Laravel já traz consigo?
Simples, basta na raiz do seu projeto Laravel executar o comando: npm install
“Após executar o comando apenas foi instalado os
pacotes na pasta node_modules.Juntamente com os pacotes baixados o Laravel traz
consigo o Laravel Elixir que basicamente utiliza o Gulp para realizar tarefas do seu dia a dia!
WEB PACK ?
WebPack basicamente é um empacotador de códigos para projetos Web, não necessariamente é geração de módulos !
Nem sempre ter todo o JavaScript/CSS do seu projeto em um único arquivo é bom!
Show MeThe Code - Laravel Elixir em ação!
5.O que éLaravel ECHO?
“Basicamente Laravel Echo é uma biblioteca FrontEnd
que já é preparada para se integrar ao BackEnd do Laravel para que seja possível criar aplicações Real-time de uma forma realmente simples !
Realmente falamos e muito de aplicações real-time vejamos então um exemplo de aplicações que utiliza
WebRTC e WebSockets: http://wmvisit.com
“Laravel contém em sua estrutura uma solução
completa para eventos Broadcasting que permite a você compartilhar os mesmos nomes de eventos entre
o código do lado do servidor (PHP) e o aplicativo JavaScript do lado do cliente.
“Caso ainda não esteja claro sobre o quanto isso é
bom. Pense no seguinte exemplo:
Quando você sintoniza sua televisão na Emissora: (Rede Globo) você espera estar assistindo ao
mesmo jogo de Futebol que o seu vizinho. E que ao acontecer o "GOLLLLLL" tanto você, quanto o
vizinho saibam disso ao mesmo tempo?
No mundo dos WebSockets podemos dizer que: Channel em nosso exemplo é a Rede Globo.
E Event é a transmissão do jogo: Real Madrid x Barcelona. E nesse contexto manter nomes é importante pois só devemos assistir a propagandas previamente registradas para aquele evento ou até mesmo disparar uma nova !
Neste exemplo todo: Eventos ficam no PHP Laravel e exibição dos eventos no Laravel Echo!
Como utilizar o Laravel Echo ?
Você precisa instalar a biblioteca PHP do Pusher da seguinte maneira:
composer require pusher/pusher-php-server.
Irei explicar o passo a passo e no final: Show Me The Code!
Como utilizar o Laravel Echo?
Agora precisamos instalar a biblioteca Javascript do Laravel Echo e também do Pusher:
npm install --save laravel-echo pusher-js
Agora iremos utilizar nossa App Keys do Pusher em nosso Laravel!
Como utilizar o Laravel Echo?
Precisamos então informar ao Laravel sobre essa configuração de ambiente.
O Laravel utiliza a biblioteca Dotenv do Vlucas:https://github.com/vlucas/phpdotenv
Vejamos um exemplo de configuração.
“As configuração no .env:
PUSHER_APP_ID=SEU IDPUSHER_KEY=SUA KEYPUSHER_SECRET=SEU PUSHER SECRET
BROADCAST_DRIVER=pusher
Outro ponto importante é descomentar o Provider de Broadcasting em config/app.php.
Isso porque quando você desejar enviar em canais privados seja possível, ou seja, canais
autenticados!
Chat exemplo:
Para o nosso exemplo iremos executar alguns comandos Artisan Laravel:
▷ php artisan make:event
ChatMessage
○ Esse comando faz com que o
Laravel crie um novo evento
que em nosso exemplo será
para o envio de mensagem!
○ O arquivo será criado no
caminho:
app/events/ChatMessage.php
Chat exemplo:
▷ php artisan make:model
ChatMessage --migration
○ Esse comando faz com que o
Laravel crie um novo modelo e
também uma migração de
dados.
○ Os arquivos serão criados nos
caminhos:
app/ChatMessage.php
database/create_chat_messag
es_table.php
Chat exemplo:
▷ php artisan make:controller
ChatMessage
○ Esse comando faz com que o
Laravel crie uma nova
controladora que será
responsável por chamar o
evento.
○ O arquivo será criado nos
caminho:
app/Http/Controllers/ChatM
essage.php
Como utilizar o Laravel Echo ?
Iremos então importar a biblioteca do Laravel Echo. Esse import que ficará em nosso app.js se faz necessário pois o Laravel echo foi escrito utilizado Type Script Lang. Criado por: Anders Hejlsberg.
Chat exemplo:
▷ php artisan migrate
○ Esse comando faz com que o
Laravel crie a tabela que
definimos na migração do
CHAT.
▷ De configuração teórica por
enquanto é isso!
Show MeThe Code - Laravel Echo em ação!
Obrigado!Perguntas?
Meus contatos novamente:
@mdba_araujo
michaeldouglas010790@gmail.com