Patrick Augusto Gonçalves
|
|
- Eduarda Anjos Macedo
- 8 Há anos
- Visualizações:
Transcrição
1 Single Page Apps com AngularJS Patrick Augusto Gonçalves
2 Vamos Começar do Começo O que são Single Page Apps? Por que usar? O que eu ganho com isso?
3 Modelo Clássico de Aplicações Web
4 Domain Request Request Browser GET / clientes Network GET / clientes Servidor Request Controller HTML Response Response <html> <body> </body> </html> <html> <body> </body> </html> View
5 Modelo Clássico Full Response Cada requisição do browser provoca uma atualização completa da página. Além do código HTML, recursos de imagem, scripts e folhas de estilo também podem ser recarregados, caso nenhuma medida de cache seja utilizada.
6 Modelo Clássico Full Response Tráfego elevado de dados eleva custo de hospedagem em serviços de cloud computing, como Amazon EC2 por exemplo. Apesar de não ser impossível, é mais difícil escalar uma aplicação no modelo clássico devido principalmente ao gerenciamento de sessões de usuários.
7 Existe uma alternadva?
8 Sim!
9 Sim! Single Page Apps
10 Single Page Apps Aplicações ou sites web que utilizam apenas uma página HTML para apresentar os dados e elementos web, sem precisar recarregar completamente a página no momento em que o usuário navega de uma funcionalidade para outra.
11 Single Page Apps Primeira requisição carrega o código HTML da página principal que a partir de então servirá como visão principal ou shell da aplicação. Códigos JavaScript necessários para a execução da aplicação também são carregados neste momento.... assim como folhas de estilo.
12 Single Page Apps Primeira Requisição GET / index.html GET / index.html HTML HTML HTML index.html Browser Próximas Requisições GET /clientes/ 1 Network GET /clientes/ 1 Servidor GET /clientes/ 1 Controller JSON { id: 1, nome: abc, fone: } JSON { id: 1, nome: abc, fone: } { id: 1, nome: abc, fone: } Domain
13 Single Page Apps Primeira Requisição pagina.html Web Browser Servidor
14 Single Page Apps Primeira Requisição GET /pagina.html pagina.html Web Browser Servidor
15 Single Page Apps Primeira Requisição HTTP 200 ok pagina.html Web Browser Servidor
16 Single Page Apps Primeira Requisição pagina.html Web Browser Servidor
17 Single Page Apps Primeira Requisição pagina.html Web Browser Servidor
18 Single Page Apps Primeira Requisição pagina.html Web Browser Servidor
19 Single Page Apps Primeira Requisição pagina.html Web Browser Servidor
20 Single Page Apps Primeira Requisição Web Browser Servidor
21 Single Page Apps Dados são requisitados através de WebServices (REST na maioria) REST Endpoint Banco de Dados Web Browser Servidor
22 Single Page Apps Dados são requisitados através de WebServices (REST na maioria) GET /api/users/1 REST Endpoint Banco de Dados Web Browser Servidor
23 Single Page Apps Dados são requisitados através de WebServices (REST na maioria) GET /api/users/1 REST Endpoint Banco de Dados Web Browser Servidor
24 Single Page Apps Dados são requisitados através de WebServices (REST na maioria) REST Endpoint Banco de Dados Web Browser Servidor
25 Single Page Apps Dados são requisitados através de WebServices (REST na maioria) REST Endpoint Banco de Dados Web Browser Servidor
26 Single Page Apps Dados são requisitados através de WebServices (REST na maioria) HTTP 200 OK REST Endpoint application/json { id: 1, username: auser, user@p.com } Banco de Dados Web Browser Servidor
27 Single Page Apps Pequenos trechos de código HTML são carregados dinâmicamente. /views/fragment.html Web Browser Servidor
28 Single Page Apps Pequenos trechos de código HTML são carregados dinâmicamente. GET /views/fragment.html /views/fragment.html Web Browser Servidor
29 Single Page Apps Pequenos trechos de código HTML são carregados dinâmicamente. HTTP 200 ok text/html /views/fragment.html Web Browser Servidor
30 Single Page Apps Pequenos trechos de código HTML são carregados dinâmicamente. Web Browser Servidor
31 Single Page Apps Pequenos trechos de código HTML são carregados dinâmicamente. Web Browser Servidor
32 Single Page Apps Pequenos trechos de código HTML são carregados dinâmicamente. Web Browser Servidor
33 Single Page Apps Pequenos trechos de código HTML são carregados dinâmicamente. Web Browser Servidor
34 A primeira página não vai ficar muito pesada?
35 Técnicas de minification, gzip compression e carregamento dinâmico de scripts (AMD) minimizam bastante o problema. Requisições completas no modelo clássico de aplicações web trafegam uma quantidade consideravelmente maior de dados durante sua utilização. Após a primeira requisição, somente dados e fragmentos HTML ainda não carregados são obtidos do servidor.
36 Primeira Requisição
37 Navegação para Segunda Visão
38 Voltando para Primeira Visão
39 Como eu crio então SPAs com AngularJS?
40 Primeiro Passo Fazer download dos arquivos JavaScript que devem ser incluídos na aplicação.
41 Primeiro Passo
42 Primeiro Passo
43 Primeiro Passo
44 Segundo Passo Incluir bibliotecas na página HTML principal da aplicação através das tag <script>.
45 <html> <head> <title>myapp</title> <script type= text/javascript" src="/js/jquery js"> </script> <script type= text/javascript" src="/js/angular.js"> </script> </head> <body> Page Content </body> </html>
46 Terceiro Passo <codificar/>
47 Vamos por partes.
48 AngularJS Building Blocs Template Engine Data Binding Controllers Services Routing Dependency Injection entre outros.
49 Dependency Injection Considerada por muitos como o ponto mais forte do AngularJS. Nos permite injetar dependências em um controlador, serviço ou diretiva da mesma forma que frameworks famosos como o Spring, CDI ou Google Guava fazem na plataforma Java.
50 Dependency Injection - Exemplo Definição de dependência. Injeção de dependência. Código disponível em: hzps://github.com/pkgoncalves/ngstore
51 Template Engine Código HTML comum contendo elementos e atributos específicos do AngularJS. AngularJS renderiza as páginas da aplicação, combinando os elementos de template com os dados presentes no modelo e nos controladores.
52 <html ng-app> <body ng-controller="mycontroller"> <input ng-model="foo" value="bar > <button ng-click="changefoo()">{{buttontext}}</button> <script src="angular.js"> </body> </html>
53 Template Engine Algumas das Diretivas Mais Utilizadas nginclude: inclui conteúdo HTML em uma página existente. ngapp: inicializa uma página HTML como um documento de visão AngularJS. ngmodel: indica a qual propriedade de objeto um campo de formulário está associado. ngclick: indica qual método do controller a aplicação deve executar quando um determinado botão é pressionado. ngif: inclui ou exclui um elemento da página HTML. ngview: indica em qual local o conteúdo das visões da aplicação devem ser renderizadas (routing engine).
54 Template Engine No código HTML, as diretivas aparecem no formato ng-nome-da-diretiva. Camel case é transformado em palavras separadas por traços. ngclick ngmodeloptions ng-click ng-model-options
55 Template Engine A documentação oficial na página do projeto contém uma relação de todas as diretivas disponíveis para utilização em templates.
56 Template Engine
57 Template Engine - Exemplo Repete a tag <tr> para cada elemento da lista clientes. Imprime na tag <td> o id de um objeto cliente. Invoca a função excluir do controlador, passando o objeto cliente como parâmetro. Código disponível em: hzps://github.com/pkgoncalves/ngstore
58 A propósito, o que significa aquele ng antes do nome de cada diretiva?
59 ng = Angular Prefixo reservado. Utilizado para identificar as diretivas implementadas pelo próprio AngularJS. Sim, você pode criar suas próprias diretivas. Mais informações em:
60 Um template sozinho não faz verão.
61 Por isso, apresentamos os Controladores.
62 Por isso, apresentamos os Controladores. Ligue agora para para *adquirir o seu. *Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam erat eros, pretium ac fringilla id, ullamcorper eu purus. Cras pellentesque, nunc sed hendrerit convallis, est urna malesuada sem, sit amet aliquet est dolor sed diam. Sed lacinia elementum risus a euismod. Sed condimentum eros eget nisi sodales, eget luctus orci convallis. Aliquam erat volutpat.
63 Controladores No AngularJS, controladores são utilizados para se programar o comportamento das visões. Controladores sempre estão associados a um escopo.
64 Controladores Utilize controladores para: Configurar o estado inicial do escopo de uma visão. Adicionar comportamento ao escopo de uma visão.
65 Controlador - Exemplo Nome do módulo ao qual o controlador será adicionado. Injeção do objeto escopo. Este objeto será também udlizado pelo template para renderização da página. Nome do controlador. Inicialização de variáveis. Código disponível em: hzps://github.com/pkgoncalves/ngstore
66 Roteamento AngularJS possui um mecanismo de roteamento pronto para uso. Deve ser inicializado no momento da configuração inicial de um módulo. Trabalha em conjunto com a diretiva ngview, pois é na área definida por ela que a nova visão será renderizada.
67 Roteamento - Exemplo Definição do módulo. Função de configuração. Devemos declarar a dependência do módulo ngroute e injetar o objeto $routeprovider. Definição de rota. Rota padrão. Executada quando o caminho da URL da aplicação não combina com nenhuma das opções definidas pela função when. Código disponível em: hzps://github.com/pkgoncalves/ngstore
68 Roteamento - Exemplo Rota /clientes
69 Roteamento - Exemplo Rota /clientes/adicionar
70 Roteamento Também é possível definir variáveis em uma rota. Variável id.
71 Roteamento Variável id.
72 Roteamento Para recuperar o valor de uma variável de roteamento no código do controlador utilize o objeto $routeparams. Variável id. Injeção de dependência do objeto $routeparams.
73 Roteamento Para usar o mecanismo de roteamento, o arquivo angular-route.js deve ser adicionado ao projeto.
74 Roteamento
75 Roteamento
76 Roteamento
77 Roteamento
78 Roteamento Finalmente, importar o arquivo angular-route.js na página principal da aplicação.
79 Services São objetos JavaScript que podem ser injetados em controladores ou outros services através do mecanismo de injeção de dependência do AngularJS. Bastante utilizado na organização e reutilização de código em aplicações AngularJS. Utilize o método factory() ou o serviço $provide para registrar seus objetos de serviço.
80 Service - Exemplo Seleção do módulo ao qual o serviço pertencerá. Nome do serviço. Injeção de dependência. Métodos do serviço. Código disponível em: hzps://github.com/pkgoncalves/ngstore
81 Service AngularJS possui muitos serviços prontos para uso. Consulte a relação completa em:
82 Como eu junto tudo isso em uma aplicação então?
83 Aplicação de Exemplo
84 Aplicação de Exemplo Utiliza Node.js como tecnologia Server Side. Node.js implementa as APIs REST e fornece a página principal da aplicação (shell) e demais elementos, como imagens, arquivos de script, CSS e etc.
85 Aplicação de Exemplo Web Browser Servidor Banco de Dados
86 Utilize qualquer plataforma server side para implementar WebServices e fornecer os elementos da sua aplicação.
87
88 Estrutura de Pastas
89 Estrutura de Pastas Existem várias formas de se estruturar o código em uma aplicação AngularJS. Podemos escrever todos os controladores, serviços e configurações em um único arquivo. Podemos criar um único arquivo para armazenar todos os controladores, outro para os serviços e assim por diante. Podemos separar os arquivos da aplicações em estruturas lógicas, uma pasta para controladores, outra para serviços, outra para visões e etc.
90 Estrutura de Pastas Existem várias formas de se estruturar o código em uma aplicação AngularJS. Podemos escrever todos os controladores, serviços e configurações e um único arquivo. Podemos criar um único arquivo para armazenar todos os controladores, outro para os serviços e assim por diante. Podemos separar os arquivos da aplicações em estruturas lógicas, uma pasta para controladores, outra para serviços, outra para visões e etc.
91 Estrutura de Pastas Existem várias formas de se estruturar o código em uma aplicação AngularJS. Podemos escrever todos os controladores, serviços e configurações e um único arquivo. Podemos criar um único arquivo para armazenar todos os controladores, outro para os serviços e assim por diante. Podemos separar os arquivos da aplicações em estruturas lógicas, uma pasta para controladores, outra para serviços, outra para visões e etc.
92 Estrutura de Pastas Existem várias formas de se estruturar o código em uma aplicação AngularJS. Podemos escrever todos os controladores, serviços e configurações e um único arquivo. Podemos criar um único arquivo para armazenar todos os controladores, outro para os serviços e assim por diante. Podemos separar os arquivos da aplicações em estruturas lógicas, uma pasta para controladores, outra para serviços, outra para visões e etc.
93 Estrutura de Pastas Projeto Completo Models Node.js Pastas com recursos JavaScript, CSS e fragmentos HTML. Aplicação AngularJS. Definição de rotas Node.js. Página principal da aplicação.
94 Estrutura de Pastas Detalhamento Controladores AngularJS. Definição do módulo principal. Definição de serviços. Fragmentos HTML (visões).
95 Tudo começa pela página index.
96 /views/index.ejs
97 Adicione as bibliotecas do AngularJS e demais dependências.
98 /views/index.ejs A inclusão da biblioteca JQuery não é obrigatória. Quando ela não é adicionada, o AngularJS utiliza uma versão embutida e simplificada do JQuery.
99 Inclua a diretiva ngapp na tag principal da página. Pode ser até mesmo a própria tag <html>.
100 /views/index.ejs O conteúdo da diretiva ng-app é de livre escolha e deve representar o nome do módulo principal da aplicação.
101 Crie o arquivo JavaScript que irá inicializar o módulo principal da sua aplicação.
102 /public/ngstore- app.js
103 Inclua o arquivo de definição do módulo principal da aplicação na página index.html.
104 /views/index.ejs As tags <script> responsáveis pelo carregamento dos controladores, serviços e demais elementos da sua aplicação, devem de preferência ser incluídos no rodapé da página. Assim o usuário terá a interface completa renderizada no browser enquanto os demais scripts são carregados.
105 Agora utilize a diretiva ngview para definir em qual região da página index.html as demais visões serão renderizadas quando o usuário navegar de uma página para outra.
106 /views/index.ejs
107 Visão de Cadastro de Clientes
108 3 elementos: Fragmento HTML de template; Controlador; Definição de roteamento (url da visão).
109 Arquivo de template HTML deve ser criado na pasta dedicada ao armazenamento de visões na aplicação.
110
111 /public/app/views/cliente- edit.html
112 Repare na diretiva ng- model no elemento <input>. Ela faz a ligação (data binding) entre um objeto no controlador e os elementos de um formulário. Alterações no formulário alteram o modelo e vice-versa, automaticamente.
113 Após implementado o template, devemos criar o controlador responsável pelos dados e ações da página.
114
115 /public/app/controllers/clienteeditcontroller.js
116 Alguns métodos de ações do controlador estão ligados ao template através da diretiva ng-click.
117 Importe o arquivo JavaScript do controlador na página principal da aplicação.
118 Devemos agora criar um roteamento para permitir que o usuário navegue para o formulário de cadastro de clientes. O roteamento também define qual controlador estará relacionado ao template da visão.
119 /public/app/ngstore- app.js Não se esqueça de injetar o serviço routeprovider. Necessário para definir os roteamentos. Arquivo de template. Controlador. O roteamento deve ser definido na configuração do módulo principal da aplicação ou de um submódulo da aplicação.
120 A navegação para a visão de cadastro de clientes pode ser feita através do elemento <a> do HTML. <a href= #/clientes/adicionar >Novo Cliente</a> O símbolo # é necessário antes do caminho da rota, caso contrário, o navegador irá buscar uma página completa no caminho /clientes/adicionar.
121
122
123 É possível utilizar rotas sem o uso de hashbangs. Para isso utilize o serviço $locationprovider, passando o valor true para o método html5mode. angular.module('storeapp, [ locationprovider ]).config(['$locationprovider', function ($routeprovider) { }]); $locationprovider.html5mode(true);
124 Código da Aplicação de Exemplo Disponível no GitHub em:
125 Patrick Augusto Gonçalves
126 Obrigado!
127
DOCUMENTAÇÃO DO FRAMEWORK - versão 2.0
DOCUMENTAÇÃO DO FRAMEWORK - versão 2.0 Índice 1 - Objetivo 2 - Descrição do ambiente 2.1. Tecnologias utilizadas 2.2. Estrutura de pastas 2.3. Bibliotecas já incluídas 3 - Características gerais 4 - Criando
Leia maisProgramando em PHP. Conceitos Básicos
Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Conceitos Básicos Todo o escopo deste estudo estará voltado para a criação de sites com o uso dos diversos recursos de programação web
Leia maisScriptlets e Formulários
2 Scriptlets e Formulários Prof. Autor: Daniel Morais dos Reis e-tec Brasil Programação Avançada Para Web Página1 Meta Permitir ao aluno aprender a criar um novo projeto Java para web no Netbeans IDE,
Leia maisANEXO 11. Framework é um conjunto de classes que colaboram para realizar uma responsabilidade para um domínio de um subsistema da aplicação.
ANEXO 11 O MATRIZ Para o desenvolvimento de sites, objeto deste edital, a empresa contratada obrigatoriamente utilizará o framework MATRIZ desenvolvido pela PROCERGS e disponibilizado no início do trabalho.
Leia maisDesenvolvendo Websites com PHP
Desenvolvendo Websites com PHP Aprenda a criar Websites dinâmicos e interativos com PHP e bancos de dados Juliano Niederauer 19 Capítulo 1 O que é o PHP? O PHP é uma das linguagens mais utilizadas na Web.
Leia maisConceitos de Ajax Exemplos de uso do Ajax no braço, muitos exemplos, muito código (HTML, CSS, JavaScript, PHP, XML, JSON)
Márcio Koch 1 Currículo Formado na FURB em Ciência da Computação Pós graduado em Tecnologias para o desenvolvimento de aplicações web Mestrando em Computação Gráfica na UDESC Arquiteto de software na Senior
Leia maismkdir /srv/www/default/html/calculadora/imagens mkdir /srv/www/default/html/calculadora/blocos
Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Criando uma Calculadora Primeiramente deve se criar uma estrutura para armazenar os arquivos necessários para o funcionamento da calculadora.
Leia maisAula 03 - Projeto Java Web
Aula 03 - Projeto Java Web Para criação de um projeto java web, vá em File/New. Escolha o projeto: Em seguida, na caixa Categorias selecione Java Web. Feito isso, na caixa à direita selecione Aplicação
Leia maisWeb Design. Prof. Felippe
Web Design Prof. Felippe 2015 Sobre a disciplina Fornecer ao aluno subsídios para o projeto e desenvolvimento de interfaces de sistemas Web eficientes, amigáveis e intuitivas. Conceitos fundamentais sobre
Leia maisSistemas para internet e software livre
Sistemas para internet e software livre Metodologia de modelagem de aplicações WEB Image: FreeDigitalPhotos.net Domínio: Elementos de aplicação WEB Páginas Web Scripts Formulários Applets e ActiveX Motivação
Leia maisHTML / JAVASCRIPT. A versão atual é o HTML5 (seus predecessores imediatos são HTML 4.01, XHTML 1.1, etc.).
HTML / JAVASCRIPT Estamos iniciando o estudo do HTML através das TAGS (comandos) para construir formulários. Isso facilitará a continuidade dos nossos estudos da linguagem de programação JavaScript, a
Leia maisDesenvolvimento de aplicação web com framework JavaServer Faces e Hibernate
Desenvolvimento de aplicação web com framework JavaServer Faces e Hibernate Tiago Peres Souza 1, Jaime Willian Dias 1,2 ¹Universidade paranaense (Unipar) Paranavaí PR Brasil tiagop_ti@hotmail.com 2 Universidade
Leia maisJava II. Sérgio Luiz Ruivace Cerqueira sergioruivace@gmail.com
Java II Sérgio Luiz Ruivace Cerqueira sergioruivace@gmail.com Por quê JSP? Com Servlets é fácil Ler dados de um formulário Recuperar dados de uma requisição Gerar informação de resposta Fazer gerenciamento
Leia maisAssociação Carioca de Ensino Superior Centro Universitário Carioca
Desenvolvimento de Aplicações Web Lista de Exercícios Métodos HTTP 1. No tocante ao protocolo de transferência de hipertexto (HTTP), esse protocolo da categoria "solicitação e resposta" possui três métodos
Leia maiswireframe do novo site
wireframe do novo site home METRÔ PAINÉIS S ANUNCIE QUEM SOMOS Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam imperdiet sed eros ut luctus. Suspendisse eu vulputate massa. Nullam dignissim,
Leia maisCurso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2
Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2 Objetivo. O objetivo da disciplina é conhecer os princípios da programação de
Leia maisManual do Usuário - ProJuris Web - Fila de E-mails Página 1 de 8
As informações contidas neste documento estão sujeitas a alterações sem o prévio aviso, o que não representa um compromisso da Virtuem Informática. As pessoas, organizações ou empresas e eventos de exemplos
Leia maisMaterial de apoio a aulas de Desenvolvimento Web. Tutorial Java WEB JSP & HTML & CSS & CLASSE & OBJETOS. AAS - www.aas.pro.
Material de apoio a aulas de Desenvolvimento Web Tutorial Java WEB JSP & HTML & CSS & CLASSE & OBJETOS AAS - www.aas.pro.net Março-2012 Este pequeno tutorial tem como objetivo conduzir o programador passo-a-passo
Leia maisAcessando um Banco de Dados
Acessando um Banco de Dados Introdução Agora que você já está craque em JSP e já instalou seu servidor, vamos direto para a parte prática! Neste tutorial vamos aprender a acessar um banco de dados. Para
Leia maisWEBDESIGN. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira
WEBDESIGN Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 1 CDI - Curso de Webdesign - Prof. Paulo Trentin Objetivos para esta aula Debater sobre
Leia maisGoogle Drive. Passos. Configurando o Google Drive
Google Drive um sistema de armazenagem de arquivos ligado à sua conta Google e acessível via Internet, desta forma você pode acessar seus arquivos a partir de qualquer dispositivo que tenha acesso à Internet.
Leia maisProduto: Webscan Relatório II Programas desenvolvidos, testados e documentados
Produto: Webscan Relatório II Programas desenvolvidos, testados e documentados Sérgio Oliveira Campos Contrato N : 2008/000514 Sumário 1 Introdução 1 2 Bibliotecas Utilizadas 2 2.1 Reconhecimento de Texto
Leia maisProgramação Web Prof. Wladimir
Programação Web Prof. Wladimir Linguagem de Script e PHP @wre2008 1 Sumário Introdução; PHP: Introdução. Enviando dados para o servidor HTTP; PHP: Instalação; Formato básico de um programa PHP; Manipulação
Leia maisManual do Painel Administrativo
Manual do Painel Administrativo versão 1.0 Autores César A Miggiolaro Marcos J Lazarin Índice Índice... 2 Figuras... 3 Inicio... 5 Funcionalidades... 7 Analytics... 9 Cidades... 9 Conteúdo... 10 Referência...
Leia maisProgramação Orientada a Objetos com PHP & MySQL Cookies e Sessões. Prof. MSc. Hugo Souza
Programação Orientada a Objetos com PHP & MySQL Cookies e Sessões Prof. MSc. Hugo Souza Se você precisar manter informações sobre seus usuários enquanto eles navegam pelo seu site, ou até quando eles saem
Leia maisatividade florestal não-madeireira título da categoria com opção de uso de icone
buscar no site OK Página inicial links rápidos a fazenda santa maria nononononono não- título em destaque texto complementar Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum
Leia maisSistema de Digitalização e Gerenciamento de Arquivos On-Line
Sistema de Digitalização e Gerenciamento de Arquivos On-Line O aplicativo Aplicativo com quase 3 anos de mercado, onde gerencia atualmente mais de 500.000 arquivos sendo eles entre digitalizados ou anexados
Leia mais02 - Usando o SiteMaster - Informações importantes
01 - Apresentação do SiteMaster - News Edition O SiteMaster foi desenvolvido para ser um sistema simples de gerenciamento de notícias, instalado em seu próprio computador e com configuração simplificada,
Leia maisManual de Integração Via Gadget. Passo a passo para realizar a integração entre websites e a plataforma Virtual Target.
Manual de Integração Via Gadget Passo a passo para realizar a integração entre websites e a plataforma Virtual Target. Manual de Integração Via Gadget 1. Introdução 1.1. O que é? Virtual Target Gadgets
Leia maisVISUAL LIGHTBOX FERRAMENTA WEB DESIGN FABIANO KEIJI TAGUCHI
VISUAL LIGHTBOX FERRAMENTA WEB DESIGN FABIANO KEIJI TAGUCHI ESTE MATERIAL TEM UM OBJETIVO DE COMPLEMENTAR OS ASSUNTOS ABORDADOS DENTRO DE SALA DE AULA, TORNANDO-SE UM GUIA PARA UTILIZAÇÃO DA FERRAMENTA
Leia maisParte I. Demoiselle Mail
Parte I. Demoiselle Mail Para o envio e recebimento de e-s em aplicativos Java, a solução mais natural é usar a API JavaMail [http:// www.oracle.com/technetwork/java/java/index.html]. Ela provê um framework
Leia maisMANUAL DE UTILIZAÇÃO
MANUAL DE UTILIZAÇÃO Módulo de operação Ativo Bem vindo à Vorage CRM! Nas próximas paginas apresentaremos o funcionamento da plataforma e ensinaremos como iniciar uma operação básica através do nosso sistema,
Leia maisDesenvolvendo para WEB
Nível - Básico Desenvolvendo para WEB Por: Evandro Silva Neste nosso primeiro artigo vamos revisar alguns conceitos que envolvem a programação de aplicativos WEB. A ideia aqui é explicarmos a arquitetura
Leia maisRepeater no GASweb. Regiões
Repeater no GASweb Por: Rodrigo Silva O controle de servidor Repeater é um container básico que permite a você criar uma lista de qualquer informação que deseja em uma página Web. Ele não tem uma aparência
Leia maisProgramação Web com Webdev 19 Julio Cesar Pedroso Conteúdo
Conteúdo INTRODUÇÃO... 6 Como acessar a ajuda on line?... 6 Conhecendo o WebDev... 8 Iniciando o WebDev... 8 Ambiente de desenvolvimento... 8 O Editor... 8 A barra de menus... 10 Os botões... 10 Os painéis...
Leia maisDesenvolvedor Web Docente André Luiz Silva de Moraes
Roteiro 2: Introdução a Linguagem HTML Neste roteiro é explorada a linguagem HTML. A linguagem HTML (Hypertext Markup Language) é amplamente utilizada na construção de páginas de internet e é responsável
Leia maisO código JavaScript deve ser colocado entre tags de comentário para ficar escondido no caso de navegadores antigos que não reconhecem a linguagem.
1 - O que é JAVASCRIPT? É uma linguagem de script orientada a objetos, usada para aumentar a interatividade de páginas Web. O JavaScript foi introduzido pela Netscape em seu navegador 2.0 e posteriormente
Leia maisCursos de Magento. 2013 Gugliotti Consulting
Cursos de Magento F U N D A M E N T O S D E M A G E N T O C O M M E R C E C U R S O E M V Í D E O - A U L A S M Ó D U L O 2 F T O 2 Fundamentos de Magento Commerce Módulo 2 Aula 1 Configuração da plataforma
Leia maisIntrodução ao HTML 5 e Implementação de Documentos
Linguagem de Programação para Web Introdução ao HTML 5 e Implementação de Documentos Prof. Mauro Lopes 1-31 20 Objetivo Iremos aqui apresentar a estrutura básica de um documento HTML e iremos também apresentar
Leia maisProgramação Web. Professor: Diego Oliveira. Conteúdo 02: JSP e Servlets
Programação Web Professor: Diego Oliveira Conteúdo 02: JSP e Servlets JSP JSP é um template de uma página Web que usa Java para gerar HTML dinamicamente JSP é considerado server-side e roda em um objeto
Leia maisPráticas de Desenvolvimento de Software
Aula 8. 13/04/2015. Práticas de Desenvolvimento de Software Aula 8 - Arquitetura e infraestrutura de aplicações Web. Oferecimento Modelo cliente-servidor (1) Cliente Rede scheme://domain:port/path?query_string#fragment_id
Leia maisEstá apto a utilizar o sistema, o usuário que tenha conhecimentos básicos de informática e navegação na internet.
1. Descrição Geral Este manual descreve as operações disponíveis no módulo VTWEB Client, cuja finalidade é gerenciar cadastros de funcionários, realização de pedidos e controle financeiro dos pedidos.
Leia maisPROGRAMAÇÃO PARA DISPOSITIVOS MÓVEIS -HTML 5: ARMAZENAMENTO DE DADOS (CLIENTE) Prof. Angelo Augusto Frozza, M.Sc. http://about.
PROGRAMAÇÃO PARA DISPOSITIVOS MÓVEIS -HTML 5: ARMAZENAMENTO DE DADOS (CLIENTE) Prof. Angelo Augusto Frozza, M.Sc. http://about.me/tilfrozza ROTEIRO Introdução Compatibilidade Principais características
Leia maisConfigurando o IIS no Server 2003
2003 Ser ver Enterprise Objetivo Ao término, você será capaz de: 1. Instalar e configurar um site usando o IIS 6.0 Configurando o IIS no Server 2003 Instalando e configurando o IIS 6.0 O IIS 6 é o aplicativo
Leia maisConstrutor de sites SoftPixel GUIA RÁPIDO - 1 -
GUIA RÁPIDO - 1 - Sumário Introdução...3 Por que utilizar o Construtor de Sites?...3 Vantagens do Construtor de Sites...3 Conceitos básicos...3 Configuração básica do site...5 Definindo o layout/template
Leia mais5 Detalhes da Implementação
Detalhes da Implementação 101 5 Detalhes da Implementação Neste capítulo descreveremos detalhes da implementação do Explorator que foi desenvolvido usando o paradigma MVC 45 e o paradigma de CoC 46 (Convention
Leia maisDesenvolvimento de Sites com PHP e Mysql Docente André Luiz Silva de Moraes
Roteiro 2: Introdução a Linguagem HTML Desenvolvimento de Sites com PHP e Mysql Neste roteiro é explorada a linguagem HTML. A linguagem HTML (Hypertext Markup Language) é amplamente utilizada na construção
Leia maisPROGRAMAÇÃO MANUAL DE INSTRUÇÕES SEJA BEM VINDO VERSÃO 1.4 10/01/2013 UDS SOLUÇÕES DIGITAIS
VERSÃO 1.4 10/01/2013 UDS SOLUÇÕES DIGITAIS PROGRAMAÇÃO MANUAL DE INSTRUÇÕES Instruções, métodos e recomendações para desenvolvimento de sistemas na UDS. 1 Sumário Apresentação... 3 Estrutura de pastas:...
Leia maisManual do Visualizador NF e KEY BEST
Manual do Visualizador NF e KEY BEST Versão 1.0 Maio/2011 INDICE SOBRE O VISUALIZADOR...................................................... 02 RISCOS POSSÍVEIS PARA O EMITENTE DA NOTA FISCAL ELETRÔNICA.................
Leia maisIntrodução. História. Como funciona
Introdução O HTML é uma linguagem de marcação utilizada para desenvolvimento de sites. Esta linguagem surgiu junto com o HTTP, ambos possibilitaram a internet ser popularizada. História O HTML foi criado
Leia maisProgramação para web JavaScript
Programação para web JavaScript Professor: Harlley Lima E-mail: harlley@decom.cefetmg.br Departamento de Computação Centro Federal de Educação Tecnológica de Minas Gerais Belo Horizonte, 4 de maio 2016
Leia maisEAI Manual do Administrador
EAI Manual do Administrador 1 Definição de Host Application O que é um Host Application? Significa Aplicativo Hospedeiro, é o nome dado ao ambiente EAI que estará executando no seu computador ou em um
Leia maisJSF e PrimeFaces. Professor: Ricardo Luis dos Santos IFSUL Campus Sapucaia do Sul
JSF e PrimeFaces Professor: Ricardo Luis dos Santos IFSUL 2015 Agenda Introdução Desenvolvimento Web Java Server Faces Exercício 2 Introdução Ao longo dos anos diversas linguagens de programação foram
Leia maisCookies. Krishna Tateneni Jost Schenck Tradução: Lisiane Sztoltz
Krishna Tateneni Jost Schenck Tradução: Lisiane Sztoltz 2 Conteúdo 1 Cookies 4 1.1 Política............................................ 4 1.2 Gerenciamento....................................... 5 3 1
Leia maisABORDAGEM DE FRAMEWORKS PARA JSF QUE AUXILIAM O DESENVOLVIMENTO DE SOFTWARE
ABORDAGEM DE FRAMEWORKS PARA JSF QUE AUXILIAM O DESENVOLVIMENTO DE SOFTWARE Amarildo Aparecido Ferreira Junior 1, Ricardo Ribeiro Rufino 1 ¹Universidade Paranaense (Unipar) Paranavaí PR Brasil aapfjr@gmail.com
Leia maisINSTALAÇÃO DO SISTEMA CONTROLGÁS
INSTALAÇÃO DO SISTEMA CONTROLGÁS 1) Clique duas vezes no arquivo ControlGasSetup.exe. Será exibida a tela de boas vindas do instalador: 2) Clique em avançar e aparecerá a tela a seguir: Manual de Instalação
Leia maisWeb Design Aula 11: Site na Web
Web Design Aula 11: Site na Web Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Motivação Criar o site em HTML é interessante Do que adianta se até agora só eu posso vê-lo? Hora de publicar
Leia maisOS CAMINHOS PARA UMA APOSENTADORIA PLANEJADA
CAPITANIA MULTI CRÉDITO PRIVADO OS CAMINHOS PARA UMA Apresentação de Produto 2º Tri 2009 APOSENTADORIA PLANEJADA Capitânia Asset & Risk Management www.capitania.net Rua Dona Leopoldina, 48 São João -Porto
Leia maisInformática I. Aula 6. http://www.ic.uff.br/~bianca/informatica1/ Aula 6-12/09/2007 1
Informática I Aula 6 http://www.ic.uff.br/~bianca/informatica1/ Aula 6-12/09/2007 1 Ementa Noções Básicas de Computação (Hardware, Software e Internet) HTML e Páginas Web Internet e a Web Javascript e
Leia maisExibindo o Catálogo (Tarefa C) Prof. Fellipe Aleixo (fellipe.aleixo@ifrn.edu.br)
Exibindo o Catálogo (Tarefa C) Prof. Fellipe Aleixo (fellipe.aleixo@ifrn.edu.br) Iteração C1: CRIANDO A LISTAGEM DO CATÁLOGO Feedback do Cliente O cliente foi queseonado sobre prioridades Gostaria de ver
Leia maisManual do Contribuidor. Portal de Internet. Projeto: Novo Portal de internet
Manual do Contribuidor Portal de Internet Projeto: Novo Portal de internet 1. Propósito Este documento tem o propósito de orientar usuários a utilizar as funcionalidades do portal do Inea no modo de contribuição.
Leia maisSumário 1. SOBRE O NFGoiana DESKTOP... 3 1.1. Apresentação... 3 1.2. Informações do sistema... 3 1.3. Acessando o NFGoiana Desktop... 3 1.4.
1 Sumário 1. SOBRE O NFGoiana DESKTOP... 3 1.1. Apresentação... 3 1.2. Informações do sistema... 3 1.3. Acessando o NFGoiana Desktop... 3 1.4. Interface do sistema... 4 1.4.1. Janela Principal... 4 1.5.
Leia maisManual de Publicaça o no Blog da Aça o TRIBOS nas Trilhas da Cidadania
Manual de Publicaça o no Blog da Aça o TRIBOS nas Trilhas da Cidadania Sumário Objetivos do Blog... 2 Log-in... 3 Esqueci minha senha... 4 Utilizando o Blog... 5 Encontrando seu Blog... 5 Conhecendo o
Leia maisUse a Cabeça! FREEMAN, Eric e Elisabeth. HTML com CSS e XHTML BASHMAN, Brian / SIERRA Kathy / BATES, Bert. Servlets & JSP
Use a Cabeça! FREEMAN, Eric e Elisabeth. HTML com CSS e XHTML BASHMAN, Brian / SIERRA Kathy / BATES, Bert. Servlets & JSP Software cliente: browser e outros Protocolo HTTP Infraestrutura de transporte
Leia mais1. Introdução pág.3 2. Apresentação do sistema Joomla! pág.4 3. Acessando a administração do site pág.4 4. Artigos 4.1. Criando um Artigo 4.2.
1. Introdução pág.3 2. Apresentação do sistema Joomla! pág.4 3. Acessando a administração do site pág.4 4. Artigos 4.1. Criando um Artigo 4.2. Editando um Artigo 4.3. Excluindo um Artigo 4.4. Publicar
Leia maisTutorial do Sistema de Gestão de Conteúdos para Web - SYSWEB
Tutorial do Sistema de Gestão de Conteúdos para Web - SYSWEB São João del-rei Outubro de 2008 1. Entrando na Intranet para acessar o SYSWEB 1.1 Digite no seu navegador (browser) o seguinte endereço: http://www.intranet.ufsj.edu.br
Leia maisPHP AULA1. Prof. Msc. Hélio Esperidião
PHP AULA1 Prof. Msc. Hélio Esperidião NAVEGADOR O navegador também conhecido como web browseré um programa que habilita seus usuários a interagirem com documentos hospedados em um servidor Web. SERVIDOR
Leia maisPROGRAMAÇÃO PARA INTERNET. Fonte: Raul Paradeda
PROGRAMAÇÃO PARA INTERNET Introdução à AJAX Fonte: Raul Paradeda INTRODUÇÃO Para entender o que é o AJAX é necessário ter o prévio conhecimento de: HTML / XHTML; Javascript; CSS; XML. INTRODUÇÃO Ao pesquisar
Leia maisMais sobre uso de formulários Site sem Ajax
Mais sobre uso de formulários Site sem Ajax Página com busca padrão 1 Página com o resultado da busca carregada no local da anterior (o formulário está vazio) Site com Ajax 2 Site usando Ajax para preencher
Leia maisAjax Asynchronous JavaScript and Xml
Ajax Asynchronous JavaScript and Xml Ajax permite construir aplicações Web mais interativas, responsivas, e fáceis de usar que aplicações Web tradicionais. Numa aplicação Web tradicional quando se prime
Leia maisControle do Arquivo Técnico
Controle do Arquivo Técnico Os documentos existentes de forma física (papel) no escritório devem ser guardados em pastas (normalmente pastas suspensas) localizadas no Arquivo Técnico. Este Arquivo pode
Leia maisRequisições de Materiais - Almoxarifado Módulo Portal Administrativo - SIPAC
1 Requisições de Materiais - Almoxarifado Módulo Portal Administrativo - SIPAC Perfil: Requisitor e Autorizador de solicitações de materiais de consumo 2 Maceió, Fevereiro de 2013. Histório de versões
Leia maisIntrodução à Tecnologia Web. Tipos de Sites. Profª MSc. Elizabete Munzlinger www.elizabete.com.br
IntroduçãoàTecnologiaWeb TiposdeSites ProfªMSc.ElizabeteMunzlinger www.elizabete.com.br ProfªMSc.ElizabeteMunzlinger www.elizabete.com.br TiposdeSites Índice 1 Sites... 2 2 Tipos de Sites... 2 a) Site
Leia maisLista de operadores de comparação - > Maior que - < Menor que - <= Menor ou igual a - >= Maior ou igual a - === Igual a -!
Página1 Javascript JavaScript (JS) é uma linguagem de programação client side Funciona no navegador do usuário. É uma linguagem baseada em objetos. "Walmir".length; 6 Para que serve - fazer websites responder
Leia maisCONSTRUÇÃO DE BLOG COM O BLOGGER
CONSTRUÇÃO DE BLOG COM O BLOGGER Blog é uma abreviação de weblog, qualquer registro frequênte de informações pode ser considerado um blog (últimas notícias de um jornal online por exemplo). A maioria das
Leia maisR.Boquino Manual de Identidade Visual
R.Boquino Manual de Identidade Visual Normas padrão para construção e uso correto da marca. Comunicação institucional padrão Apresentação 3 Envelope 36 18 Conceito da marca 4 Envelope 34 19 Marca 5 Envelope
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JQUERY
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JQUERY Prof. Dr. Daniel Caetano 2012-1 Objetivos Introduzir o framework JQuery Capacitar para a construção de documentos JQuery simples Compreender os mecanismos
Leia maisComo implementar Cache Busting nas tags da Atlas. O que são tags? O que é Cache Busting?
Guia de implementação de cache busting e teste de tags Atlas Ad Server http:///operacoes/guia_implementacao_cachebusting_teste_tags_atlas_aunica.pdf Este documento é destinado à orientação e ao suporte
Leia maisTutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT.
Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT. PÁGINA: 2 de 21 Nenhuma parte deste documento pode ser utilizado ou reproduzido, em qualquer meio
Leia maisProgramação WEB II. Sessions e Cookies. progweb2@thiagomiranda.net. Thiago Miranda dos Santos Souza
Sessions e Cookies progweb2@thiagomiranda.net Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Cookies e Sessions Geralmente, um bom projeto
Leia maisZEND F r a m e w o r k
LOGO ZEND F r a m e w o r k Alexsander Muraro FRAMEWORK O que é? Um framework nada mais é do que uma arquitetura padrão que fornece várias ferramentas comuns a todo tipo de projeto; Utilizam os mais variados
Leia maisIntrodução a listas - Windows SharePoint Services - Microsoft Office Online
Page 1 of 5 Windows SharePoint Services Introdução a listas Ocultar tudo Uma lista é um conjunto de informações que você compartilha com membros da equipe. Por exemplo, você pode criar uma folha de inscrição
Leia maisConteúdo Dinâmico. Introdução. Interação Browser x Servidor Web. Interação Browser x Servidor Web
Introdução Formulários rios & Conteúdo Dinâmico Mário Antonio Meireles Teixeira Dept o. de Informática - UFMA A Web surgiu inicialmente como uma nova forma de comunicação de informações, fazendo uso de
Leia maisMódulo e-rede Prestashop v1.0. Manual de. Instalação do Módulo. estamos todos ligados
Módulo e-rede Prestashop v1.0 Manual de Instalação do Módulo estamos todos ligados ÍNDICE 01 02 03 04 Introdução 3 Versão 3 Requerimentos 3 Manual de instalação 4 05 06 4.1 Instruções iniciais 4 4.2 Instalação
Leia maisjquery André Tavares da Silva andre.silva@udesc.br
jquery André Tavares da Silva andre.silva@udesc.br jquery jquery é uma biblioteca em JavaScript; Seu objetivo é simplificar a programação em JavaScript; jquery foi desenvolvida para ser de aprendizado
Leia maisLista de Revisão. 3. Analise a afirmativa a seguir como verdadeira ou falsa e justifique.
Lista de Revisão 1. Nos sistemas web, geralmente os usuários apresentam dois problemas típicos, a desorientação e a sobrecarga cognitiva. Discorra sobre esses problemas. 2. Apresente as principais diferenças
Leia maisMódulo e-rede OpenCart v1.0. Manual de. Instalação do Módulo. estamos todos ligados
Módulo e-rede OpenCart v1.0 Manual de Instalação do Módulo estamos todos ligados 01 02 03 04 Introdução 3 Versão 3 Requerimentos 3 Manual de instalação 4 05 06 4.1 vqmod 4 4.2 Instalação e ativação do
Leia maisManual do Usuário Android Neocontrol
Manual do Usuário Android Neocontrol Sumário 1.Licença e Direitos Autorais...3 2.Sobre o produto...4 3. Instalando, Atualizando e executando o Android Neocontrol em seu aparelho...5 3.1. Instalando o aplicativo...5
Leia maisConstruindo portais com Plone. Módulo 3 Templates
Construindo portais com Plone Módulo 3 Templates Templates l Quando o Plone vai mostrar uma página, duas perguntas precisam ser respondidas: Ø O que será mostrado? Isto é, quais conteúdos serão buscados
Leia maisVersion Notes (Notas da versão) Versão 4.11.1.7-26-02-2013
Florianópolis, 26 de fevereiro de 2013. Abaixo você confere as características e funcionalidades da nova versão 4.11.1.7 do Channel. Para quaisquer dúvidas ou na necessidade de maiores esclarecimentos,
Leia maisColeção - Análises de email marketing em clientes de email
Coleção - Análises de email marketing em clientes de email Introdução Nesta quinta edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos o estudo do Windows Mail, um cliente
Leia maisMódulo Publicações Publicações On Line. Módulo Publicações
Módulo Publicações Elaborado por: Julio Cesar Cavalheiro PÁG. 1/8 Índice 1. Objetivo... 3 2. Parametrização... 3 3. Baixando as Publicações... 4 4. Atribuindo processos aos Dados Baixados... 5 5. Status
Leia maisProgramação Web com PHP. Prof. Wylliams Barbosa Santos wylliamss@gmail.com Optativa IV Projetos de Sistemas Web
Programação Web com PHP Prof. Wylliams Barbosa Santos wylliamss@gmail.com Optativa IV Projetos de Sistemas Web Agenda O que é PHP? O que da pra fazer com PHP? Como a web funciona? Onde, quando e por que
Leia maisAula 1: Noção Básica e Criação de Tabelas.
Aula 1: Noção Básica e Criação de Tabelas. Introdução Olá! Seja bem-vindo a apostila de Microsoft Access 2010. Access 2010 é um Sistema de Gerenciamento de Banco de Dados da Microsoft, distribuído no pacote
Leia maisOlá, esse é o manual feito para ajudar você a conhecer ainda mais o Painel Web que acompanha* App Kontrole.
Obrigado por baixar o App Kontrole!! Olá, esse é o manual feito para ajudar você a conhecer ainda mais o Painel Web que acompanha* App Kontrole. Aproveite para descobrir todo o potencial desse seu novo
Leia maisCriando um script simples
Criando um script simples As ferramentas de script Diferente de muitas linguagens de programação, você não precisará de quaisquer softwares especiais para criar scripts de JavaScript. A primeira coisa
Leia maisBoas Práticas de Desenvolvimento Seguro
Boas Práticas de Desenvolvimento Seguro Julho / 2.012 Histórico de Revisões Data Versão Descrição Autor 29/07/2012 1.0 Versão inicial Ricardo Kiyoshi Página 2 de 11 Conteúdo 1. SEGURANÇA DA INFORMAÇÃO
Leia mais