Postagens

Mostrando postagens com o rótulo framework

Vue.js - Propriedades e métodos de um componente

Imagem
O Vue.js é um framework para front end que vem ganhando muito espaço na comunidade de desenvolvimento por sua baixa curva de aprendizado e por suas excelentes qualidades. É possível desenvolver em Vue.JS utilizando o Vue cli , que é uma ferramenta de 'transpiler', ou apenas importando scripts com a tag <script>, que no geral colocamos no header da página. Para facilitar o desenvolvimento de aplicações abaixo segue um breve resumo das opções dentro de um componente Vue.js. { // Referência para o container HTML // (utilizado no desenvolvimento sem vue-cli) el: '#app', // HTML que deve ser renderizado junto com variáveis e etc. // (utilizado no desenvolvimento sem vue-cli) template: '<p>Minha aplicação {{ nome }}</p>', // Define as variáveis disponíveis no componente data() { return { nome: 'Meu nome' } }, // Define métodos disponíveis no componente methods: {...

AngularJS - detectando o evento Enter através de uma diretiva ngEnter

O AngularJS tem inúmeras diretivas e funções para criar rapidamente uma aplicação porém uma que não existe no pacote do framework e que faz bastante falta é um evento ' on-Enter ' para chamar uma função ou método. Por exemplo se estou desenvolvendo um formulário e quero que ao preencher um campo e apertar o Enter uma função seja chamada, seja para validar algum dado, seja para efetuar um login. Apesar de não existir um evento deste tipo o AngularJS permite a criação de diretivas personalizadas. Assim podemos criar a nossa própria diretiva ng-Enter . Abaixo está uma diretiva simples que permite incluir em sua aplicação um ng-enter e, através deste, chamar uma função qualquer. /* Esta diretiva permite chamar uma função qualquer ao pressionar a tecla Enter. */ app.directive('ngEnter', function () { return function (scope, element, attrs) { element.bind("keydown keypress", function (event) { if(event.which === 13) { ...

PHP - Criando uma classe que concatena métodos

Imagem
É comum em frameworks ou bibliotecas aplicarmos métodos em cadeia para modificar um dado conteúdo. A ideia deste tipo de classe é evitar criar variáveis temporárias para guardar o resultado de um método para depois inseri-lo em outro a fim de aplicar uma nova modificação. Com o encadeamento de métodos o retorno de cada um é lido pelo seguinte automaticamente. Para isso existe um truque: os retornos dentro de cada método. Vamos ver um exemplo. Class Sequencia { public $retorno; public function primeiro($var) { $this->retorno .= " Primeiro {$var}:"; return $this; } public function segundo($var) { $this->retorno .= " Segundo {$var}:"; return $this; } } $seq = new Sequencia; $seq->primei...

Angular.js - Trabalhando com classes e estilos CSS de modo mais limpo

Imagem
O Angular traz modos interessantes de se trabalhar com estilos CSS, tornando mais automatizadas e limpas certas operações e interação cliente/aplicação. Vamos aproveitar para ver um pouco sobre diretivas do Angular também. As diretivas são propriedades inseridas nas Tags que nos ajudam a trabalhar com as interações do usuário. O Angular.js possui inúmeras diretivas que substituem a prática muito utilizada no Jquery de atribuir eventos a classes ou ids. Se no Jquery precisávamos ligar um evento a uma classe ou id e depois ligar estes a uma função para executar a operação desejada, no Angular.js isto é feito diretamente, atribuindo-se a função diretamente a um evento dentro da Tag desejada, sem a necessidade de utilizar outros tipos de truque. O exemplo abaixo considera dois diferentes modos de se trabalhar com classes e estilos. <html ng-app> <head> <title>Classes</title> <style> .menu-true { color: green; } .outro-estilo ...

Uma introdução ao Angular.js

Imagem
Pesquisando sobre novas tecnologias me deparei com o Angular JS , um projeto suportado pelo Google. A ideia do Angular JS é oferecer uma alternativa ao Jquery, Ember e outros frameworks. Esta pesquisa me levou também a muitos caminhos sem saída e desinformação. Para evitar que os leitores do blog também fiquem confusos resolvi fazer um post explicando o básico para iniciar no Angular JS. Bom, em primeiro lugar você não precisa de nenhuma configuração ou instalação no servidor. Trabalhar com Angular JS depende apenas da carga de um arquivo .js, que pode ser (aliás é recomendado) linkado diretamente do Google. É basicamente o mesmo procedimento que você faria para carregar a biblioteca do Jquery O serviço está disponível em: http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js Vamos a um exemplo bem básico, o cálculo de uma soma com Angular JS. Chamaremos este arquivo de angular.html: <html> <head> <script src="http://ajax.googleapis....

Instalando o Zend Framework no Windows

Imagem
Existem muitos frameworks no mercado e um dos principais é o Zend Framework . A função de um framework é tornar mais rápido o desenvolvimento de aplicações. Para isto um framework trabalha com orientação a objetos, utilizando classes que podem ser reaproveitadas em várias partes da aplicação. Além disto um framework trabalha com a estrutura chamada VMC que separa o que é visto pelo usuário (View) da lógica da aplicação (Model) e utiliza um mediador entre as duas que pega o que o usuário fez e o envia para a lógica da aplicação (Controler) Vamos assumir que você tem o PHP e o Apache instalados. Aqui vamos seguir o procedimento com o XAMPP instalado C:\xampp\ . Vamos criar uma pasta específica para os projetos com zend, já que podemos utilizar vários frameworks para fazer diferentes aplicações. Nossa pasta base será C:\xampp\htdocs\zend Baixando o Zend Framework O Zend pode ser baixado em http://framework.zend.com/downloads/latest . Dentre as opções baixe a Zend Framewo...