Blog SW9

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

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.

UI GRID Componente de Grid para AngularJS – Final

Tags: , , , , , , |

UI GRID - Componente de Grid para AngularJS Quem nunca precisou implantar uma grid de dados em sua aplicação e se deparou com as perguntas. Qual componente usar? Qual o melhor? Como usar? Com esta série de vídeos pretendo ajudar os desenvolvedores a encontrar e implantar a melhor solução de grid. Ao todo vou apresentar 3 componentes de Grid que possuem uma infinidade de recursos e possibilidades para deixar sua aplicação web mais profissional e amigável. Lembrando que todos os grids apresentados aqui são componentes gratuítos e desenvolvidos em Javascript. Dando continuidade a apresentação do UI Grid, componente construído para trabalhar e usar todo o potencial do framework AngularJS, neste vídeo irei apresentar as funcionalidades: validação e exportação de dados com paginação externa ativa. Eu espero que gostem do vídeo.

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?