SlideShare a Scribd company logo
SPA's com
+
by José Barbosa | @kidchenko
Single
Page
Application
“…In an SPA, either all necessary code –
HTML, JavaScript, and CSS – is retrieved with
a single page load, or the appropriate
resources are dynamically loaded and added
to the page as necessary, usually in response
to user actions. The page does not reload at
any point in the process…”
SPA é uma
“aplicação de
uma única
página”!?
Spa's com Reactjs e Asp Net Core
https://dayssincelastjavascriptframework.com/
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Software Engineer;
Agilista;
Empreendedor digital;
Apaixonado por JS;
Ex-Lambda3
@kidchenko
github.com/kidchenko
Acompanhe
o podcast da
Lambda3:
http://blog.lambda3.com.br/category/p
odcast
Spa's com Reactjs e Asp Net Core
SPA's com
+
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Nops!
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Entendendo
o Reactjs
Componentes
Spa's com Reactjs e Asp Net Core
<!DOCTYPE html>
<html>
<head>
<script src="https://fb.me/react-15.1.0.min.js"></script>
<script src="https://fb.me/react-dom-15.1.0.min.js"></script>
</head>
<body>
<script>
ReactDOM.render(React.createElement(
'div', null, 'Hi React!'), document.body);
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script src="https://fb.me/react-15.1.0.min.js"></script>
<script src="https://fb.me/react-dom-15.1.0.min.js"></script>
</head>
<body>
<script>
ReactDOM.render(React.createElement(
'div', null, 'Hi React!'), document.body);
</script>
</body>
</html>
Spa's com Reactjs e Asp Net Core
<script type="text/jsx">
var Hi = React.createClass({
render: function() {
return (<div>
<h1>Hi from react and jsx :)</h1>
<p>This is some text</p>
</div>)
}
});
ReactDOM.render(<Hi />,
document.getElementById('container'));
</script>
<script type="text/jsx">
var Hi = React.createClass({
render: function() {
return (<div>
<h1>Hi from react and jsx :)</h1>
<p>This is some text</p>
</div>)
}
});
ReactDOM.render(<Hi />,
document.getElementById('container'));
</script>
Virtual
DOM
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Composição
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Entendendo o
ASP .NET Core
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Controllers
Spa's com Reactjs e Asp Net Core
Spa's com Reactjs e Asp Net Core
Por quê Reactjs é
útil para o ASP
.Net Core?
Spa's com Reactjs e Asp Net Core
OBRIGADO!
Dúvidas?
@kidchenko
github.com/kidchenko

More Related Content

PPTX
Building SPA’s using ReactJS and ASP NET Core
PDF
Surviving the Zombie Apocalypse of Connected devices - Jfokus 2013
DOC
Adetunji's resume
PPTX
Creating Responsive Website Using Bootstrap
PDF
Modern Static Site with GatsbyJS
PPTX
Google Wants To Help You Succeed
PDF
xAPI Live - The Statue of Authoriing Tools
PDF
Migration Best Practices - Search Y 2019, Paris
Building SPA’s using ReactJS and ASP NET Core
Surviving the Zombie Apocalypse of Connected devices - Jfokus 2013
Adetunji's resume
Creating Responsive Website Using Bootstrap
Modern Static Site with GatsbyJS
Google Wants To Help You Succeed
xAPI Live - The Statue of Authoriing Tools
Migration Best Practices - Search Y 2019, Paris

What's hot (18)

PPTX
WCCBUS 2015 - Content Architecture in WordPress
PPTX
Sean Putman - eLearning State of the State #xapicamp
PDF
WillsResume
PPTX
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
PPTX
Migration Best Practices - Peak Ace on Air
PPTX
The Rise of JavaScript and What it Means for SEO
PDF
Backend & Frontend architecture scalability & websockets
PDF
Gaca-Tworek: JavaScript analysis is extremely important and anyone can do it!...
PDF
Advanced data-driven technical SEO - SMX London 2019
PDF
How Googlebot Renders (Roleplaying as Google's Web Rendering Service-- D&D st...
PPTX
Content Architecture in WordPress
PPTX
Latest Javascript MVC & Front End Frameworks 2017
PDF
Search Engines and Flash: Secrets, Tricks, and Black Magic
PDF
Migration Best Practices - SMX West 2019
PPTX
Three site speed optimisation tips to make your website REALLY fast - Brighto...
PDF
HTML Hypermedia APIs and Adaptive Web Design - RuPy
PDF
OK Google, Whats next? - OMT Wiesbaden 2018
PPTX
Introduction to Progressive Web Applications
WCCBUS 2015 - Content Architecture in WordPress
Sean Putman - eLearning State of the State #xapicamp
WillsResume
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Migration Best Practices - Peak Ace on Air
The Rise of JavaScript and What it Means for SEO
Backend & Frontend architecture scalability & websockets
Gaca-Tworek: JavaScript analysis is extremely important and anyone can do it!...
Advanced data-driven technical SEO - SMX London 2019
How Googlebot Renders (Roleplaying as Google's Web Rendering Service-- D&D st...
Content Architecture in WordPress
Latest Javascript MVC & Front End Frameworks 2017
Search Engines and Flash: Secrets, Tricks, and Black Magic
Migration Best Practices - SMX West 2019
Three site speed optimisation tips to make your website REALLY fast - Brighto...
HTML Hypermedia APIs and Adaptive Web Design - RuPy
OK Google, Whats next? - OMT Wiesbaden 2018
Introduction to Progressive Web Applications
Ad

Similar to Spa's com Reactjs e Asp Net Core (20)

PDF
HTML Hypermedia APIs and Adaptive Web Design - Nordic APIs
PDF
AFUP Lorraine - Symfony Webpack Encore
PPTX
Chanhao Jiang And David Wei Presentation Quickling Pagecache
PPTX
Extending & Scaling | Dallas PHP
PPT
High performance java script why everything youve been taught is wrong
PPTX
Google I/O 2012 - Protecting your user experience while integrating 3rd party...
PDF
Progressive web apps
PDF
Death of a Themer
DOCX
“Good design is obvious. Great design is transparent.” — How we use Bootstrap...
PDF
CCSP 2012F 早點下班的工具
PDF
WordPress: React Way
PDF
Always on! Or not?
PPTX
JS Fest 2019/Autumn. Александр Товмач. JAMstack
PPTX
Front end performance optimization
PPTX
JavaScript - Getting Started.pptx
PPTX
Enough with the JavaScript already!
PPT
Os Smarr
PPT
Smarr Oscon 2007
PPTX
Enough with the javas cript already! de Nicholas Zakas
PDF
Parse Apps with Ember.js
HTML Hypermedia APIs and Adaptive Web Design - Nordic APIs
AFUP Lorraine - Symfony Webpack Encore
Chanhao Jiang And David Wei Presentation Quickling Pagecache
Extending & Scaling | Dallas PHP
High performance java script why everything youve been taught is wrong
Google I/O 2012 - Protecting your user experience while integrating 3rd party...
Progressive web apps
Death of a Themer
“Good design is obvious. Great design is transparent.” — How we use Bootstrap...
CCSP 2012F 早點下班的工具
WordPress: React Way
Always on! Or not?
JS Fest 2019/Autumn. Александр Товмач. JAMstack
Front end performance optimization
JavaScript - Getting Started.pptx
Enough with the JavaScript already!
Os Smarr
Smarr Oscon 2007
Enough with the javas cript already! de Nicholas Zakas
Parse Apps with Ember.js
Ad

More from José Barbosa (10)

PPTX
React e reactividade Meetup Facebook Developer Circles
PPTX
Relatos de uma empresa ágil
PPTX
Vuejs Angularjs e Reactjs. Veja as diferenças de cada framework!
PPTX
Angular 1.5 Components
PPTX
.ASP NET CORE ON DOCKER
PPTX
Por que api’s
PDF
Por que api’s?
PPTX
Monitoramento de containers Docker
PPTX
Vá além com cortana e windows 10
PPTX
DevopsSummitBrasil - Azure Machine Learning
React e reactividade Meetup Facebook Developer Circles
Relatos de uma empresa ágil
Vuejs Angularjs e Reactjs. Veja as diferenças de cada framework!
Angular 1.5 Components
.ASP NET CORE ON DOCKER
Por que api’s
Por que api’s?
Monitoramento de containers Docker
Vá além com cortana e windows 10
DevopsSummitBrasil - Azure Machine Learning

Recently uploaded (20)

PDF
Why TechBuilder is the Future of Pickup and Delivery App Development (1).pdf
PPTX
Agentic AI Use Case- Contract Lifecycle Management (CLM).pptx
PDF
Odoo Companies in India – Driving Business Transformation.pdf
PPTX
Operating system designcfffgfgggggggvggggggggg
PDF
PTS Company Brochure 2025 (1).pdf.......
PDF
Design an Analysis of Algorithms I-SECS-1021-03
PPTX
Essential Infomation Tech presentation.pptx
PPTX
Introduction to Artificial Intelligence
PDF
Upgrade and Innovation Strategies for SAP ERP Customers
PDF
Adobe Illustrator 28.6 Crack My Vision of Vector Design
PPTX
Oracle E-Business Suite: A Comprehensive Guide for Modern Enterprises
PDF
Wondershare Filmora 15 Crack With Activation Key [2025
PPTX
Reimagine Home Health with the Power of Agentic AI​
PDF
Design an Analysis of Algorithms II-SECS-1021-03
PPTX
CHAPTER 2 - PM Management and IT Context
PPTX
Odoo POS Development Services by CandidRoot Solutions
PDF
System and Network Administration Chapter 2
PDF
How to Migrate SBCGlobal Email to Yahoo Easily
PDF
Raksha Bandhan Grocery Pricing Trends in India 2025.pdf
PPTX
ai tools demonstartion for schools and inter college
Why TechBuilder is the Future of Pickup and Delivery App Development (1).pdf
Agentic AI Use Case- Contract Lifecycle Management (CLM).pptx
Odoo Companies in India – Driving Business Transformation.pdf
Operating system designcfffgfgggggggvggggggggg
PTS Company Brochure 2025 (1).pdf.......
Design an Analysis of Algorithms I-SECS-1021-03
Essential Infomation Tech presentation.pptx
Introduction to Artificial Intelligence
Upgrade and Innovation Strategies for SAP ERP Customers
Adobe Illustrator 28.6 Crack My Vision of Vector Design
Oracle E-Business Suite: A Comprehensive Guide for Modern Enterprises
Wondershare Filmora 15 Crack With Activation Key [2025
Reimagine Home Health with the Power of Agentic AI​
Design an Analysis of Algorithms II-SECS-1021-03
CHAPTER 2 - PM Management and IT Context
Odoo POS Development Services by CandidRoot Solutions
System and Network Administration Chapter 2
How to Migrate SBCGlobal Email to Yahoo Easily
Raksha Bandhan Grocery Pricing Trends in India 2025.pdf
ai tools demonstartion for schools and inter college

Spa's com Reactjs e Asp Net Core

Editor's Notes

  • #5: SPA’s não são apenas “carregar todas as páginas”
  • #8: SPAs não são nada novo! Apenas react é uma nova ferramenta para SPA