SlideShare une entreprise Scribd logo
1  sur  38
.NET Conf
2018
Blazor –
Utilizando C#
no Browser
Gustavo Bigardi
Desenvolvedor
.NET
Java, GoLang, JS
https://about.me/gbb
igardi/
Blazor?
?
Mais um...............
Blazor
 Blazor é um framework Web baseado nas
tecnologias Web já existentes como HTML e CSS,
mas utiliza C# e a sintaxe do Razor, ao invés de
apenas Javascript
 Blazor: Browser + Razor
Blazor
 O Blazor é executado no browser através da
tecnologia WebAssembly, o que é um de seus
maiores diferenciais!
AVISO!
Experimental!
 O Blazor ainda é um projeto em fase experimental, ou
seja, não possui suporte ou mesmo garantia de
continuidade pela Microsoft.
 O projeto é open-source, disponível no GitHub. Quanto
mais participação houver, maiores as chances de se
tornar um projeto oficial.
WebAssembly?
?
WebAssembly
 Para quem não conhece o WebAssembly, é uma nova
tecnologia que tem indícios de ser o futuro da web.
 É como se o Browser funcionasse como uma máquina
virtual, como o .NET ou JVM, que executa de forma nativa
um código binário (WASM), que é quase tão rápido como
código nativo e com performance superior ao JavaScript.
WebAssembly
 Encontra-se sob responsabilidade do W3C e já é suportado
pela maioria dos browsers modernos.
 É possível executar aplicações com OpenGL, Banco de dados,
além dos recursos já existentes como acesso a câmera,
microfone, localização, etc.
 A engine Unreal 4 já foi portada para WebAssembly, assim
como o .NET Core está passando por essa portabilidade.
Por que usar .NET no browser?
Javascript...
C#
everywhere!
Arquitetura
do Blazor
Pontos positivos
Utiliza WebAssembly
Todas as features de um SPA
comum
Permite reaproveitar todo
conhecimento de backend em
C# e Views em Razor
Curva de aprendizado para
times que desejam entregar
aplicações SPA baseadas em
uma arquitetura REST
Server-side Rendering. (SEO!!!)
É .NET, um mesmo Stack para
toda a aplicação
Pontos negativos
Ainda é novo, experimental.
Mesmo fazendo parte
oficialmente
do stack do ASP.NET, ainda não
temos certeza de seu futuro
Por ser baseado em .NET, para
desenvolvedores JS / TS,
apresenta uma curva de
aprendizado maior, o que pode
diminuir a aderência ao seu uso,
pelo menos no início
Ainda não temos kits de
componente prontos como
temos para
o Angular e React, já
consolidados no mercado
Sua arquitetura ainda depende
do JS para acesso ao DOM, o
que acaba tornando o Blazor
ainda mais lento que o JS, pelo
menos na versão atual
Por ser experimental, ainda não
contamos com documentação
e suporte da comunidade 100%,
assim como tooling nas
ferramentas Visual Studio e Visual
Studio Code
DEMO
DEMO
• Visual Studio 2017 – 15.8.0 (!!!)
• ASP.NET / .NET Core 2.1.400 (Apenas com o VS 15.8.0), mas
pode ser utilizada a versão 2.1.300 ou superior
• Plugin VS – ASP.NET Core Blazor Language Services
• SQL Server - Azure
DEMO
https://github.com/gustavobigardi/demo-blazor-coding-night
Documentação Oficial
https://blazor.net/docs/index.html
Repositório Oficial
https://github.com/aspnet/Blazor
Live no canal Coding Night
https://goo.gl/Cd4zYL
Gustavo Bigardi
Desenvolvedor
.NET
Java, GoLang, JS
https://about.me/gbb
igardi/
Dúvidas?
Obrigado!

Contenu connexe

Tendances

Tendances (20)

Você não precisa de uma sopa de letrinhas para criar web apps
Você não precisa de uma sopa de letrinhas para criar web appsVocê não precisa de uma sopa de letrinhas para criar web apps
Você não precisa de uma sopa de letrinhas para criar web apps
 
TDC2018SP | Trilha .Net - Crie SPAs com Razor e C# usando Blazor em .Net Core
TDC2018SP | Trilha .Net - Crie SPAs com Razor e C# usando Blazor  em .Net CoreTDC2018SP | Trilha .Net - Crie SPAs com Razor e C# usando Blazor  em .Net Core
TDC2018SP | Trilha .Net - Crie SPAs com Razor e C# usando Blazor em .Net Core
 
SPA com CSharp
SPA com CSharpSPA com CSharp
SPA com CSharp
 
Arquitetura de Microserviços - Stone Tech Saturday - Março/2017
Arquitetura de Microserviços - Stone Tech Saturday - Março/2017Arquitetura de Microserviços - Stone Tech Saturday - Março/2017
Arquitetura de Microserviços - Stone Tech Saturday - Março/2017
 
Blazor, web assembly e o futuro do browser
Blazor, web assembly e o futuro do browserBlazor, web assembly e o futuro do browser
Blazor, web assembly e o futuro do browser
 
Por que Node JS?
Por que Node JS?Por que Node JS?
Por que Node JS?
 
ASP.NET Core e Linux: Explorando novas fronteiras - OneDay - Junho/2017
ASP.NET Core e Linux: Explorando novas fronteiras - OneDay - Junho/2017ASP.NET Core e Linux: Explorando novas fronteiras - OneDay - Junho/2017
ASP.NET Core e Linux: Explorando novas fronteiras - OneDay - Junho/2017
 
WordCamp Rio de Janeiro 2016 - Vinícius Lourenço | Lojas Virtuais Descomplica...
WordCamp Rio de Janeiro 2016 - Vinícius Lourenço | Lojas Virtuais Descomplica...WordCamp Rio de Janeiro 2016 - Vinícius Lourenço | Lojas Virtuais Descomplica...
WordCamp Rio de Janeiro 2016 - Vinícius Lourenço | Lojas Virtuais Descomplica...
 
O novo ASP.NET - GDG-SP - Outubro/2016
O novo ASP.NET - GDG-SP - Outubro/2016O novo ASP.NET - GDG-SP - Outubro/2016
O novo ASP.NET - GDG-SP - Outubro/2016
 
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
 
Construindo um Servidor Web com GO
Construindo um Servidor Web com GOConstruindo um Servidor Web com GO
Construindo um Servidor Web com GO
 
ASP.NET MVC Core
ASP.NET MVC CoreASP.NET MVC Core
ASP.NET MVC Core
 
Curso de ReactJS
Curso de ReactJSCurso de ReactJS
Curso de ReactJS
 
Palestra WordCamp RJ 2016 Configure um servidor Nginx de alta performance par...
Palestra WordCamp RJ 2016 Configure um servidor Nginx de alta performance par...Palestra WordCamp RJ 2016 Configure um servidor Nginx de alta performance par...
Palestra WordCamp RJ 2016 Configure um servidor Nginx de alta performance par...
 
ASP.NET Core - iMasters - Março/2016
ASP.NET Core - iMasters - Março/2016ASP.NET Core - iMasters - Março/2016
ASP.NET Core - iMasters - Março/2016
 
Novidades do Visual Studio 2017 - .NET São Paulo - Maio/2017
Novidades do Visual Studio 2017 - .NET São Paulo - Maio/2017Novidades do Visual Studio 2017 - .NET São Paulo - Maio/2017
Novidades do Visual Studio 2017 - .NET São Paulo - Maio/2017
 
Quercus - Running PHP over Java
Quercus - Running PHP over Java Quercus - Running PHP over Java
Quercus - Running PHP over Java
 
Desenvolvimento Mobile Web e o PHP
Desenvolvimento Mobile Web e o PHPDesenvolvimento Mobile Web e o PHP
Desenvolvimento Mobile Web e o PHP
 
Guia prático de desenvolvimento front-end para django devs
Guia prático de desenvolvimento front-end para django devsGuia prático de desenvolvimento front-end para django devs
Guia prático de desenvolvimento front-end para django devs
 
Desenvolvendo para WordPress com Docker, Git e WP-CLI
Desenvolvendo para WordPress com Docker, Git e WP-CLIDesenvolvendo para WordPress com Docker, Git e WP-CLI
Desenvolvendo para WordPress com Docker, Git e WP-CLI
 

Similaire à .NET Conf 2018 - Campinas - Blazor: Utilizando C# em browsers

Similaire à .NET Conf 2018 - Campinas - Blazor: Utilizando C# em browsers (20)

MSP Tech Days Online 2018 - SPA além do JavaScript com Blazor
MSP Tech Days Online 2018 - SPA além do JavaScript com BlazorMSP Tech Days Online 2018 - SPA além do JavaScript com Blazor
MSP Tech Days Online 2018 - SPA além do JavaScript com Blazor
 
Fullstack C# com Blazor
Fullstack C# com BlazorFullstack C# com Blazor
Fullstack C# com Blazor
 
ASP.NET MVC para desenvolvedores Web Forms (TechEd)
ASP.NET MVC para desenvolvedores Web Forms (TechEd)ASP.NET MVC para desenvolvedores Web Forms (TechEd)
ASP.NET MVC para desenvolvedores Web Forms (TechEd)
 
Desenvolvimento web - conceitos, tecnologia e tendências.
Desenvolvimento web - conceitos, tecnologia e tendências.Desenvolvimento web - conceitos, tecnologia e tendências.
Desenvolvimento web - conceitos, tecnologia e tendências.
 
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
 
ASP.NET e Visual Studio 2010
ASP.NET e Visual Studio 2010ASP.NET e Visual Studio 2010
ASP.NET e Visual Studio 2010
 
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
 
Angular, React ou Vue? Comparando os favoritos do JS reativo
Angular, React ou Vue? Comparando os favoritos do JS reativoAngular, React ou Vue? Comparando os favoritos do JS reativo
Angular, React ou Vue? Comparando os favoritos do JS reativo
 
Iniciação JSP!
Iniciação JSP!Iniciação JSP!
Iniciação JSP!
 
Grails, o que isso quer dizer?
Grails, o que isso quer dizer?Grails, o que isso quer dizer?
Grails, o que isso quer dizer?
 
ASP.NET Core, .NET Core e EF Core: multiplataforma e otimizados para a nuvem
ASP.NET Core, .NET Core e EF Core: multiplataforma e otimizados para a nuvemASP.NET Core, .NET Core e EF Core: multiplataforma e otimizados para a nuvem
ASP.NET Core, .NET Core e EF Core: multiplataforma e otimizados para a nuvem
 
Javascript levado a serio
Javascript levado a serioJavascript levado a serio
Javascript levado a serio
 
Conheça o ASP.NET MVC 3
Conheça o ASP.NET MVC 3Conheça o ASP.NET MVC 3
Conheça o ASP.NET MVC 3
 
Hangout Tempo Real Eventos - Nodejs - Os Primeiros Passos
Hangout  Tempo Real Eventos - Nodejs - Os Primeiros PassosHangout  Tempo Real Eventos - Nodejs - Os Primeiros Passos
Hangout Tempo Real Eventos - Nodejs - Os Primeiros Passos
 
ASP.NET Core e Linux: Explorando novas fronteiras - Araras Dev - Julho/2017
ASP.NET Core e Linux: Explorando novas fronteiras - Araras Dev - Julho/2017ASP.NET Core e Linux: Explorando novas fronteiras - Araras Dev - Julho/2017
ASP.NET Core e Linux: Explorando novas fronteiras - Araras Dev - Julho/2017
 
Microsoft Edge (Teched 2015)
Microsoft Edge (Teched 2015)Microsoft Edge (Teched 2015)
Microsoft Edge (Teched 2015)
 
Java Web Fácil com VRaptor
Java Web Fácil com VRaptorJava Web Fácil com VRaptor
Java Web Fácil com VRaptor
 
.NET Open Source 2009
.NET Open Source 2009.NET Open Source 2009
.NET Open Source 2009
 
ASP.NET Core e Linux - ASP.NET Core Day - Maio/2017
ASP.NET Core e Linux - ASP.NET Core Day - Maio/2017ASP.NET Core e Linux - ASP.NET Core Day - Maio/2017
ASP.NET Core e Linux - ASP.NET Core Day - Maio/2017
 
ASP .NET MVC - Você esta pronto para a pílula vermelha?
ASP .NET MVC - Você esta pronto para a pílula vermelha?ASP .NET MVC - Você esta pronto para a pílula vermelha?
ASP .NET MVC - Você esta pronto para a pílula vermelha?
 

Plus de Gustavo Bellini Bigardi

Plus de Gustavo Bellini Bigardi (20)

Canal DotNet - Design Patterns - Mediator
Canal DotNet - Design Patterns - MediatorCanal DotNet - Design Patterns - Mediator
Canal DotNet - Design Patterns - Mediator
 
Aplicações Distribuídas com .NET e Apache Kafka
Aplicações Distribuídas com .NET e Apache KafkaAplicações Distribuídas com .NET e Apache Kafka
Aplicações Distribuídas com .NET e Apache Kafka
 
Azure Labs - Publicando APIs no Azure
Azure Labs - Publicando APIs no AzureAzure Labs - Publicando APIs no Azure
Azure Labs - Publicando APIs no Azure
 
MVP Week 2020 - Aplicações Modernas com Blazor WASM
MVP Week 2020 - Aplicações Modernas com Blazor WASMMVP Week 2020 - Aplicações Modernas com Blazor WASM
MVP Week 2020 - Aplicações Modernas com Blazor WASM
 
Codificando Night Week - Blazor, tornando o fullstack C# possível!
Codificando Night Week - Blazor, tornando o fullstack C# possível!Codificando Night Week - Blazor, tornando o fullstack C# possível!
Codificando Night Week - Blazor, tornando o fullstack C# possível!
 
Ignite The Tour 2019 - Sao Paulo - Blazor, AI & Blockchain
Ignite The Tour 2019 - Sao Paulo - Blazor, AI & BlockchainIgnite The Tour 2019 - Sao Paulo - Blazor, AI & Blockchain
Ignite The Tour 2019 - Sao Paulo - Blazor, AI & Blockchain
 
DevPira2019 - Blazor
DevPira2019 - BlazorDevPira2019 - Blazor
DevPira2019 - Blazor
 
Dev week2019 blazor
Dev week2019 blazorDev week2019 blazor
Dev week2019 blazor
 
Microsservicos serverles combinacao perfeita
Microsservicos serverles combinacao perfeitaMicrosservicos serverles combinacao perfeita
Microsservicos serverles combinacao perfeita
 
Microsservicos com node js + azure functions + azure service bus
Microsservicos com node js + azure functions + azure service busMicrosservicos com node js + azure functions + azure service bus
Microsservicos com node js + azure functions + azure service bus
 
Microsserviços com Serverles e Azure Functions
Microsserviços com Serverles e Azure FunctionsMicrosserviços com Serverles e Azure Functions
Microsserviços com Serverles e Azure Functions
 
Blazor and azure functions for serverless websites
Blazor and azure functions for serverless websitesBlazor and azure functions for serverless websites
Blazor and azure functions for serverless websites
 
Implementando rapidamente web apps com blazor e serverless
Implementando rapidamente web apps com blazor e serverlessImplementando rapidamente web apps com blazor e serverless
Implementando rapidamente web apps com blazor e serverless
 
Distribuindo seu app Blazor no Azure com Storage + CDN
Distribuindo seu app Blazor no Azure com Storage + CDNDistribuindo seu app Blazor no Azure com Storage + CDN
Distribuindo seu app Blazor no Azure com Storage + CDN
 
Esqueca o ETL! Estraindo métricas com CosmosDB e Serverless
Esqueca o ETL! Estraindo métricas com CosmosDB e ServerlessEsqueca o ETL! Estraindo métricas com CosmosDB e Serverless
Esqueca o ETL! Estraindo métricas com CosmosDB e Serverless
 
Serverless com azure functions e node js
Serverless com azure functions e node jsServerless com azure functions e node js
Serverless com azure functions e node js
 
CapiConf Online - Utilizando reconhecimento facial para segurança em aplicações
CapiConf Online - Utilizando reconhecimento facial para segurança em aplicaçõesCapiConf Online - Utilizando reconhecimento facial para segurança em aplicações
CapiConf Online - Utilizando reconhecimento facial para segurança em aplicações
 
Meetup - FC Nuvem - Serviços Cognitivos
Meetup - FC Nuvem - Serviços CognitivosMeetup - FC Nuvem - Serviços Cognitivos
Meetup - FC Nuvem - Serviços Cognitivos
 
7Masters - PWA - Publishing using Universal Windows Apps
7Masters - PWA - Publishing using Universal Windows Apps7Masters - PWA - Publishing using Universal Windows Apps
7Masters - PWA - Publishing using Universal Windows Apps
 
Azure Conference 2018 - Face Service para gestão de qualidade em Callcenters
Azure Conference 2018 - Face Service para gestão de qualidade em CallcentersAzure Conference 2018 - Face Service para gestão de qualidade em Callcenters
Azure Conference 2018 - Face Service para gestão de qualidade em Callcenters
 

Dernier

Dernier (8)

ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docxATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
 
Boas práticas de programação com Object Calisthenics
Boas práticas de programação com Object CalisthenicsBoas práticas de programação com Object Calisthenics
Boas práticas de programação com Object Calisthenics
 
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docxATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
 
Luís Kitota AWS Discovery Day Ka Solution.pdf
Luís Kitota AWS Discovery Day Ka Solution.pdfLuís Kitota AWS Discovery Day Ka Solution.pdf
Luís Kitota AWS Discovery Day Ka Solution.pdf
 
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docxATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
 
Padrões de Projeto: Proxy e Command com exemplo
Padrões de Projeto: Proxy e Command com exemploPadrões de Projeto: Proxy e Command com exemplo
Padrões de Projeto: Proxy e Command com exemplo
 
ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docxATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx
 
Programação Orientada a Objetos - 4 Pilares.pdf
Programação Orientada a Objetos - 4 Pilares.pdfProgramação Orientada a Objetos - 4 Pilares.pdf
Programação Orientada a Objetos - 4 Pilares.pdf
 

.NET Conf 2018 - Campinas - Blazor: Utilizando C# em browsers