Tecnologia de Programação 2- Seminário
Professor: Cleiton dos Santos Garcia
Alunos: Djiovani Douglas, Luiz Machado e Osmar...
O que é
Scaffolding
vs
Hulk:
• Força bruta!
• Mais código
• Muito rápido
• Difícil de achar
• Ou se tornar
• (ninguém quer ser verde)
Homem de ferro:
• Ferramentas!
• Menos código
• Atalhos, IDEs
• Fácil de disseminar
• (todo mundo quer ser milionário)
Qual é melhor?
+53Armaduras diferentes do Iron Man
http://marvel.wikia.com/wiki/Iron_Man_Armor
Hulkbuster Armor
Como o nome sugere, foi feito
especificamente feita para
batalhar contra o Hulk. […]
Durante seu primeiro...
Use ferramentas de produtividade
• Frameworks, Bibliotecas …
• Snippets, shortcuts, scripts …
• IDEs, livre reload, hot de...
Tempo
gasto
ganha.geek
Tamanho
tarefa
faz
manualmente
fica
puto
roda
script
faz
manualmente
zoa o método complicado
do gee...
Emmet - Ferramenta para desenvolvedores Web
http://emmet.io/
SCAFFOLDING
È um termo […] da engenharia
civil, que denota a colocação de
andaimes e outras estruturas
para suportar tenor...
Scaffolding
• Rails (Ruby)
• Spring Roo (Java)
• Cake (PHP)
• Yeomen (WEB)
Nova paradigma…
…vem com muitas outras ferramentas!
“Git is a fast, scalable, distributed revision control system with an unusually rich command
set that provides both high-l...
“GitHub is a web-based Git repository hosting service”
Open-Source
Social Network
Git Repository
https://github.com/git/gi...
Scaffolding
Tool
“Yeoman is a robust and opinionated set of tools, libraries, and a workflow
that can help developers quickly build beautif...
BUILD
TOLL
“Gulp is a toolkit that helps you automate painful or time-consuming
tasks in your development workflow.”
Open-Source
Auto...
OU
“Grunt: The JavaScript Task Runner”
Open-Source
Automation
https://github.com/gruntjs/grunt
Qual melhor?
1,910,975
Download
ultimo mês
Plugins
disponíveis
Contribuidores
GitHub
Perguntas
Stackoverflow
Benchmarks
1,...
Diferença código
Diferença código
Package
Manager
“Bower package manager for the Web,
created by Twitter”
Open-Source
Package manager
https://github.com/bower/bower
Exemplo código
+4321Geradores registrados, sendo +46 oficias
http://yeoman.io/generators/
https://github.com/yeoman
Geradores oficiais
• generator-angular
• generator-polymer
• generator-bootstrap
• generator-chrome-extension
• (…)
Geradores comunidade
• Javascript: Mean, React, Meteor
• Mobile: Android, iOS, Ionic, Cordova, Xaramin
• Java: Jhipster, S...
Frameworks SPA
O que é SPA
• Single page application
• Menos lado servidor, mais do lado cliente
• Não necessáriamente Parallax ou Infini...
Vantagens
• Melhor experiência usuário
• Performance
• Maior responsabilidade para o lado do cliente
Desvantagens
• Um novo framework
• Javascript desabilitado
• SEO (Search engine optimization)
“Angular is a development platform for building mobile and desktop web applications”
Open-Source
Single Page Application
W...
COMPONENTES DIRETIVAS SERVIÇOSROTEAMENTO
TEMPLATE METADATA DATA BINDING
INJEÇÃO
DEPÊNCIA
PRINCIPAIS BLOCOS
{ }
{ }
{ }
{ }
{ }
Barra de navegação
Barra Lateral
Post
Post
Post
Star Widget
{ }
Node.Js
Java
.NET
Ruby
Python
COMPONENT
SERVICE
BACKEND
“TypeScript is a superset of JavaScript that compiles to clean JavaScript output”
Open-Source
MultiBrowser(Chome,Edge,Fire...
“.NET Core is a blazing fast, lightweight and modular platform for creating
web applications and services that run on Wind...
https://channel9.msdn.com/Events/Build/2016/B891
Android
.NET STANDARD LIBRARY
Uma biblioteca para reger tudo
.NET FRAMEWO...
Exemplo
“Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine”
Open-Source
Roda sem auxilio do navegador
Multipl...
Instalação
npm install -g yo
npm install -g generator-aspnetcore-angular2
npm install -g typescript
Instalação
npm install -g yo
npm install -g generator-aspnetcore-angular2
npm install -g typescript
Instalação
npm install -g yo
npm install -g generator-aspnetcore-angular2
npm install -g typescript
Gerar um novo projeto
yo aspnetcore-angular2
Command-line
cd src/sua-aplicacao
tsc
dotnet restore
dotnet run
Resultado
O que gerou 
Se informe sobre Yomen
http://yeoman.io/
Tecnologia de Programação 2- Seminário
Professor: Cleiton dos Santos Garcia
Alunos: Djiovani Douglas, Luiz Machado e Osmar...
ASP .NET CORE, Angular 2, e Typescript com Scaffolding Yeoman  | Seminário
ASP .NET CORE, Angular 2, e Typescript com Scaffolding Yeoman  | Seminário
ASP .NET CORE, Angular 2, e Typescript com Scaffolding Yeoman  | Seminário
Próximos SlideShares
Carregando em…5
×

ASP .NET CORE, Angular 2, e Typescript com Scaffolding Yeoman | Seminário

63 visualizações

Publicada em

Seminário desenvolvido no quarto semestre do curso de B. Sistemas de Informação, na matéria de Tecnologia de Programação 2 mestrada por Cleiton Garcia

Publicada em: Software
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
63
No SlideShare
0
A partir de incorporações
0
Número de incorporações
1
Ações
Compartilhamentos
0
Downloads
0
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide
  • È mais rápido por usar mais memória, executa as tarfeas em paralelo. Gulp para extrair melhor precisa saber bem sobre API de Stream e Node.JS. Não tem muita vantage trocar, mas se for demora no máximo uma tarde ou um dia mesmo a build ser complexa
  • ASP .NET CORE, Angular 2, e Typescript com Scaffolding Yeoman | Seminário

    1. 1. Tecnologia de Programação 2- Seminário Professor: Cleiton dos Santos Garcia Alunos: Djiovani Douglas, Luiz Machado e Osmar Petry ASP .NET CORE, Angular 2, e TypeScript Scaffolding
    2. 2. O que é Scaffolding
    3. 3. vs
    4. 4. Hulk: • Força bruta! • Mais código • Muito rápido • Difícil de achar • Ou se tornar • (ninguém quer ser verde)
    5. 5. Homem de ferro: • Ferramentas! • Menos código • Atalhos, IDEs • Fácil de disseminar • (todo mundo quer ser milionário)
    6. 6. Qual é melhor?
    7. 7. +53Armaduras diferentes do Iron Man http://marvel.wikia.com/wiki/Iron_Man_Armor
    8. 8. Hulkbuster Armor Como o nome sugere, foi feito especificamente feita para batalhar contra o Hulk. […] Durante seu primeiro uso enagural, ela conseguiu aguentar um combate fisico contra o Hulk
    9. 9. Use ferramentas de produtividade • Frameworks, Bibliotecas … • Snippets, shortcuts, scripts … • IDEs, livre reload, hot deploy … • Geradores de código
    10. 10. Tempo gasto ganha.geek Tamanho tarefa faz manualmente fica puto roda script faz manualmente zoa o método complicado do geek retorno do invstimento escreve script
    11. 11. Emmet - Ferramenta para desenvolvedores Web http://emmet.io/
    12. 12. SCAFFOLDING È um termo […] da engenharia civil, que denota a colocação de andaimes e outras estruturas para suportar tenoriamente trabalhadores e/ou maquinário enquanto a construção definitive não está pronta […]
    13. 13. Scaffolding • Rails (Ruby) • Spring Roo (Java) • Cake (PHP) • Yeomen (WEB)
    14. 14. Nova paradigma…
    15. 15. …vem com muitas outras ferramentas!
    16. 16. “Git is a fast, scalable, distributed revision control system with an unusually rich command set that provides both high-level operations and full access to internals.” Open-Source Version Controll Multiplataforma (Linux, Windows,Mac, [...]) https://github.com/git/git
    17. 17. “GitHub is a web-based Git repository hosting service” Open-Source Social Network Git Repository https://github.com/git/git.github.io
    18. 18. Scaffolding Tool
    19. 19. “Yeoman is a robust and opinionated set of tools, libraries, and a workflow that can help developers quickly build beautiful, compelling web apps.” Open-Source Scaffolding Web Components https://github.com/yeoman/yeoman
    20. 20. BUILD TOLL
    21. 21. “Gulp is a toolkit that helps you automate painful or time-consuming tasks in your development workflow.” Open-Source Automation https://github.com/gulpjs/gulp
    22. 22. OU
    23. 23. “Grunt: The JavaScript Task Runner” Open-Source Automation https://github.com/gruntjs/grunt
    24. 24. Qual melhor? 1,910,975 Download ultimo mês Plugins disponíveis Contribuidores GitHub Perguntas Stackoverflow Benchmarks 1,910,975 5,915 64 22,945 930ms 2,437,448 2,656 174 23,052 493ms
    25. 25. Diferença código
    26. 26. Diferença código
    27. 27. Package Manager
    28. 28. “Bower package manager for the Web, created by Twitter” Open-Source Package manager https://github.com/bower/bower
    29. 29. Exemplo código
    30. 30. +4321Geradores registrados, sendo +46 oficias http://yeoman.io/generators/ https://github.com/yeoman
    31. 31. Geradores oficiais • generator-angular • generator-polymer • generator-bootstrap • generator-chrome-extension • (…)
    32. 32. Geradores comunidade • Javascript: Mean, React, Meteor • Mobile: Android, iOS, Ionic, Cordova, Xaramin • Java: Jhipster, Spring, JAX-RS • .NET: Aspnetmvc, Aspnetcore, • (…)
    33. 33. Frameworks SPA
    34. 34. O que é SPA • Single page application • Menos lado servidor, mais do lado cliente • Não necessáriamente Parallax ou Infinite Scroll
    35. 35. Vantagens • Melhor experiência usuário • Performance • Maior responsabilidade para o lado do cliente
    36. 36. Desvantagens • Um novo framework • Javascript desabilitado • SEO (Search engine optimization)
    37. 37. “Angular is a development platform for building mobile and desktop web applications” Open-Source Single Page Application Web Components https://github.com/angular/angular
    38. 38. COMPONENTES DIRETIVAS SERVIÇOSROTEAMENTO TEMPLATE METADATA DATA BINDING INJEÇÃO DEPÊNCIA PRINCIPAIS BLOCOS
    39. 39. { } { } { } { } { } Barra de navegação Barra Lateral Post Post Post Star Widget
    40. 40. { } Node.Js Java .NET Ruby Python COMPONENT SERVICE BACKEND
    41. 41. “TypeScript is a superset of JavaScript that compiles to clean JavaScript output” Open-Source MultiBrowser(Chome,Edge,Firefox, [...]) Multiplataforma (Linux, Windows,Mac, [...]) https://github.com/Microsoft/TypeScript
    42. 42. “.NET Core is a blazing fast, lightweight and modular platform for creating web applications and services that run on Windows, Linux and Mac” Open-Source Multiplataforma (Linux, Windows,Mac,[...]) Ambiente .NET https://github.com/dotnet/core .NET Core
    43. 43. https://channel9.msdn.com/Events/Build/2016/B891 Android .NET STANDARD LIBRARY Uma biblioteca para reger tudo .NET FRAMEWORK WPF Windows Forms ASP.NET .NET CORE UWP ASP.NET CORE XARAMIN iOS OS X Android
    44. 44. Exemplo
    45. 45. “Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine” Open-Source Roda sem auxilio do navegador Multiplataforma (Linux, Windows,Mac,[...]) https://github.com/nodejs/node-v0.x-archive
    46. 46. Instalação npm install -g yo npm install -g generator-aspnetcore-angular2 npm install -g typescript
    47. 47. Instalação npm install -g yo npm install -g generator-aspnetcore-angular2 npm install -g typescript
    48. 48. Instalação npm install -g yo npm install -g generator-aspnetcore-angular2 npm install -g typescript
    49. 49. Gerar um novo projeto yo aspnetcore-angular2
    50. 50. Command-line cd src/sua-aplicacao tsc dotnet restore dotnet run
    51. 51. Resultado
    52. 52. O que gerou 
    53. 53. Se informe sobre Yomen http://yeoman.io/
    54. 54. Tecnologia de Programação 2- Seminário Professor: Cleiton dos Santos Garcia Alunos: Djiovani Douglas, Luiz Machado e Osmar Petry ASP .NET CORE, Angular 2, e TypeScript Scaffolding

    ×