advertisement

Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio/ASSESC

0 %
100 %
advertisement
Information about Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS -...
Technology

Published on February 28, 2014

Author: rodrigobranas

Source: slideshare.net

Description

Link para o código do hands-on:

http://www.agilecode.com.br/angularjs/minicurso_rodrigobranas.zip
advertisement

Rodrigo Branas – @rodrigobranas - http://www.agilecode.com.br Desenvolvimento de aplicações web com AngularJS

Organização Realização Apoio

           JavaScript e AngularJS Clean Code com TDD e Refactoring Academia Programador Academia Java Academia WEB Academia Enterprise Academia Arquiteto Linux Asterisk OpenSIPS Oficiais Furukawa www.voffice.com.br treinamento@voffice.com.br

“Transformar equipes de desenvolvimento de software” http://www.agilecode.com.br

Rodrigo Branas rodrigo.branas@agilecode.com.br http://www.agilecode.com.br • • • • Desenvolvendo Software na Gennera Criando treinamentos na Agile Code Escrevendo na Java Magazine e PacktPub Palestrando sobre desenvolvimento de software em eventos, universidades e empresas

Formação Acadêmica Ciências da Computação – UFSC Gerenciamento de Projetos - FGV Certificações SCJA, SCJP, SCJD, SCWCD, SCBCD, PMP, MCP e CSM Experiência Há mais de 12 anos desenvolvendo software na plataforma Java com as empresas: EDS, HP, NET, Citibank, GM, Dígitro, Softplan, OnCast, Senai, VALE, RBS, Unimed, Globalcode, V.Office, Suntech, WPlex e Gennera.

• • • • • • • • • Há mais de 5 anos liderando pessoas. Mais de 2000 horas em sala de aula. Mais de 100 apresentações em eventos. 6 artigos escritos para revistas. 1 livro. Mais de 500 profissionais treinados. Criação de 22 palestras. Criação de 10 treinamentos. Criação de mais de 3.000 slides.

Insatisfação com a falta de produtividade!

O que leva uma tecnologia a ser improdutiva?

Build muito lento

Tecnologia muito complexa

Aprendizado muito difícil

Mistura de conceitos Onde devo programar cada parte da aplicação?

Como surgiu a web?

Tim Berners-Lee Criador da Web

Em 1990, nos laboratórios do CERN e utilizando um computador NeXTcube, Berners-Lee construiu o primeiro servidor, o primeiro navegador e as primeiras páginas que descreviam seu próprio projeto, chamado WorldWideWeb. (CERN)

Em 1990, nos laboratórios do CERN e utilizando um computador NeXTcube, Berners-Lee construiu o primeiro servidor, o primeiro navegador e as primeiras páginas que descreviam seu próprio projeto, chamado WorldWideWeb. (CERN)

Em 1990, nos laboratórios do CERN e utilizando um computador NeXTcube, Berners-Lee construiu o primeiro servidor, o primeiro navegador e as primeiras páginas que descreviam seu próprio projeto, chamado WorldWideWeb. (CERN)

Em 1990, nos laboratórios do CERN e utilizando um computador NeXTcube, Berners-Lee construiu o primeiro servidor, o primeiro navegador e as primeiras páginas que descreviam seu próprio projeto, chamado WorldWideWeb. (CERN)

Primeiro website da história!

No princípio era tudo estático

Como fazer para torná-la mais dinâmica?

Vamos gerar o código HTML no lado servidor

CGI Common Gateway Interface

Bem vindos a Web 1.0

Geração de conteúdo HTML no servidor e pouca interação

Como fazer para torná-la mais interativa?

JavaScript Entrando na era da alta interatividade

Bem vindos a Web 2.0

Quando pensamos em JavaScript, qual é a primeira coisa que surge?

O Ministério da Saúde adverte: O uso excessivo de JavaScript pode levar o projeto ao caos!

Parece que vai ser necessário começar a organizar o negócio...

Finalmente, chegamos...

Criado por Misko Havery e Adams Abrons em 2009

Atualmente, o AngularJS é mantido pela equipe do Google

Totalmente escrito em JavaScript

Isso quer dizer que toda a aplicação roda browser do cliente?

Vai funcionar em todos os browsers?

Como fica a performance?

E a segurança do código?

O AngularJS tem como objetivo estender a linguagem HTML

• Água • Coca-Cola • Cerveja

1. <ul> 2. <li>Água</li> 3. <li>Coca-Cola</li> 4. <li>Cerveja</li> 5. </ul>

1. <ul> 2. <li></li> 3. </ul>

1. <ul> 2. <li ng-repeat="item in items"> 3. </li> 4. </ul>

1. <ul> 2. <li ng-repeat="item in items"> 3. {{item.description}} 4. </li> 5. </ul>

Qual é a vantagem em estender a linguagem HTML?

Tornar a programação mais declarativa, escrevendo muito menos código

Arquitetura do framework

O que é arquitetura? Qual é a diferença entre arquitetura e design?

Surgimento do padrão MVC Model-View-Controller

Trygve Reenskaug Criou o padrão em 1978 na Xerox (PARC)

MVC, MVP, MVVM e MVW

Separação de responsabilidades

View É o que o cliente vê

Controller Responsável pelo que a View consome

Scope Faz a mediação entre a View e o Controller

Hello World!

1. 2. 3. 4. 5. 6. 7. 8. <!doctype html> <html> <head> <title>Hello World</title> </head> <body> </body> </html>

1. 2. 3. 4. 5. 6. 7. 8. <!doctype html> <html ng-app> <head> <title>Hello World</title> </head> <body> </body> </html>

1. 2. 3. 4. 5. 6. 7. 8. 9. <!doctype html> <html ng-app> <head> <title>Hello World</title> <script src='angular.js'></script> </head> <body> </body> </html>

1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. <!doctype html> <html ng-app> <head> <title>Hello World</title> <script src='angular.js'></script> <script> function HelloWorldCtrl($scope) { $scope.message = 'Hello World!'; } </script> </head> <body> </body> </html>

1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. <!doctype html> <html ng-app> <head> <title>Hello World</title> <script src='angular.js'></script> <script> function HelloWorldCtrl($scope) { $scope.message = 'Hello World!'; } </script> </head> <body ng-controller="HelloWorldCtrl"> </body> </html>

1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. <!doctype html> <html ng-app> <head> <title>Hello World</title> <script src='angular.js'></script> <script> function HelloWorldCtrl($scope) { $scope.message = 'Hello World!'; } </script> </head> <body ng-controller="HelloWorldCtrl"> {{message}} </body> </html>

AngularJS Hands-On Por dentro das principais características do framework!

Quais são os concorrentes do AngularJS?

http://sporto.github.io/blog/2013/04/12/comparison-angular-backbone-can-ember

Quem está usando AngularJS?

Perguntas?

Treinamento de Desenvolvimento web com JavaScript e AngularJS Aprenda a construir aplicações web interativas e fáceis de utilizar, com uma arquitetura modular, robusta e flexível e uma produtividade que vai superar as suas expectativas! treinamento@voffice.com.br Turmas 08/03 (sábados) em Indaial 24/03 (seg. e qua.) em Florianópolis 05/04 (sábados) em Florianópolis 15/04 (ter. e qui.) em Florianópolis Vagas Encerradas Vagas Encerradas Inscrições Abertas Inscrições Abertas

Treinamento de Clean Code Desenvolva suas habilidades na arte da programação e aprenda a construir aplicações de alta qualidade por meio de Técnicas de Refactoring, Orientação a Objetos, Test-Driven Development e Automação do Ambiente de Desenvolvimento! treinamento@voffice.com.br Turmas 16/04 (seg. e qua.) em Florianópolis Inscrições Abertas

Obrigado! rodrigo.branas@gmail.com http://www.agilecode.com.br www.slideshare.net/rodrigobranas

Add a comment

Related presentations

Presentación que realice en el Evento Nacional de Gobierno Abierto, realizado los ...

In this presentation we will describe our experience developing with a highly dyna...

Presentation to the LITA Forum 7th November 2014 Albuquerque, NM

Un recorrido por los cambios que nos generará el wearabletech en el futuro

Um paralelo entre as novidades & mercado em Wearable Computing e Tecnologias Assis...

Microsoft finally joins the smartwatch and fitness tracker game by introducing the...

Related pages

Bruno Gonçalves | LinkedIn

... interceptador de requisições utilizando Brunch.io e as tecnologias JavaScript, HTML, CSS ... Desenvolvendo aplicações web com ASP ... AngularJS ...
Read more

Moacir Selinger (@hassedcom) | Twitter

Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio... by @rodrigobranas http://www. slideshare.net/rodrigobranas/ minicurso- ...
Read more

Outubro 2014 - Mercado Web Minas

Atualmente foi executado em mais de 100 países ao redor do mundo desenvolvendo ... AngularJS, Jquery, Javascript ... desenvolvimento de aplicações web;
Read more

Ellyson Ricardo | LinkedIn

... Java OO, Servlet, JSP, JSF, JSTL, JPA, Strut2, Vraptor, Spring web MVC, Hibernate, Jquery, Javascript ... Desenvolvendo para Web ... AngularJS : o ...
Read more

Alexandre Cavalcanti | LinkedIn

... me aperfeiçoei nas metodologias de ensino das linguagens de programação web, ... Desenvolvedor de aplicações ... criando e desenvolvendo ...
Read more