Blog SW9

Desenvolvimento Web e Híbrido na prática.
Tome um café, concentre-se, codifique. (งツ)ว

Testando seu App AngularJS com Karma e Jasmine – Parte 1 – SW9

Tags: , , , , , , , , |

Olá a todos. Decidi lançar uma nova série, agora para falar sobre testes associados a Apps Web. O Teste é uma das fases mais importantes do cliclo de desenvolvimento de um Software, seja ele para a Web, Desktop ou Mobile. Eu digo a vocês que o teste é o grande aliado para identificarmos potenciais defeitos no código. Já passou a época onde as pessoas desenvolviam os sistemas e para testá-los navegavam por todas as telas em busca de defeitos. Essa pode ser uma alternativa, mas não é a única. Para realizarmos testes de qualidade, o mais correto é construirmos casos de teste e aplicá-los de forma automática sempre que ocorrer uma alteração em nosso código. Para esta primeira série sobre testes, vou focar no processo de testes de um App escrito em AngularJS. Como fazer isso? Como consigo criar testes para validar os códigos escritos em AngularJS. Para viabilizar a construção dos testes, vamos precisar de um framework de teste, que nada mais é do que um conjunto de features que vai nos permitir codificar casos de teste. Para o caso do AngularJS o escolhido foi o framework Jasmine.

reCaptcha do Google – passo a passo com AngularJS e PHP – Aula 2 (BackEnd) – SW9

Tags: , , , , , , , |

Olá a todos. O tema da vez é o captcha. De acordo com a definição existente no site wikipedia, o captcha nada mais é do que "um teste de desafio cognitivo, utilizado como ferramenta anti-spam para diferenciação entre computadores e humanos". Seguindo nesta linha, eu acredito que a maioria de vocês já deve ter visto um Widget (componente visual) que aparece nos formulários web para validar determinada situação antes de submeter o formulário. Pois é, este recurso existe para evitar que robôs façam submissão de formulários de forma não autorizada. Estas submissões não autorizadas são consideradas SPAM e podem prejudicar a segurança e a estabilidade de seu site ou App Web. Um tipo comum de CAPTCHA requer que o usuário identifique as letras de uma imagem distorcida, às vezes com a adição de uma sequência obscurecida das letras ou dos dígitos que apareça na tela. Atualmente, o reCAPTCHA é recomendado pelos criadores de CAPTCHA como a implementação oficial. Existem diversas formas e componentes para implementação de captcha. Neste artigo vou explicar passo a passo como ativar, configurar e utilizar o serviço de captcha do Google o famoso reCaptcha. O reCaptcha é um sistema de caixa de diálogo para usuário originalmente desenvolvido na Universidade Carnegie Mellon. Mas em 16 de setembro de 2009 (Fonte Wikipedia) foi adquirida pelo Google. Ele possui uma API que nos permite implantá-lo de forma simples e rápida e com isso tentar minimizar os riscos de segurança e estabilidade do site ou App. Neste segundo vídeo, vou explicar como implantar o recaptcha do lado do servidor para validá-lo e, em seguida, autorizar e submeter o formulário.

reCaptcha do Google – passo a passo com AngularJS e PHP – Aula 1 (FrontEnd) – SW9

Tags: , , , , , , , |

Olá a todos. A partir de hoje estarei apresentando uma nova série agora para falar de um tema bem interessante. O tema da vez é o captcha. De acordo com a definição existente no site wikipedia, o captcha nada mais é do que "um teste de desafio cognitivo, utilizado como ferramenta anti-spam para diferenciação entre computadores e humanos". Seguindo nesta linha, eu acredito que a maioria de vocês já deve ter visto um Widget (componente visual) que aparece nos formulários web para validar determinada situação antes de submeter o formulário. Pois é, este recurso existe para evitar que robôs façam submissão de formulários de forma não autorizada. Estas submissões não autorizadas são consideradas SPAM e podem prejudicar a segurança e a estabilidade de seu site ou App Web. Um tipo comum de CAPTCHA requer que o usuário identifique as letras de uma imagem distorcida, às vezes com a adição de uma sequência obscurecida das letras ou dos dígitos que apareça na tela. Atualmente, o reCAPTCHA é recomendado pelos criadores de CAPTCHA como a implementação oficial. Existem diversas formas e componentes para implementação de captcha. Neste artigo vou explicar passo a passo como ativar, configurar e utilizar o serviço de captcha do Google o famoso reCaptcha. O reCaptcha é um sistema de caixa de diálogo para usuário originalmente desenvolvido na Universidade Carnegie Mellon. Mas em 16 de setembro de 2009 (Fonte Wikipedia) foi adquirida pelo Google. Ele possui uma API que nos permite implantá-lo de forma simples e rápida e com isso tentar minimizar os riscos de segurança e estabilidade do site ou App. Nesta série eu vou explicar passo a passo como implementar a versão mais recente do reCaptcha, aquela que exibe o texto [I am not a robot] e no lado esquerdo deste texto existe um botão que deve ser clicado pelo usuário. Para este primeiro vídeo vou explicar passo a passo como ativar, configurar o recaptcha e construção do formulário para exibição do widget.

UI GRID Avançado – CRUD – Angular + Json Server – Aula 2

Tags: , , , , , , , |

Olá pessoal, venho apresentar o segundo vídeo sobre UI Grid Avançado, cuja a proposta é mostrar um exemplo completo da utilização do Ui Grid. Na primeira série que criei e que está disponível no canal e blog, procurei apresentar a maioria das funcionalidades e me limitei a não apresentar um exemplo real integrando a grid com o backend. Agora, atendendo a pedidos, preparei dois vídeos que vão justamente abordar a integração com o backend. Para backend vou utilizar o Json Server - Fake rest API que permite utilizarmos uma API Rest construida em Javascript de forma simples e rápida. Lembrando que o Json Server, é uma Fake Rest API e recomendo sua utilização apenas para efeito de testes, prototipação e treinamento. Neste segundo e último vídeo vou abordar a implementação de um CRUD usando Json Server. Para este CRUD vou utilizar um formulário Modal e a diretiva NgMessage para validação de formulários.

UI GRID Avançado – Paginação Externa – Ordenação Externa – Filtro Externo – Aula 1

Tags: , , , , , , , |

Olá pessoal, venho apresentar o primeiro vídeo sobre UI Grid Avançado, cuja a proposta é mostrar um exemplo completo da utilização do Ui Grid. Na primeira série que criei e está disponível no canal e blog, procurei apresentar a maioria das funcionalidades e me limitei a não apresentar um exemplo real integrando a grid com o backend. Agora, atendendo a pedidos, preparei dois vídeos que vão justamente abordar a integração com o backend. Para backend vou utilizar o Json Server - Fake rest API que permite utilizarmos uma API Rest construida em Javascript de forma simples e rápida. Lembrando que o Json Server, é uma Fake Rest API e recomendo sua utilização apenas para efeito de testes, prototipação e treinamento. Neste primeiro vídeo vou abordar a paginação externa. Neste modelo de paginação, ao inves de trazermos todos os dados do backend de uma única vez e paginar do lado do cliente, trazemos apenas o conteúdo da página que desejamos. Esta característica melhora a performance da paginação, principalmente quando trabalhamos com um banco de dados grande ou quando o volume de dados que queremos retornar na grid é muito grande.

Paulo Eduardo
Geek desde criança, sempre me interessei por games, filmes e tecnologia. Sou graduado em engenharia da computação pela PUC Campinas. Possuo mais de 15 anos de experiência em desenvolvimento, com foco maior em desenvolvimento web, gestão de times e mais recentemente desenvolvimento mobile utilizando HTML e Javascript.

Termos como #backend, #frontend e #fullstack fazem parte do meu dia a dia.

Não deixe de acompanhar meu blog, canal youtube e meus produtos digitais.

Divirta-se e bons estudos. :-)
Paulo Eduardo on sabyoutubePaulo Eduardo on sabinstagramPaulo Eduardo on sabgithubPaulo Eduardo on sabfacebook
✌(◕‿-)✌ Tempo Limitado - Tenha acesso a nossa área de DownloadsClique Aqui - É Grátis
How to whitelist website on AdBlocker?