Acesse nosso Fórum

Front-end Week

Uma overdose de eventos e palestras sobre front-end em uma semana.

por Diego EIs 27/06/2017 Comentários
Imagem de destaque do post Mas afinal, o que está acontecendo com a automação?
Automação Mercado e comportamento

Mas afinal, o que está acontecendo com a automação?

Quanto tempo você acha que vai demorar até que as máquinas façam o seu trabalho melhor do que você?

por Tailo Mateus Gonsalves
Imagem de destaque do post Indo além no Mundo React-Native
JavaScript Mobile ReactJS Código

Indo além no Mundo React-Native

Um estudo pessoal sobre as possibilidade do React Native.

por Jose Urbano Duarte Junior
Imagem de destaque do post Performance do Tableless estático
Código middleman CSS HTML Técnicas e Práticas hugo

Performance do Tableless estático

Uma análise simples de velocidade do Tableless depois da mudança para código estático.

por Diego Eis

JavaScript

Indo além no Mundo React-Native

Um estudo pessoal sobre as possibilidade do React Native.

Seu primeiro bot para o Telegram

Nesse artigo vamos mostrar o desenvolvimento de um BOT muito simples utilizando a API do Telegram.

Páginas acessíveis com o HaTeMiLe

O HaTeMiLe é uma biblioteca que utiliza os Padrões Web para resolver problemas de acessibilidade. Entenda melhor como ela funciona.

O fim da profissão front-end

O front-end como você conhece vai morrer.

Como criar aplicações em tempo real usando Node.js e RethinkDB

Sobre o RethinkDB Se você precisa de um banco de dados NoSQL que funcione com dados JSON e tenha suporte completo para buscas em tempo real e uma mistura de modelos entre SQL e NoSQL, então uma boa opção é o RethinkDB. Trata-se de uma base de dados em código aberto em que todos os dados JSON são persistidos em tabelas como um banco de dados SQL convencional, permitindo que você execute queries entre múltiplas tabelas utilizando o comando clássico join.

Criando a sua primeira aplicação web com React

Um exemplo prático de como criar seu primeiro código com o Create React App.

O futuro das interfaces: Chatbots

Estamos acostumados a interagir diariamente com interfaces gráficas, seja no computador, celular, tablet, smart tv, etc. Naturalmente incorporamos a utilização dessas interfaces para obter nossos objetivos no dispositivo em questão, seja fazer uma busca no google, ver uma página no Facebook, ler um artigo em um portal de notícias ou escolher um filme no Netflix. Podemos não perceber, mas quando ligamos para um call-center onde a máquina (URA — Unidade de Resposta Audível) nos pede para dizer em voz alta o que desejamos, ou o número correspondente ao que queremos, também estamos interagindo com uma interface de voz para atingir nosso propósito.

Sass

Bulma: framework CSS baseado em flexbox

“Inspirado pelo Bootstrap, o Bulma visa oferecer a todos a alegria de fazer o design do site, com a simplicidade do flexbox e a elegância de Sass.” – Jeremy Thomas, criador do projeto Bulma.io.   Como o título diz, o Bulma é um framework CSS baseado na tecnologia flexbox, que já tem uma grande compatibilidade entre os navegadores. O pacote contém todos os elementos mais comuns como botões, formulários, menus, tabelas, títulos, notificações, barras de progresso e um simples sistema de grid (basta adicionar uma coluna, o resize das colunas é automático).

Sass vs. LESS vs. Stylus: Batalha dos Pré-processadores

Ter em mãos o verdadeiro poder de um pré-processador CSS é uma aventura. Existem incontáveis linguagens, sintaxes e funcionalidades todas prontas para uso imediato. Nesse artigo iremos falar sobre diversas funcionalidades e benefícios de usar três pré-processadores diferentes: Sass, LESS e Stylus.

Bootstrap 4 Alpha

O framework Bootstrap chega na versão 4 (alpha) com pré-processador Sass e outras mudanças.

Criando Layouts com Susy Framework

Conheça o Susy Framework e desenvolva layouts facilmente com ele.

Grid simples com SASS

Criando um grid simples com SCSS.

Workflow Front-end

O desenvolvimento em html, javascript e CSS é uma forma mágica de se construir um mundo novo a cada linha de código. Os mágicos do front-end precisam de cartolas para que retirem seus coelhos.

Em um relacionamento sério com generators front-end – Parte 2

Na parte 2 de nossa série, vamos falar de Yeoman, um generator que, na minha opinião, é bem completo e atende a grandes necessidades na criação de um projeto.

ReactJS

Indo além no Mundo React-Native

Um estudo pessoal sobre as possibilidade do React Native.

O fim da profissão front-end

O front-end como você conhece vai morrer.

Hello World com React, do rascunho até o primeiro componente

Há muito tempo eu queria fazer um Hello World com React, mas nunca tinha tempo por que eu mudei de área há uns 3 anos, ficando mais na parte de gestão de produtos e times, deixando quase que totalmente o desenvolvimento e a escrita de código. Por isso, senti na pele o que os iniciantes sentem quando precisam fazer um simples Hello World de uma tecnologia nova. São tantos artigos falando coisas diferentes, usando setups diferentes, na sua maioria complexos e que não explicam as coisas com simplicidade.

Criando sua aplicação React em 2 minutos

Configurar aplicações que utilizam React pode ser uma tarefa árdua e complexa... Babel, Webpack, ESLint, Autoprefixer... Mas agora não mais! Com o Create React App, é possível configurar o projeto em menos de 2 minutos!

ReactJS 101

Uma introdução a biblioteca para criação de interfaces do Facebook

Introdução ao Redux

Uma breve explicação sobre a arquitetura Redux e suas principais características

Introdução ao webpack

Conheça o webpack: um bundler que permite dividir seu código em múltiplos módulos para serem lidos sob demanda.

Design

Um comentário sobre a desnecessária fragmentação da profissão designer

Discutindo um pouco sobre a separação das disciplinas que compõe a profissão de Designer para Web

O novo formato de arquivo do Sketch 43

Algumas informações sobre o novo formato de arquivo do Sketch 43

O futuro das interfaces: Chatbots

Estamos acostumados a interagir diariamente com interfaces gráficas, seja no computador, celular, tablet, smart tv, etc. Naturalmente incorporamos a utilização dessas interfaces para obter nossos objetivos no dispositivo em questão, seja fazer uma busca no google, ver uma página no Facebook, ler um artigo em um portal de notícias ou escolher um filme no Netflix. Podemos não perceber, mas quando ligamos para um call-center onde a máquina (URA — Unidade de Resposta Audível) nos pede para dizer em voz alta o que desejamos, ou o número correspondente ao que queremos, também estamos interagindo com uma interface de voz para atingir nosso propósito.

Reação é melhor que previsão

Entender o usuário é algo difícil. Você pode perceber isso facilmente comparando a sua forma de usar algum serviço de internet, digamos o Facebook, com qualquer outra pessoa ao seu redor. Provavelmente você tem um costume totalmente diferente de navegar, consumir conteúdo, comentar etc. Pessoas diferentes, usam de formas diferentes um mesmo produto e isso é totalmente normal. É por isso que tentar prever cenários para desenvolver um produto para internet é algo complicado.

Como organizar e nomear o conteúdo do projeto?

Pode até parecer uma questão simples ou de pouco valor no projeto, mas a verdade é que a forma que você solucione essa ponto será determinante para o sucesso e o card sorting é o melhor caminho! O card-sorting é uma técnica usada para descobrir como o usuário classifica determinada informação em sua mente. Muitas pessoas acreditam que podem classificar a informação pelos outros pois acham que sabem como será a melhor forma.

Indexando mobile-first – Google anuncia novidades

Segundo o Google, atualmente a maioria das pessoas já fazem busca utilizando um dispositivo móvel. Entretanto, os sistemas de classificação ainda costumam olhar a versão desktop do conteúdo da página em questão para dar relevância ao usuário. Pensando em mobile-first, isso pode trazer alguns problemas caso a página mobile tenha menos conteúdo do que a página desktop porque os algoritmos do Google não estão avaliando a página que está sendo vista pelo usuário da página mobile.

Um software para front-end e UI Designers

Já faz um tempo que tento encontrar um software que seja bom para fazer o design das interfaces, em que eu possa compartilhar protótipos e ainda fazer as animações de UI. Comecei a usar o Adobe Experience Design, que no começo foi uma boa experiência, mas como sabemos, a Adobe geralmente demora um pouco para evoluir os seus softwares (também quando evolui, o bicho pega…rs). Sinto falta de maiores opções para animações de interface, uma coisa simples como fixar o header em um protótipo, é impossível.

Artigos