Artigos

imagem
Temos a seguinte classe que representa um usuário no nosso sistema:
java
Para salvar um novo usuário, várias validações são feitas, como por exemplo: Ver se
o nome só contém letras, [**o CPF só números**] e ver se o usuário possui no mínimo
18 anos. Veja o método que faz essa validação:
java
Suponha agora que eu tenha outra classe, a classe `Produto`, que contém um atributo
nome e eu quero fazer a mesma validação que fiz para o nome do usuário: Ver se só
contém letras. E aí? Vou criar outro método para fazer a mesma validação? Ou criar
uma interface ou uma classe que tanto Ùsuario` quanto `Produto` estendem? Não faz
muito sentido né? Como resolver esse caso sem repetir código?
## Anotações
No Java 5 um novo recurso foi introduzido à linguagem, as anotações. Elas permitem

que metadados sejam escritos diretamente no código.
Metadados são, por definição, dados que fazem referência aos próprios dados.
Para nos ajudar a entender o conceito de metadados vou usar a definição feita pelo
autor Eduardo Guerra no livro [**Componentes Reutilizáveis em Java com Reflexão e
Anotações**]:
> "_No contexto da orientação a objetos, os metadados são informações sobre os_
_elementos do código. Essas informações podem ser definidas em qualquer meio,_
_bastando que o software ou componente as recupere e as utilize para agregar novas_
_informações nos elementos do código."_
Perceba que, por si só, anotações não fazem nada. Elas precisam que a aplicação as
recupere e as utilize, para que, só assim, elas consigam nos fornecer algo que
possamos usar para realizar alguma tarefa.
Voltando ao nosso problema, vamos criar uma anotação para validar a idade mínina do
usuário. Para isso, vamos anotar nossa classe:
java
Se olharmos nosso código perceberemos que ele não compila, pois falta
implementarmos a anotação `@IdadeMinina`. Logo, precisamos criar uma nova classe
com o nome IdadeMinima:
java
Mas, pensando bem, estamos criando uma classe? Não estamos! Portanto, a
nomenclatura é diferente para uma anotação. A forma correta seria:
java
Estranho, né? Mas foi o jeito que o pessoal do Java fez para falar que esse arquivo
se trata de uma anotação.
Agora temos que anotar nossa interface com algumas anotações obrigatórias para que
o Java entenda onde e quando sua anotação pode ser utilizada, sendo elas:
- @Retention - Aqui nós falaremos para a nossa aplicação até quando nossa anotação
estará disponível.
- @Target - Aqui passaremos os elementos que podem ser anotados com essa anotação.
Até onde nossa anotação estará disponível? Precisamos que ela seja executada quando
o usuário enviar os seus dados, e isso acontece quando nossa aplicação está
rodando, logo precisamos dela em tempo de execução, _Runtime_:
java
E quem será anotado? Que elemento faz sentido ser anotado com uma anotação que
verifica se o usuário tem idade suficiente? Um atributo, certo? Logo, um _Field:_
java
Agora que já especificamos o contexto da nossa anotação, precisamos falar qual a

idade mínima que a nossa anotação deve usar para validar a idade do usuário, para
isso, vamos criar uma propriedade na nossa anotação chamada `valor`
java
Nossa anotação está completa, vamos agora anotar o atributo `dataNascimento` da

classe Ùsuário` com ela:
java
Fazendo apenas isso, receberemos um erro de compilação. Precisamos passar a idade

mínima para a nossa anotação, logo:
java
Para validar essa anotação vamos criar um usuário e passar para um método
`validador()`:
java
Agora vamos criar o método `validador()` que retornará um `boolean`
java
O problema de criar nosso método dessa forma é que novamente estamos nos limitando
a validar apenas usuários, só que nossa meta é validar qualquer objeto.
Para isso, podemos fazer uso de [**Generics**] que, no nosso caso, irá permitir
receber um objeto de qualquer tipo:
java
Agora estamos falando que iremos receber um objeto de tipo genérico `T`. Mas fazer
isso não é suficiente, precisamos validar esse objeto. E como validamos um objeto
que não sabemos o tipo?
Precisamos descobrir, em tempo de execução, informações a respeito do objeto que

irá chegar no nosso método, logo, podemos usar [**reflexão**]. Com reflexão podemos
descobrir e operar dados da classe. Então, primeiramente, vamos pegar a classe
desse objeto:
java
Com isso conseguimos operar sob a classe referente ao tipo do objeto recebido.
Primeiro, vamos descobrir qual atributo da nossa classe está anotado com o
`@IdadeMinima`.
Para descobrir isso, vamos iterar sobre os atributos da classe usando o método
[getDeclaredFields()]:
java
Agora estamos iterando por todos os atributos da classe do nosso objeto. O próximo
passo é descobrir qual campo está anotado com a nossa anotação.
Vamos usar o método [**isAnnotationPresent()**]. Esse método verifica se o campo

contém a anotação passada e retorna um `boolean`.
java
Caso entre no ìf` saberemos que o campo possui a anotação ÌdadeMinima`. Só falta
compararmos a idade mínima que atribuímos na nossa anotação com a idade passada.
Para fazer isso vamos pegar a nossa anotação.
Para conseguir pegar a nossa anotação usaremos o método [**getAnnotation()**]

passando a nossa anotação:
java
Temos um objeto do tipo da nossa anotação, com ele conseguimos pegar a idade mínima
que setamos. Agora precisamos, também, da idade passada pelo usuário.
Para acessar o valor de um atributo `private` precisamos falar que esse atributo
está acessível, desta forma:
java
Mas perceba que não recebemos a idade do usuário, recebemos a data de nascimento
dele. Precisamos pegar esta data e descobrir a idade do usuário. Para pegar o valor
do atributo anotado com `@IdadeMinima` vamos usar o método [**get()**] da classe
`Field`:
java
Perceba que fizemos um cast para `LocalDate`, pois o método `get()` nos retorna um
Òbject`.
Para finalizar, vamos comparar para ver se o período entre `dataNascimento` e a

data atual é maior ou igual ao valor que colocamos como idade mínima na nossa
anotação:
Na comparação iremos usar o método [between()] que recebe como parâmetro duas datas
para serem comparadas, o método [now()] para obtermos a data atual e o método
[getYears()] para conseguirmos saber o valor do período em anos:
java
Perceba que pegamos o período em anos e comparamos para ver se o valor é maior ou
igual a ìdadeMinina.valor()` que nada mais é do que aquele valor que colocamos na
nossa anotação. Além disso, no final retornamos falso, pois caso nenhum campo do
objeto possua a anotação `@IdadeMinima` ele não pode ser validado.
Agora, para testar, vamos criar um usuário e printar o retorno do nosso método
validador:
java
A data de nascimento do usuário criado é 13/01/2005, logo, comparado com a data

atual resultará em `false`. Vamos ver:
imagem` consegue validar qualquer classe que tenha nossa anotação.
## Conclusão
Neste post conseguimos descobrir o poder da reflexão, realmente ela nos ajuda e
muito quando precisamos operar sobre a classe dos objetos dinâmicamente.
Com anotações fomos capazes de marcar os elementos da nossa aplicação para que
nosso método que usa reflexão consiga captar informações úteis para que fosse
possível executar nossa lógica de validação.
Usar [reflexão] é muito útil quando queremos criar algo mais genérico, mas
precisamos ter cautela pois com reflexão, operamos sobre os tipos dos objetos
dinamicamente e isso faz com que algumas otimizações da máquina virtual não sejam
executadas. Então temos que tomar cuidado para ver onde é realmente necessário o
uso de reflexão.
Para saber mais a respeito de reflexão e metadados, a Alura possui o curso [**Curso
Java Reflection: mágica e meta programação**], onde é mostrado várias outras
funcionalidades legais que o Java nos traz para trabalhar com reflexão.
Algo bem comum no Android é que queremos manter o estado atual quando fazemos a
rotação do celular, como vimos [**nesse artigo**] !
Quando precisamos armazenar muitos objetos no momento que viramos a tela, por
exemplo :
- uma lista;
- três fotos que foram tiradas e ainda não salvamos o seu caminho;
- o tempo que o usuário está naquela activity.
Vamos ver como ficaria o código para armazenarmos tudo isso :
Java
Nada muito díficil, agora temos que restaurar tudo isso :
Java
Ah, está bem tranquilo até agora, mas vamos dificultar um pouquinho, pense que
estamos numa tela um pouco mais complexa, que estamos tratando com muitas
informações, nosso código ficaria muito grande, tanto para salvar o estado quanto
para restaurar.
Para facilitar esse processo todo vamos utilizar uma API que vai resolver nosso
problema, chamada **[Icepick]**.
Vamos traze-la para o nosso projeto, para isso iremos mexer no nosso `gradle` :
java
Legal, já trazemos a API agora vamos utiliza-la.
Precisamos informar quais são os objetos que queremos que sejam armazenados e
restaurados, para isso usaremos uma Ànnotation` em cada objeto que será necessário
persistir para aquela Àctivity` :
Java
Mas só anotar não é necessário, precisamos ter certeza que serão salvos e
restaurados para isso temos que invocar alguns métodos que realizam esse
procedimento :
java
Através desses métodos todo aquele procedimento de colocar ou retirar o objeto do

`bundle` fica bem mais simples, pois quando anotamos os objetos, a própria API cria
um identificador e utiliza no momento que salvamos e restauramos esses objetos.
Já imaginou que teríamos de fazer linha por linha para cada objeto que precisávamos
guardar ? Dessa forma, todo aquele trabalho que teríamos para cada objeto, estamos
substituindo em apenas uma única linha :)
Quer conhecer mais sobre Android ? Aqui na Alura temos [**vários cursos**] bem
bacanas!
Nos dias 25 e 26 de agosto em Porto Alegre e nos dias 01 e 02 de setembro em

Fortaleza, rolou a maior conferência de JavaScript do universo, a BrazilJS.
No episódio de hoje do Alura Live, convidamos Erick Krominski, apresentador do

Shark Tank Brasil, que foi o host do evento e o Artur Adam, que faz parte dos times
da Alura e Caelum e que deu uma palestra super bacana lá.
https://www.youtube.com/watch?v=EdDTBEXni_E
Quer saber mais sobre o que rolou? Assista essa [live completa.]
Conheça alguns cursos e carreiras do mundo web:
- Quer dar seus primeiros passos com JavaScript? [**Lógica de programação I:**] Os
primeiros programas com Javascript e HTML.
- Avance e evolua com JavaScript e Typescript: [**JavaScript avançado I:**] ES6,

orientação a objetos e padrões de projetos. [**TypeScript parte 1:**] Evoluindo seu
Javascript.
- Quer aprender novos fundamentos? [Meteor:] Crie single page applications com
JavaScript. [React Native parte 1:] Criando apps nativas com JavaScript e React.
- Quer seguir uma carreira JavaScript na web? Aqui na **Alura** temos uma
[**Formação JavaScript.**]
Não deixe de nos seguir twitter: [Gabriel Ferreira], [Erick Krominski], [Artur
Adam] e a [Alurinha]! :D
Como formatar uma moeda utilizando o Python?
Sou programador de uma loja online brasileira e, recentemente, decidimos

implementar a venda de produtos para Portugal, com o intuito de aumentar nossa
clientela. Para isso, precisamos converter os preços de Real para Euro.
Temos uma função já implementada para realizar a conversão, que toma como parâmetro
o valor em Real como float e retorna o valor em Euro, também float:
python
Vamos testar nosso código:
python
A função funciona bem! Mas esse resultado basta? Afinal, o que significa todo esse
número solto?
Repare que temos um valor com 7 casas decimais (o que atrapalha a legibilidade),
sem indicação nenhuma do que estamos nos referindo, do significado dele. Qual o
sentido desse número?
Precisamos tornar o valor convertido mais legível, formatá-lo. Queremos transformar

todo esse número em **12,46 €**, o padrão de Portugal. Como podemos fazer isso?
## Arredondando um número com a função `round()`
O primeiro passo para formatar o número é arredondá-lo, afinal não podemos deixar
um valor com 7 casas decimais para nossos clientes.
Uma simples solução para isso é obtida através da função nativa do Python
**[round()]**, que toma como parâmetro o número a ser arredondado e a quantidade de
casas decimais que queremos:
python
E já temos o valor arredondado em 2 casas decimais:
python
## Substituindo um caractere de uma string com o método `replace()`
Precisamos, agora, transformar o `.` em `,`, para seguir o padrão. Para isso,
podemos usar o método `replace()` dos objetos string, especificando **o que** e
**para que** queremos substituir nos parâmetros, dessa forma:
python
Vamos testar o `replace()`:
python
Opa! Recebemos uma exceção!
A exceção, de tipo ÀttributeError`, indica que o tipo float não tem nenhum
atributo ou método `replace`. Isso é porque o `replace()` é um método da classe
string, ou seja, temos de transformar nosso valor convertido de float para string.
Vamos de novo:
python
E o resultado:
python
Agora sim! Enfim, precisamos apenas adicionar o símbolo do Euro, o que pode ser
feito com uma simples formatação de string:
python
Vamos ver como fica nosso valor agora:
python
Ótimo! Realmente conseguimos formatar nosso valor no padrão português de moeda.
## Suportando mais de uma moeda e seguindo padrões diferentes
Se tivéssemos um número maior, como **1000.50**, e quiséssemos agrupar o número

pelos milhares, transformando em **1.000,50 €**, o que faríamos?
Além de um cuidado extra para não substituir o `.` do agrupamento por uma `,` com o
`replace()`, precisamos de um código que saiba onde o agrupamento deve ser feito.
Outro problema é que estamos restritos ao padrão português. E se, por exemplo,
quiséssemos abrir as portas para clientes estadunidenses?
O padrão não seria mais **12,46 €**, mas sim **$12.46**. Um outro caso seria voltar
o valor em Real, portanto, o padrão seria **R$ 12,46**...
Será que precisamos implementar uma maneira diferente de formatar moeda para cada
país?
## Conhecendo o módulo `locale`
O Python nos oferece um módulo inteiro dedicado a serviços de internacionalização -

permitindo que nós, programadores, consigamos lidar facilmente com possíveis
problemas culturais em uma aplicação - o módulo **[locale]**.
A partir desse módulo temos diversas funções que podem nos auxiliar na conversão de
formatações de certas especificidades, como tempo e dinheiro.
No nosso caso, podemos usar a função `locale.currency()`, passando o nosso valor

que queremos formatar como parâmetro:
python
Vamos testar:
python
Epa! Novamente uma exceção, dessa vez do tipo `ValueError`, indicando que
formatação de moeda não é possível usando o `locale` padrão, que é o `C`.
O `C` é o `locale` mais simples, sem as definições específicas para realizarmos a

operação que queremos.
## Definindo um _locale_ específico com a função `setlocale()`
Precisamos, então, definir um `locale` em nosso programa, para passar por cima do
padrão. Para isso, usaremos a função `locale.setlocale()`, que necessita de dois
argumentos:
- `category`: A categoria que define o tipo de operação que será alterado para o
`locale` especificado
- `locale`: Uma string que representa o _locale_ que queremos
Vamos dar uma olhada nas possibilidades de uso desses dois parâmetros. Em primeiro
lugar, as categorias permitidas são:
- `locale.LC_CTYPE` - Funções relacionadas a caracteres
- `locale.LC_COLLATE` - Ordenação de strings
- `locale.LC_TIME` - Formatação de tempo
- `locale.LC_MONETARY` - Formatação de valores monetários
- `locale.LC_MESSAGES` - Exibição de mensagens
- `locale.LC_NUMERIC` - Formatação de números
- `locale.LC_ALL` - Combinação de todas as categorias
Como estamos tratando de formatação de moedas, usaremos a categoria `LC_MONETARY`.
No caso do parâmetro `locale`, as strings aceitas dependem do sistema em que o

código está rodando. Por exemplo, em sistemas baseados em UNIX, podemos ver uma
lista dos _locales_ registrados em nossa máquina com o seguinte comando no
Terminal:
python
No Windows, a coisa complica um pouco. Podemos até ver uma **[lista de locales
publicada pela Microsoft]**, mas possivelmente existem elementos nessa lista que
não funcionem em seu sistema e, ainda, _locales_ no seu sistema que não estão na
lista.
Como estou trabalhando no Linux e quero converter para Dólar americano, usarei o
_locale_ **en_US.UTF-8**:
python
O método `setlocale()` retorna uma string nos mostrando o _locale_ que escolhemos:
python
## Formatando moeda com a função `currency()`
Agora sim, basta usarmos a função `currency()`:
python
E temos como retorno:
python
Tudo resolvido! Repare que a função `currency()` chegou até a arredondar o valor
pra gente, tirando nossa necessidade de usar a função `round()`! Vamos testar com
um valor mais alto, para ver como fica:
python
O resultado:
python
Tudo bem, mas queríamos que, na formatação, os milhares ficassem agrupados, lembra?
Para isso, além de enviar o valor, também podemos passar um outro argumento pro
método `currency`: o `grouping`.
O parâmetro `grouping` espera receber um boolean, que, por padrão, é **False**.

Para agruparmos, então, basta indicar como **True**:
python
Dessa vez:
python
Exatamente como o padrão estadunidense!
> Outros parâmetros que podemos definir são **_symbol_**, que define se queremos o
símbolo da moeda (como por exemplo o **$**) e é **True** por padrão, e
**_international_**, que define se queremos usar o símbolo internacional da moeda
(como por exemplo **USD**) e é por padrão **False**.
## Conclusão
Nesse post, começamos com a necessidade de formatar uma moeda em Euro usando os
padrões corretos.
Tentamos, em primeiro lugar, funções como `round()`, para arredondar o valor, e

métodos como `replace()` e `format()`, para ajustarmos a string do valor em Euro
formatado, e confirmamos que é possível até um certo ponto - funciona, mas podemos
encontrar dificuldades.
Conhecemos, por fim, o módulo `locale`, que consegue solucionar os problemas de

internacionalização sem exigir muito do programador. No nosso caso, usamos a função
`currency()` definida nesse módulo.
## Para saber mais
Quer saber mais sobre o poder do módulo `locale` no Python? É sempre uma boa ler a
**[documentação]** para sabermos o que podemos fazer!
E aí? Ficou mais simples formatar uma moeda agora, não é? E ainda sabemos onde
pesquisar caso precisemos de um código que leva em consideração aspectos culturais!
Quer aprender mais sobre Python? Dê uma olhada em **[nossos cursos na Alura]** e
continue estudando!
imagem
Fomos chamados para implementar um sistema em uma loja de produtos eletrônicos que
ajudasse no controle das quantidades de produto que temos em loja.
Começamos alinhando quais eram as operações que o cliente esperava poder realizar
nesse controle de produtos.
Segundo ele, era preciso primeiro **inserir um produto**, depois precisavam poder
sempre **ver quantos produtos haviam lá**.
Então começamos desenvolvendo esse código para adicionar produto.
java
Neste caso, usamos **Servlets**, porém percebemos que o código acabou ficando muito
grande e não fizemos nem metade das coisas que o cliente pediu. Resolvemos apenas a
parte de inserção de produtos, mas ainda faltam as features de ver, atualizar e
remover.
Se considerarmos isso, ao final teríamos um código imenso e, consequentemente,

prejudicaríamos a legibilidade e manutenção.
E como poderíamos resolver esse problema?
## Utilizando Spring Framework
Uma forma mais elegante de resolver esse problema de códigos compridos e pouco
legíveis pode ser utilizando o Spring.
O Spring é um [**framework**] que facilita bastante o desenvolvimento, ou seja com

ele nós temos a legibilidade de código maior, implementações com menos código,
facilidade na manutenção de código. Com isso teremos uma **entrega mais rápida**
também.
Para começar, precisamos antes de mais nada criar um projeto.
## Criando o projeto
Para criar o nosso projeto temos que acessar [o site do spring] e colocar as
dependências que queremos, mas quais queremos?
Nossa aplicação tem que ser **web**, para ser um acesso mais dinâmico, ou seja
podemos acessar de qualquer dispositivo.
Como toda a aplicação web ela tem dados, e esses **dados** precisam ser guardados
em algum lugar então precisamos de um **banco de dados**.
Tem que fazer o mapeamento das classes para o banco, para agilizando o processo em
relação ao banco.
Então vamos usar a dependência **Web** para ser uma aplicação web que contenha o
tomcat já incluso para que a gente não tenha que fazer toda a configuração.
**Mysql** vai ser o banco de dados que vamos utilizar nesta aplicação, pois tenho
que salvar em algum lugar os dados. Com isso além de salvar, podemos alterar,
remover, ou pesquisar por dados que estão dentro do banco.
**JPA** para persistir nossas classes no banco de dados, pois assim vamos fazer o
mapeamento das nossas classes e fazer a criação de maneira automática.
imagem** que incrementa de um em um, assim o id não se repete.
Sabendo disso tudo, precisamos alguma coisa para mapear os atributos de **Nome** e
**Quantidade**, como nome e quantidade estão ligados a um produto, então vamos
criar um pacote chamado modelo. Dentro desse pacote também criaremos uma classe
produto com esses atributos e mapear como uma entidade.
java
Agora criamos esses atributos no banco de dados, mas ainda não inserimos,
pesquisamos ou alteramos nada até o momento. E como isso pode ser feito? Será que
dá para fazer direto na Entidade?
## Repositório
Quando pensamos em inserir, pesquisar, alterar dados, logo pensamos em **DAOS** ou

até mesmo em comandos SQL, isto é muito trabalhoso. Mas então como vamos fazer a
persistência dos dados? Na classe de entidade?
Iremos fazer isto nós [**repositórios**], pois facilita demais o processo do

**CRUD.** Por boas práticas não vamos fazer dentro da classe entidade.
O repositório tem uma interface chamada [**CrudRepository**] que nos permite fazer
um CRUD dos nossos dados, sem que a gente escreva uma linha de código.
Precisamos criar um pacote chamado repositório e uma interface chamada

ProdutosRepository.
Nesta interface o que precisamos para fazer ela fazer essa persistência de dados ?
Temos que estender a interface **CrudRepository** e passar a entidade que queremos
e o tipo do ID dela. Com isto o nosso **CRUD** está pronto.
java
Porém como vamos controlar a aplicação para saber o que vamos fazer?
## Controle
Os controles são o intermediário da nossa aplicação, ou seja ele fazem a

comunicação com a parte frontal da nossa aplicação e com o banco de dados. Então
ele pode fazer a inserção no banco de dados. Fazemos o controle da aplicação
conforme o protocolo [http]. Como podemos ver o **http tem os métodos: POST, GET.**
Vamos usar eles como para controlar nossa aplicação?
Nós vamos fazer esse controle por meio de [anotações], mapeando com **@GetMapping,
@PostMapping** para seguir o protocolo http. Beleza, agora fazemos para que serve
essas anotações e o protocolo http. Mas como podemos fazer isto na aplicação ?
Bem podemos criar um pacote chamado **controller** e uma classe chamada

ProdutoController para controlar o fluxo da nossa aplicação. Mas se usamos a
anotação @Entity para dizer que a classe Produto é uma entidade, temos que usar
alguma anotação para o controle?
Podemos fazer duas anotações **@Controller e o @RestController**. O @Controller é

usado para sinalizar que é uma classe do **Spring MVC** e bastante usado para
redirecionar views. Já o @RestController faz automaticamente tudo o que o
@Controller faz é retornar tudo em JSON e não precisamos utilizar a anotação
**@ResponseBody**, pois, já está contido nele, então vamos usar o @RestController.
Temos que mapear a nossa classe com o @RestController ficando dessa maneira.
java
Se rodarmos o projeto nada acontece ainda, pois não mapeamos a url do controller,
precisamos fazer isto, de qual maneira?
Se você pensou em uma anotação acertou, temos que usar uma anotação para fazer
isto, está anotação vai ser a @RequestMapping(“url que queremos”).
No nosso caso vamos fazer o na url (/api/produto) ficando da seguinte maneira:
java
Bem fazendo dessa maneira ainda não vai nos retornar nada, pois não fizemos nenhum
tipo de mapeamento de retorno. Como fazer este mapeamento? Utilizando o http ao
nosso favor e fazendo o mapeamento com as anotações @GetMapping, @PostMapping.
java
Mas assim como o RequestMapping temos que passar um caminho para cada anotação, só
que elas tem um coisa de diferente que é ao invés de passar direto temos que
utilizar o parâmetro **value** e o mapeamento delas.
java
Com isto feito percebemos que temos erros :
![]
Este erro dá, pois não temos um alguma coisa que faça uso dessas anotações, o que
podemos fazer para utilizar elas?
Uma boa ideia seria utilizar métodos com retornos para ficar mais simples de se
utilizar, bem se temos que listar usuários é criar um método que contenha um
retorno de uma lista de usuários.
java
Mas o que o que vamos retornar? Bem lembra do nosso repositório lá temos bastante
métodos e um deles é o findAll que busca todos os elementos que estão no banco.
Temos que fazer a injeção de dependência do repositório, podemos fazer está injeção
pelo construtor, mas vamos optar por fazer com uma anotação chamada **@Autowired**
e utilizar os métodos do repositório.
java
Bem vamos testar isto vamos utilizar o **método findAll** para ver se ele nos
retorna os registros do banco de dados.
java
Bem mas na hora que formos testar queremos que nosso retorno um **JSON**, mas como
pode ser feito isto ?
Existe o produces que é o valor que a gente vai produzir, e o consumes que é o
valor que a gente vai consumir. Para o GetMapping nosso vamos produzir o valor em
JSON, dessa maneira.
java
Agora que sabemos disso no nosso @PostMapping como seria? Com o PostMapping seria
diferente, pois, nele nós teríamos consumir os dados da parte frontal para fazer a
inserção no banco de dados, mas para enviar esses dados da parte frontal da
aplicação pro controle, temos que fazer de qual maneira?
Temos uma anotação chamada @RequestBody para enviar pelo o corpo da requisição isso
os dados e nós vamos utilizar ela.
Mas qual o tipo de método que eu crio para isso? Bem vamos criar um ResponseEntity
para retornar as respostas conforme [**http status code**] que é uma das boas
práticas que devemos seguir.
java
## Conclusão
Tivemos o problema em relação aos **DAOS** serem muito longos e resolvemos utilizar
o Spring de outra maneira.
Quando utilizamos o Spring temos as vantagens do framework e conseguimos fazer um

**CRUD** de maneira rápida.
E aí, o que achou do post? Fica até mais fácil trabalhar com o spring agora, não
acha? Se quiser continuar estudando sobre o assunto. Temos uma [**formação Java**]
que fala mais sobre o spring continue aprendendo!
Surgiu a necessidade de implementar uma funcionalidade de envio de arquivos para o

**servidor**, mas como podemos implementar o **recurso de upload** em nosso
sistema?
imagem
Nosso primeiro passo será criar uma classe para representar qualquer tipo de
arquivo, logo podemos ver que um bom nome para a mesma seria Àrquivo`:
java
## Criando o método upload
Após criar e definir o nome de nossa classe estamos pronto para o próximo passo,
vamos começar a implementação do método ùpload`:
java
Bacana, temos o nosso método para realizar o upload, mas por onde podemos começar?
Inicialmente sabemos que um **arquivo** possui o nome e o lugar ao qual ele será
**gravado**, portanto, podemos receber esses 2 parâmetros no nosso método:
java
Quando fazemos upload de um arquivo, além de pegar o nome e o local, precisamos

também pegar o próprio arquivo em si, ou melhor, precisamos pegar os seus **bytes**
que o representa de verdade dentro do computador. Sendo assim, veremos passo a
passo como podemos fazer isso.
## Implementando o método Upload
Temos o caminho e nome do nosso arquivo, porém, como podemos representar um arquivo
em Java? Fazemos isso por meio classe [**File**] passando o nome do arquivo
completo em sua construção.
java
Agora já temos também a representação do nosso arquivo, portanto, o nosso próximo

passo é entender como realmente funciona o upload de arquivos.
## Transferindo arquivos em Java
No processo de upload é realizado a **transferência** do arquivo local em nossa

máquina para o navegador, assim que o navegador termina de carregá-lo já somos
capazes de pegar uma "representação" desse arquivo, com a representação desse
arquivo precisamos agora de fato salvá-lo em nosso servidor.
Nesse momento você deve estar imaginando:
> "Basta apenas pegar o arquivo passado pelo navegador e de uma forma mágica salvá-
lo no servidor."
Mas as coisas não são tão simples assim, o que realmente é feito durante o processo
de um upload é a **leitura byte** a byte do arquivo carregado e depois criado um
novo arquivo passando os bytes lidos.
## Copiando um arquivo byte a byte
Para realizar a **cópia do arquivo** enviado pelo usuário e posteriormante

carregado pelo navegador devemos seguir alguns passos, o primeiro nada mais é do
que criar nosso método responsável por tal operação:
java
Beleza, já temos nosso método declarado, mas por onde devemos começar sua
implementação? Como mencionado anteriormente sabemos que para realizar uma cópia
precisamos de **origem** e **destino**, logo são dois fortes candidatos á serem
parâmetros para nosso método:
java
Repare que declaramos a origem do tipo [**InputStream**] pois é o objeto

responsável por leituras de arquivos em Java, logo podemos ver que
[**OutputStream**] é o responsável pela escrita, ambos pertencem ao pacote
`java.io`.
Sabemos também que iremos ter que ler os bytes do arquivo origem para escrevê-lo no
arquivo destino, podemos fazer isso através de uma variável:
java
Como a palavra `byte` é reservada da linguagem Java criei a variável como **bite**,
também precisamos definir um tamanho máximo do arquivo, fazemos isso através de um
àrray`:
java
Agora precisamos ler os bytes da origem um por um e ir copiando para o arquivo

destino, enquanto os mesmos forem existentes, logo vemos a necessidade de realizar
um loop:
java
Quando estamos trabalhando com operações de leitura e escrita devemos tratar

algumas possíveis exceções, podemos fazer isso através de um **try catch**:
java
Agora que já sabemos como é feito realmente um upload de arquivo e já criamos o

método para realizar a leitura e cópia do mesmo, devemos utilizá-lo no momento de
realizar o upload para de fato copiar o arquivo carregado pelo navegador para nosso
servidor.
Mas até agora não temos uma forma de ler o arquivo carregado pelo navegador, como
resolver o problema? Podemos passar o arquivo via parâmetro para nosso método
ùpload`:
java
Definimos o parâmetro do tipo ÌnputStream` pois sabemos que o mesmo trata-se de

uma leitura, além disso também sabemos que nosso método `copiar` precisa de um
segundo parâmetro, onde será gravado o arquivo. Já temos a representação do nosso
arquivo, precisamos apenas criar um ÒutputStream` para realizar a escrita:
java
Com isso já temos tudo o que é preciso para de fato chamar nosso método `copiar`:
java
Com a nossa classe Àrquivo` pronta, já devemos ser capazes de realizar o upload do
arquivo, o próximo passo será mexer em nosso **front-end**, ou seja, criar um
formulário para enviar o arquivo para nosso **back-end**:
## Buscando arquivos com HTML

O primeiro passo seria criarmos um form, para que sejamos capazes de realizar a
busca do arquivo em nossa máquina:
html
Mas somente a tag form não é capaz de realizar tal necessidade sozinha, precisamos
de alguma forma conseguir buscar um arquivo em nossa máquina e enviá-lo ao
navegador, mas como podemos criar tal recurso?
### Conhecendo o input file
Entre os vários tipos de input's existentes para nosso formulário, um deles é do

tipo **file**, com ele conseguimos buscar e carregar arquivos locais de nossa
máquina para a web:
html
Para finalizar, devemos criar um botão para conseguirmos realizar a submissão do

form:
html
Com isso, teremos o seguinte resultado:
Enviar
Porém se tentarmos realizar o upload do arquivo ainda não iremos ser capazes de lê-
lo em nosso código Java, por que isso está acontecendo?
Por padrão todas as informações são decodificadas ao serem submetidas por um

formulário, isso é definido através da tag [**enctype**] que, quando não definida,
tem seu valor padrão como àpplication/x-www-form-urlencoded`.
Para mudarmos esse comportamente padrão precisamos deixar explícito o valor do

enctype para `multipart/form-data`:
html
## Enviando arquivo do navegador para o servidor
Para fazer o uso da nossa classe Àrquivo`, precisamos de alguma forma realizar uma
requisição para nosso código Java, pegar a representação do arquivo e
posteriormente fazer uso de nossos métodos,
Para maior facilidade no exemplo irei utilizar o framework [**VRaptor**], capaz de

realizar a comunicação web e Java, você pode estar utilizando o framework de sua
preferência:
java
Com isso já devemos ser capazes de carregar e enviar nosso arquivo para o servidor.
Caso fique um pouco confuso sobre os objetos utilizados para gravar, ler ou criar
arquivos, na alura temos [**uma formação Java**] que fala sobre o pacote java.io e
várias outras particularidades da linguagem.
Como os consumidores gastam cada vez mais tempo usando a internet e menos em outros
canais, os anunciantes também são forçados a seguir essa tendência. Os anúncios
devem estar onde as pessoas estão.
O marketing digital não é tão simples e direto quanto o marketing tradicional. Ele
é mais bem produzido em casa e não deveria ser terceirizado para uma agência de
marketing digital por várias razões práticas.
Quando feito em casa, marcas têm maior controle de suas ações e podem ajustá-las
com a velocidade que o meio exige. Por esse motivo, o profissional de marketing
digital é cada vez mais procurado, e essa demanda só tende a crescer no futuro.
**A melhor maneira de se tornar um especialista em marketing digital é começar a

praticá-lo hoje. E a melhor característica do marketing digital é que você pode
começar a fazê-lo em uma escala muito pequena.**
Tudo que é preciso é um computador, uma conexão com a internet e uma pequena
quantia de dinheiro para experimentar. Você pode aprender marketing digital
aplicando seus conceitos em seu próprio miniprojeto agora mesmo!
## **1\. Tornando-se um profissional de marketing digital**
A indústria do marketing digital está crescendo rapidamente e é incrivelmente

competitiva. É fácil para as empresas diferenciarem entre os candidatos que têm
vontade de aprender e aqueles que não estão tão engajados assim.
Essa indústria exige paixão e um desejo pelo sucesso. Você precisa se manter sempre
atualizado, já que empresas como Google, Facebook e Twitter ajustam regularmente
suas plataformas de publicidade e mudam com frequência suas regras.
### **O que devo ler para me tornar um profissional de marketing digital?**
Acompanhar blogs como o [**SEOGadget**], o [Social Media Examiner] e o

[**Hubspot**] vai ajudá-lo bastante na sua caminhada pelo marketing digital. Ter um
bom inglês é fundamental, já que a maior parte do conteúdo de aprendizado no setor
está nessa língua, mas você pode também seguir o blog do [Marketing de Conteúdo],
uma excelente fonte de conhecimento em português.
Procurar conhecer uma rede de suporte, participar de encontros da indústria e

conferências para nutrir relacionamentos com outros profissionais de marketing
digital será essencial.
Experimentar suas próprias ideias e desenvolver projetos pessoais é uma ótima

maneira de aprender e ter o que mostrar numa futura entrevista de emprego.
### **Quais são os conceitos básicos do marketing digital?**
Para trabalhar com marketing digital, você precisa também estar confortável com as
siglas do mercado, como PPC, SEM e SEO. Todas elas representam termos muito
diferentes, e um mal-entendido pode ser um sinal claro de que você ainda precisa de
mais treinamento.
A capacidade de analisar campanhas de marketing digital e entender quais elementos

funcionaram ou não depende bastante da sua capacidade de entender o jargão da
indústria. Por isso, vamos começar com um pequeno glossário:
- API — Application Programming Interface: conjunto de funções disponíveis para

utilizar um software sem conhecer sua implementação
- AdWords: a tecnologia que impulsiona a publicidade PPC (pay per click) do Google.
- A/B Testing: método para testar uma nova técnica de marketing (A) contra um grupo
de controle (B), para verificar sua eficácia.
- CRO — Conversion Rate Optimization ou otimização da taxa de conversão: a taxa de
conversão é o número de pessoas que começam apenas navegando e, depois, tornam-se
clientes, ou seja, fazem uma compra.
- Campanha: mensagens de marketing com um objetivo específico, como aumentar a
conscientização com relação a uma marca ou as vendas de um produto.
- CPA — Cost Per Action, ou custo por ação. O anunciante paga por uma ação do
usuário — como um download, por exemplo.
- CPC — Cost Per Click, ou custo por clique. O anunciante paga este valor por cada
clique recebido em seu anúncio.
- Google Analytics: uma ferramenta gratuita que permite rastrear diferentes
estatísticas a respeito de um site
- Google Trends: uma ferramenta que mostra a densidade de pesquisas por palavra-
chave, seja em comparação com outras ou com relação a um período.
- Influenciador: um especialista em determinado campo que detém grande poder em
comunicar suas opiniões aos seus seguidores, afetando seu comportamento.
- Link building: o processo pelo qual você aumenta a quantidade de links para seu
site. É um dos objetivos de SEO.
- Listagens orgânicas: são os resultados de uma pesquisa na web que não foram
pagos.
- Palavra-chave: um termo ou frase que um usuário procurará por meio de um
mecanismo de pesquisa — como o Google.
- Palavra negativa: o oposto de uma palavra-chave, se um usuário pesquisar usando
essas palavras seus resultados não serão exibidos.
- PR — Page Rank: uma pontuação que indica o quão confiável é um determinado site
de acordo com o algoritmo do Google.
- PPC — Pay Per Click, ou pago por clique. Modalidade em que o anunciante paga por
cada clique recebido em seu anúncio.
- ROI — Retorno Sobre Investimento: o que toda pessoa de negócios gosta de ver. É
todo resultado gerado acima do investimento inicial.
- SEO — Search Engine Optimization, ou otimização do motor de buscas: quando um
site é otimizado para busca, maiores são as chances de ele subir na página de
resultados. Isso torna possível que eles sejam encontrados organicamente.
- SEM — Search Engine Marketing, ou seja, investir dinheiro para se posicionar
melhor nos motores de busca.
- SMO — Social Media Optimization, ou otimização de mídia social: o ato de dirigir
tráfego por canais de mídias sociais para atingir um determinado objetivo.
Você sabe diferenciar seu CPC do seu CPA? Se quiser se destacar em uma entrevista,
fale sobre o ROI de publicidade de uma campanha que já executou.
É fácil falar sobre conceitos criativos e excitantes que você ajudou a desenvolver,
mas o dinheiro fala mais alto. Para conquistar uma vaga como profissional de
marketing digital, será preciso mostrar que você domina as métricas e a linguagem
do mercado.
### **Quais são os principais componentes?**
Os componentes do marketing digital incluem:
- Marketing de conteúdo.
- SEO.
- Pesquisa paga (pay per click).
- Marketing de e-mail.
- Marketing de mídias sociais.
- Marketing de display digital.
- Web analytics.
- Marketing móvel.
É indispensável que você conheça bem cada um deles e saiba qual seu propósito.
O marketing de conteúdo é a estratégia de criar conteúdos interessantes para

auxiliar no processo de compra e atrair de forma orgânica novos consumidores. O SEO
é a otimização de sites e páginas para potencializar esses resultados em motores de
busca.
A pesquisa paga é um dos recursos que o profissional de marketing digital possui

para atrair atenção para as marcas com que trabalha, dando lances em palavras-chave
de interesse do seu público-alvo e pagando pela quantidade de cliques em sua
página.
O e-mail marketing e o marketing de mídias sociais, por sua vez, são recursos para
nutrir e cativar leads. Cursos de [**marketing digital**] podem ajudá-lo melhor a
esclarecer cada conceito, aprender suas funções e orientá-lo, de forma prática, a
fazer cada uma dessas estratégias funcionar no mundo real.
### **Por onde começar a aprender marketing digital?**
Existem programas de MBA e especializações em marketing digital, além de exames de

certificação, como o [Hubspot Inbound Marketing Certification Program] e a
certificação do [**Google AdWords**], que serão essenciais para que você consiga se
destacar nessas carreiras. Entretanto, assistir a esses cursos e obter os
certificados não tornam você um especialista em marketing digital.
Eles ensinam [**fundamentos**], e alguns dos conceitos avançados da prática, mas

conhecimento de verdade vem com a experiência. A melhor maneira de se tornar um
especialista é criando um grande projeto agora mesmo.
Com o passo a passo a seguir você conseguirá aprender o básico e terá o que
mostrar, aplicando o marketing digital em pequena escala.
#### **1\. Crie um blog**
- Escolha um tema pelo qual você é apaixonado e comece um blog sobre isso.
- Aprenda um pouco sobre SEO e escreva artigos otimizados em seu blog.
- Instale o código de acompanhamento do Google Analytics e veja se você está
recebendo algum tráfego para o seu blog.
#### **2\. Aprenda a ler dados e identificar oportunidades**
- Explore as múltiplas possibilidades do Google Analytics.

- Abra uma conta no Google AdWords e faça alguma pesquisa de palavras-chave para
ver o que as pessoas estão pesquisando no Google, para encontrar informações sobre
o tópico do seu blog.
#### **3\. Mantenha suas páginas e redes sociais atualizadas**
- Escreva mais artigos e publique-os.

- Abra uma página do Facebook dedicada ao seu blog e compartilhe os artigos que
escreve em sua página.
#### **4\. Experimente criar pequenas campanhas de publicidade**
- Promova sua página com publicidade no Facebook.

- Incorpore botões de compartilhamento social em seus artigos usando plugins do
WordPress.
- Promova seu blog via AdWords, começando com lances de CPC muito baixos.
#### **5\. Crie uma newsletter para seu blog**
- Inscreva-se para um serviço de e-mail marketing como o MailChimp.

- Incorpore formulários de inscrição de e-mail em seu blog para coletar assinantes.
- Envie um e-mail a seus assinantes sempre que publicar algo em seu blog.
- Promova sua página do Facebook por e-mail marketing e ganhe novos assinantes a
partir do Facebook, num ciclo contínuo.
#### **6\. Monetize seu conteúdo**
- Cadastre-se no Google AdSense e use a publicidade para monetizar seu blog.

- Garanta que seu blog é completamente funcional no mobile.
## **2\. As cinco competências fundamentais do profissional de marketing digital**
Um especialista em marketing digital é aquele que pode construir uma campanha de

publicidade online efetiva, real e conectada com o objetivo de uma organização.
Tarefas comuns que l, pesquisa de comportamento online, exame de tendências e dos

movimentos da concorrência.
Alguns profissionais do marketing digital também [constroem websites], produzem

vídeos e fazem gráficos para usar nas suas operações de publicidade online. Aqui
estão algumas das habilidades necessárias para chegar lá.
### **Um excelente texto e as certificações adequadas**
Você precisará de excelência em habilidades de escrita e deverá, além disso, ser um

comerciante ativo e eficaz. Ter habilidades para utilizar aplicativos de computador
e sites adequados é outra das necessidades. Um diploma universitário com foco em
comunicação ou marketing pode ajudar.
Alguns locais de trabalho podem exigir um nível de graduação que enfatize as

habilidades de escrita, publicidade ou [**tecnologia**]. Se você tem experiência
substancial em mídias sociais, pode ser que consiga um emprego sem precisar de um
grau acadêmico. Mas certificações, como a da Hubspot, são uma forma de provar suas
habilidades.
### **Familiaridade com softwares e automação de marketing**
Você deve ter habilidades com softwares relevantes para a criação de planilhas,
relatórios e documentos. Habilidades com a gravação e edição de vídeo também podem
ser úteis ao profissional de marketing digital.
Uma das dicas importantes para qualquer profissional de social media é aprender a
arte da automação. Algumas tarefas que podem ser automatizadas são o RT automático,
a menção automática, os posts automatizados, dentre outros.
Familiaridade com o digital, como o conhecimento de softwares de automação de

marketing, vai ajudar bastante na hora de se tornar um guru das mídias sociais.
### **Muita criatividade e um olho atento para as tendências de mercado**
Um estudo da Fractl e do Buzzstream descobriu que [**21% dos usuários**] de mídias

sociais não seguiriam uma marca se seu conteúdo fosse muito repetitivo ou chato.
Para manter seus seguidores envolvidos e ser um profissional de marketing digital

eficaz, você deve consistentemente chegar a novas e criativas campanhas. A
criatividade é uma das características fundamentais desse profissional.
### **Capacidade de entender os números e fazer com que os outros entendam também**
Para se tornar um grande profissional do marketing digital, você precisa saber como
traduzir dados até que eles se tornem histórias. A maioria das empresas está pronta
para tomar decisões sobre métricas, e o profissional de marketing digital precisa
conhecer aquelas que são mais importantes e as metodologias certas para transmiti-
las a seus superiores.
### **Habilidades para gerenciar projetos e equipes**
**Habilidades organizacionais e o talento para gerir projetos são outras

necessidades que um profissional do marketing digital não pode deixar de lado.**
Pode ser difícil gerenciar vários projetos com muitos colaboradores, mas essa é uma
habilidade que você precisa desenvolver se quiser se dar bem nessa carreira.
## **3\. Os maiores problemas**
Já reparou que ultimamente somos cada vez mais bombardeados com ebooks, promoções e
conteúdos que pretendem ser a solução dos seus problemas?
Não é preciso fazer um grande esforço para comparar essa situação com a que vivemos
offline, com marcas e publicitários tentando de tudo para conquistar a sua atenção.
Agora, no mundo digital, vivemos quase que os mesmos problemas.
Embora [74% dos brasileiros] nunca tenha feito uma compra pela internet, muitas
vezes o marketing digital dá a entender outra coisa. Para atuar de forma efetiva
como profissional de marketing digital, é preciso estar atento às seguintes
questões.
### **As redes sociais não são apenas um canal de promoção, mas também de
atendimento**
**Boa parte das interações que os clientes terão com uma marca na internet são de
atendimento ou solução de dúvidas. Não adianta nada dar início à presença online de
uma marca sem compreender essa função essencial do canal e, como profissional de
marketing digital, seu papel é desenvolver estratégias que tornem esse atendimento
o melhor possível.**
As redes sociais muitas vezes são menos um canal de promoção e mais um canal de
atendimento, mas não é por isso que o profissional de marketing digital deve se
tornar um profissional de help desk. Um bom atendimento, afinal, é uma das maneiras
mais eficientes que uma marca tem para divulgar a excelência de seus produtos e
serviços, por isso, nunca negligencie essa vocação do marketing digital.
### **A internet nivela a concorrência, mas é preciso criatividade**
Pode parecer surreal, mas um e-commerce pequeno e uma grande loja varejista têm à
disposição os mesmos recursos online. Ainda que o orçamento de uma empresa maior
seja mais gordo, pagar por cliques nem sempre significa conseguir alavancar sua
consciência de marca online.
**Os profissionais de marketing digital aprendem muito cedo que uma presença de
marca valiosa não tem a ver com dinheiro, e sim com encontrar a sua voz e conseguir
realizar conexões com seu público-alvo.**
### **Online, marcas têm uma chance única de conhecer seus consumidores**
Um dos maiores riscos que um profissional de marketing digital corre é achar que
conhece bem demais seu público. Isso pode gerar grandes problemas de planejamento,
estratégia e execução em suas campanhas, e acabar prejudicando os clientes
atendidos por ele. Aproveite a internet para conhecer cada vez mais o público-alvo
de suas ações.
## **4\. O mercado de trabalho**
Se você pretende se tornar um profissional de marketing digital, não há melhor

momento que agora. A economia online está crescendo até [dez vezes mais rápido] do
que a economia tradicional, o que resultará em um déficit de vagas na maioria dos
países.
Existem três posições principais que você pode assumir no mercado de trabalho como
profissional de marketing digital. Analista, gestor e consultor. Confira o que cada
um desses profissionais faz no seu dia a dia.
### **Analistas de marketing digital**
Os analistas de marketing digital fazem o planejamento e a criação de campanhas, e

auxiliam na sua implementação, trabalhando em conjunto com outros profissionais
para tornar forte a presença das marcas para as quais prestam seus serviços.
Essa posição é a primeira que você deve ocupar em sua carreira, sendo um pouco mais
operacional e uma excelente oportunidade de aprender e ganhar experiência nesse
mercado.
### **Gerente de marketing digital**
O gestor, ou gerente de marketing digital, é o responsável pelo planejamento,

controle de metas e pelos relatórios de campanha, que devem ser entregues à
diretoria de marketing ou ao departamento comercial de sua empresa.
**Esse tipo de profissional já costuma ter mais experiência no mercado e passa boa
parte do seu tempo gerindo projetos e lidando com pessoas.**
### **Consultor de marketing digital**
O consultor de marketing digital é um profissional que trabalha por conta própria

ou associado a uma consultoria, e ajuda as empresas a desenvolverem um planejamento
de marketing digital.
Esse profissional é mais independente que os demais e deve ter uma forte veia
empreendedora, pois, além de executar planejamentos, precisa vender seus serviços.
Em constante atualização, deve possuir uma disciplina que os outros dois cargos não
exigem e desenvolver uma metodologia de trabalho própria. O consultor de marketing
digital lida com vários clientes e projetos ao mesmo tempo, o que demanda jogo de
cintura e atualização constante.
### **Como um profissional de marketing digital pode ingressar no mercado de

trabalho?**
Para entrar no mercado de trabalho, uma boa tática é começar a estudar. Durante um
curso de marketing você vai conhecer pessoas que já trabalham na área e outros
estudantes, dando início ao networking necessário para encontrar uma colocação.
Um bom currículo no Linkedin e um projeto pessoal de sucesso são excelentes cartões

de visita para uma futura entrevista de emprego, mas conhecer pessoas é
imprescindível para ficar a par das oportunidades em sua cidade.
### **As tendências e oportunidades do marketing digital**
O Brasil, apesar da crise econômica, passa por um momento interessante no marketing

digital, já que cada vez mais empresas buscam na internet um canal para gerar
vendas e leads.
O crescimento do número de usuários de internet no Brasil e do acesso a

dispositivos móveis coloca o marketing digital como uma obrigação para empresas de
todos os tamanhos, e uma das tendências que parece forte no ano de 2017 é o aumento
da presença de pequenas e médias empresas no universo online.
Existe um interesse cada vez maior dos empresários de PMEs pelo marketing digital,
o que significa que é um excelente momento para se tornar um profissional dessa
área, principalmente se você pretende atuar como consultor.
Outra tendência de mercado para a qual devemos estar atentos é o uso de

dispositivos móveis e a criação e estruturação de campanhas de marketing digital
que os suportem. Websites responsivos e melhorias no SEO que levem em consideração
esse mercado, devem fazer parte dos planos de quem quer se destacar no marketing
digital em 2017.
Para quem trabalha com marketing digital, o ano será de grandes oportunidades. A
carreira nunca esteve tão valorizada e um número crescente de negócios busca formar
suas próprias equipes para fugir do custo alto das agências digitais. Tornar-se
[**mão de obra qualificada**] vai ajudar você a conseguir uma oportunidade nessa
área.
Agora que você já sabe como se tornar um profissional de marketing digital e que
tipo de talentos são precisos, aproveite para assinar a newsletter da Alura! Receba
o melhor do conteúdo aqui do blog direto em seu e-mail e não perca nossas mais
importantes atualizações!
Quer ficar por dentro de assuntos sobre [marketing digital], [marketing pessoal],
[personal branding] e [carreira profissional]? Conheça o blog da [Priscila Stuani]
e fique por dentro das novidades!
Acertou se a sua resposta é tecnologia! Esse setor tem algum tipo de novidade quase
que diariamente seja em _softwares_, _hardwares_, linguagens, entre muitos outros
recursos.
Essa agilidade é necessária para trazer melhores processos e produtos ao mercado.

Porém, essa alta velocidade de transformação evidencia a importância da capacitação
profissional para todos que atuam com tecnologia, ou seja, buscar conhecimento
constantemente.
Quem deseja conseguir as melhores vagas ou alavancar sua carreira precisa ficar
atento às tendências do mercado, para dessa forma oferecer um trabalho otimizado e
que possa suprir as necessidades da empresa.
Ficou interessado? Então confira todas as dicas e sugestões espertas que

preparamos!
## Aumento da produtividade
Não é segredo para ninguém que as empresas desejam profissionais com boa
produtividade. Para conseguir esse nível de excelência é preciso buscar formas
novas, atuais e otimizadas de executar as tarefas e desenvolver os projetos. Pode
ser um novo recurso de um programa, como o _Photoshop_ e _lllustrator_, ou mesmo
entender sobre arquitetura da informação e [**experiência do usuário**].
Com isso, além de adquirir conhecimento, você conseguirá melhorar o seu tempo de
execução das tarefas, pois as atualizações da área de tecnologia surgem para
resolver problemas e apresentar soluções, objetivando o aperfeiçoamento do
trabalho. O resultado é o desenvolvimento dos processos de maneira mais rápida,
consequentemente atendendo a mais demandas.
Isso é muito importante para aqueles que trabalham em empresas, para atender às
expectativas dos gestores em [**produzir com mais agilidade**]. Há também outro
grupo beneficiado: os profissionais autônomos, que conseguem atender mais projetos
e, com isso, aumentar seus ganhos.
## Elevação do nível de empregabilidade
A área de [**tecnologia é uma das que mais têm vagas de emprego em aberto**], mesmo
em tempos de crise econômica. Isso é uma ótima notícia para quem segue a profissão.
Porém, um dos motivos para a grande oferta é a dificuldade em encontrar
profissionais qualificados para ocupar os cargos disponíveis.
E esse é mais um dos motivos para se investir em capacitação profissional. Ao

buscar mais conhecimento aumentam significativamente os níveis de empregabilidade.
Isso é ótimo para quem está buscando o seu lugar ao sol no mercado de trabalho.
Mas talvez nesse momento você se pergunte: e no meu caso, que já tenho emprego,
também é importante? Com toda a certeza! Para conseguir se desenvolver no posto
atual ou conseguir a sonhada promoção.
Vamos a uma dica que vale para todos: faça uma pesquisa para entender quais são as
demandas da sua área. Isto é, quais programas, linguagens e recursos são
importantes e buscados pelos empregadores. Ao encontrar as respostas, invista em
cursos exatamente nesses pontos. Qual é a ideia disso? Tornar-se o profissional que
o mercado necessita.
Aproveite a oportunidade de fazer [**cursos online**] para aprender e desenvolver

mais na sua área. Lembre-se: um bom profissional mantém-se constantemente
atualizado.
## Participação em projetos mais ousados
Qual é o profissional que não sonha em participar de um projeto ousado e importante

da empresa? Ter uma chance de se destacar, alcançar uma promoção, aumentar o
salário, ganhar um prêmio e conseguir uma grande experiência profissional.
É algo realmente [positivo para a carreira], não é mesmo? Mas antes de chegar a

esse ponto, há alguns passos a percorrer — dentre eles, estudar para aprender mais
e ficar antenado nas tendências e novidades do mercado.
Para esse ponto, vale a boa e velha conversa com o seu gestor. Mostre-se
interessado em entender os planos da empresa, para verificar quais são as suas
condições de participar dos projetos mais ousados.
A partir daí, trace um plano pessoal e busque a capacitação necessária para estar
afinado com os objetivos da empresa. Se essa é sua meta, trabalhe dia e noite até
atingi-la.
Por fim, tenha em mente que isso não deve ser negligenciado. Afinal, ninguém quer
perder a grande chance da vida no trabalho por não estar preparado para assumir uma
nova responsabilidade, concorda?
## Apresentação de soluções na hora certa
Imagine a cena: ocorreu um problema no desenvolvimento do site, que compromete a

experiência do usuário. Todos da área estão buscando entender o que ocorreu. E
então, você, um profissional que buscou conhecimento e agora está capacitado,
apresenta a solução. A partir daí, seguramente, ganhará mais respeito e confiança
dos seus gestores.
Esse é apenas um caso fictício, mas que poderia muito bem ocorrer no dia a dia de
qualquer equipe. Por isso, um profissional precisa ficar atento às tendências,
necessidades e atualizações do mercado.
Com isso conseguirá sugerir soluções na hora certa, ou seja, no momento que surge
um problema. Isso é proatividade e senso de urgência. Essas são duas competências
muito valorizadas no mercado de trabalho.
Porém, para conseguir ser prestativo a esse ponto, é preciso entender bem da sua
área de atuação e das tecnologias envolvidas no processo. Portanto, para se
destacar e ajudar a resolver problemas, a melhor forma é investindo em conhecimento
constantemente.
## Aumento das chances de receber melhores remunerações
Já apresentamos alguns bons motivos sobre a importância da capacitação profissional

para a área de tecnologia. Provavelmente, você já está bem convencido, mas um ponto
merece mais destaque: os salários.
Todos trabalham porque gostam da sua área de atuação, aprendem, participam de

projetos interessantes e ganham respeito; mas também porque precisam receber uma
remuneração. E se for atraente, melhor ainda, não é mesmo?
A área de tecnologia é conhecida por oferecer altas remunerações aos profissionais.

Quem nunca ouviu falar, mesmo que seja pela internet, de um jovem que ganha algo
semelhante a um diretor de empresa? Apesar de não ser a regra, essa possibilidade
existe realmente.
Mas mesmo que o salário não seja nesse patamar que comentamos, é possível ter uma
boa remuneração ao final do mês. Porém, para atingir esse nível, é preciso ter
efetivo conhecimento, ou seja, estudar e se dedicar com afinco.
Como você faz para conseguir isso? Bom, fazer cursos, como já mencionamos é um bom
começo. Mas as possibilidades não se esgotam por aí. Ler bastante, fazer pesquisas,
testes e conversar com profissionais experientes também ajuda — e muito — no seu
desenvolvimento profissional. Com todo o esforço envolvido, um dos resultados é a
possibilidade de receber um salário mais elevado. O que é ótimo, certo?
O que achou da importância da capacitação de um profissional na área de tecnologia?

Compartilhe conosco seu ponto de vista! Aproveite também e deixe seu comentário
falando um pouco da sua experiência como profissional ;)
imagem
No [primeiro curso de Kotlin da Alura], vimos que o Kotlin nos permite realizar a
sobrecarga de construtores de uma maneira simples e poderosa. Um exemplo de
implementação seria para a classe `Produto`:
java
Com cada property sendo inicializada, somos capazes de criar um produto das
seguintes maneiras:
java
Repare que criamos diversos produtos com características peculiares:
1. Um produto com os valores padrões;

2. Uma TV sem descrição ou quantidade;
3. Uma camiseta de cor preta mas sem quantidade;
4. Um refrigerante sabor guaraná e com 10 quantidades
Até o momento nenhuma novidade, mas suponhamos que é necessário criar um produto
que tenha apenas um nome e quantidade, com a nossa amostra inicial, teríamos o
seguinte resultado:
java
Repare que o nosso produto não tem nenhuma descrição, mas, ao mesmo tempo, não
somos capazes de criar 50 chocolates da seguinte maneira:
java
Pois, como segundo parâmetro, precisamos enviar uma descrição! E agora?
## Utilizando o named parameter para sobrecarga
No Kotlin, além da abordagem de mandar os parâmetros de acordo com a ordem na qual

foram declarados, somos capazes de identificar qual parâmetro enviamos por meio de
uma label, por exemplo, queremos enviar apenas o **nome** e a **quantidade**, logo,
podemos indicar da seguinte maneira:
java
Desta maneira, conseguimos enviar os parâmetros com a ordem que desejarmos,

portanto, podemos até mesmo declarar esse mesmo produto da seguinte maneira:
java
Esse recurso é conhecido como **_Named Parameter_**, como podemos ver, a ideia dele
é permitir uma melhor legibilidade no envio de parâmetros, seja via construtor ou
funções, e também, possibilitar uma sobrecarga de construtor bem poderosa que nos
permite enviar parâmetros sem se preocupar com a ordem.
## Para saber mais

No exemplo inicial, utilizamos valores padrões apenas nas properties do construtor
primário, porém, esse recurso é disponível para parâmetros de funções também!
Isso significa que podemos criar funções com parâmetro opcionais! Por exemplo:
java
Se chamarmos essa função da seguinte maneira:
java
Chamando a função desta maneira, temos o seguinte resultado `Total da soma: 37`.
Porém, se enviarmos o parâmetro de mensagem, podemos modificar a saída padrão:
java
Com essa chamada a saída desta função fica da seguinte maneira `"Resultado: 37”`. É
válido lembrar que essa foi uma amostra simples, porém, abre portas para diversas
possibilidades que deixarei a sua imaginação tomar conta ;)
## Conclusão
Neste post vimos que além de utilizarmos valores padrões nos parâmetros, somos
capazes de identificar o valor que desejamos enviar por meio do **_Named
Parameter_** que também possibilita mais opções de sobrecarga, como por exemplo,
enviando os parâmetro na ordem que desejar.
E que tal aprender mais sobre Kotlin? Na Alura temos cursos [**Desenvolvimento
mobile com Kotlin**], onde você vai aprender desde o princípio da linguagem, como
declarar classes, variáveis e funções, como também, assunto mais avançados como
Higher-Order Functions, Delegated Properties e muito mais!
**Os principais browsers do mercado hoje são: Chrome, Firefox, Safari, Opera e
Internet Explorer/Edge. E cada um desses navegadores usa uma engine de renderização
diferente.**
O Internet Explorer usa o [Trident]) e Edge o EdgeHTML(que é um fork do Trident).

Firefox o [Gecko], Safari o [Webkit] e Chrome e Opera usam o [Blink]. Vale lembrar
que o Opera Mini e o Opera Classic não usam Blink, mas o Presto, que ainda é bem
importante.
Mas afinal, **o que é** uma engine de renderização? Basicamente, é apenas das
partes da [estrutura de um navegador.]
Várias coisas: Imagens, botões, links, etc. Só que quando o navegador faz uma
requisição para o servidor, ele não recebe esse conteúdo todo bonitinho e
simplesmente joga na tela.
Não, ele recebe uma mistura de código HTML, CSS, XML e imagens e precisa de alguma
forma lidar com isso. É aí que entra a engine de renderização: é ela que é
responsável por pegar todo esse conteúdo, interpretar ele e **desenhar** o site
para a gente no navegador.
Esse processo de leitura e renderização é feito em várias fases. [Esse artigo]

explica muito bem como os navegadores modernos funcionam e como todo esse processo
acontece (:
E aí, gostou? Quer aprender mais? Dá uma olhada na nossa [**Formação Front End**!]
Precisa fazer um insert rápido pra testar algo?
sql
Maravilha. Mas e se forem dois clientes? Dois inserts?
sql
Tão claro quanto, mas mais bonito:
sql
Rápido e eficaz.
imagem
Ultimamente, a modalidade de trabalho remoto tem sido uma ótima alternativa para
profissionais que desejam trabalhar em casa e ter mais liberdade e flexibilidade na
sua rotina. Apesar disso, é preciso que haja dedicação, organização e uma rotina de
trabalho bem estruturada, por parte daqueles que o exercem.
Por não ser necessário comparecer a um escritório físico, nessa modalidade é

possível trabalhar em qualquer lugar do mundo, desde que se tenha acesso à
internet.
Mesmo com essa rotina diferente dos padrões que conhecemos, é possível ser um
funcionário convencional, com carteira assinada em uma empresa, ter um contrato de
trabalho por determinado período de tempo ou, também, ser um [**profissional
freelancer**].
Entretanto, é importante lembrar que, para ser produtivo no home office e alcançar
o resultado esperado, o profissional precisa de bastante disciplina e equilíbrio,
além de evitar distrações.
Sendo assim, confira a seguir algumas dicas que separamos para que você saiba como
iniciar seu trabalho em casa da melhor forma possível. Vamos lá?
## 1\. Crie um local de trabalho na sua casa
Sabemos que o home office torna bastante tentadora a ideia de trabalhar na cama ou
no sofá, usando seu pijama e, quem sabe, com o notebook apoiado em alguma
superfície aleatória. Porém, essa pode não ser uma boa ideia.
Esse tipo de atitude provavelmente impactará de forma negativa o seu desempenho,

fazendo com que haja uma queda na produtividade.
Ainda que não exista um escritório na sua casa, é fundamental criar um local de
trabalho personalizado exclusivamente para você e já com tudo que você poderá
precisar na sua jornada de trabalho.
Pode ser num quarto, no canto de uma sala ou até mesmo na cozinha. O importante é
que seja um local exclusivo para seu trabalho.
### 2\. Vista-se para o trabalho
É muito mais confortável andar com seu pijama do que com roupa social. Pensando
assim, parece uma ótima ideia usar a roupa de dormir como uniforme para o trabalho
em casa.
Apesar disso, ficar com o roupão o dia inteiro enquanto trabalha também é uma
atitude prejudicial para a rotina de trabalho, pois dá um ar de casualidade às suas
tarefas.
A melhor saída, nesse caso, é se vestir como se fosse sair de casa — para visitar
uma loja, por exemplo. Tome um banho, vista-se e tome um café da manhã, da mesma
forma que faria se estivesse se preparando para ir para o escritório de uma
empresa.
## 3\. Defina uma agenda para o seu dia
Quando você [**mantém o hábito**] de acordar e ir diretamente para o PC para ler as

notícias do dia ou checar seus e-mails enquanto decide o que vai fazer, a tendência
é ter um dia com uma produtividade muito baixa.
O ideal é que você utilize uma agenda onde estejam anotadas, desde o dia anterior,
as suas tarefas daquele dia, organizadas por ordem de importância.
Dessa forma, não haverá procrastinação enquanto você define o que será feito. A
partir daí, será apenas uma questão de colocar a mão na massa e ir riscando as
tarefas da lista à medida que concluí-las.
## 4\. Separe o pessoal do profissional
É muito comum ver pessoas que trabalham em casa misturarem atividades da rotina
pessoal com as tarefas do trabalho. Isso ocorre com mais frequência quando se trata
de fazer compras online, ver e-mails, fazer ligações e navegar na internet. Essa
última, principalmente.
Isso é algo que com certeza atrapalha o ritmo e níveis de produtividade, sobretudo
se você fizer essas atividades com muita frequência durante o dia.
A partir do momento em que iniciar o trabalho, procure focar apenas nas tarefas
dele, deixando assuntos pessoais para serem tratados em momentos de pausa, como no
almoço ou no fim do expediente, por exemplo. Agindo com essa disciplina, o ganho na
produtividade será altamente perceptível.
## 5\. Esqueça que está na sua casa
Essa é uma daquelas máximas em que você diz que “falar é fácil”.
A verdade é que, se você ficar pensando nas atividades domésticas, como arrumar a
cama, lavar a louça ou limpar a cozinha, elas poderão se tornar as desculpas
perfeitas para se convencer a adiar as tarefas do trabalho, como concluir uma
planilha complexa ou iniciar um novo projeto.
Além disso, quem trabalha em casa também tem a tendência de utilizar momentos de
pausa para cuidar das tarefas domésticas pendentes. Essa não é uma boa ideia, já
que atividades desse tipo sempre demoram mais do que o planejado.
## 6\. Estabeleça metas sólidas e recorrentes
Se você busca garantir o sucesso profissional com o home office, é essencial que se
tenha objetivos definidos, sejam semanais ou mensais.
Esses objetivos a serem atingidos definidos por você ou pela empresa para a qual
trabalha são uma ótima forma de direcionar o seu foco e certificar-se de que está
mantendo o ritmo necessário para alcançar o sucesso esperado. Trabalhar sem metas
ou direção pode custar caro, portanto, tenha objetivos, sempre!
## 7\. Cuidado com a ideia de recomeçar no dia seguinte
Tenha cuidado com as pausas quando não estiver tendo um dia tão produtivo. Alguns
pensam que pode ser melhor, por exemplo, pausar a tarefa e retornar no dia
seguinte, mas esse é um erro grave e pode se tornar uma bola de neve.
A verdade é que, ao fazer isso, o profissional terá prejuízos ainda maiores com sua
rotina. Além de atrasar as atividades mais do que o esperado, será mais difícil
retomar o ritmo no dia seguinte e isso abrirá margem para que o problema se repita.
Portanto, procure treinar seu cérebro a não abandonar as atividades tão

rapidamente. Se bater aquela falta de inspiração, faça tarefas secundárias,
organize papéis ou objetos no escritório, [**busque inspiração**] online ou dê uma
volta para refrescar a mente. Assim, será muito mais fácil se recuperar e retomar a
rotina.
## 8\. Lembre-se do networking
Trabalhar em casa normalmente permite ter paz e concentração absoluta para a

execução das tarefas. Um ponto negativo é que também é muito fácil se isolar do
restante do mundo, o que pode não ser uma ideia muito saudável..
Para os profissionais que são freelancers, é importante manter uma rede de contatos
crescente, além de buscar frequentar eventos relacionados à sua área. Essa costuma
ser uma ótima oportunidade para ampliar sua rede, conseguir novos projetos e
[**aprender cada vez mais**].
Seguindo todas essas dicas, você certamente conseguirá manter uma rotina produtiva,
tendendo a alcançar os resultados esperados.
E se quiser entender um pouco mais a fundo de como criar [**Hábitos Produtios**],

temos um curso na alura que passar um pouco dessas ideias com base em conceitos
muito interessantes! Dá uma olhada lá ;)
Vou criar uma aplicação Web! Ou seja, uma aplicação que eu consiga rodar em
qualquer plataforma, seja computador, celular ou qualquer dispositivo que rode um
navegador qualquer... Para rodar uma aplicação web nós precisamos de um servidor de
aplicação que será responsável em manter a nossa aplicação funcionando!
Atualmente, existem diversos servidores de aplicação e linguagens de programação

que podemos utilizar para a nossa aplicação, porém, iremos criar uma aplicação
**Java Web** e o nosso **servidor** de aplicação será o [**Tomcat**].
Para desenvolver essa aplicação utilizaremos o [**eclipse IDE**] que facilitará a

nossa vida durante o desenvolvimento! Caso não tenha o eclipse, faça o [**download
da versão para Java EE**], descompacte o arquivo .zip e execute o eclipse:
imagem**:
java
Criamos a nossa primeira Servlet! Vamos rodar a nossa aplicação? Clique com o botão
direito em cima do projeto "Run as > 1 Run On Server":
imagem que significa que estamos acessando uma URL via HTTP em localhost (sua
própria máquina) e na porta 8080. Por fim, aperte Enter para fazer a chamada para a
aplicação:
imagem:
java
o nosso XML fica assim:
xml
Vamos testar novamente a nossa aplicação? Mas antes, vamos adicionar uma mensagem
para que seja impressa no momento que for executada:
java
Clique com o botão direito em cima do projeto "Run as > 1 Run on Server", agora que
o Tomcat já estava iniciado, o eclipse vai perguntar se você deseja reiniciá-lo,
marque a opção para reiniciar para garantir que todas as nossas alterações
funcionem. Agora, se testarmos a URL `http://localhost:8080/minha-biblioteca/`:
imagem` o `HttpServletRequest req` e o `HttpServletResponse resp`:
- **HttpServletRequest** é o parâmetro que representa as requisições à nossa

aplicação, ou seja, tudo que o cliente manda será recebido por meio desse parâmetro
- **HttpServletResponse** é o parâmetro que representa as respostas da nossa
aplicação, ou seja, tudo que mandamos para o cliente será enviado por meio desse
parâmetro
Isso significa que podemos o `HttpServletResponse` para mandar uma mensagem! E

faremos isso utilizando o método `getWriter()` que devolve um objeto do tipo
`PrintWriter`:
java
Agora basta apenas imprimir utilizando o método `print()`:
java
Vamos testar novamente! Clique com o botão direto em cima do Tomcat e escolha a
opção "Restart" para reiniciá-lo, então teste novamente o link
`http://localhost:8080/minha-biblioteca/`:
imagem`, por exemplo, para listar os meus livros:
java
imagem` e registrar a nossa Servlet no arquivo web.xml que será responsável em

descrever todas as informações de deploy da nossa aplicação! Por fim, vimos como
enviar uma resposta em texto ou em **HTML** todas as vezes que alguém faz uma
requisição à nossa aplicação.
E aí, o que achou da API de Servlet? Quer aprender mais sobre Servlets? Na
**Alura** temos uma [**formação Java**], onde é abordado diversos assuntos sobre
Servlets e os principais fundamentos sobre a programação de aplicações para Java
Web!
imagem
Você precisa comprar um botijão de gás e escolhe o app [Chama] para fazer seu
pedido. Quando abre o app, suponha, hipoteticamente, que se depara com algo mais ou
menos assim:
<iframe class="aligncenter" src="https://streamable.com/s/sbik1/azqpme?autoplay=1"

width="340" height="582" frameborder="0" allowfullscreen></iframe>
Agora, se analisarmos em paralelo essa interação hipotética com o app real,

teríamos algo assim:
<iframe class="alignnone" src="https://streamable.com/s/sbik1/azqpme?autoplay=1"

width="280" height="479" frameborder="0" allowfullscreen></iframe>
<iframe class="alignnone" src="https://streamable.com/s/0eyac/gesrcx" width="280"

height="479" frameborder="0" allowfullscreen></iframe>
Note que, no primeiro caso, temos uma mudança muito brusca de uma atividade para
outra. A tela parece piscar toda vez que interagimos com algum botão diferente,
tornando as transições pouco fluidas.
Já no segundo, **temos transições mais suaves, que ajudam a identificar quando

acionamos alguma nova função**. Além disso, temos a inclusão de animações que
auxiliam na compreensão de que algo está carregando, fazendo buscas, etc.
Consegue notar a diferença? Estes pequenos detalhes em animações trabalhados na UI

(user interface) do app real, deram uma experiência completamente diferente da
primeira que vivenciamos. Este recurso é conhecido como **Motion Design**.
## O que é Motion Design em UX?
O termo **Motion Design** é utilizado para nos referirmos à toda produção gráfica
em movimento. Isto é, podemos citar os vídeos infográficos, os efeitos em filmes e,
no nosso caso, pensando em UX, nas animações que encontramos ao interagirmos com
diferentes interfaces.
Podemos usar isso para diferentes casos em nossos projetos, dependendo do propósito
que queremos alcançar. Vamos ver algumas das possibilidades que encontramos por aí!
:)
## As diferentes funções do motion design
No app da Chama, temos alguns outros tipos de uso o motion design, como a animação
que busca os revendedores:
imagem com a ação que o público teria em um contexto real.
Depois, precisamos iniciar nossas [**pesquisas por referências**] do que já foi

feito e definir nosso passo a passo para cada animação:
imagem, ou mesmo de **reforçar a marca**.
Existem diversas possibilidades para incluir animações em sua UI, **realçando

alguma funcionalidade** ou simplesmente adicionando pequenos detalhes que tornam
seu sistema muito **mais leve e agradável de interagir**.
Em consequência, conseguimos gerar uma experiência de usuário muito melhor, assim

como notamos no exemplo do app Chama com as animações já inseridas.
Não se esqueça de sempre mensurar o impacto que o motion design tem em seu público
fazendo pesquisas estratégicas para levantar esses dados. Na Alura temos um curso
sobre [**Monitoramento de produto em UX**] muito bom para entender melhor sobre
essa prática. :)
Fiz a leitura de um arquivo CSV com as informações de nome, e-mail e pontos de um

aluno. Essas informações estão dentro de uma única `String`:
java
Agora preciso enviar essas informações para ele:
java
## Pegando um pedaço da String
E agora? Como eu posso pegar um pedaço dessa `String` e settar no meu aluno?
Podemos usar o método da `substring()`, da classe `String`, que pega um pedaço dela
por meio de 2 parâmetros:
java
Testando o código:
```
Alex
```
Ótimo, funcionou!
O método `substring()` pegou justamente o nome do aluno Alex, pois o nome Alex
inicia no começo (posição 0) e termina no 4º caractere dessa `String`, ou seja,
para pegar o e-mail eu terei que usar o `substring()` de novo. Então, vamos
verificar qual posição o e-mail está...
O começo é 6, agora o final... 7, 8, 9, 10, 11, 12, 15, 17, 20... Perdi a conta!
Que chato! Todas as vezes eu vou precisar ficar contando a **dedo a posição do
texto**?
E se o aluno fosse o Guilherme? Ele não terminaria na 4º posição... Com certeza
isso vai dar um problema gigante!
## Separando palavras com o split
Além do método `substring()` a classe `String` possui o método `split()` que

**separa o texto em linhas** de acordo com uma regra, por exemplo, quero que meu
texto seja separado cada vez que aparecer um ";":
java
Visualizando o array:
```
[Alex, alex.vieira@caelum.com.br, 15000]
```
Conseguimos separar as informações do aluno! Note que o `split()` devolveu um

_array_ de `String`, isso acontece pois ele **separa cada linha em _Strings_
diferentes**, por essa razão é devolvido o _array_ de `String`. Agora podemos
atribuir cada valor ao meu objeto aluno:
java
Verificando as informações do aluno:
```
Exception in thread "main" java.lang.NumberFormatException: For input string: "
15000"
```
## Cuidados ao usar o split
Parece que a nossa conversão para ìnt` não deu certo... Apareceu a _exception_
pois em nossa `String` temos um espaço (_backspace_) entre o ";" e as informações,
ou seja, em vez de receber apenas o número, foi recebido o espaço junto com o
número, por isso não foi possível converter. Se imprimíssemos apenas o e-mail ele
também viria com o espaço:
java
Imprimindo o email apenas:
```
alex.vieira@caelum.com.br
```
## Aplicando expressão regular no split
Precisamos informar o `split()` para que ele tire os espaços também. O `split()`
trabalha em cima de [expressão regular], ou seja, podemos especificar as regras
utilizando expressão regular. Nesse caso eu irei usar a expressão "\\s" que
significa espaço em branco:
java
Rodando o código novamente:
```
Alex - alex.vieira@caelum.com.br - 15000
```
Funcionou! Porém tem um pequeno detalhe...a expressão regular ";\\s" significa que
vai ser **sempre** que tiver ";" e um espaço juntos, ou seja, se a `String` fosse:
java
O resultado seria:
java
Com certeza meu sistema quebraria...
## Adicionando mais de uma regra com pipe
Para fazer com que o `split` lide tanto com o caso do ";" ou ";\\s" utilizamos o
pipe (|):
java
Testando novamente aquela mesma `String`:
java
Excelente!
Agora conseguimos pegar todas as informações do aluno que vieram da `String`. É

importante verificar que foram utilizadas duas "\\", pois é necessário "escapar" a
barra para ser reconhecida dentro da `String`.
Vimos que quando precisamos separar textos em Java, nós temos o método `split()` da
classe `String` que tem a capacidade de separar o texto em linhas de acordo com uma
regra. No nosso exemplo foi separado em todas as vezes que apareciam ";" ou quando
apareciam ";" e espaços juntos. Poderia também ser uma "," ou ":".
O importante é saber que o `split()` funciona em cima de expressão regular, então

qualquer uma delas se aplica.
**O que achou dessa dica? Bacana, né? A gente fala bastante sobre manipulação de
Strings [nos cursos de Java aqui na Alura].**
A resposta simples é que **não**. Esse tipo de variação não afeta muito a
performance final.
Mas tem a resposta ultranerd que apareceu no [**fórum da Alura**] a partir da

pergunta do Julio Cesar.
## Entendendo o GZIP
Na prática, nossos arquivos CSS são servidos com GZIP, um algoritmo de compressão
que compacta o arquivo no servidor antes de ser transmitido pro navegador.
E acontece que **o GZIP é muito bom com textos repetitivos**. Pense naquela lousa
do Bart Simpson com a mesma frase dezenas de vezes: o GZIP adora isso, a compressão
é ótima, porque ele basicamente manda a frase 1x só e manda repetir as demais.
## O que isso tem a ver com CSS?
Bom, quanto mais repetições você tiver no seu CSS, melhor o GZIP vai trabalhar.
Imagine 2 classes:
css
Eu rodei o GZIP em linha de comando (`gzip -c file.css | wc -c`) nesse arquivo CSS
simples pra ter uma ideia do tamanho final: **82 bytes.**
Coloquei em ordem alfabética as propriedades:
css
E rodei de novo: **77 bytes**.
Ambos tem as mesmas propriedades mas como não estão na mesma ordem, diminuem a
eficiência do GZIP ao comprimir isso.
## O que devo considerar para melhorar a otimização do GZIP?
A ideia é que quanto maior for a intersecção de texto entre diferentes partes do
arquivo, melhor pro GZIP comprimir.
Colocar em ordem alfabética vai melhorar a probabilidade de mais texto se repetir

dentro do arquivo. Na verdade, qualquer ordenação lógica que não seja aleatória,
_provavelmente_ vai aumentar essa chance.
> Se você fizer uma ordenação alfabética reversa, por exemplo, vai dar 77 bytes
também
## Conclusão
Então a resposta super nerd é que ordenar seu CSS com alguma lógica consistente
aumenta as chances do GZIP comprimir melhor seu CSS e, logo, menos bytes serem
transmitidos pela Internet. Então aumentaria um pouco a performance.
Mas em geral essa "melhoria" é bem pequena, e eu não acho que valha a pena escrever
seu CSS assim só por causa disso. Prefiro um CSS que siga o padrão que você julgar
mais legível pra você. Até porque [existem ferramentas de build] que podem pegar
seu CSS e fazer essa ordenação depois pra você.
Lidar com datas é sempre uma tarefa complicada, nesse artigo vamos resolver um dia
e hora de uma empresa de estacionamento.
Essa empresa registra o dia e a hora de entrada e saída dos carros manualmente,
inserindo no sistema cada informação em um campo separado:
go
Tendo como saída o seguinte resultado:
go
Atualmente, o valor recebido de data e hora está contido em uma `string`. Com isto
podemos colocar qualquer valor nela, ou seja, ela pode receber tanto um texto
quanto um número e isso pode ser um problema.
Geralmente, as linguagem de programação tem suas próprias libs para auxiliar este
trabalho, como `DateTime` no C#, ou `Date` do Python e no Golang não é diferente.
# Formatação de data e hora

No Golang temos o pacote `Time`, que contém algumas funções para trabalhar com data
e hora, além de facilitar a nossa vida durante formatação que vai ser exibida para
o usuário.
go
Agora que importamos o pacote `time` dentro do nosso código, podemos fazer uso de
suas funções.
# Utilizando o time Now()
No lugar de escrever a data e a hora em uma string, vamos utilizar a função
`time.Now()`:
go
E temos como resultado:
go
Observe que temos informações demais aqui e este não é o resultado que nós
gostaríamos.
# Formatando datas com Golang
Quando queremos formatar em Golang, utilizamos a palavra format, seguido de algo

bem diferente de outras linguagens de programação. Isso porque os formatos de data
e hora parecem com a data e hora reais e não `Y-m-d H:i:s` como no PHP, por
exemplo.
Vejamos então o que queremos editar e o em código Go:
| O que queremos editar | código |

|---------------------------|---------|
| dia (com zero) | 02 |
| dia (sem o zero) | 2 |
| dia da semana (inteiro) | Monday |
| dia da semana abreviado | Mon |
| mês com número (com zero) | 01 |
| mês com número (sem zero) | 1 |
| mês (nome inteiro) | January |
| mês (nome abreviado) | Jan |
| ano (inteiro) | 2006 |
| ano (abreviado) | 06 |
| hora (com zero) | 03 |
| hora (sem zero) | 3 |
| hora (formato 24 horas) | 15 |
| minutos (com zero) | 04 |
| minutos (sem zero) | 4 |
| segundos (com zero) | 05 |
| segundos (sem zero) | 5 |
Certo, mas como fica o nosso código?
go
E nosso resultado será:
go
Você pode acessar ver este código neste [link]:
Para deixar claro a diferença de trabalhar com data utilizando Golang e outras
linguagens, comparamos com as linguagens Java e C:
GO:
go
Java:
java
C:
c
# Encontrar o formato de data e tempo
Neste [link], você pode montar a formatação ideal e ver também outros tipos como
segundos, milissegundos, entre outros.
# Conclusão.
Não precisamos manipular nossas datas usando o tipo String. Podemos usar um tipo
preparado para trabalhar com datas e tempo no Golang: Time,, que formata nossa
lista de uma maneira mais padronizada e de fácil compreensão.
E aí, o que achou do artigo? Fica até mais fácil trabalhar com datas no Golang
agora, não acha? Se quiser continuar estudando sobre o assunto, dê uma olhada em
nosso curso na Alura de [**GO lang**] continue aprendendo ainda mais!
No [**post anterior**], havíamos criado uma lista de cursos e por fim, fizemos com
que a lista fosse uma lista personalizada, e o resultado foi o seguinte:
imagem`:
java
Agora precisamos fazer a implementação desse listener a partir da interface

[AdapterView.OnItemClickListener]:
java
Para pegarmos um item da lista, nesse caso um curso, podemos utilizar o parâmetro
`parent`, e então, chamarmos o método `getItemAtPosition()` passando o parâmetro
`position` que é justamente a posição que se encontra o curso tocado!
java
Vamos testar a nossa App e verificar se está funcionando:
java
Funcionando conforme o esperado! Então agora só falta implementarmos a ação para

que abra o navegador com a url do curso. Mas como podemos fazer isso? No Android,
todas as vezes que queremos nos comunicar com alguma App externa, nesse caso o
navegador, precisamos utilizar a classe `[Intent]`:
java
Porém, precisamos falar qual é a **nossa intenção** ao chamar a Ìntent`, nesse

caso, queremos fazer com que alguém, que saiba lidar com URL do site do curso, seja
chamado pelo Android e resolva essa URL para nós.
Para indicarmos essa intenção, utilizamos as categorias da própria classe Ìntent`

que são constantes que permite verificar se alguma App instalada no dispositivo
atende à categoria especificada, nesse caso usaremos a constante ÀCTION_VIEW` da
própria Ìntent`:
java
Mas perceba que ainda não passamos a URL que precisa ser tratada, e como faremos
isso? Simples! Basta apenas utilizar o método estático `parse` da classe Ùri`
enviando a URL do curso, e então, mandamos como segundo parâmetro da instância da
Ìntent`:
java
Por fim, pedimos para que uma Àctivity` que saiba resolver essa nossa intenção
(Ìntent`) seja iniciada com o método `startActivity()`:
java
Testando a nossa App, ao clicar no curso de Java que contém a URL:

https://www.alura.com.br/curso-online-primeiros-passos-com-java, temos o seguinte
resultado:
![lista-de-apps]
Perceba que ele lista todas as Apps que resolvem essa URL, pois utilizamos a
categoria ÀCTION_VIEW` que é uma categoria genérica que chama qualquer tipo de App
que saiba lidar com a intenção que estamos enviando, nesse caso, foi uma URL com o
protocolo HTTP.
Escolhendo uma das Apps sugeridas, nesse caso o Google Chrome, podemos verificar o
resultado para essa Ìntent`:
![abrindo-pagina]
Excelente! Agora eu posso verificar o conteúdo do curso que eu fiz apenas com um
único toque!
Vimos que, quando precisamos nos comunicar com outras Apps do Android, podemos
utilizar a classe Ìntent` que nos permite utilizar uma categoria e a informação
que queremos que seja resolvida, nesse caso, utilizamos a categoria ÀCTION_VIEW`
que é uma categoria mais genérica que vai chamar todas as Apps capazes de resolver
a URL que enviamos por meio da classe Ùri`.
E aí, o que achou da forma que nos comunicamos com outras Apps no Android? Quer
aprender mais sobre Android? Que tal dar uma olhada nos nossos [**cursos de
Android**] na Alura? Além de Ìntent`s, são abordados diversos assuntos para que
você crie sua própria App Android!
Essa é uma grande dúvida. Para trabalhar com tecnologia, em especial programação, a
resposta curta é **não**. O trabalho do dia a dia é bastante técnico e há muito
espaço se você estuda, pratica e se dedica. Obviamente, com o tempo, alguma
profundidade em diversos assuntos costumam ser necessários para dar um salto na
carreira, e aí os ensinamentos, ambiente e aprendizado dentro de uma faculdade
podem ajudar bastante.
Nesse vídeo, Paulo Silveira, que fez bacharelado e mestrado em computação na USP,
conversa comigo, que acabei não me formando, e mostra essas e outras opiniões:
https://www.youtube.com/watch?v=jw06H8esyzQ&list=PLh2Y_pKOa4Ufs_KwjTdGBFH6b65ChApyD
Vale lembrar: a nossa opinião é de que **sim**, a faculdade agrega muito, por mais
que desconfiemos de algumas disciplinas e conteúdo. Seu objetivo não é apenas
fornecer o conteúdo que o mercado pede, e sim ir muito além na formação de um
profissional.
# Ciência da Computação ou Sistemas de informação?
Você pode aproveitar e ouvir esse podcast sobre as diferenças entre Ciência da
Computação e Sistemas de informação
<iframe src="https://open.spotify.com/embed-podcast/episode/2T7pFgrwsF24Pl6uZoBU7m"
width="100%" height="232" frameborder="0" allowtransparency="true"
allow="encrypted-media"></iframe>
Quando estamos começando em PHP, normalmente, uma das primeiras coisas que
aprendemos é a incluir um script dentro do outro:
php
Assim a gente evita muita repetição de código e consegue fazer os scripts

interagirem entre si. E, com isso, surge na nossa vida o famoso ìnclude`.
Entretanto, nem só de script é feito um bom desenvolvedor. E quando começamos a nos

aventurar em orientação a objetos surge o `namespace`! E com ele vem a necessidade
de utilizar o use:
php
Mas, muitas vezes, os porquês desse processo acabam ficando meio obscuros.
## Trabalhando sem namespace
Vamos supor que precisamos realizar o login do nosso sistema PHP. Um dos conceitos
mais básicos da orientação a objetos é que se precisamos representar algo, criamos
uma classe.
Logo, para resolver nosso problema, precisaremos criar uma classe de Login. Algo
como, dentro de um arquivo Login.php:
php
Perfeito! Com nossa classe login conseguimos modelar uma forma para nosso usuário
passar pela validação do sistema. Portanto, no nosso sistema, se quisermos realizar
um login podemos usá-la:
php
Aqui, incluímos nosso arquivo Login.php no `Sistema` para que pudéssemos criar um
novo `Login` e usar nossa classe.
Porém, em softwares modernos, temos apenas uma forma de login? É muito comum nos
dias de hoje um sistema ter diversas formas de login por API, certo? Um exemplo
disso são os logins pelo facebook, google plus, etc.
Se a gente teve a necessidade de criar uma classe Login para modelar a nossa forma
de passar pela validação, é bem possível que essas APIs tenham feito a mesma coisa
e também criaram seu arquivo Login.php, para descrever como o login deles funciona.
Algo como:
php
Repare que temos uma class Login.php para nosso sistema, outra para a conexão de
API. Será que até aqui já temos algum problema? Se pararmos para analisar, temos
duas classes com o mesmo nome! Mas, isso resolvemos fácil. Basta trocar elas de
pasta, deixando nossa estrutura parecida com:
php
Mas, no nosso sistema, precisariamos criar nosso login e o login da api, certo?
Algo como:
php
Agora temos que dar new em 2 Login. Para isso, incluimos nossa classes de Login e a
classe de Login da API. Mas, como o PHP vai saber de qual Login estamos falando
quando demos `new`? Ambas as classes têm o mesmo nome!
Uma solução era mudar o nome de uma delas. Como normalmente não mexemos nos
arquivos externos, mudaríamos nossa classe Login para algo como LoginInterno.
php
O que não faz sentido algum já que se a classe de Login está dentro do nosso
projeto, é evidente que esse Login é interno!
Nesse caso estaríamos perdendo a semântica do nosso código por um problema de

estrutura: não temos como diferenciar classes com o mesmo nome.
## Agora com namespace
Podemos dizer para o PHP que queremos diferenciar nossas classes da mesma forma que
colocamos os arquivos em pastas no nosso sistema operacional. Mas, agora, ao invés
de separar nossos arquivos em pastas, separamos em namespaces!
Como a estrutura de pastas de um sistema costuma ser bem organizada é muito comum a
gente utilizar a própria estrutura de pastas para declarar nosso `namespace`. Algo
como:
php
Como a classe Login está dentro da pasta class, colocamos ela no `namespace` class.
## Mas, e os nomes iguais?
Perfeito, nosso problema está resolvido! Colocamos nossas classes em namespaces

diferentes e podemos usá-los, mas ainda temos um pequeno problema:
php
Ainda estamos tentando dar new nas classes com o mesmo nome. Por isso, quando
usamos namespaces podemos dar apelidos ([alias]) para nossas classes! Algo como:
php
Agora sabemos exatamente que a classe LoginApi está relacionada ao namespace

**api** sem mexer em nenhuma outra linha de código. Tornamos nosso código muito
mais semântico, flexível, evitamos conflitos e ainda conseguimos organizar na mesma
estrutura das pastas!
Algo que jamais conseguiríamos apenas com o include, afinal ele apenas inclui o
conteúdo do arquivo. O conceito de namespace é algo extremamente importante de se
entender para mantermos um código bem organizado e orientado a objetos.
Com o use, não estamos mais presos a uma string com o diretório do arquivo, o que
evita problemas com o diretório exato. Temos uma forma elegante de lidar com a
duplicidade das classes!
Claro que, isso não exclui completamente a utilidade dos includes. Ainda temos a
necessidade de carregar os arquivos que vamos utilizar, porém podemos fazer isso
com um único arquivo de [**autoload**] que carrega tudo pra gente.
Qualquer projeto grande, inclusive frameworks como laravel e symfony, trabalham com
namespaces e utilizam autoload para incluir os arquivos. Para facilitar essa
inclusão, surgiram alguns padrões de desenvolvimento mais conhecido como Php
Standard Recommendation (PSR).
**Se você quiser saber mais sobre PSRs, tem um outro [post aqui no blog] sobre boas
práticas em PHP e PSRs.**
Aqui na alura, a gente sempre se preocupa com boas práticas. Se você quiser saber
mais sobre boas práticas em PHP, da uma olhada no [**curso de design patterns**] =)
Se a resposta foi sim, e se você tem certa preferência por artes digitais ante as
tradicionais pela simples conveniência de poder gastar tinta à vontade sem se sujar
- deve considerar o ingresso na carreira de 3d e Animação.
Mas enfim, por que usar pixels e ferramentas digitais, se é do lápis e papel que as
idéias tomam forma? Um dos atrativos das artes digitais, além da flexibilidade de
edições posteriores, é que elas podem ser programadas para simulações, imersões e
realidades virtuais singulares, direcionáveis a diversos propósitos além da simples
- mas não menor apreciação estética.
Inicialmente escolhi o 3d pelo prazer de criar sem me sujar de tinta mesmo, e só

depois de algum tempo visumbrei [inúmeras outras aplicações].
### O mergulho
Por mais que alguém te descreva um salto de paraquedas ou um mergulho submarino,

você só terá idéia daquela sensação se tiver tido alguma experiência semelhante, e
mesmo assim ainda será uma tradução subjetiva feita a partir das suas próprias.
Acontece o mesmo com qualquer experiência profissional específica, mas vou

assinalar aqui o que foi importante no meu percurso - que começou no século
passado, lá atrás em 1996 e poderá vir a ser útil no seu percurso, que começa hoje,
na crista da onda da computação gráfica.
Antigamente precisávamos criar um cubo com quadrados, e uma esfera com linhas, mas
hoje em dia, com apenas um clique você transfere uma idéia de sua cabeça por
neuroimagem transcraniana; com outro clique manda um protótipo pra impressora 3d
portátil; e com mais outro clique faz tudo se tornar interativo numa realidade
virtual 'inacreditível'. Uau! Já tá fácil assim? Na verdade, não.
Quem dera... Os carros ainda não estão voando, e a gente também tem que suar um
pouco pra construir nossas imagens e filmes em 3d, mas garanto que está bem mais
fácil do que no século passado. Porém, como o mercado de trabalho não mudou tanto
quanto a tecnologia à disposição, vamos à pergunta simples de resposta complexa:
por onde começar?
### Algumas acrobacias
O começo de qualquer novo caminho coincide com o medo e com a esperança, traduzido
em perguntas que fazemos a nós mesmos: será que conseguirei aprender?
Será que é muito complicado? Trabalharei num grande estúdio como um especialista
numa longa linha de produção? Preferirei um estúdio pequeno, porém generalista e
com mais liberdade artística?
Ou farei as coisas do meu jeito, ao meu tempo, e serei um tranquilo freelancer

eremita? Só posso adiantar que a resposta pra todas estas perguntas não é
importante agora.
Como um antigo filósofo estóico lhe aconselharia para lidar com o futuro: [liberte-

se do medo e da esperança].
Foque no presente, que é o mesmo pra todos, independente de qualquer um destes

futuros concretizáveis, e comece a estudar hoje mesmo, colocando a mão na massa.
Garanto que a massa de pixels é mais limpinha que a de argila do escultor ou as
tintas a óleo do pintor.
Os atores virtuais também são mais flexíveis e menos sujeitos aos delírios da fama,
que os atores reais. Logo, se está decidido a aprender mais e crescer na carreira,
melhor dar um passo de cada vez.
Se quer aprender culinária, começar por fazer um ovo cozido pode ser mais difícil
do que parece. Mas se quer entrar na carreira de 3d e Animação, que tal começar
agora mesmo, [**aprendendo a fazer um ovo cozido mutante?**]
Uma vez firme e decidido(a), seu primeiro objetivo será montar um portfolio (do
latim, literalmente, um 'carrega-folhas') que nada mais é do que um site ou galeria
de imagens com seus melhores (ou únicos) trabalhos.
Mas como vou produzir trabalhos se ainda não tenho experiência alguma? Ora, os
projetos que você executar em nossos cursos do Alura podem fazer parte de seu
primeiro portfolio, pois afinal, foi você quem fez. Outra dica é se propor a
executar algo dentro do seu potencial ou conhecimento adquirido, como se executasse
um projeto para um cliente fictício.
Meu primeiro portfolio continha uma vinheta animada para o dinossáurico serviço de

música Napster, uma cena inspirada no filme Matrix, uma moto copiada descaradamente
do desenho Akira, e um 'mech' animado também plagiado do filme Robocop.
Confesso que não fui nada original, o acabamento não era lá o melhor do mundo, e os
respectivos autores nunca chegaram a ver minhas homenagens às obras deles, mas meu
primeiro contratante viu e gostou bastante, e assim embarquei profissionalmente
nessa jornada.
A dedicação diária aos estudos é essencial para construir um bom portfolio, então

não hesite em sanar todas as suas dúvidas nos fóruns dos cursos enquanto prossegue.
Perguntar muito e se colocar desafios também te faz progredir com mais segurança.
Se você acha que não consegue realizar algo que está imaginando, tente começar por
uma versão simplificada da mesma idéia, e vá do começo ao final da execução.
Termine o que se propôs primeiro, e só então pule para a próxima idéia.
Começar e não terminar algo, para seus futuros clientes ou contratantes, é o mesmo
que não ter feito nada - por mais que você tenha aprendido um pouco no processo.
Mesmo que o resultado dos seus primeiros trabalhos fique aquém de sua expectativa,
o importante é concluir e publicar. O feedback dos amigos e da família também é
importante nessa fase só o da mãe-coruja que não vale.
Procure publicar suas imagens em comunidades de artistas iniciantes e experientes,

como o [CGSociety] e o [DeviantArt], buscando a opinião de estranhos e anônimos
isentos da necessidade de elogio por mera camaradagem.
Lembre-se: você pode melhorar seu porfolio com o tempo, mas se não finalizar cada
pequeno projeto que se propuser, não terá sequer um portfolio.
As críticas de outros artistas e até de leigos ou iniciantes, o ajudarão a se

aperfeiçoar, e seguindo a máxima do 'fazer e terminar', em breve você terá
qualidade apresentável para conseguir sua primeira participação em uma equipe ou um
projeto alheio. Repetindo: comece e termine, várias e várias vezes.
Que seja simples, mas esteja feito, publicado, e comentado. E se não sabe como
organizar,publicar e atualizar um portfolio que seja comentável, que tal começar
dando os [primeiros passos com o wordpress]?
### A aterrisagem
Aos poucos você incluirá trabalhos realizados como freelancer ou contratado fixo ao
seu portfolio, mas isto é só o começo. Talvez surjam oportunidades na publicidade,
na arquitetura, no cinema, na pré-visualização aeroespacial, quem sabe? Tudo
dependerá do direcionamento que você der aos seus projetos iniciais e às ofertas de
trabalho posteriores.
Uma ilustração científica pode dividir espaço com um motion design completamente
abstrato no mesmo portfolio? Sem problema. Se esta versatilidade te agrada, siga
por ela. Só não suponha que por ter se safado de uma árdua e longa carreira em
medicina - que seus pais ou avós tanto sonhavam, por exemplo - estará livre de
constantes atualizações por toda a carreira.
Assim como o médico ou qualquer outro profissional sujeito

a criteriosas exigências, o artista de 3d também está em constante aprendizado,
pois as ferramentas evoluem, surgem novos métodos para resolver antigos problemas
de maneira mais eficiente, e portanto, não podemos parar nunca de aprender se
quisermos responder às necessidades sempre novas dessa caixa de pandora que é a era
da informação.
Estamos nos aproximando rapidamente de um novo ciclo da experiência audiovisual (e

tátil!). O desenho e a pintura um dia ganharam uma caixa escura, e surgiu a
fotografia. Essa foi colocada em movimento pelo rotoscópio, e surgiu o cinema.
O cinema era preto e branco (e mudo!) Com o tempo vieram as vozes e também as
cores. Os videogames começaram como um ping-pong de quadradinhos preto-e-branco, e
hoje praticamente estamos interagindo com um filme de cinema. Enfim, já desponta
comercialmente a tão prometida realidade virtual.
As aplicações para essa míriade de possibilidades do 3d e da Animação, vão do

tratamento de fobias à simulação de treinamento cirúrgico, passando por
telepresença e simuladores para 'n' fins. A narrativa artística também já ganha uma
nova modalidade: a de filmes imersivos.
E neste turbilhão de possibilidades audiovisuais interativas, estão os artistas de

3d, animadores, roteiristas, programadores, e outros tipos de profissionais que não
se contam numa mão só, dando fôlego e forma a esta nova etapa da representação
artística e científica.
As evoluções neste meio não param, e não desacelerarão tão cedo. E você, vai ficar
aí assistindo e esperando, ou vai tomar coragem e pôr o pé na estrada e a mão na
massa, seguindo nossas trilhas de design, UX, photoshop, ilustração, video, [**3d e
Animação; com novos cursos todo mês?**]
Comece um curso hoje mesmo: foque no presente, que o futuro dele depende.
A empresa AirTravellers, uma agência de viagens, solicitou um banner e chegaram ao

seguinte resultado:
imagem** não causa estranhamento:
imagem
## Indo mais além
Além destas técnicas, há outros exemplos muito interessantes que podemos encontrar
por aí. Desde as soluções mais simples até as mais elaboradas, mas que são
igualmente válidas.
No site da [**Hipster.tech**], por exemplo, foram usadas transparências coloridas

sobre as fotos. Além de ajudar na legibilidade do texto, essa solução deixou o
visual descontraído, bem como a hipsters.tech se representa.
![]
Outra opção muito sutil é a usada no [**JovemNerd**], um site que apresenta muitas
imagens logo de cara e, para não perder o impacto dessas fotos nem a legibilidade,
foi adicionado um efeito gradiente muito suave, quase imperceptível. O suficiente
para resolver o problema.
![]
Olhando mais de perto podemos notar a diferença:
![]
Como você pôde ver, essas são algumas das saídas que encontramos por aí, pensadas
de acordo com a característica e a proposta de cada situação.
E que tal aprender a tratar imagens no Photoshop? Na Alura temos o [**Curso de

Photoshop: Tratamento de imagens**], onde você vai aprender algumas técnicas de uma
das ferramentas mais famosas no mundo de Design.
**SQL** é uma linguagem padrão para trabalhar com **bancos de dados relacionais**.
Ela é uma linguagem declarativa e que não necessita de profundos conhecimentos de
programação para que alguém possa começar a escrever **queries**, as consultas e
pedidps, que trazem resultados de acordo com o que você está buscando. **SQL**
significa **Standard Query Language**, literalmente a linguagem padrão para
realizar queries.
A **linguagem SQL** é utilizada de maneira relativamente parecida entre os

principais bancos de dados relacionais do mercado: Oracle, MySQL, MariaDB,
PostgreSQL, Microsoft SQL Server, entre muitos outros. Cada um tem suas
características, sendo o **MySQL** e o **PostgreSQL** extremamente populares por
possuírem versões gratuitas e de código aberto.
É também uma linguagem que muitos profissionais acabam precisando aprender: seja
quem usa Excel de forma pesada e acaba migrando as informações para um banco de
dados, seja um cientista de dados que usa Python para agregar os dados das
diferentes fontes de informações.
# SELECT: uma query de consulta a um banco
Imagine que você tem uma tabela de banco de dados, que realmente pode ser feito uma
analogia com uma **planilha de Excel**, para guardar as informações das suas notas
fiscais:
```
+----+----------------------------+------------+-------+
| id | titulo | pagamento | valor |
+----+----------------------------+------------+-------+
| 1 | canetas | 2019-07-05 | 150 |
| 2 | notebook | 2019-07-01 | 1200 |
| 3 | macbook | 2019-07-02 | 2100 |
| 4 | microfone | 2019-07-05 | 90 |
| 5 | matricula alura | 2019-07-09 | 900 |
| 6 | gasolina reembolso diretor | 2019-06-10 | 200 |
+----+----------------------------+------------+-------+
```
Se você quer buscar todas as notas fiscais que tem valores acima de mil reais, a
query que você deve rodar é uma que vai selecionar (`SELECT`) todos os campos (`*`)
onde (`WHERE`) o valor da nota seja maior que mil (`valor > 1000`):
```
SELECT * FROM notas_fiscais WHERE valor > 1000
```
E o resultado será algo como:
```
mysql> SELECT * FROM notas_fiscais WHERE valor > 1000;
+----+----------+------------+-------+
+----+----------+------------+-------+
| 2 | notebook | 2019-07-01 | 1200 |
| 3 | macbook | 2019-07-02 | 2100 |
+----+----------+------------+-------+
2 rows in set (0.00 sec)
```
Com você pode ver, é bastante simples e direto. Quase uma sentança escrita em
inglês. Esse caso foi no mysql mas essa query é padrão em todos os bancos de dados.
Poderíamos ainda apenas listar todos os campos ordenando pela data de pagamento,
usando ÒRDER BY pagamento`:
```
mysql> SELECT * FROM notas_fiscais ORDER BY pagamento;
+----+----------------------------+------------+-------+
+----+----------------------------+------------+-------+
| 6 | gasolina reembolso diretor | 2019-06-10 | 200 |
| 2 | notebook | 2019-07-01 | 1200 |
| 3 | macbook | 2019-07-02 | 2100 |
| 1 | canetas | 2019-07-05 | 150 |
| 4 | microfone | 2019-07-05 | 90 |
| 5 | matricula alura | 2019-07-09 | 900 |
+----+----------------------------+------------+-------+
6 rows in set (0.00 sec)
```
# Quais são os principais comandos SQL?
Os **principais comandos SQL** são:
- `SELECT`: busca linhas em tabelas de acordo com um critério definido dentro da

chamada cláusula de `WHERE`
- ÌNSERT`: insere novas linhas na tabela. no nosso caso, colocaria novas notas
fiscais dado os argumentos que são passados para o ÌNSERT`. Por exemplo, no nosso
caso: ÌNSERT INTO nf (titulo, pagamento, valor) VALUES 'canetas', '2019-07-15',
150`.
- ÙPDATE`: atualiza linhas do banco de dados de acordo com um critério de `WHERE`,
como mudar o CPF
- `DELETE`: remove linhas da tabela de acordo com um critério.
Há ainda uma infinidade de subcomandos para fazer buscas melhores e mais

elaboradas, como `JOIN`, `LIKE`, `HAVING` e `GROUP BY`.
Não se assuste! O trabalho básico com tabelas, linhas, colunas, relacionamentos e

chaves não demanda um conhecimento extenso de SQL. Ele vai se fazer necessário para
otimizar consultas e tomar decisões de como modelar esses dados.
# Modelagem de banco de dados.

imagem
Além desses comandos, você será exposto a formas de criação de tabelas e de

colunas, como `CREATE TABLE` e ÀLTER TABLE`. A **modelagem de banco de dados** é a
forma que definimos com as tabelas vão armazenar e relacionar os nossos dados, isso
é, como estruturar esse relacionamentos para que não fique algo difícil de dar
manutenção e validação como acaba sendo com planilhas.
Por exemplo, a tabela acima criamos usando:
# Como posso aprender a trabalhar com SQL?
O ideal é começar trabalhando com uma base bastante simples, com uma única tabela,
que tenha o modelo de dados próximo do que você conhece e busca. Aconselho que
utilize o **MySQL** ou o **PostreSQL**.
Nos [**cursos de SQL**] da Alura você encontra desde a instalação e modelagem de

banco até os primeiros comandos SQL, tanto no MySQL e PostgreSQL quanto no
SQLServer e Oracle. E conheça mais dos [**comandos básicos de SQL**] nesse outro
artigo.
Neste post nós batemos um papo com uma aluna nossa que tem um perfil um pouquinho
diferente da maioria: ela é designer e música! Toca ukulele, violão, piano,
violino, cavaquinho e também canta 😮 Vamos ver como foi essa conversa!
imagem, eu estou produzindo uma webserie de vários curtas (a Alura tem me ajudado
nessa também).
### Gosta de estudar o que na Alura? Sempre fez cursos online?
[**Design UX**] é minha paixão, mas eu realmente não tenho limites quando se trata
de vocês.
Posso começar assistindo uma aula sobre [**design thinking**] e lá pelas 3 da manhã
eu percebo que estou aprendendo a fazer uma [**animação no Cinema 4D nos cursos**].
É bem doido hahaha.
Eu não costumava fazer cursos online, por sempre achar o curso que queria, mas não
da maneira que queria. Da maneira que vocês fazem!
### Tem dificuldades pra estudar assim? Tem alguma dica?
Eu tenho uma maneira bem particular de assistir as aulas. Primeiro tem que estar na
velocidade máxima. Sim, sou bem acelerada haha. E as vezes, aqueles "resumos-pós-
vídeo" me ajudam 10x mais!
Sabendo que existem váaaarias maneiras de absorção de informação, a minha é mais

visual, por leitura. Então aqueles resuminhos sempre me salvam.
Acho que não tenho alguma dica específica, vocês são bem completos!
### Já desenvolveu algum projeto usando algo que aprendeu na Alura?

Sim! Depois de estudar bastante sobre o [After Effects], aprendi a fazer animações,
e agora estou aplicando isso no meu TCC e em alguns projetos de audiovisual que
estou montando.
Também estou aprendendo a desenvolver o [**front-end**], e agora posso sair só das

telas desenhadas no photoshop e finalmente fazer com que elas funcionem!
Criado em 1990 pelos irmãos Thomas e John Knoll, o Photoshop mudou a história da
fotografia e do design. Na época, Thomas estudava na Universidade de Michigan e
elaborava um projeto de um programa para manipulação de fotos.
Um ano depois, o software foi vendido para a Adobe e, desde então, não parou de
crescer e receber novas funcionalidades.
Hoje, sem sombra de dúvidas, esse software é indispensável para os profissionais da

área, e já se tornou referência até para quem não trabalha com edição de imagens ou
mesmo com computadores.
De fato, trabalhar com Photoshop é poder criar novas possibilidades para suas
imagens, e dar asas a sua imaginação.
## 1\. Limpeza de pele
As ferramentas carimbo _(clone stamp)_ e pincel de recuperação _(healing

brush)_ são excelentes para eliminar defeitos de pele em fotografias.
Ambas têm a mesma forma de utilização, mas com finalidades um pouco diferentes. A
primeira faz uma clonagem da área selecionada. Já a segunda reproduz a cor e os
meios tons de forma mais suave.
A seguir, veja como usá-las corretamente:
1. crie uma nova camada em “Camada” _(“Layer”)_ > “Nova” _(“New”)_ >

“Camada” _(“Layer”);_
2. selecione o carimbo (ou o pincel de recuperação) na paleta de ferramentas e
escolha o tamanho e o tipo do pincel adequados. A opção de
opacidade _(opacity)_ indica a intensidade do carimbo. O ideal é que ela fique
entre 20% e 50% para tratamento de pele;
3. clique com o botão esquerdo do mouse, enquanto mantém a tecla alt pressionada.
Esse comando aciona um ícone em formato de alvo. Solte a tecla alt e movimente o
mouse até a área que você quer retocar;
4. clique com o botão esquerdo na área.
imagem_ e selecione os dentes. Nesse momento, não se preocupe com tanta precisão;
2. no menu “Camada” _(“Layer”)_, selecione: “Nova Camada de Ajuste” _(“New
Adjustment Layer”)_ > “Matiz/Saturação” _(“Hue/Saturation”)_. Escolha os
“Amarelos” _(“Yellows”)_ no menu de cores;
3. altere o valor da saturação para clarear os dentes. Esse número varia conforme a
fotografia; o importante é buscar o branco mais natural possível;
4. seguindo no painel “Matiz/Saturação”, clique em “Máscaras” _(“Masks”)_ e aumente
um pouco o valor da “Difusão” _(“Feather”)_ para evitar que a seleção criada fique
com uma borda muito evidente.
imagem_. Para isso, clique duas vezes na camada e, na caixa de diálogo que será
aberta, clique em “OK”;
2. na caixa de ferramentas, clique na opção “Retângulo Arredondado” _(“Rounded
Rectangle Tool”)_ e defina o raio _(radius)_ para 30 pixels;
3. desenhe o retângulo por cima da imagem. Você pode movê-lo até encontrar o
posicionamento desejado;
4. na janela de camadas, clique e arraste a camada da foto em cima da “Forma 1”;
5. ainda com a camada da foto selecionada, clique na seta localizada no canto
superior direito da janela e depois em "Criar Máscara de Corte" _(“Create Clipping
Mask”)_.
imagem_. imagem_ > “Desfoque” _(“Blur”)_ > “Desfoque Gaussiano” _(“Gaussian

Blur”);_
imagem_ > “Ajustes” _(“Adjustments”)_ >
“Brilho/Contraste” _(“Brightness/Contrast”)_ e faça os ajustes necessários para
deixar a imagem com mais luminosidade;
imagem_ > “Ajustes” _(“Adjustments”)_ > “Curvas” _(“Curves”_).
imagem_ e de plano de fundo _(background)_ para #ff0000 (vermelho) e #00ff00
(verde), respectivamente;
- duplique a camada: “Camada” _(“Layer”)_ > “Duplicar Camada” _(“Duplicate
Layer”);_
- nessa nova camada, aplique o mapa de degradê: “Imagem” _(“Image”)_ > “Ajustes”
(_“Adjustments”)_ > “Mapa de Degradê” _(“Gradient Map”);_
- ainda nessa camada, use as opções de mesclagem: “Camada” _(“Layer”)_ > “Estilo de
Camada” _(“Layer Style”)_ > “Opções de Mesclagem” _(“Blending Options”);_
- na caixa de opções, selecione o modo de mesclagem _(blend mode)_ para
“cor” _(color)_ e a opacidade _(opacity)_ para 50%;
- achate a imagem: “Camada” _(“Layer”)_ > “Achatar Imagem” _(“Flatten Image”);_
- aplique um filtro de ruído: “Filtro” _(“Filter”)_ > “Ruído” _(“Noise”)_ >
“Adicionar Ruído _(“Add Noise”)_ com 2% de intensidade _(intensity)_ e distribuição
gaussiana _(gaussian)_. Acione também a opção “monocromático” _(“monochromatic”)_.
imagem_ > “Duplicar Camada” _(“Duplicate Layer”);_

- aumente o zoom para 100% de visualização. Para isso, clique duas vezes na
ferramenta de zoom;
- clique em “Filtro” _(“Filter”)_ > “Outros” _(“Other”)_ > “Alta
Frequência” _(“High Pass”)_. O valor a ser usado nesse filtro varia conforme a
foto, portanto, é preciso fazer alguns testes para ver qual fica melhor em sua
imagem;
- para que o efeito seja colocado apenas nos olhos, crie uma máscara nessa região:
“Camada” _(“Layer”)_ > “Máscara de Camada” _(“Layer Mask”)_ > “Ocultar
Todas” _(“Hide all”);_
- com a máscara criada, use um pincel suave de cor branca e pinte toda a área dos
olhos;
- mude o blend mode dessa camada para a opção “sobrepor” _(“overlay”)_. Essa
alteração pode ser feita na própria janela de camadas, em substituição à opção
“normal” definida como padrão.
imagem_ > “Scripts” _(“Scripts”)_ > “Processador de Imagens” _(“Image Processor”);_

imagem e as dimensões (largura e altura) para as novas imagens;
imagem_ para guardar essas configurações para uso posterior;
imagem_ para iniciar o trabalho de redimensionamento das imagens.
![]
Bem, essas foram as dicas de hoje! Esperamos que você tenha gostado, e que elas
possam te ajudar a trabalhar com Photoshop. Agora, aproveite para conferir também
algumas [**dicas do illustrator que você precisa conhecer!**]
Um dos nossos desafios diários é casar o tempo com os estudos. E com tantas
informações como mídia sociais, sites com streaming de séries e filmes, além da
falta de incentivo para o auto investimento entre outras coisas, acabam afetando
nossa motivação e deixam aquela dúvida: **Como se manter motivado para estar
aprendendo coisas novas? Que carreira seguir? Como saber no que posso investir para
meu próprio futuro?**
Neste episódio do Alura Live, o host Gabs Ferreira está de volta conversando sobre
aprendizado, carreira, hábitos de estudo e a vontade de aprender com Guilherme
Silveira, Head de Educação e um dos fundadores da Alura e Carlos Felício, Diretor
Admnistrativo da Caelum.
Quer saber um pouco melhor sobre hábitos e que carreira seguir?
https://www.youtube.com/watch?v=a84Hd9c1_sw
Ainda ficou afim de saber ainda mais sobre esse tema? Assista a [live completa!]
Algumas carreiras da Alura:
- Comece agora a programar: [Iniciante em Programação]
- Quer aprender a criar aplicativos? [Desenvolvedor Android]
- Não quer programar e quer saber editar seus vídeos? [Editor de Vídeo]
- Ainda sim pensa em algo diferente, como ranquear sua página no Google? [SEO
Expert]
Não deixe de nos seguir twitter: [Gabriel Ferreira], [Guilherme Silveira], Carlos
Felicio não tem twitter gente :/ e a [Alurinha]! :D
Chegou a hora de se preparar para prestar concurso público. Afinal, bons salários,
estabilidade no emprego e chances de crescimento na empresa são mais que ótimos
argumentos, não é? Pode parecer muito bom para ser possível, mas se preparar é mais
fácil do que você imagina.
Neste post daremos uma visão geral do que costuma cair nas provas de concurso
público para a área de TI: conteúdos básicos, exclusivos, gerenciais e da própria
área de TI. Além disso, apresentaremos também algumas dicas e métodos de estudo,
que podem ajudá-lo, já que eles facilitam a forma de lidar com todo esse conteúdo.
Ficou interessado? Confira!
## Conteúdos e temas recorrentes nas provas
De fato, quase sempre há concurso público aberto para a área de TI e, geralmente,

eles oferecem [**bons salários**].
Apesar da complexidade e crescente especialização da área, eles costumam ter alguns

conteúdos e temas em comuns, que nós podemos adiantar aqui:
### 1 Conteúdos básicos
Em geral, esses conteúdos não são de TI, mas estão presentes em uma vasta gama de
concursos por isso os chamamos de básicos.
Grosso modo, consistem em Português, Matemática, Raciocínio Lógico, Inglês, e
conteúdos administrativos-legislativos (Direito Constitucional, Administração
Pública, etc.). Alguns exemplos de conteúdos nessas áreas:
- [Português]: acentuação gráfica (crase, acentos, etc.), ortografia (emprego de

palavras como porque/ porquê, etc.), morfologia (uso de substantivos, pronomes,
preposições, etc.), dentre outros;
- [Matemática]: conjuntos numéricos (naturais, inteiros, etc.), equações de 1º e 2º
graus (situações problema, análise de gráfico, etc.), logaritmos, geometria
analítica e plana, dentre outros;
- [Administração]: teoria geral da administração, recursos humanos (cargos e
salários, etc.), qualidade e produtividade (5S, 6 Sigma, etc.), controle
(auditoria, fiscalização), dentre outros.
Um dos maiores erros de concurseiros é ignorar o valor desses conteúdos. Eles podem
ter até um peso mais baixo, mas ainda valem pontos. E quem quer perder pontos?
Se você não estuda nada para eles, corre o risco de zerar as questões — nesse caso,
pode ser eliminado pelo conteúdo mais simples. Melhor não se arriscar, correto?
### 2 Conteúdos exclusivos
Também não-TI, esses são conteúdos vinculados às leis e regimentos que regulam as
empresas e organismos das vagas. São as normas e instruções legais que, por
exemplo, estabelecem a criação do órgão ou falam das responsabilidades dos
funcionários.
Dentre eles, temos:
- Regimentos internos (regimentos da Câmara, [regimentos de tribunais], etc.);

- Leis orgânicas (da Polícia Civil, do Tribunal de Contas da União, etc.);
- Direitos específicos (Tributário, Ambiental, Autoral, etc.).
É um conteúdo difícil de se estudar, mas que pode ser dividido em pequenas partes e
estudado aos poucos. Desse modo, ele fica mais compreensível e fácil de lembrar.
É muito comum os candidatos errarem ou mesmo ignorarem esses conteúdos. Em geral,

acham impossível decorar tudo. Logo, você tem aqui uma oportunidade. Eles podem ser
um diferencial para aprovação.
### 3 Conteúdos gerenciais
Esse é um conteúdo que pode parecer maçante. Faz sentido, afinal de contas, é muito
papel e pouco teclado quando o assunto é gerência e planejamento.
Apesar disso, é um conteúdo que pode ser bem memorizado, já que é bem lógico. Como
não é algo comum no dia a dia, pode ser privilegiado nos seus estudos. Por quê?
Porque, digamos que você já programe em alguma linguagem. Tendo facilidade nela,
você não precisa se dedicar a essa mesma linguagem de programação da mesma forma
que a um conteúdo que não domina.
Esses conteúdos estão muito presentes em concursos para cargos como o de Analista,
o de Consultor e outros. Ele tratam de Gestão, Planejamento e Governança de TI.
Alguns itens que provavelmente cairão são:
- PMBOK - Project Management Body of Knowledge;

- COBIT - Control Objectives for Information and related Technology;
- ITIL - Information Technology Infrastructure Library;
- Redes de Computadores — Protocolos TCP/IP, HTTP, etc.
### 4\. Conteúdos de TI
São os conteúdos mais técnicos e abarcam tanto sua [dimensão infraestrutural] como
desenvolvimento. Conteúdos comuns são:
- [Segurança da Informação];
- Arquitetura de Computadores;
- Paradigmas de Programação (Orientada a Objetos, por exemplo);
- Linguagens de Programação (Java, PHP, etc.);
- Banco de Dados;
- Engenharia de Software;
- Arquitetura de Sistemas.
Bem, pode parecer extenso, mas saiba que há práticas para trabalhar esse conteúdo
de maneira viável. Vejamos, então, algumas dicas para potencializar seu estudo!
## Recursos e formas de estudar
Um bom começo sempre é planejar o estudo. E, para isso, [**a técnica SWOT**] pode
ser uma bela ajuda.
Sigla de Strengths, Weaknesses, Opportunities e Threats (forças, fraquezas,

oportunidades e ameaças, respectivamente), essa técnica mapeia o que você sabe,
além do que deve saber e tem facilidade ou dificuldade. E, é claro, [**elimina
distrações e procrastinação**].
Além de ler, resumir e anotar o conteúdo planejado, exercitar é vital. Quanto a

isso, os [**simulados de prova**] são uma das melhores opções.
Você viu que entre os conteúdos e temas das provas existem links para questões?
Experimente testar seu conhecimento através delas. Faça provas inteiras — assim
você sai da teoria e se obriga a lembrar do conteúdo.
Recomendamos estes simulados: [Analista de TI do CODEMIG], de 2013; [Analista de TI

do INSS], de 2014; e [Técnico de TI da PRODABEL], de 2010. Mas não fique só nesses,
busque e faça [outros simulados] também!
Complemente esses exercícios e a leitura com outros conteúdos. Você pode buscar as
[videoaulas], por exemplo. E, por fim, não ignore que você ainda é humano, e não um
computador.
Seu [corpo precisa de descanso], lazer e atividade física. Sem eles, o cérebro tem
dificuldade de reter memórias de curta duração, necessárias para transformarem-nas
em conhecimento. Por isso, busque dormir as oito horas de sono recomendadas e tenha
atenção com a sua alimentação!
Ser aprovado em um concurso público é algo muito desejado em qualquer área. E a

[**Alura**] pode ajudá-lo nessa jornada! Com profissionais atuantes na área, nós
desenvolvemos cursos que dão uma visão completa do conhecimento necessário, seja
para já trabalhar, atualizar suas habilidades ou passar no concurso.
Imagina que você tá usando o seu aplicativo bacana pra tirar fotos e aplicar uns
filtros marotos. Você vira o celular de lado para enquadrar melhor a foto e quando
vai ver o resultado percebe que a foto saiu desse jeito:
![Por que a orientação está incorreta?]
Mas por que será que isso aconteceu?
Isso acontece porque o sensor da câmera é fixo e não sabe como o dispositivo está
posicionado quando a foto é tirada. O papel dele é simplesmente capturar a imagem.
Ah, mas quando tiramos uma foto com o celular virado de lado e abrimos a foto na
galeria ela tá com a orientação correta!
Verdade! Isso mostra pra gente que tem alguém no meio do caminho fazendo algum tipo
de correção pra mostrar a foto direitinho. Bom, o sensor da câmera é fixo mas
sabemos que as câmeras digitais e também nossos smartphones tem aqueles sensores de
orientação pra saber quando devem virar a tela. O que eles fazem então é salvar a
imagem juntamente com essa informação da orientação justamente pra que a gente
consiga corrigir depois.
Pra salvar essas informações extras, praticamente toda câmera digital salva as
imagens no formato **Exif** que permite armazenar algumas tags com informações como
data, hora, geolocalização e também a orientação da câmera no momento da captura.
Isso significa que para mostrar uma foto no seu aplicativo com a orientação
correta, você só precisa conseguir ler esses dados extras e descobrir qual correção
aplicar antes de exibir a foto!
Mãos à obra então! Vamos criar uma classe que consiga devolver pra gente um
`Bitmap` corrigido a partir do caminho de uma foto. Usaremos a
classe ÈxifInterface` para acessar as informações extras da imagem e descobrir a
orientação da foto:
java
Agora que temos a orientação, só precisamos descobrir qual rotação devemos aplicar
ao abrir o `Bitmap`. Para isso, vamos comparar a orientação que obtivemos da
ÈxifInterface` com algumas constantes que já estão prontas. Como essas constantes
são do tipo inteiro, vamos ter que converter a orientação que pegamos da
ÈxifInterface` pra inteiro antes de fazer a comparação:
java
Agora só precisamos criar mais um método que abra a imagem como um `Bitmap` e faça
a rotação de acordo com a correção a ser aplicada.
java
Pronto! Agora só precisamos utilizar esse método na nossa classe que carrega as
fotos. Veja como fica o código completo:
java
Legal! Então agora só precisamos usar essa classe toda vez que formos carregar uma
imagem. Então se a gente tiver uma Àctivity` com uma ÌmageView` pra mostrar uma
foto, poderíamos usar nossa classe assim:
java
Agora sim já podemos mostrar nossas fotos sem se preocupar se elas foram tiradas
com o celular de pé ou de lado!
O que você achou dessa dica? Também já passou por esse problema e resolveu de outro
jeito? Conta pra gente! Se quiser aprender mais sobre desenvolvimento pra mobile,
dá uma olhadinha nos [**cursos mobile do Alura**] ou nos [cursos presenciais da
Caelum]!
imagem
Você tem uma campanha de lançamento de um novo produto, aplicativo ou plataforma,

mas não sabe a melhor maneira de impactar seus clientes no Facebook?
Quer impactar as pessoas que já se relacionam com sua marca, reforçando os

brandlovers, mas não sabe como encontrá-los e como atingi-los de maneira assertiva
para potencializar a ação?
E se eu te contar que você pode encontrá-los dentro da plataforma de uma maneira

fácil, assertiva, com grande potencial, e ainda reforçar mais um ponto de impacto?
Será que isso é possível?
Poucos sabem (e reconheço que fica até um pouco escondido hahaha) mas o quanto é
escondido lhe garanto que é eficaz, dentro de nosso glorioso [**Power Editor**] no
Facebook, conseguimos trabalhar com lista de e-mails!
E como isso pode beneficiar em suas estratégias? (Pode estar se perguntando aí

agora). Você pode subir sua base já fidelizada, seja captada por leads de seu blog,
ou mesmo campanhas de vendas de **e-mail marketing** que você trabalha, e ele
automaticamente cruza as informações dentro da ferramenta e encontra seus clientes
pra você limpo, claro e rápido sem pestanejar. ( E aí é legal ou não é?)
E o mais interessante é que ele não te limita a nada, não há restrição de número de
bases, você possui total liberdade de criar e ter uma segmentação própria para cada
assunto, por exemplo, de cada seção de seu site, cada tipo de produto e trabalhar
com cada interesse individualmente em seus anúncios.
> _Opa! Show de bola, mas onde encontro esse tal de **Públicos** que tanto fala no
Facebook?_
Mole, dentro do nosso famoso Power Editor, procure a seção **Ativos**, e lá terá
**Públicos**.
imagem_
imagem
Ao desenvolver um app de e-commerce, a tela inicial ficou mais ou menos assim:
imagem
Alguns podem ainda confundir esse recurso com uma **pesquisa dinâmica**, mas
existem pontos que deixam clara essa diferença.
## Pesquisa dinâmica
Em uma pesquisa dinâmica, também começamos digitando o item que esperamos
encontrar:
![]
Contudo, as sugestões apresentadas não são apenas de termos que eu possivelmente

estou buscando, mas sim de itens que já estavam sendo apresentados na página e, ao
digitar na busca, eles foram "filtrados" como possíveis sugestões do que eu buscava
nessa página.
Só que, se estamos falando de uma grande base de dados, talvez esse recurso não
funcione tão bem.
Para contextos maiores, uma saída melhor para a busca poderia ser a **pesquisa
avançada**.
## Pesquisa avançada
Em uma **pesquisa avançada**, estamos tratando com critérios e um refinamento muito

maior para a busca que o usuário quer fazer:
![]
Nesse caso, o usuário entrará com diversos inputs mais específicos, afunilando a
pesquisa de acordo com o que ele busca.
Esse recurso é mais utilizado em buscas complexas, porém podemos incluir uma outra
forma de afunilar uma busca através de uma **pesquisa categorizada**.
## Pesquisa categorizada
Nesse tipo de pesquisa, podemos simplesmente incluir um filtro de poucas

categorias:
![]
Nesse caso conseguimos dividir os resultados em "todos", “apenas notícias”, “apenas

imagens”, etc...
Ao fazermos isso, diminuímos o escopo da pesquisa, isto é, assim como na divisão em

categorias que o autocomplete pode oferecer, com essa "pré categorização",
direcionamos melhor o que o usuário busca.
## Alguns pontos importantes
No caso do app que criamos, o autocomplete com categorização foi suficiente. Porém,
existem alguns detalhes a considerar:
Quando fazemos uma ferramenta de busca, não podemos nos esquecer de oferecer ao
usuário o feedback necessário para compreender que a ação está ocorrendo,
**portanto inclua um elemento de carregamento ou progresso, que sugira a ação
acontecendo**.
![]
Ou ainda, se eu errei o que estou digitando ou desisti de procurar pelo que

coloquei no campo de busca, posso deletar tudo o que escrevi, ou oferecer ao
usuário a opção de deletar tudo o que fora escrito de uma vez, isto é, **um botão
que limpa todo o campo de uma vez**.
![]
Por fim, não podemos nos esquecer das lacunas que eventualmente podem virar "becos
sem saída" ao usuário como, por exemplo, realizar uma busca que não tem nenhum
resultado encontrado.
Nesse momento, podemos diminuir a frustração do usuário oferecendo novas

possibilidades de itens ou de termos de busca que o direcione a alguma nova ação ou
opção.
![]
Trabalhando bem uma ferramenta de busca conseguimos tornar a experiência do usuário

muito mais focada e rápida, levando esse usuário diretamente para o que procura e
aumentando a satisfação com a interação que realizou.
Assim como qualquer feature que implementamos, é importante monitorar como anda a
aceitação dos usuários, se realmente tem sido utilizado e considerado útil pelos
usuários.
Na Alura temos um curso de [**UX Produto**] que traz exatamente esses pontos,
trabalhando com as métricas que precisamos considerar para validar nossas features.
Sente falta de tempo e não consegue programar uma rotina de estudo? Então conheça o
calendário de estudo de um profissional de tecnologia.
Esses dias têm sido corridos demais... já passou por isso? Sensação de que faltou
tempo para estudar o que eu queria, e para praticar o que eu precisava.
Às vezes tenho a ilusão de que é um dia da minha vida que fez a diferença na minha
carreira. Que um dia bem estudado vai permitir um grande novo salto.
Mas, paro pra pensar... hoje não consegui estudar nada... tudo bem... eu tenho mais
um ano inteiro pela frente para estudar quase todos os dias, crescer quase todos os
dias.
## A técnica de estudo
Em vez de estudar muito durante um único dia, prefiro estudar um pouco quase todos
os dias. **Espaçar e repetir é uma técnica comprovada de estudo e crescimento
profissional. Mas como estudar quase todo dia sendo que quase sempre "falta tempo"?
**
Todo ano compro um calendário, aquelas agendas de papelaria mesmo, em que anoto o
que estudarei cada um dos dias. Tenho sempre um mês à frente anotadinho, dia a dia,
o que estudarei em uma única hora que tenho em cada dia útil, cada dia algo
diferente. Tem até nome esse tipo de estudo: **interleaving**.
A consistência é o que me faz crescer. Porém, para isso, preciso de uma

oportunidade para estudar todos os dias. Preciso de muito conteúdo disponível para
mim, e de um guia, de alguém que faça a curadoria do que devo e o que não devo
estudar para não perder meu tempo.
Foi por isso que criei o **Alura**: tenho conteúdo de colegas instrutores o qual
posso estudar. E existe a necessidade de estudar muito para eu criar meus cursos na
plataforma. É por isso que gosto da **Casa do Código:** tenho livros curados pelo
meu colega Adriano para estudar todos os dias no próximo ano.
## Preparando o calendário de estudo
Queria fazer um convite para você... entre agora em um site de cursos como o Alura,
ou em uma site de livros como a Casa do Código. Escreva o nome de 5 cursos ou
livros, compre uma agenda e anote cada um em um dia da semana nas próximas 4
semanas.
Por exemplo, se hoje é segunda-feira, dia 4:
java
### Seguindo as regras do calendário
Pronto. Todo dia útil, no mesmo horário, foque uma única hora para estudar aquilo
que se comprometeu. Não precisa terminar hoje, afinal você terá semana que vem
(**spaced repetition**) e, até lá, estará conectando outros assuntos também
(**interleaving**), para não ficar viciado e com uma visão unilateral.
Não tenha dúvida também: todo dia você se pergunta "devo estudar A ou B?". Já está
escrito em sua agenda: é A, ponto final! Assim como eu, se tirar essas dúvidas do
caminho, você senta e aproveita aquela uma hora estudando do começo ao fim.
### Resultados obtidos
Em um mês você terá lido dois livros e estudado três cursos. Isso no seu primeiro
mês, quando ainda não aplica outras técnicas que eu uso!
Está feito o meu convite, compre sua agenda agora mesmo, deixe ela na frente do seu
monitor em sua casa, para não esquecer da uma hora diária.
Passe os próximos 12 meses estudando comigo e crescendo junto nas mais diversas
áreas de [**programação**] e [**design**], usando esta e outras técnicas que
compartilharei.
E meu convite vai mais longe: daqui 12 meses, vamos ver o quanto aprendemos e onde
chegamos, fico curioso para saber tanto o quanto você aprendeu como o que achou
dessa experiência de foco de um ano de crescimento na carreira.
O que acha?
Sugestões de passos para agora mesmo:
- Comprar uma agenda e deixar na frente do monitor

- Separar uma hora por dia
- Preencher o próximo mês
- Me contar quando terminar o primeiro curso!
Como você deve ter percebido, o mais legal é que você consegue usar essa técnica
para qualquer tipo de aprendizado. Seja por um curso online, como é o nosso caso
aqui [**na Alura**] ou um dos nossos cursos presenciais [**na Caelum**] ou através
de um livro, como os [**da Casa do Código**]. É só uma questão de se organizar.
E você, já começou a montar o seu calendário?

Criei algumas [**imagens no Docker**]e queria compartilhá-las com os outros
desenvolvedores da empresa. Para isso, consigo usar os próprios repositórios do
Docker, como o [**Docker Hub**], ou o [**Docker Store**]. Lá nós colocamos nossas
imagens e elas ficam disponíveis para download.
Porém se eu colocar minha imagens nesses repositórios, só vou conseguir baixá-las

se estiver com internet. Quero que essas imagens fiquem sempre disponíveis na minha
rede local. Dessa forma mesmo sem internet terei acesso a elas.
Mas como posso criar um repositórios de imagens local?
## Criando o repositório
O Docker trabalha com containers. Então, nada mais justo, que seu repositório de
imagens também seja um container. Então para criarmos nosso repositório local basta
iniciarmos um container.
No Docker, esse repositório local se chama **Registry**. Então para criarmos nosso
repositório local, basta ir até o servidor e digitar:
`docker run registry`
Mas dessa maneira travamos o terminal com a execução desse container, ou seja, não
podemos utilizar esse terminal enquanto nosso container estiver rodando. Para que
isso não ocorra, basta falar para o Docker rodar nosso container no background (`-
d`).
`docker run -d registry`
Nosso Registry está rodando, mas como vamos acessá-lo? Quando nós acessamos um
serviço na rede, por exemplo o site da Alura, precisamos ter acesso a esse serviço.
Ou seja, precisamos de uma [porta de acesso]).
No caso de sites, a porta padrão é a porta `80`. Já o nosso registry utiliza por
padrão a porta `5000`.
Então vamos dizer ao Docker para ele iniciar nosso repositório mapeando a porta (`-
p`) **5000** do nosso host para a porta \*\*5000 \*\*do nosso container.
`docker run -d -p 5000:5000 registry`
Uma boa prática quando criamos containers é dar nomes para eles. Isso facilita sua
administração. Como estamos criando um repositório de imagens, podemos dar o nome
(`--name`) `repositorio`.
`docker run -d -p 5000:5000 --name repositorio registry`
Se nosso container do Registry cair, será um problema? Precisamos garantir que

mesmo se o container caia, outro suba em seu lugar. Ou seja, queremos reiniciar
(`--restart`) nosso container sempre que ele cair:
`docker run -d -p 5000:5000 --restart=always --name repositorio registry`
imagem adicionar uma regra, que no nosso caso pode ser permanente (`--permanent`),
e adicionar a porta (`--add-port`) que queremos liberar. Também precisamos dizer
qual o protocolo de comunicação que, neste caso, é o protocolo `tcp`
`firewall-cmd --permanent --add-port=5000/tcp`

Agora temos que reiniciar o firewall para que nossa alteração fique válida:
`firewall-cmd --reload`
imagem da imagem do `wordpress` com o nosso repositório. Neste caso, vou utilizar o
endereço IP do nosso registry, que no meu caso é o `192.168.0.10`, na porta `5000`.
E o nome dessa imagem no repositório também será `wordpress`.
`docker tag wordpress 192.168.0.10:5000/wordpress`
imagem e em baixo vamos realizar nossa configuração.
Vamos dizer que quando o Docker iniciar (ÈxecStart`) o daemon do Docker

(`/usr/bin/dockerd`) vai adicionar um repositório considerado inseguro (`--
insecure-registry`):
ÈxecStart=/usr/bin/dockerd --insecure-registry 192.168.0.10:5000`
imagem reiniciar o daemon (`daemon-reload`) para que nossas configurações passem a

valer. Como essas são as configurações do Docker, vamos reiniciar (`restart`) esse
serviço também:
`systemctl daemon-reload`
`systemctl restart docker`
![]
Agora se tentarmos enviar nossa imagem para o servidor, obteremos sucesso:
`docker push 192.168.0.10:5000/wordpress`
![]
## Para saber mais
Colocar um repositório inseguro não é uma boa prática de segurança. Neste caso, só
utilizamos para entender como funciona o registry.
Para aumentar a segurança do nosso repositório, podemos criar sistemas de

autenticação e utilizar certificados de segurança. Um exemplo de como faz essas
configurações, está na [**documentação do Docker**].
Perceba que as imagens ficam no container `repositorio` que está no servidor. Ou

seja, se esse container for excluído as imagens se perderão.
Por isso, uma boa prática é criar volumes entre o container e a máquina host. Pois,
mesmo se o container for excluído, temos uma cópia das imagens na máquina.
Neste caso utilizamos o endereço IP para se comunicar com o repositório. Porém,

podemos utilizar um nome como uma URI. Para isso, temos que configurar um
[**serviço de DNS**].
Docker e containers são um dos assuntos mais comentados nos dias de hoje. Muitas
coisas foram facilitadas pelos containers, tanto na parte de infraestrutura, quanto
na parte do desenvolvimento.
Por isso aqui na Alura temos um [**curso de Docker**]. Nele você aprenderá sobre
como o Docker funciona, como utilizar e criar containers, como criar suas próprias
imagens e muito mais.
Como os containers estão sendo muito utilizados, algumas ferramentas foram criadas
para facilitar sua administração. Uma ferramenta muito utilizada é o Kubernetes.
Com ele conseguimos gerenciar nossos containers, criar balanceamento de cargas

entre nossos container e realizar sua comunicação de uma forma mais simples.
No [**curso de Kubernetes**] você vê algumas dessas técnicas e, no final, consegue

realizar o deploy da aplicação na nuvem.
Você já deve ter visto websites que possuem em sua URL o símbolo de um cadeado e o
nome HTTPS logo ao lado.
imagem
Para entender essa diferença, vamos considerar a seguinte aplicação web na qual um
usuário de uma empresa (vamos chamá-lo de João), está usando apenas o protocolo
HTTP, ou seja, o modo “Não seguro”:
imagem. Mas como foi possível conseguir essas informações??
## Entendendo o princípio do protocolo HTTP
As comunicações em uma rede são feitas por um conjunto de regras e procedimentos

chamadas de protocolo [**Link**]). O protocolo HTTP, Hypertext Transfer Protocol,
foi inicialmente desenvolvido para permitir a comunicação com um servidor web, a
princípio, o método existente era apenas o de “pegar” (GET) o conteúdo de um
servidor.
Com o passar do tempo, surgiu a necessidade de não somente pedir informações do

servidor, mas também de passar as informações. Atualmente sabemos que na Web, não
apenas pedimos como também mandamos informações, certo? Como é o caso de uma compra
na internet. Mas o que acontece se esse for um dado sensível como os dados e senha
do cartão de crédito?
Analisando o nome do protocolo HTTP, vemos que se trata de um protocolo para

transferência de texto, dessa forma, os dados e senha do cartão de crédito são
passados como um texto para o servidor também!
Isso significa que, se caso alguém analisar essas informações será capaz de ver
quais são os dados e senha do cartão de crédito. Portanto, quaisquer aplicações web
que usam o protocolo HTTP e precisam passar dados sensíveis, possuem uma
vulnerabilidade para o cliente final.
Tendo ciência de todo esse problema, todo o site que opera no protocolo HTTP,
precisa, de alguma forma, encontrar algum meio de se proteger, certo? É nesse
momento que o HTTPS entra como um grande aliado! Mas o que o protocolo HTTPS faz
para resolver essa vulnerabilidade?
## Conhecendo o protocolo HTTPS
Agora, ao invés de analisar um site “Não seguro”, isto é com o protocolo HTTP,
faremos a análise em um site “Seguro” que trabalha com o HTTPS.
Nesse nosso exemplo, consideraremos a página de login da Alura usando os mesmos
dados que usamos na aplicação que estava usando o HTTP. Vejamos o resultado:
imagem e destrancar a caixa (descriptografar). Quando temos a mesma chave utilizada

para criptografar e descriptografar um dado, chamamos esse processo de criptografia
de **chave simétrica**. Exemplos de alguns algoritmos que utilizam esse sistema de
chave simétrica:
- **DES (Data Encryption Standard)**

- **AES (Advanced Encryption Standard)**
Uma vez que a mesma chave é usada para realizar a criptografia e a descriptografia,
é necessário encontrar uma forma de enviar essa chave ao destinatário (caso ele
ainda não tenha) para que ele possa assim destrancar a caixa e ler o conteúdo da
carta (descriptografar).
Mas veja só o que temos, se a mesma chave é usada para trancar (criptografar) e
destrancar (descriptografar), o que aconteceria se alguém conseguisse interceptar
essa chave? Essa pessoa conseguiria utilizá-la para poder ver as informações
passadas e continuaríamos tendo o mesmo problema não é mesmo? E agora?
Desse modo, somente a utilização desse processo de chaves simétricas durante as

etapas de comunicação pode não resolver completamente o problema e por isso uma
nova forma de criptografia também foi desenvolvida para complementar a utilização
das chaves simétricas. Vamos voltar ao exemplo anterior.
### Processo de chaves assimétricas
Nós temos o Roberto e a Luísa, o Roberto deseja enviar uma carta com conteúdo
confidencial para a Luísa. A ideia agora é que o Roberto utilizará um cadeado
especial e tal cadeado terá 3 posições:
1 - trancado 2 - destrancado 3 - trancado
imagem e a outra chave só poderá ser usada na posição decrescente (posição 3, 2 e

1).
O Roberto decide trancar a caixa com a primeira chave, a que consegue operar o
cadeado na ordem crescente. Dessa forma, para poder trancar a caixa, ela estará
agora na posição 3. Essa chave o Roberto não enviará para ninguém, é a chave
exclusiva dele, chamaremos essa chave de **chave privada.**
A segunda chave que opera na ordem decrescente (posição 3, 2 e 1), será usada para
enviar para a Luísa, como estamos enviando essa segunda chave para outra pessoa, a
chamaremos de **chave pública.**
Quando a caixa chegar até a Luísa, ela estará trancada na posição 3. Com a chave
pública que a Luísa recebeu, ela consegue operar na ordem decrescente e voltar o
cadeado para a posição 2 (posição destrancada) e abrir a caixa, lendo assim o
conteúdo da carta.
A Luísa ao responder a mensagem irá trancar com a chave pública. Lembre-se que a
chave pública só funciona no sentido decrescente, dessa forma, como ela está na
posição 2 (destrancada), ela só poderá ir para a posição 1 para trancá-la
novamente. Uma vez que o Roberto receber a caixa, ele poderá usar sua chave privada
(aquela que ele guardou para si e não distribui para ninguém e só funciona na ordem
crescente) para voltar o cadeado para a posição 2 (destrancada) e poder assim abrir
o conteúdo da mensagem.
imagem a outra chave é usada para destrancar a caixa (descriptografar). Quando
temos duas chaves, chamamos esse processo de criptografia de **chave assimétrica**.
Exemplos de alguns algoritmos que utilizam esse sistema de chave assimétrica:
- RSA (Sendo as iniciais dos sobrenomes de seus desenvolvedores: Ron Rivest, Adi
Shamir, e Leonard Adleman)
- DSA (Digital Signature Algorithm)
## Implementação do protocolo de segurança do HTTPS
Os princípios de chaves simétricas e assimétricas serão usados pelo HTTPS durante o

processo de comunicação. Dentro do HTTPS existe um protocolo responsável por
inserir essa camada de criptografia, vamos conhecer algum deles:
### SSL
O primeiro protocolo desenvolvido para esse fim foi de autoria da empresa Netscape
e recebeu o nome de **Secure Sockets Layer 1.0**, ou mais popularmente conhecido
como SSL v1.0. O protocolo **SSL** sofreu modificações e melhorias até chegar na
sua última versão, SSL v3.0.
Porém ao longo dos anos foram descobertas algumas vulnerabilidades nesse protocolo,
uma dessas vulnerabilidades poderia expor informações criptografadas e acabou sendo
chamada de Poodle (Padding Oracle on Downgraded Legacy Encryption) , para mais
detalhes segue link do governo norte-americano alertando sobre tal
[**vulnerabilidade descoberta no protocolo SSL**].
### TLS
Uma vez que o protocolo SSL v3.0 apresentou essas vulnerabilidades foi necessário o
desenvolvimento de um novo tipo de protocolo para atribuir essa camada de
criptografia de uma maneira mais segura.
Esse novo protocolo recebeu o nome de Transport Layer Security, TLS 1.0 sofrendo
adaptações e melhorias ao passar do tempo chegando na versão mais atual até o
momento de escrita desse post, a versão TLS 1.2
O principio de utilização do TLS é unir as forças das chaves assimétricas e

simétricas durante o processo de comunicação. Uma vez que as chaves assimétricas
possuem um processo de criptografia envolvendo duas chaves distintas,
consequentemente há um maior tempo de processamento. Por isso o TLS utiliza esse
processo na fase de autenticação entre o cliente e o servidor.
Em seguida, ele faz uso das chaves simétricas que possuem um processo de
criptografia com apenas uma chave, logo, necessita de menos tempo para seu
processamento.
Uma vez que podemos ter uma grande quantidade de dados sendo transmitidos, as
chaves simétricas serão mais rápidas para processar toda essa informação e será
utilizado na fase de transporte dos dados, também conhecido como **bulk**.
Caso tenha mais interesse nesse mundo de protocolos e segurança, não deixe de ver
nossos cursos sobre [**HTTP: Entendendo a web por baixo dos panos**], [**Segurança
Web: Vulnerabilidades do seu sistema e OWASP**] e [**Segurança de redes: Conheça as
vulnerabilidades de servidores e clientes**]
imagem
Um grande erro é o famoso “atirar para todos os lados”. Quem faz isso, encontra
mais resistência e, provavelmente, vai se desanimar ao ouvir um “não” seguido de
outro. Além disso, a atividade se torna mais desgastante e trabalhosa.
Por isso, antes de tentar aprender na base da tentativa e erro, leia e aplique as
dicas deste post. Vamos trazer as principais informações sobre o assunto.
Acompanhe!
## Você conhece o seu público e o mercado?
Antes de começar, vamos combinar que, sempre que usarmos o termo “produto”,
estaremos falando de produto ou serviço. Assim, conseguimos ser mais objetivos.
Então vamos lá!
A primeira coisa que você precisa fazer é achar o cliente certo: aquele que mais
pode ser beneficiado com o seu produto ou serviço. Por isso, você deve se perguntar
que tipo de problema ele tem que o seu produto resolve.
A partir disso, fica mais fácil para você identificar o perfil de pessoa que
convive com essa dificuldade e, portanto, tem uma necessidade maior de adquirir sua
oferta.
Depois disso, você deve se dedicar a 3 informações essenciais para sua prospecção.
São elas:
### O mercado
Já reparou como são as entrevistas com presidentes de grandes empresas? Sobre o

quanto eles falam do mercado? A quantidade de dados e informações que eles possuem?
Você pode achar que não precisa disso, mas não é bem assim!
Sem [**conhecer o mercado**], você não tem como saber se existem clientes em número
suficiente para prospectar, onde eles estão concentrados, qual o potencial de
compra deles, como a concorrência faz... E assim por diante.
Mas não se preocupe! Essa não é uma tarefa difícil. Com a internet é muito fácil
levantar esse tipo de informação. Aliás, algumas entidades como o [**Sebrae**]
fazem levantamentos o tempo todo e os disponibilizam na rede.
### A persona
Hoje em dia falamos mais em persona do que em público-alvo. A diferença é que ela é
como se fosse um personagem: tem preferências pessoais, uma maneira de falar (mais
formal ou descontraída), objetivos, problemas definidos e um perfil determinado.
Mas você não deve supor essas características do perfil de sua persona. O que
funciona é pesquisar a respeito analisando seus clientes atuais. Depois disso,
basta identificar os detalhes que são comuns entre eles e considerar esses pontos
como os que definem o seu cliente ideal. Dessa maneira, você consegue determinar a
linguagem adequada e se aproximar dele com mais facilidade.
### A jornada de compra
**Conhecendo o mercado e a persona, você já tem grande parte do que precisa, mas
ainda faltam alguns detalhes importantes.** Para uma boa prospecção, você precisa
conhecer como seus clientes compram. Em outras palavras, estamos falando dos passos
que eles trilham para comprar seu produto.
Você deve investigar, por exemplo, como ele pesquisa a respeito de sua oferta, como
usa a internet, se considera a opinião de outras pessoas, ou o que for necessário
para direcionar seu usuário chega ao seu produto.
## Você tem suas etapas definidas?
As informações da jornada de compra são importantes para que você possa desenvolver
o seu processo de prospecção alinhado aos passos da sua persona. Imagine se ela usa
aplicativos de ofertas e você não está presente em nenhuma dessas ferramentas. Sua
ação vai ficar mais difícil, não é mesmo?
Mas se você elabora suas etapas do processo de vendas de acordo com o mercado que
pesquisou, os hábitos da jornada e o perfil da persona, o encontro entre vocês
ocorre mais naturalmente e a busca de novos clientes não é tão desgastante como se
estivesse “atirando para todo lado”.
## Sua conversa de vendas é persuasiva?
Se a sua conversa de vendas não for convincente, elas não vão te dar muita atenção.
Além disso, o maior erro que você pode cometer nos primeiros contatos é sair
falando do seu produto ou promoção. Não faça isso!
Primeiro é preciso vender a ideia, ou seja, despertar o interesse em te ouvir.
Quantas vezes alguém te abordou oferecendo um produto e o que disse entrou por um
ouvido e saiu pelo outro? Isso ocorre quando não quebramos a barreira inicial.
É por isso que, conhecendo os problemas de sua persona, você deve elaborar uma
conversa de vendas que rapidamente desperte o interesse.
Por exemplo, digamos que você trabalhe com criação publicitária e seu possível
cliente seja um empresário do setor de alimentos, de 45 anos, com formação
universitária e dificuldade de tornar sua marca conhecida.
Você poderia dizer: “O senhor já conhece os pontos-chave que têm garantido

resultado para grande parte das empresas de alimentação na divulgação de suas
marcas?” Funcionaria muito melhor do que simplesmente oferecer um serviço de
criação de identidade visual, não acha?
## Você usa os canais certos para prospectar clientes?
Outro ponto determinante é a definição dos canais que você vai utilizar. Como
vimos, ela deve se basear nos hábitos do seu cliente que foram identificados quando
você conheceu a jornada de compra dele. Então, confira alguns dos canais de
prospecção que você deve considerar:
- indicações: conseguir indicações dos seus clientes atuais, de parceiros ou

conhecidos do seu cliente ajuda muito na atividade, pois o nível de confiança é bem
mais alto;
- participação em eventos: eventos setoriais como feiras de negócios, premiações,
congressos e encontros entre empresários são ótimos para levantar prospects que,
nesses momentos, estão mais descontraídos e abertos para um contato;
- networking: manter sua rede de relacionamento ativa é importante para que você
seja lembrado, o que sempre gera oportunidades;
- [**produção de conteúdo**]: publicar conteúdo em redes sociais, no seu blog ou
para enviar por e-mail é outra opção. Ao fornecer informações relevantes de forma a
estimular que seu prospect se aproxime, ele pode se tornar um grande fã até antes
de virar um cliente;
- associações e outras entidades: se a sua persona participa como associada em
alguma entidade, você deve se aproximar e, conforme o caso, até oferecer um
convênio com condições especiais para os associados;
Para concluir, a tarefa de prospectar clientes é uma das que mais exige um bom
acompanhamento de resultados. É preciso estar atendo aos indicadores de desempenho
para encontrar gargalos e, com base neles, desenvolver ações de correção e
aprimoramento.
No que diz respeito ao meio digital, na Alura temos um curso de Marketing digital
voltado para [**análise de resultados do site**], uma boa forma de começar a medir
o retorno do que foi investido. ;)
**Fala Vinicius, beleza? Diz pra gente o seu nome completo, por favor.** Vinicius
Brito de Paulo.
**Mora em qual cidade atualmente?** Bauru, SP.
**Estuda? Qual instituição e curso?** Sim, Fatec-Bauru, no curso de Banco de Dados.
**Trabalha atualmente? Qual o seu cargo?** Pode se dizer que sim rsrs, pois estou
afastado. Mas trabalho como desenvolvedor Front-End.
**Como foi seu contato com a área de TI?** Meu primeiro contato foi quando consegui
meu primeiro computador quando eu tinha meus 14 anos. Lembro que era um Celeron
D(básico), já bastante curioso queria saber como funcionava e fui logo abrindo o
PC. Depois conheci as paginas web e queria saber como isso funcionava. Que
felicidade quando conseguir fazer aquele primeiro alert(“Hello Word !!”).
**E porque começou a desenvolver em Front-End?** Me adaptei melhor ao Front, não

que eu não saiba de back. Antes do desenvolvimento eu trabalhava como Suporte de TI
e sempre queria ir para equipe de desenvolvimento como qualquer estagiário, mas
certo dia pintou uma oportunidade> um grande amigo Zé(@J_Zes) me chamou para
trabalhar com ele.
Meio inseguro demorei para dar a resposta com aquele pensamento “Nossa será que sou
realmente capaz de trabalhar como programador ?”. E sim, qualquer pessoa é capaz
basta ter força de vontade e acreditar no seu potencial. Hoje no meu trabalho temos
uma equipe de 4 pessoas e são os melhores desenvolvedores, já deixo o meu abraço ao
(Eloi, Zé e Kennedy)
**Seu objetivos no Front-End quais são?** Não só o Front-End mais também Back-End.
Venho correndo atrás bastante para sempre aprender mais. Meus principais objetivos
são melhorar meus conhecimentos em Front-End com programação funcional, sempre
tentando fazer o melhor Html, Css, JavaScript e utilizando as melhores ferramentas.
**Quais linguagens você utiliza?** No meu trabalho a linguagem utilizada é Java e

banco é Postgres. Então conhecimento em Java, JSF, Primefaces e outros derivados é
necessário. Também faço alguns freelas utilizando PHP, Angular. Mas o que realmente
estou gostando é a pegada do NodeJs e as distribuições hibridas (PhoneGap e Ionic),
e outras coisas como por exemplo MongoDB, Firebase, Android.
**Quais foram as maiores dificuldades que você teve durante toda a sua trajetória?
** Acho que a maior dificuldade está acontecendo agora, pois recentemente descobri
que estou com câncer e venho lutando contra isso. No dia que descobri foi
complicado, mais no outro dia pegue meu notbook e fique desenvolvendo no hospital
mesmo, não queria nem saber rsrsrs.
**Quais são seus planos para o futuro?** Melhorar meus conhecimentos e terminar
minha plataforma que comecei fazendo no hospital(internado). Ainda está em
desenvolvimento mais está disponível para testes em http://freelafree.kinghost.net.
**Existem outros projetos que você está desenvolvendo ou pretende desenvolver

atualmente?** Sim. Além do freelafree, estou desenvolvendo uma aplicação de slide
em tempo real feito em NodeJs, um aplicativo de localização de pessoas com
PhoneGap, um gerenciador de arquivos e também meu TCC que será um sistema de
replicação de dados entre Mysql e MongoDB feito em Python.
**Para quem quer começar a programar, o que você sugeriria?** A primeira coisa é
não desistir dos seus objetivos!
Busque a cada dia aprender mais, o meu amigo Zé(@J_Zes) uma vez me disse: nunca
faça do jeito mais fácil, mais sim da melhor maneira, busque conhecimento e o
diferencial.
**A Alura é um ótimo lugar para quem quer começar e tem um ótimo suporte.**
O Angular fez bastante barulho quando foi lançado em 2010 e ganhou o coração de
muitos desenvolvedores e empresas.
Mas a web mudou de lá pra cá. E mudou bastante.
O Angular 2 tem várias features novas e é bem diferente do 1. Os destaques vão para
o maior suporte ao mobile e os recursos mais modernos dos browsers. E mais uma
novidade: a recomendação do time do Google é que os desenvolvedores usem
[**TypeScript**] com Angular 2. O Typescript foi desenvolvido pela Microsoft e é
uma versão de Javascript que suporta funcionalidades como classes no estilo da
Orientação a Objetos, bem parecido com o que temos em Java e C#.
Você pode baixar a versão 2 e ver todas as funcionalidades novas e documentação

[aqui].
> _Quer dizer então que o Angular 1 morreu, paro de estudar e não encosto mais um
dedo nisso?_
Não necessariamente, depende muito do seu caso. O Angular 1 é um framework que está
há muitos anos no mercado e muitos desenvolvedores e empresas ainda o utilizam e
continuarão utilizando. As linguagens e ferramentas não simplesmente morrem assim.
Mas, a tendência é que os projetos novos de hoje sejam criados na versão 2. Então,
se você vai começar um projeto novo hoje, **é recomendado que você vá com o 2
mesmo** :)
E aqui na Alura os alunos já vem pedindo curso de Angular 2 há um boooom tempo. Nós
estávamos esperando essa versão final para começar a trabalhar em algo concreto.
Esperem novidades para um futuro não tão distante!
Enquanto isso, porque não estuda a [versão 1] com a gente? :)

Você está buscando maneiras de melhorar as suas chances para destacar a sua
carreira e encontrar o trabalho dos seus sonhos? Então esse artigo é para você.
As redes sociais podem exercer diversos papéis: **socialização, compartilhamento de

nossas ideias e opiniões.** Além disso ela também é considerada como um espaço para
marcas e clientes interagirem e empresas buscarem pelo candidato ideal.
> Empresas buscarem pelo candidato ideal?
Sim! Já foi o tempo em que as redes sociais era considerada apenas como uma opção
de entretenimento.
O [**LinkedIn**] é conhecido como a rede social dos profissionais, então saber

utilizar seus recursos, aproveitar-se da visibilidade que ele pode gerar e se
relacionar com pessoas chaves que estão nessa importante rede social pode fazer
toda diferença na sua carreira profissional. Ficou curioso? Então continue lendo :)
## A análise feita pela equipe do LinkedIn
Para descobrir o que exatamente os empregadores estão procurando e o que é preciso

para conseguir um emprego com sucesso, o LinkedIn olhou para bilhões de pontos de
dados e analisou toda a contratação e recrutamento atividade que ocorreu em seu
site até o final de 2016 para identificar os perfis profissionais e habilidades
mais procurados.
[**Durante essa análise**], eles descobriram as 10 principais habilidades que você

pode desenvolver durante esse ano.
_"Enquanto vemos as aplicações de trabalho aumentarem no LinkedIn, sabemos que as

empresas não estão contratando na mesma proporção"_, diz Catherine Fisher,
especialista em carreira do LinkedIn, em um comunicado à imprensa:
> "Embora algumas habilidades expirem a cada dois anos, nossos dados sugerem
fortemente que as habilidades tecnológicas ainda serão necessárias nos próximos
anos, em todas as indústrias. Agora é um grande momento para os profissionais
desenvolverem as habilidades que precisam para se tornarem mais relevantes no
mercado.”
Como a ideia desse artigo é despertar o seu interesse e curiosidade para aprimorar
a sua carreira, aqui estão as habilidades mais quentes e mais demandadas em todo o
mundo:
1. Computação em nuvem e distribuída

2. [Desenvolvedor Java]
3. [Design da interface do usuário]
4. [Segurança das Redes e da Informação]
5. [Desenvolvimento Móvel]
6. [SEO] / SEM Marketing
Em um post no LinkedIn, Fisher explica que a lista de "melhores habilidades" revela

várias tendências sobre o mercado de trabalho global, incluindo:
## 1 Demanda para os comerciantes está ficando mais leve
Embora as habilidades de marketing estivessem em alta demanda em 2015, _"as coisas

mudaram"_, escreve ela.
> "Este ano, SEO / SEM caiu cinco pontos de N º 4 para N º 9 e gestão da campanha
de marketing caiu completamente fora da lista.La demanda por habilidades de
marketing está diminuindo porque o fornecimento de pessoas com habilidades de
marketing tem apanhado com a demanda dos empregadores para Pessoas com habilidades
de marketing."
## 2 Dados e nuvem reinam suprema
_"Eu cheiro uma dinastia em construção!"_ Fisher escreve.
> "Nuvem e computação distribuída tem permanecido no primeiro lugar nos últimos
dois anos ... Seguindo de perto os seus passos é a análise estatística e mineração
de dados, que veio em n º 2 no ano passado, e n º 1 em 2014."
Essas habilidades estão em uma demanda tão alta porque estão na vanguarda da
tecnologia. Os empregadores precisam de funcionários com computação em nuvem e
computação distribuída, análise estatística e habilidades de mineração de dados
para se manter competitivo.
## 3 Design de interface do usuário é o que está quente agora
_"O design da interface do usuário (nº 5), que está projetando a parte de produtos
com os quais as pessoas interagem, é cada vez mais demandado pelos empregadores"_,
escreve Fisher.
> "Os dados se tornaram centrais para muitos produtos, o que criou uma necessidade
para pessoas com habilidades de design de interface de usuário que podem tornar
esses produtos fáceis para os clientes usarem".
[Clique aqui] para ver o relatório completo e detalhamento das habilidades em

demanda por país.
O curso mais popular do mundo tem [**taxa de conclusão de cerca de 20%**]. E os

outros 80%? Desistem no meio.
No começo dos cursos de Harvard online, [**entre 5 e 20% dos alunos concluem o
curso**]. O resto? Desiste bem antes de chegar na metade dele.
Estimativas dizem que, em média, [**menos de 10% dos estudantes de MOOCs terminam o
curso**].
Terminar um curso está ligado com diversos fatores.: o curso é bom? O curso é útil?
O professor é bom? A didática é boa? O conteúdo é interessante? O tamanho é ideal?
São centenas de detalhes que tentamos atacar nos diversos treinamentos internos que
o **Guilherme Silveira** criou para nossos instrutores aqui da Alura. Não é a toa
que ele é o chato que cobra todo mundo (:
E qual o resultado desses treinamentos para os nossos professores e alunos? Altas

taxas de conclusão. 85% de nossos alunos concluem pelo menos um curso, com uma
média de 8 cursos concluídos por aluno - média!
### Quais os cursos com a maior % de conclusão?
Entre os cursos de Java, por exemplo, sem dúvida alguma o de [Primeiros passos] e
[Orientação a Objetos] se destacam bastante nesse critério. Assim como o de
[Fundamentos da linguagem] e [Orientação a objetos] em C# e o de [JQuery] no
JavaScript.
Aqui vai um exemplo de 10 cursos na Alura:
- [Java II: Orientação a Objetos] - 59%

- [HTTP: Entendendo a web por baixo dos panos] - 59%
- [Certificação Java SE 7 Programmer I: Laços] - 57%
- [jQuery I: Introdução à biblioteca campeã de JavaScript] - 57%
- [Lógica de Programação II: Funções, Desenhos e um Jogo] - 56%
- [Identidade Visual I: do briefing ao papel] - 53%
- [JavaScript: Programando na linguagem da web] - 51%
Legal, não é?
Agora a pergunta é: o que pode significar uma taxa de conclusão?
A explicação é simples: alguns alunos estão preocupados em terminar o curso para

receber o certificado. Justo, neste caso esperamos e desejamos que ele conclua.
Outros alunos querem aprender o conteúdo e passar para a frente.
**Também é justo, e nem sempre eles precisam ir até o fim do curso, ele pode parar
quando sentiu que foi o suficiente e partir para o próximo, também ficamos
felizes.**
**De qualquer maneira, não deixamos que a peteca caia, queremos taxas de conclusão
altas e que os alunos saiam satisfeitos, prontos para um próximo aprendizado.
Acompanhar e entender essas estatísticas é muito importante para nós, o mais
importante é manter o aluno crescendo sempre em sua carreira.**
Sabemos como o Django, framework web escrito em Python, pode ser bom para
aplicações web. Mas ao final de todo o desenvolvimento, o que fazemos com todo o
projeto?
Recentemente, desenvolvi um [simples projeto de agenda de contatos] utilizando o

framework [**Django**], e resolvi compartilhar pela Internet. É uma aplicação web,
então o ideal seria que fosse possível acessá-la como acessamos qualquer outro
site, digitando seu endereço em um navegador qualquer, em um computador qualquer.
Assim, me preparei aluguei um [**VPS**] com Linux e registrei um domínio estilo

`dominio.com.br`. O serviço do servidor possuía diversos tutoriais ensinando a
colocar projetos em PHP e Java de pé, mas não de Django… E aí, como podemos rodar
nossa aplicação?
## Enviando os arquivos locais para o servidor remoto
A primeira coisa que precisamos fazer é, realmente, mandar nossa aplicação para o
servidor que eu aluguei. Afinal, atualmente tenho todos os meus arquivos aqui no
meu computador, mas não vou rodar a aplicação por ele.
Para esse primeiro passo, temos várias opções, como [**FTP**], [**SFTP**], ou o
**[Git]**. Por conta da simplicidade, vou optar pelo Git, aproveitando que meu
projeto já está no [GitHub].
Em minha pasta de usuário (`home`), quero clonar (`clone`) o repositório que está
lá no GitHub para um diretório chamado àgenda`. Um simples comando faz o trabalho:
Rapidamente, podemos ver que uma pasta àgenda` (como especificamos no final do
comando) foi criada em nosso diretório `home`, contendo os arquivos do projeto - a
aplicação Django em si:
imagem, onde cada ambiente terá sua própria versão dos pacotes. Mas como podemos
criá-los?
No Python, temos o **_[virtualenv]_**, que cria ambientes Python isolados, nos

quais podemos aplicar as configurações que desejarmos.
Podemos instalá-lo através do **[pip]**, com o seguinte comando no terminal:
> Dependendo da configuração do seu sistema, será necessária permissão `sudo` para
rodar esse comando
Com o _virtualenv_ instalado, podemos criar um novo ambiente com um simples

comando, especificando o nome que queremos definir:
Rodando esse comando, um diretório deve ser criado:
imagem nossa aplicação para o diretório do ambiente virtual, apenas para manter uma
melhor organização:
Certo! Entrei (`cd`) no diretório da aplicação para testar:
Coloquei o servidor do Django para rodar, com o clássico comando `runserver`:
python
Mas… novamente um erro! Dessa vez, direto no terminal:
sql
A longa exceção que recebemos indicou um erro de configuração, nos questionando se

instalamos o driver conector do MySQL com o Python. De fato, não instalamos. Na
verdade, nem ao menos instalamos o MySQL em si! Vamos cuidar disso, então.
## Instalando o MySQL (MariaDB)
Antes de tudo, precisamos apertar **CTRL-C** para sair do `runserver` falho. Feito
isso, agora precisamos instalar o banco de dados.
No caso, usarei o [**MariaDB**], que é um _fork_ do MySQL, porque é como está

configurado em minha máquina local. Caso quiséssemos usar outro serviço, como o
PostgreSQL, ou o SQLite, essa parte de configuração seria diferente.
A instalação também depende da distribuição Linux e gerenciador de pacotes que

estamos usando. No nosso caso, vamos focar na instalação com o **[apt]**, padrão de
distribuições derivadas do Debian, como o Ubuntu, por ser o mais conhecido.
Apesar disso, é importante que fique claro que não é a única possibilidade!
Bastaria um pouco de pesquisa para descobrir os nomes dos pacotes relativos ao que
instalaremos pelo apt.
Antes de começar a instalação, vamos sair do nosso ambiente virtual, pois não
precisamos dele agora. Para isso, basta usar o comando `deactivate` no terminal:
imagem
Temos o banco de dados e suas dependências instaladas, mas ele ainda está
completamente vazio, sem configuração alguma.
Assim, antes de qualquer coisa, é importante que criemos nossa database (`CREATE
DATABASE`) àgenda` e nosso usuário (`CREATE USER`), que vou chamar de `yan`.
Também temos que dar os privilégios necessários (`GRANT ALL PRIVILEGES`) para nosso
usuário.
> Caso SQL ainda seja um tópico confuso, temos uma [apostila disponível
gratuitamente] que trata da linguagem e de bancos de dados relacionais, além dos
diversos [cursos na Alura]! ;)
Note que ainda não criamos a tabela de contatos que meu projeto usa, e é porque
fazer isso manualmente é desnecessário! Já já vamos ver como o Django pode nos
ajudar nisso.
Com o básico do banco configurado, precisamos passar para o próprio Django essas
configurações. Para isso, vamos alterar algumas coisas no arquivo `setttings.py`,
dentro da pasta àgenda`, de nossa aplicação àgenda`. Vamos entrar em nosso
ambiente virtual e editar o arquivo com o `nano`:
python
E agora, o que devemos mexer nele?
## Configurando o banco de dados no Django
Com o arquivo `settings.py` aberto, vamos procurar a parte que trata do banco de
dados, localizada no dicionário `DATABASES`. Dentro dele, há outro dicionário,
`'default'`, com as configurações padrões - é nele que queremos mexer.
A primeira variável, `'ENGINE'`, diz respeito ao tipo de banco de dados que estamos
usando. Como estamos com o MariaDB, que é um fork do MySQL, devemos colocar o valor
`'django.db.backends.mysql'`. `'NAME'` trata do nome da _database_, e ÙSER` e
`PASSWORD` das informações do usuário. Podemos deixar `'HOST'` e `'PORT'` vazios,
já que o banco está rodando no próprio [localhost] do servidor. Ao final, esse
bloco do código ficou assim:
sql
Com essa estrutura definida, podemos fazer a migração com o Django:
python
Algumas mensagens devem aparecer indicando que tudo deu certo:
imagem:
imagem nossa _virtualenv_. Instalar o pacote é fácil com o àpt`:
```
sudo apt-get install nginx
```
> Em sistemas que não utilizam do àpt`, esse processo também não deve ser nada
difícil, provavelmente apenas usando um comando diferente.
Com o Nginx instalado, podemos logo inicializá-lo, como fizemos com o MySQL:
python
Agora podemos passar para a parte de configuração. Precisamos explicar para o Nginx
como queremos que ele lide com as requisições.
Para isso, vamos criar um arquivo de configuração específica para nosso projeto no
diretório `sites-available` do Nginx. Vamos nos mover para esse diretório com o
comando `cd`:
python
Utilizando o apt, provavelmente conseguimos entrar no diretório que queríamos,

porque o pacote do Nginx mantido por lá automaticamente vem com as pastas `sites-
available` e `sites-enabled`. Entretanto, em outros sistemas é possível que isso
resulte em um erro indicando que essa pasta não existe. Se for o caso, a resolução
é simples - podemos criar esses dois diretórios manualmente:
python
Com as duas pastas criadas, precisamos abrir o arquivo de configuração geral do

Nginx:
python
Agora basta adicionar uma linha **dentro do bloco `http { }`**:
python
Agora sim (caso essas pastas não tenham sido criadas automaticamente), podemos
entrar na pasta sem problemas:
python
Vamos criar nosso arquivo de configuração do projeto, então:
python
Nosso arquivo de configuração de projeto do Nginx, que será incluído dentro do

bloco `http { }` nas configurações gerais, tem uma estrutura básica, com um bloco
`server {}`. Dentro desse bloco, vamos definir a variável `server_name` para
especificar a que sites estamos tratando:
sql
> `meudominio` deve ser alterado para o domínio que registramos e/ou o IP do
servidor
Além disso, vamos adicionar um bloco `location { }` **dentro do nosso bloco `server
{ }`**, especificando como o Nginx deve responder para requisições em localizações
específicas. No nosso caso, queremos que para qualquer localização a partir da raiz
`/`, a requisição seja encaminhada para o Gunicorn.
Ainda não configuramos o Gunicorn, mas podemos definir agora mesmo que queremos que
ele rode no próprio localhost (`127.0.0.1`) na porta **8000**. Assim, adicionamos o
seguinte ao bloco `server { }`:
sql
Legal! O único problema é que quando o Nginx enviar a requisição para o Gunicorn, o
endereço de IP e o hostname específicos dessa requisição se tornarão o localhost e
o hostname do nosso servidor. Para resolver isso, basta adicionar algumas linhas no
bloco `location / { }`. Ao final, o arquivo fica assim:
sql
Certo! Temos a configuração de nosso site disponível. Precisamos avisar o Nginx que
este site não só está disponível, como também ativo, e para isso vamos para o
diretório `sites-enabled`:
python
Dentro da pasta, vamos criar um link com a configuração que acabamos de criar,
usando o comando `ln` no terminal:
python
Se nosso Nginx já veio com a pasta `sites-enabled`, provavelmente há um arquivo

padrão que não queremos no diretório. Para removê-lo, basta o comando `rm`:
python
Ao final, podemos reiniciar o Nginx, para aplicar as mudanças, com o comando:
python
Agora, podemos partir para o Gunicorn.
## Instalando e configurando o Gunicorn
Com o Gunicorn, as coisas ficam bem mais simples. Primeiramente, por ser um pacote
Python, podemos ir lá para o diretório de nossa aplicação e ativar o _virtualenv_:
python
Para instalar o Gunicorn, basta usar o pip:
python
Agora já podemos iniciá-lo. É importante que lembremos de usar o mesmo endereço de

IP e a mesma porta que especificamos lá para o Nginx:
python
Finalmente, podemos acessar nosso site pelo navegador, através da porta padrão do
HTTP. Para testar nossa aplicação de agenda de contatos, resolvi tentar adicionar
alguns contatos através da página de **admin** (`http://meudominio.com.br/admin`):
imagem, muito menos nessas URLs. E agora?
## Coletando e configurando os arquivos estáticos
O Django tem, por padrão, alguns arquivos estáticos que melhoram a usabilidade
padrão do framework. Coletá-los é simples, podemos fazer com apenas um comando com
o `manage.py`. Vamos fechar o Gunicorn com **CTRL-C** e cuidar disso, então.
Antes, porém, o Django precisa saber onde queremos guardar esses nossos arquivos.
Eu decidi deixar em uma pasta `static/`, fora da aplicação Django, mas dentro do
ambiente virtual.
Além disso, quero que qualquer arquivo dentro desta página apareça como na URL
`meudominio.com.br/static/`. Assim, modifiquei as últimas linhas do meu arquivo
àgenda/settings.py` e deixei da seguinte forma:
python
Agora sim, podemos simplesmente rodar o comando no terminal:
python
Rapidamente, os arquivos vão ser todos copiados:
python
Certo! Agora já temos os arquivos que precisamos. Mas espera… como o Nginx vai
saber que quando a requisição for para a URL `meudominio.com.br/static/*` ele deve
buscar nessa pasta que criamos? Precisamos avisá-lo!
Vamos voltar para a edição de nosso arquivo de configuração do projeto do Nginx:
python
Agora, dentro do bloco `server { }`, vamos precisar de mais um bloco `location { }`
específico para as URLs `/static/`, e que funcione como um atalho para nossa pasta
lá no ambiente virtual. Assim, podemos adicionar isso no arquivo:
sql
Feito! Podemos reiniciar o Nginx e executar novamente o Gunicorn:
python
Dessa vez, olha como ficou a página de admin:
imagem pode ser uma ótima opção para o seu projeto!
Após toda a programação, chega sempre um dos momentos mais temidos para os
desenvolvedores - o deploy. Apesar dos mitos, hoje aprendemos passo a passo como
colocar no ar nossa aplicação Django, de forma simples e eficiente. Daqui para
frente não teremos mais esse problema!
Além disso que aprendemos hoje, é bacana saber que temos mais opções que podem nos
ajudar com o deploy de aplicações, como o [**Docker**].
Se quiser continuar estudando sobre o assunto, dê uma olhada em nossos cursos na

Alura de [**Django**] e [**Python**] e continue aprendendo!
imagem
Estou configurando um servidor e preciso configurar um serviço de **DNS**. Para

esse serviço funcionar eu preciso editar alguns arquivos. Só que o servidor não
possui modo gráfico, apenas o terminal.
Ou seja, não consigo abrir o bloco de notas, o Notepad++, Sublime, nem nenhum outro
editor de texto visual.
Como posso editar esse arquivo? Será que existe algum editor de textos para ser
utilizado no terminal?
## Começando com o Vim
Existem diversos editores de texto para terminais, cada um com suas singularidades
e modos de utilização.
No mundo **Linux**, um bem conhecido é o Vim, um editor de texto simples e

poderoso. Mas como podemos usá-lo para editar nossos arquivos?
O Vim é um editor de texto que funciona via terminal, isto é, sem interface gráfica
como o bloco de notas, nem conta com o auxílio do mouse. E, como praticamente tudo
no terminal, ele funciona por meio de comandos.
Como queremos configurar um serviço de DNS, ou seja, queremos configurar o serviço

que traduz os nomes das URIs em endereços IPs. Logo, vamos abrir o arquivo
`named.conf` que contém as informações sobre nossos domínios.
Esse arquivo fica dentro da pasta ètc`. Para abri-lo com o `vim` podemos entrar na
pasta e depois abrir o arquivo, ou então, simplesmente passar o caminho até ele:
`vim /etc/named.conf`
imagem.
Então vamos ter que copiar linha por linha?
Não necessariamente. Apesar do Vim ser um editor de textos pelo terminal, existe
nele um modo chamado **visual**. Nesse modo conseguimos selecionar uma área do
texto para copiá-lo, recortá-lo ou excluí-lo. Para acessar o modo visual é basta
apertarmos a tecla `v` (visual).
imagem Podemos salvar e sair do arquivo. Mas como eu consigo sair desse arquivo?
Não podemos dar um `Ctrl + s` para salvar o arquivo, nem um Àlt + F4` para sair.
Bem, queremos salvar esse arquivo. Ou seja, queremos escrever as mudanças que
fizemos. Para isso, no modo normal, podemos utilizar o comando `:w` (write) que
escreve (salva) as mudanças no arquivo. Já para sair do arquivo podemos utilizar o
comando `:q` (quit).
## Para saber mais
Além do Vim, existem outros editores de texto para terminal como o Nano, Emacs,
entre muitos outros.
O Vim é **case-sensitive**, ou seja, ele diferencia as letras maiúsculas de

minúsculas. Por isso, ao digitarmos nossos comandos, é importante sempre notar se
ele é feito com letras maiúsculas ou minúsculas.
O comando `:w` salva o arquivo, já o comando `:q` saí do arquivo. Logo, se

desejamos salvar e sair do arquivo podemos unir esses dois comandos e digitar
`:wq`, ou simplesmente `:x`.
Se quiser saber mais sobre o poder do Vim, você pode digitar o comando `:help` no
modo normal do editor, ou ainda no terminal utilizar o comando `vimtutor`:
imagem
Além dos gráficos, história e jogabilidade, um outro aspecto que marca **jogos** de
todas as épocas são as **trilhas sonoras**. Quem tem o costume de jogar com
frequência, consegue lembrar facilmente de alguma música que toca em momentos
específicos de uma fase, ou até mesmo de quase toda a trilha sonora de algum jogo
em especial.
Hoje, os games triplo A utilizam de orquestras, estúdios e centenas de artistas

para produzir suas músicas... Mas nem sempre foi assim. Por muito tempo, ao decidir
incluir uma música em um jogo, era necessário transcrevê-la em código e usar
**samples** das maneiras mais criativas possíveis.
Aqui tem uma lista com alguns jogos que revolucionaram com suas trilhas sonoras,
cada qual em sua época:
# Revenge of Shinobi
https://www.youtube.com/watch?v=HiOhzHrj2qs
Yuzo Koshiro, compositor e produtor de músicas para vídeo-games, foi o primeiro

artista a ter seu nome estampado na capa de um jogo com créditos por sua música.
Ele se tornou uma das pessoas mais influentes e respeitadas da história das músicas
de vídeo-games.
# Donkey Kong
https://www.youtube.com/watch?v=-5rAjOjTGtc
Aquatic Ambiance é uma música que levou o Super Nintendo aos seus limites na época.
O _nerdwriter_ tem um vídeo documentando as grandes mágicas feitas com o chip
SPC700:
https://www.youtube.com/watch?v=jvIzIAgRWV0
Para poder caber nos 64kb de limites, foi necessário, literalmente, programar as
músicas dentro do código do jogo!
# Zelda Ocarina of Time
Koji Kondo ficou mundialmente conhecido por suas músicas em The Legend of Zelda e
também em Super Mario Bros. No famoso livro *Koji Kondo's Super Mario Bros.
Soundtrack*, Andrew Schartmann dá bastante destaque a criação da trilha sonora de
todos os Zeldas:
https://www.youtube.com/watch?v=qXRRpSiOAV0
# Street Fighter 2
Essa é a única obra da compositora Yoko Shimomura em Street Fighter antes de ir

para a Square. O icônico tema do Guile é dela:
https://www.youtube.com/watch?v=4qwKCQ4M2Nw
O [Yamaha YM2151] também foi levado aos seus limites para poder trazer vida as
músicas compostas por Yoko.
Aproveitando, você pode estudar e praticar [**programação**](/cursos-online-

programacao) e [**desenvolvimento de jogos**](/cursos-online-programacao/jogos) com
a gente! E, se você quiser conhecer como funcionam os jogos, pode descobrir [neste
**Nerdologia**].
imagem
Um amigo meu me pediu para criar um programinha que leia os dados que ele gerou (em
JSON)sobre a pontuação dos países em uma competição e faça algumas manipulações.
Como eu já tenho bastante experiência com PHP, decidir utilizá-lo como linguagem
para essa tarefa.
O primeiro passo foi, claro, pedir os dados para meu amigo, e foi esse JSON que ele
me enviou:
json
Com isso, sabemos que temos uma lista de [**objetos literais**] em JavaScript, mas
e em PHP? Como esses dados seriam representados?
## Lendo JSON
Bom, a primeira coisa a fazermos é ler esse arquivo em JSON e transformá-lo em

algum dado que a gente possa maniuplar em PHP.
Felizmente isso é muito fácil e tudo que precisamos fazer é chamar uma função
chamada `json_decode`.
php
Executando este código, temos a seguinte saída:
php
Podemos notar que recebemos como retorno um array de objetos do tipo `stdClass`.
Isso é como se fosse um objeto literal do JavaScript. É um tipo de **objeto sem
forma onde podemos adicionar quaisquer propriedades** que quisermos.
Se nós adicionássemos um segundo atributo à função `json_decode`, poderíamos

informar que ao invés de objetos do tipo `stdClass` nós gostaríamos de receber
[**arrays associativos**]. Então basta mudar nosso código para:
php
E desta forma todos aqueles objetos se tornam arrays associativos.
Bom, agora que já lemos os dados para um formato conhecido em PHP, vamos ver o que
meu amigo me pediu pra fazer:
- Listar o número de países participantes;

- Fazer com que seus nomes fiquem em letras maiúsculas;
- Ordenar:
- Pelo país que tiver mais medalhas de ouro
- Em caso de empate, pelo país que tiver mais medalhas de prata
- Em caso de empate, pelo país que tiver mais medalhas de bronze
- Listar o número de medalhas distribuídas na competição
## Número de itens em um array
A primeira tarefa é fácil. Temos um array, então basta realizarmos um `foreach` por
ele, e a cada iteração, incrementar um contador.
Mas, espera... Isso parece bem complexo pra uma tarefa tão simples. Antes mesmo de
digitar esse código fui dar uma pesquisada em alguma solução melhor e encontrei a
função [**count**].
Esta função faz exatamente o que queremos: **Conta o número de itens em um array
PHP**. Então para entregarmos a primeira solicitação, basta fazer o seguinte:
php
E a saída será:
php
## Alterando os dados de um array
A segunda tarefa também parece fácil. É só fazer um foreach e deixar o índice

`pais` de cada item na lista em letra maiúscula, não é?
Testei aqui e vi que não. Quando a gente usa o `foreach`, uma cópia de cada item é
criada para realizar a iteração. Então aqui nós temos 3 soluções:
- Realizar o **foreach** utilizando referências (consulte [aqui]);

- Realizar um `for` normal e editar cada chave;
- Mapear o nosso array para um novo com os valores modificados.
Bom, parece que a terceira opção é interessante e a função que mapeia um array para
um novo com valores modificados se chama **array_map**.
Ela recebe um array por parâmetro e aplica uma função em cada item para que as
alterações sejam realizadas e retorna o item modificado. É exatamente o que
queremos e o código utilizando ela fica assim:
php
Agora se executarmos `var_dump($dadosEmJson);` de novo, veremos que todos os países

estão com letra maiúscula.
## Ordenando um array
Bom, agora vamos à parte de ordenar. Eu aprendi na faculdade alguns algoritmos de

ordenação, mas honestamente não me lembro muito bem deles. Então dei uma pesquisada
rápida sobre como ordenar um array e achei a função `sort` do PHP.
Com ela, se passarmos um array por parâmetro o próprio PHP ordena pra gente.
Basicamente assim:
php
Beleza, parece uma boa solução, mas como o PHP vai saber que nossa regra de
ordenação é pela quantidade de medalhas? Seria legal eu poder fazer como no
àrray_map` e passar uma função dizendo como quero ordenar.
O PHP não me desaponta nunca e pesquisando encontrei rapidinho a função pra isso. É
a ùsort`. Essa função funciona igualzinho à `sort`, mas podemos passar uma função
informando a regra de ordenação.
Funciona assim:
Passamos uma função que recebe 2 parâmetros, que são 2 itens do nosso array. Se
segundo nossa regra, o primeiro item passado deve vir primeiro, nós devemos
retornar um número negativo (-1 por exemplo).
Se o segundo item passado por parâmetro deve vir primeiro na nossa ordenação,
retornamos um número positivo (1, por exemplo). Se pela nossa regra for um empate e
o PHP não precisar fazer nda, basta retornar 0.
Sei que parece um pouco complicado, mas no código vai ficar mais fácil de entender.
Dá uma olhada:
php
Com isso, já conseguimos ordenar pelo país que mais tem medalhas de ouro, mas essa
não era nossa única regra. Pensando um pouco, dá pra ver que nosso código ia ficar
cheio de ìf`s dessa forma, então fiz uma otimização no código e ficou assim:
php
Agora parece que nosso código não vai ficar tão grande. Conseguiu entender essa
lógica? Faz alguns testes aí e vamos continuar implementando a regra.
Falta agora verificar, se as medalhas de ouro forem iguais, ordenar por prata. Se
forem iguais ainda, ordenar por bronze. No final, fica parecido com isso:
php
Essa parte do código é meio complicadinha de ler, então se você preferir, pode
fazer suas refatorações, criar outras funções para auxiliar ou ler com mais calma e
realizar seus testes, mas com ela, conseguimos implementar a ordenação desejada. :-
D
## Reduzindo um array a apenas um dado
Agora nós chegamos na última tarefa. Precisamos pegar todo esse array, realizar os
cálculos e retornar o número de medalhas distribuídos nessa competição.
Falando de outra forma, precisamos reduzir um array ao número de medalhas.
Aqui a gente poderia de novo fazer um `foreach` e ir somando cada dado, mas seria
um pouco mais trabalhoso do que precisa, já que mais uma vez o PHP nos dá uma bela
de uma mãozinha com a função **array_reduce**.
Com ela nós passamos uma função que irá acumulando os valores desejados de cada
item em um array, e no final reduz isso tudo a um valor.
Um exemplo mais simples de uso dessa função é somar os dados de um array que
contenha números. Ex.:
php
E com isso nós teríamos em `$soma` o valor de `15`.
Agora que já ficou um pouco mais claro, vamos aplicar para o nosso caso. Basta
somarmos todos os valores das medalhas assim:
php
E este código exibirá:
php
## Filtrando um array
Bom, foi trabalhoso mas conseguimos implementar tudo o que meu amigo pediu. Acho
que seria legal até pra gente praticar um pouco mais, entregar também uma função
que filtra desses países apenas os que não tiverem espaço em seu nome.
No PHP temos uma função exatamente para isso, o **array_filter**. Essa função
recebe um array e uma função que retorna se cada item deve ou não fazer parte do
novo array filtrado.
Para isso, basta retornarmos `true` apenas se não encontrarmos nenhum espaço no
nome do país. Com isso nosso código pode ficar assim:
php
E executando `var_dump($paisesComNomeSemEspaco);` vemos que funciona, e temos

apenas o Brasil. :-D
## Resumindo...
Bom, foi bastante coisa que fizemos aqui, então dando uma recapitulada, o que nós
fizemos foi:
1. Ler uma string em json para um formato conhecido pelo PHP;

2. Contar os itens de um array;
3. Mapear um array para outro com alterações;
4. Ordenar um array com regras complexas;
5. Reduzir um array a um único valor (a soma, por exemplo);
6. Filtrar um array baseado em algum critério que definirmos;
7. Como colocar uma string em letras maiúsuclas com [mb_convert_case];
8. Procurar uma string dentro de outra com [strpos].
## Conclusão
Ufa... Quanta coisa, né!? Arrays em PHP são muito poderosos e nos dão muitas
facilidades. Ainda há muitas outras funções que você pode conferir [na documentação
do PHP], mas já deixo aqui uma dica:
> Arrays no PHP são otimizados para tudo e para nada ao mesmo tempo, ou seja, você
pode fazer o que quiser com eles, mas se precisar de muita performance, é melhor
procurar alternativas como as [Estruturas de Dados] ou dar uma olhada no [**Curso
de Collections**] aqui da Alura.
Quando fazemos uma análise de dados, é muito comum utilizarmos dados provenientes
de um banco de dados, arquivos de texto, como `.csv`, arquivos de log, entre
outros. Além desses, existem outros locais que podemos obter dados para serem
analisados.
Por exemplo, quando estamos querendo saber sobre alguma tecnologia. Nós podemos
procurar em blogs, fóruns, redes sociais, na documentação da tecnologia… Todos
esses locais contém que podem nos ajudar com a nossa busca.
Na análise de dados também! Podemos, por exemplo, varrer sites em busca de

informações, ou então, utilizar as redes sociais para entender melhor nossos
clientes. Podemos utilizar essas informações para melhorar nossos produtos, ou
então sugerir o produto que melhor atenda as necessidades do cliente.
Existem vários sites e redes sociais que podemos utilizar para obter informações, o
Twitter é um exemplo. Nós lemos os tweets e obtemos as informações, mas temos que
ler cada tweet? Isto é, precisamos ler um tweet por vez e fazer a análise nós
mesmos?
Podemos fazer dessa maneira, contudo é um pouco trabalhoso, não acha?
Nós poderíamos criar um **script** que busca os tweets para a gente com base em uma
palavra, por exemplo. E, então, criamos outro script para classificá-los.
Mas como conseguimos captar os tweets?
## Buscando tweets
Para buscar os tweets, nós precisamos nos comunicar com a [**API do Twitter**].
Existem algumas bibliotecas em Python que podemos utilizar para isso. Uma muito
utilizada é a [Tweepy]. Com ela, conseguimos, entre outras coisas, buscar tweets.
Como estamos utilizando o Python, uma maneira de instalar essa biblioteca é

utilizar o `pip`. Portanto: `pip install tweepy`.
imagem**, temos as informações que vamos usar para nos conectar no Twitter. Isto é,
a chave do consumidor (Consumer key), o segredo do consumidor (Consumer secret), os
token de acesso (Access token) e seu segredo (Access token secret).
A chave de consumidor e seu segredo são como nosso "usuário", enquanto os tokens
são como nossa “senha". Logo, não podemos ficar compartilhando essas informações.
Como essas chaves são muito grandes, vamos guardá-las em variáveis ficar mais fácil
de manipulá-las:
py
Mas nós ainda não nos autenticamos nossa aplicação Twitter, apenas pegamos as
credenciais. Como vamos acessar pelo Tweepy, podemos dizer para o `tweepy` se
encarregar dos nossos dados de autenticação.
Então, podemos falar para o Tweepy nos autenticar utilizando nossa chaves de
acesso:
py
A classe **OAuthHandler** é responsável por nos autenticar no Twitter. Veja que no

construtor só passamos a chave do consumidor e seu segredo. Mas e os tokens?
Podemos falar quais são os tokens da nossa autenticação. Isto é, nós podemos
atribuir um valor para o token de acesso:
py
Legal! Já temos todos os dados para nos autenticar. Então vamos para para o
`tweepy` se conectar com a ÀPI` do Twitter com esses dados de àutenticacao`:
py
Já estamos conectados com o Twitter, agora podemos buscar (search) nossos tweets.
py
Mas o que vamos buscar? Isto é, qual nossa consulta (`q`)? Na [documentação do
Twitter], ele diz que devemos passar um parâmetro de busca chamado `q`. Por
exemplo, se queremos pesquisar sobre os tweets da Alura ou que citam ela, podemos
passar como parâmetro seu nome:
py
Vamos rodar o código e ver se temos algum resultado:
imagem que fez o tweet e a mensagem do tweet (`text`).
py
imagem.
py
![]
Agora sim! Temos uma visualização mais limpa dos tweets.
## Para saber mais

Além do Tweepy, temos outras bibliotecas que podemos utilizar para nos comunicar
com a API do Twitter. Uma delas é o [Twython]. A sua utilização é similar com a
Tweepy.
Neste caso, como não utilizamos uma conta paga para fazer a busca dos tweets, não
temos acesso a todos os tweets postados, porém, conseguimos um valor bom para
começarmos uma análise.
Além de buscar tweets, essas bibliotecas nos permitem buscar usuários, descobrir o
número de seguidores e até tuitar alguma mensagem como se estivéssemos utilizando o
site ou o aplicativo.
Conseguimos captar os tweets. Agora podemos salvá-los em uma lista, ou em um

arquivo e fazer nossas análises. Aqui na Alura, temos uma [**formação de machine
learning**] onde você aprenderá a criar algoritmos que processam textos e
classificá-los. Por exemplo, se o tweet é ou não um spam.
imagem
Uma noção importante para o designer é a de psicologia das cores, um estudo focado
na interação das tonalidades com o interlocutor, ou seja, o entendimento de como
uma determinada cor pode afetar a percepção de uma pessoa sobre um produto ou
serviço.
Continue a leitura e saiba como o uso correto das cores pode alavancar os seus
projetos de design, destacando-os da concorrência. Vamos lá?
## O que é psicologia das cores?
Como seres sensoriais, desvendamos o mundo através de nossos sentidos; um som, um

gosto ou um cheiro trazem reações instantâneas para nossa mente. E com as cores,
não é diferente. Um matiz pode ter inúmeras interpretações e trazer à tona muitos
sentimentos. Entender como a cor de um projeto para web pode transmitir segurança é
essencial para um designer.
Por meio de experimentos e estudos, podemos determinar a eficácia de tons

específicos para cada tipo de necessidade de comunicação. Existem cores capazes de
indicar o segmento de uma empresa, se ela é arrojada ou conservadora, se ela quer
transmitir diversão ou mais seriedade etc.
A cor exata pode encurtar a distância entre a marca e o cliente, tornando-a de

fácil reconhecimento. Também é capaz de comunicar sentimentos e ressaltar noções já
existentes de um determinado produto ou serviço.
## Como as cores sao usadas no Design?
A cor tornou-se uma forma de expressão, o que trouxe ao mundo moderno um novo
problema: como se destacar em meio a um ambiente tão colorido? Transmitir de
maneira correta uma mensagem por meio da cor pode ser a diferença entre o sucesso e
o fracasso de um projeto.
A Coca-Cola é um ótimo exemplo de como a cor afeta a percepção do público. O

[**vermelho da marca**], junto da sua forma, pode ser reconhecido facilmente ao
redor do mundo.
Outras empresas também utilizam a psicologia das cores, criando tons exclusivos que
se tornam sinônimos de seus serviços e produtos. Muitas possuem pantones
patenteados que podem ser somente utilizados pela empresa que os registrou, mas
isso não significa que é necessário o uso dessa modalidade de cor para obter
sucesso.
O designer pode utilizar uma grande variedade de tons e significados que vêm
atrelados a cada um deles. A seguir vamos apresentar alguns e mostrar de que
maneira afetam o público.
## Qual o significado das cores?
Ao utilizar a cor certa para um projeto, o designer cria uma ponte cognitiva entre
consumidor e produto. Dominar o que cada uma transmite é essencial.
**Amarelo**: otimismo, felicidade, desenvolvimento e clareza. O amarelo estimula os

processos mentais e o sistema nervoso, ativa a memória e encoraja a comunicação.
**Verde**: riqueza, natureza, crescimento e saúde. Essa cor acalma, traz harmonia e
renovação, relaxa o corpo e ajuda a aliviar a ansiedade.
**Azul**: confiança, força, credibilidade e profissionalismo. A cor mais utilizada

em projeto de UI e UX, está carregada de um senso de inovação e segurança.
**Roxo**: imaginação, sabedoria, realeza e misticismo. O roxo é empolgante, ao

mesmo tempo em que acalma a mente e os nervos, encoraja a criação e inspira.
**Rosa**: romantismo, diversão e jovialidade. Esse tom excitante pode aumentar a

pressão sanguínea, a respiração, a pulsação e os batimentos cardíacos. Estimula a
energia, ação e confiança.
**Vermelho**: coragem, foco, excitação e energia. Assim como o rosa, o vermelho

também altera propriedades físicas de nosso corpo, desde a pressão sanguínea até os
batimentos cardíacos. Por estimular a ação e a confiança, essa cor é muito
utilizada em promoções.
**Laranja**: alegria, confiança e agressividade. Essa cor estimula a atividade, o

apetite e a socialização. Uma escolha divertida, cheia de calor e energia.
**Branco**: pureza, neutralidade e limpeza. O branco simboliza novos começos,

encoraja a organização e auxilia na clareza mental.
**Preto**: autoridade, poder e suavidade. A falta de cor representa o vazio e evoca

o mistério.
Essas são apenas algumas opções entre as várias tonalidades que o designer pode
escolher. Como podemos ver, existe uma grande variedade de significados em cada
cor. Mas como escolher a ideal?
## Como escolher a cor de um projeto?
Cada projeto de design tem necessidades distintas, por isso é impossível garantir
que uma cor será sempre exata para todo tipo de demanda. No entanto, existem alguns
casos em que uma cor prevalece sobre outras, como é no design de interfaces e
experiência do usuário, conhecidos também pelas siglas [**UI e UX**].
Presente em sites importantes como [**Facebook**] e Twitter, o azul é uma
unanimidade quando se trata de UI e UX. Mas por que tamanha aceitação?
Como já vimos anteriormente, azul é uma cor ligada à inovação e tecnologia. Outras
cores,como o vermelho, o laranja ou o verde possuem uma ligação simbólica mais
forte com erro, atenção ou sucesso, o que torna o azul excelente alternativa para
designers.
Ele é bem-aceito por homens e mulheres ao redor do mundo, transmite segurança e

confiabilidade. Grandes empresas de tecnologia como PayPal, Dell, IBM e Intel
utilizam o azul em suas interfaces de usuário. Repleto de calma, inteligência e
equilíbrio, o azul também é uma excelente escolha quando o assunto é
acessibilidade. Mesmo nos tipos mais comuns de [**daltonismo**], uma deficiência
visual que dificulta a percepção de cores, existe a detecção da cor azul.
Porém, é preciso ressaltar mais uma vez que cada projeto pode (e deve) possuir
características únicas. Nem sempre o tom mais utilizado pelo mercado será o correto
para seu cliente. Por isso, quando necessário, utilize [**ferramentas para
auxiliar**] em suas escolhas cromáticas.
Por fim, não deixe de realizar [**testes A/B**] constantes em seu projeto,
acompanhe o fluxo de visitas com auxílio dos Heat Maps e não tenha medo de ousar em
cores inusitadas e contrastantes.
Agora você já está por dentro da importância que a psicologia das cores tem no
design e sabe que sua aplicação vai destacar seus projetos e trazer reconhecimento
para você e seus clientes.
Quando trabalhamos em um projeto de identidade visual, as cores escolhidas são

muito importantes, mas não são as únicas coisas a se preocupar.
Tipografia, estrutura, composição e muitas outras coisas fazem parte do projeto.

Aqui na alura temos um [**curso de identidade visual**]. Nele você aprenderá essas
técnicas para compor a identidade visual desde o briefing até a validação.
Quer saber mais dicas e informações sobre design? Siga o Alura nas redes sociais e
compartilhe com a gente suas dúvidas e seus êxitos. Esperamos por você!
imagem
Alguma vez você, que se interessa em tecnologia, pensou em como é ser parte de um
time de devs em empresas com crescimento rápido e que usam as mais novas
tecnologias e métodos de trabalhar?
Se você está curioso, continue lendo: **nós batemos um papo bem legal com quatro
pessoas que desenvolvem na Movile, na Alura e na iFood**. Alexis, Esdras, Joviane e
Yuri falam sobre a rotina deles, linguagens e ferramentas que usam e como foi o
processo de chegada na empresa.
E, atenção aqui! Eles também compartilham **dicas para quem quiser começar na
área** ou se candidatar para alguma vaga dentro das próprias equipes deles.
imagem é a_ **_diversidade de tarefas_**_. Aqui já dei aulas presenciais de Java e

de front-end, depois quis experimentar como era falar na frente da câmera e gravei
alguns cursos para a Alura e, agora, faz uns 6 meses que voltei a ser dev. É uma
trajetória muito legal.”_
imagem.
**Yuri**: _Entrei na Caelum 4 anos atrás como estagiário, quando estudava Sistemas
de Informação na USP. O pessoal da faculdade advertia que quem trabalha em uma
empresa acaba largando a faculdade por não ter tempo suficiente. Mas,_ **_era bem
flexível e, sempre que precisava estudar, meu chefe entendia_** _e até me
incentivava a ir para a facul. O único problema era o sono_ (risada)_. No primeiro
mês, fiquei bem cansado por estudar de manhã e trabalhar de tarde._
**Joviane**: _Estava fazendo a_ [_Formação Java_] _na Caelum e, no segundo curso,_

_me falaram:_ **_você está mandando muito bem nas aulas, quer vir trabalhar aqui
com a gente como dev e instrutora_**? _E como sempre acreditei na educação em
tecnologia, aceitei e comecei a programar e a dar aulas_.
imagem
Nós fizemos um material bem bacana que mostra a trajetória dos quatro protagonistas
desta entrevista, falando sobre **o começo da carreira** de cada um, **o que
aprenderam nas empresas onde trabalham** e também comentando o que mais gostam na
programação.
**Bora conhecer as histórias inteiras desse pessoal e ver mais dicas para
programadores e programadoras**? [Baixe aqui] o whitepaper _Como é trabalhar com
programação na Movile, na Alura e na iFood__!_
imagem
Na editora de livros na qual trabalho, estamos tentando implementar o marketing de

conteúdo. Depois de descobrir mais sobre o [**marketing de conteúdo**] e
analisarmos nosso público-alvo e de que [forma queríamos nos comunicar com ele],
passamos a pensar em como aconteceria essa comunicação.
Começamos a nos questionar onde poderíamos postar os conteúdos e como as pessoas os

receberiam.
Nisso, vimos que existem diversos canais para fazermos isso, como blog, redes
sociais, podcast, entre outras e fomos pesquisar mais sobre elas para definirmos
qual ou quais dela usaremos.
## Cada canal e suas características
### **Redes sociais**
Existem diversas redes sociais, cada uma com a sua característica. Pensamos que
seria um ótimo espaço para ter uma comunicação mais direta com nossos clientes,
além de fornecer as informações básicas a respeito da editora.
**Twitter:** Pensamos em utilizar o miniblog como uma forma de contato instantâneo.

Porém, como ele só aceita textos pequenos, de até 280 caracteres, e, segundo a
empresa, [a maior parte de seu público são jovens de 15 a 24 anos], pensamos em
criar conteúdos curtos e diretos.
Usar fotos e vídeos curtos para abordar os assuntos e curiosidades da editora e dos
livros, criar enquetes sobre próximos lançamentos, realizar sorteios e também
sempre fazer uma interação, como, por exemplo, perguntar qual a leitura atual dos
seguidores.
**Facebook:** Além de aceitar textos maiores que o Twitter, esta rede social é uma
das mais usadas pelos brasileiros [eles são 127 milhões dos seus usuários].
Como há uma maior diversidade de pessoas, com idades distintas, analisamos que a
abordagem deveria ser diferente do que a do Twitter. Por também ser possível vídeos
e postagens maiores, queremos criar posts um pouco mais completos, que terão de
cinco a dez linhas, com imagens ou vídeos sobre os livros, suas histórias e
curiosidades.
**Instagram:** Com um foco maior em imagens, e agora vídeos com o IGTV - que é uma
plataforma de vídeos na vertical -, pensamos em postar imagens de novidades. Além
disso, a rede social, que [possui, mensalmente, um bilhão de usuários ativos].
Se tornou famosa pelos stories, pequenos vídeos que podem ser visto por um dia e
achamos que seria legal usarmos esse espaço para mostrar os livros sendo feitos e
recém-impressos ou visitas e eventos e estão acontecendo ou irão acontecer.
Em todas as redes sociais pensamos em fazer coberturas de eventos de lançamentos,

como stories das pessoas comprando o livro, fotos no facebook e no twitter. Além de
em todas também compartilharmos fotos dos leitores com seus livros, incentivando
uma interação com os clientes.
**Linkedin:** A rede social que tem um foco maior no perfil profissional das
pessoas e das empresas, [possui mais de 500 milhões de usuários], e conecta
empresas e candidatos.
Com um foco maior no profissional, a editora poderia usar para criar esse contato
com os autores e, até mesmo, dar a aparência de empresa mesmo, mostrando todos os
setores da mesma e como ela funciona. Também, poderiam ser feitos vídeos e artigos
dos autores que fecharam com a editora, todo o processo, a vida e a importância dos
livros na vida deles.
### **Blogs**
Como essa é uma das formas de passar conteúdos mais completos a respeito de
assuntos relacionados a sua empresa, avaliamos que seria legal apresentarmos
novidades, com mais informações, entrevistas com os autores, tutoriais de como
manter o livro limpo e como novo, curiosidades da editora e, também, da história do
livro.
### **Podcasts**
Esses são formas de conteúdo como o do blog, mas em áudio. Assim, pensamos em criar
um podcast voltado para o conteúdo editorial de livros falando como funciona, para
mudar dos assuntos já abordados no blog.
Os primeiros episódios poderiam ser a respeito de como acontece a publicação de um

livro até mesmo a falar sobre a decisão de publicar um livro enviado por um autor,
por exemplo.
### **Plataformas de vídeos**
A equipe também pensou nas plataformas de vídeo, que são sites ondes as pessoas
podem postar ou assistir a vídeos. Por mais que existem diversas opções, como o
Vimeo, a mais usada é o Youtube que, de acordo com a empresa, eles possuem [mais de
um bilhão de usuários], tendo a maioria de 18 a 34 anos, que assistem a um bilhão
de horas assistidas por dia.
Assim, pensamos em trazer vídeos de entrevista com os autores, além de resenhas dos
livros da editora feitas por booktubers, influenciadores do Youtube que falam
somente sobre livros, dos quais poderíamos tentar fazer uma parceria.
### **Newsletter**
Lembramos de um resuminho mensal que recebíamos de diversas empresas sobre o que

tinha acontecido durante aquele período.
Pensamos em fazer o mesmo, enviando tudo que havia acontecido durante o período: os
livros lançados, o livro mais vendido e uma dica de leitura. Além disso, atrelamos
os outros canais, colocando o post mais lido, e as fotos de leitores com as
publicações, que eles haviam nos enviado pelas redes sociais.
### **Ebooks**
Eles são livros online onde um assunto pode ser mais aprofundado. No Marketing de
Conteúdo, eles são muito usados como uma forma de adquirir o contato da pessoa. A
empresa fornece o conteúdo mais completo gratuitamente para download, mas para
isso, a pessoa precisa fornecer um e-mail. Assim, a empresa consegue o contato de
uma pessoa interessada naquele assunto em específico.
## Qual canal escolher?
Analisamos todos os canais e como poderíamos atuar em cada um deles. Porém, ainda
tínhamos dúvidas de qual escolher.
Nossa equipe é grande e possui pessoas que editam vídeo, áudio, gravam, escrevem,
gostam de criar conteúdo e que possam se dedicar exclusivamente para cada uma
dessas coisas. Então, pensamos, por que não usar todas ou quase todas?
Como já publicamos livros, acreditamos que não precisamos desenvolver e-books. Mas,
avaliamos que seria legal termos um blog a respeito de novidades e curiosidades dos
livros e lançamentos da editora. Um podcast, focado somente na editoração de
livros, que ainda é bem desconhecida para a maioria das pessoas.
A ideia é com as duas plataformas pudéssemos trazer conteúdos relevantes,

interessantes e inexplorados ainda.
Por mais que as pessoas tenham ideia do que acontece em uma editora, a intenção é
contar e detalhar cada processo que as pessoas não conhecem.
Nas redes sociais, deixamos um grupo da equipe pronto para criar conteúdo e
responder prontamente as pessoas, pois, lá queremos criar esse contato direto e
pessoal com cada um deles como se nas redes sociais eles encontrassem respostas e
informações em tempo real.
Combinamos para que todos os grupos conversassem entre si, do blog, podcast e redes
sociais.
Sempre que houvesse uma novidade no blog e no podcast, seria postado nas redes
sociais. Além deles responderem, prontamente, qualquer dúvida ou interação do
público e cobrirem os eventos que aconteceriam, relacionados aos lançamentos dos
livros ou encontro de fãs.
## Canais no marketing de conteúdo

O lado bom do marketing digital são as diversas formas pelas quais podemos chegar
ao público e o mesmo acontece com o marketing de conteúdo.
Para saber quais canais pode usar, deve ser analisado, primeiro, em quais deles o
seu público-alvo está mais presente, e depois, a quantidade de pessoas disponíveis
e que saibam realizar a tarefa, principalmente, para o caso de vídeos, podcasts e
newsletters.
Saiba também de que maneira vocês querem atuar em cada uma. Além de transmitir
conteúdo, tenha uma relação com os clientes e lembre-se que o foco, sempre, são
eles.
Também, saiba como integrar todos os canais entre si. Por exemplo, sempre que
postar algo no blog da empresa, divulgue nas redes sociais com o link do post, para
que as pessoas que seguem lá, mas não acompanham o blog, possam visitá-lo.
A mesma coisa pode ser feita com vídeos no youtube, como publicar um vídeo menor e
convidar as pessoas para assistir o completo na plataforma.
Por fim pense em maneiras de passar os conteúdos em cada canal. Nas redes sociais,
além das postagens que trazem posts do blog, pode-se também utilizar infográficos,
imagens e vídeos curtos a respeito da empresa ou um resumo da novidade. Caso sejam
mais informações ainda, pode ser uma boa também criar um ebook.
Se você quiser aprofundar mais ainda seu conhecimento sobre os canais de marketing
de conteúdo, que tal dar uma conferida no nosso [**curso de Marketing de
Conteúdo**]?
Além disso, também pode conferir mais informações no livro da Casa do Código
[**Marketing de Conteúdo: Estratégias para entregar o que seu público quer
consumir**].
E, caso queira ouvir já, confira esse episódio do nosso podcast Hipsters Ponto Tech
que fala sobre[**como a Nubank atua com o marketing de conteúdo nas redes
sociais**].
imagem
A Caelum irá fazer um Outdoor e recebemos uma arte em jpeg com as dimensões de:
`640x200px`.
Tentaram utilizar a mesma imagem para o Outdoor e o painel ficou assim:
imagem forma-se um bitmap.
Os arquivos **Bitmaps**, por serem formados pixel a pixel, se tiverem seu tamanho
aumentado sofrem distorções consideráveis, pois cada ponto é transformado em blocos
maiores, preenchidos com mais pixels de cores intermediárias, que consequentemente
deixam a imagem meio deformada. Isso é chamado de [**interpolação**].
imagem.
A boa notícia é que temos ferramentas que fazem isso para gente!
imagem.
Faça o teste você mesmo e diga ai nos comentários!
## Concluindo…
Conseguimos entender melhor para quais situações é uma boa opção a vetorização,
como no caso de imagens em grandes dimensões. Mas também poderíamos utilizá-las em
diversas outras situações, como em: identidade visual, ilustrações, em motion
design, animações, entre outros.
Tento em mente tudo isso, uma "regrinha" que você pode levar considerar é que:
sempre que tivermos que fazer um logotipo ou imagens que iremos querer escalar, já
produzir em vetorial para evitar retrabalho e problemas futuros.
Seguindo essa linha de raciocínio podemos ter uma noção de qual tipo de imagem
iremos precisar em trabalhos futuros.
Caso você tenha interesse em aprender ainda mais sobre [**estruturas e composições
utilizando o Illustrator**], temos cursos na Alura sobre esses temas!
Entenda um pouco mais das diversas formas para gerar a data atual, utilizando
algumas das funções da linguagem Java de programação.
Quando um aluno inicia um curso é gerada uma matrícula para ele no meu sistema:
java
Mas como faço para adicionar a data atual no momento em que o aluno se matricula em
um curso? É simples! Precisamos apenas fazer uma instância para a classe `Date`:
java
Testando o método `geraDataDeInscricao()`, qual será o resultado?
java
Resultado:
```
> Wed Nov 25 10:16:55 BRST 2015
```
Ótimo, funcionou! Quando fazemos uma instância da classe `Date`, ela coleta as
informações de: dia, mês, ano, horas, minutos e segundos de acordo com o Time Zone
configurado na máquina com precisão de milissegundos, ou seja, ele vai pegar todas
essas informações naquele instante!
Embora a classe `Date` funcione, não é recomendado fazer instâncias dela para gerar
a data atual, pois é considerada uma solução _Deprecated_, ou seja, uma solução
obsoleta. Sugerimos utilizar a classe `Date` apenas para questões de
compatibilidade. Para outras situações, é recomendado o uso da classe `Calendar`,
utilizamos o seu método estático `getInstance()` para pegar a data atual:
java
Se testarmos novamente a classe `Matricula`:
java
Resultado:
```
> Wed Nov 25 10:55:14 BRST 2015
```
Funcionou como o esperado. Existe também a [**classe GregorianCalendar**],que é uma

subclasse de `Calendar`, ou seja, uma classe mais específica que abstrai as
necessidades para casos em que o seu calendário seja gregoriano. Para alterar o
calendário só precisa mudar de `Calendar` para `GregorianCalendar` e, em vez
de usar o método estático `getInstance(),` precisamos fazer a instância da classe
`GregorianCalendar`:
java
Testando novamente a classe `Matricula`:
java
Resultado:
```
> Wed Nov 25 10:58:17 BRST 2015
```
A data é impressa com sucesso! Mas, além do `Date` e do `Calendar`, é possível

utilizar a classe `LocalDateTime` disponível a partir do _Java 8_, por meio do seu
método estático `now(),` que coleta a informação de data atual de acordo com as
informações do relógio do sistema operacional.
java
Testando novamente:
java
Resultado
```
> 2015-11-25T11:05:36.693
```
Funcionou como esperado! Como podemos ver, a impressão do `LocalDateTime` é mais

sofisticada e apresenta um formato mais legível.
Vimos diversas formas para gerar a data atual utilizando Java, porém algumas são
consideradas _Deprecated_ e só são utilizadas apenas para compatibilidade, como é o
caso da classe `Date` e também soluções mais sofisticadas como é o caso da
`LocalDateTime` disponível a partir do Java 8. E aí, qual solução você gostou mais?
**Há um post da Caelum que detalha essa nova [API do Java 8]. Pensando nisso tudo,
o criador da Caelum, Paulo Silveira, resolveu criar um [curso de Java 8] e suas
bibliotecas com mais 1500 alunos e 99% de recomendação.**
Esses dias me deparei com o seguinte `select` quando tentavam buscar um livro pelo
nome e ano de lançamento:
sql
Por que há um `1=1`dentro de um `where`? Podemos tirar esse `true` daí, já que é
equivalente? Claro! Ele é totalmente desnecessário em nosso SQL.
Mas por que escreveram isso? Se olharmos o código que gerou essa query, teremos a
resposta:
java
O que eu fiz? Se preencheu o campo nome, adiciona ele na query:
java
Se preencheu o campo ano, adiciona ele na busca:
java
Isto é, nosso formulário de busca permite que o usuário final preencha os campos
que bem entender. Se ele não preenche nenhum, funciona, se preenche qualquer um
funciona, se preenche ambos, funciona.
Ao colocar o `where 1=1` fazemos com que cada parte opcional da nossa query use
sempre um ànd`, e fica fácil de escrever o código.
Por isso é comum ver algumas queries rodando com o where 1=1: **são queries
dinamicas onde o programador desejou fazer uma sequência de ands e ficar de boa na
hora de concatená-los**!
Consegue imaginar outras variações de como implementar esse código sem fazer where
1=1? Sem ifs extras?
Queria aproveitar para indicar o curso do meu amigo e professor comigo na Alura, o
Maurício Aniche:
No [**MySQL I: Iniciando suas consultas**] passamos por diversos pepinos do dia a

dia ao usar um banco de dados relacional, resolvendo nossos problemas com o MySQL.
Temos um cadastro que recebe dados como CPF e o CEP do usuário, mas estamos tendo
certos problemas no nosso sistema, pois todos os usuários cadastrados estão
inserindo seus dados de forma diferente, como mostrado na tabela abaixo:
java
O CPF de cada usuário está sendo enviado em vários formatos e nosso sistema está
programado para receber apenas os dígitos do documento, sem nenhum "." ou “-”.
Alguns endereços não estão sendo encontrados, pois para buscar o endereço do
usuário é necessário que o CEP esteja sem formatação alguma, ou seja, só possua os
dígitos.
Precisamos padronizar isso para que todos sejam salvos da mesma forma.
Para isso, vamos criar um método que pega os dados do usuário e os formata,
retirando tudo o que for desnecessário, antes dos mesmos serem enviados para alguma
lógica de negócio.
Todos os dados que receberemos serão do tipo `String`, portanto vamos criar um
método que recebe uma `String`, formata e a retorna:
java
Vamos começar pelo CPF. Um CPF é composto por 11 dígitos, que podem estar
separados, tanto por "." quanto por “-”. E aí, como removeremos esses caracteres
indesejados?
## Método replaceAll()
Precisamos sumir com os caracteres indesejados sem remover nenhum dígito ou mudar a
ordem dos caracteres da nossa `String`. Para isso podemos usar o método
[replaceAll()] da classe `String`.
Este método nos permite substituir todas as ocorrências do caractere que passarmos
por outro caractere.
Então primeiro vamos remover todos os ".". Dessa forma temos:
java
Perceba que o primeiro argumento que passamos foi ".", pois ele é o caractere que
queremos substituir. Logo em seguida passamos uma `String` vazia representada pelas
aspas duplas juntas.
Com isso estamos dizendo que qualquer ponto que ele ache na nossa `String` será
substituído por nada, logo, será removido.
Para testar, vamos chamar este método passando um CPF qualquer:
java
Como resultado temos:
imagem` também aceita [expressões regulares (regex)].
Neste caso, ele considerou o ponto como uma expressão regular. Este regex
representa qualquer caractere menos `\n` que representa uma nova linha. Com isso
todos os caracteres da nossa `String` foram removidos.
Precisamos fazer o Java interpretar o ponto como apenas um ponto e não um regex,
para isso vamos adicionar duas barras invertidas antes do ponto, isso indica para o
compilador que o ponto tem um significado diferente do padrão, que naquele caso, é
um regex. Logo ele vai considerar o ponto como um caractere normal, desta forma:
java
Vamos testar novamente e ver o que acontece:
imagem`:
java
Vamos testar com o mesmo CPF:
imagem` o hífen será removido.
Vamos testar essa teoria passando um CEP verdadeiro:
java
E no nosso console:
imagem`? Com isso ele eliminaria tudo que fosse desnecessário ou inválido.
Pensando em um CPF ou em um CEP, o que eles permitem ter? Apenas dígitos, correto?
Logo, vamos falar para o `replaceAll()` que queremos substituir tudo o que não for
dígito por nada, ou seja, queremos remover tudo que não for dígito:
java
Esse regex representa tudo o que não for um número de 0 a 9. Para testar, vamos
passar um CPF cheio de erros, com ".", ”-”, ”/” e letras:
java
Nosso método nos devolve:
![]
Funcionou! Conseguimos fazer nosso método formatar de forma correta.
## Conclusão
Formatar dados é algo muito comum. É preciso tomar cuidado ao lidar com dados
vindos do usuário, pois nunca se sabe o que o usuário está mandando. Também, ao se
envolver em um problema desses, onde está ficando cada vez mais difícil criar ou
dar manutenção em uma funcionalidade, é muito válido parar e ver o problema por
outro ângulo, como foi o nosso caso.
É muito importante saber construir um código limpo e conseguir perceber um problema

no nosso próprio código. Para nos ajudar nisso a Alura possui o [**Curso Design
Patterns Java I: Boas práticas de programação**]. Lá você aprenderá muito sobre
design patterns e boas práticas em Java.
Usando o `:after` ou o `:before`. E sempre acabamos colocando certas delarações CSS
nesses elementos, como no código abaixo:
css
Na maioria dos casos, usamos essas declarações, meio chato ficar repetindo código,
não?
Repetição de código no CSS é um trabalho que o Sass tira de letra, usando o recurso
de _mixins_. Pense em um mixin como uma espécie de função, um trecho de código que
você pode repetir em vários lugares apenas o invocando.
css
Esse código depois de compilado no Sass, resulta no seguinte CSS:
css
> Você pode testar esses códigos Sass facilmente no [SassMesteir] ou no [Codepen].
Bacana, mas será que todos os pseudo-elementos que vou criar terão exatamente o
mesmo conteúdo? O mesmo `display`? Talvez sim, talvez não. Melhor preparar para o
pior caso, certo? É com esse cenário em mente que podemos passar **parâmetros** na
criação do mixins. Analisemos o código da criação de um mixin com essa ideia:
css
Agora basta que, ao incluírmos esse mixin em uma regra CSS, passarmos esses
parâmetros, como por exemplo:
css
O código acima depois de compilado resulta no seguinte código CSS:
css
Maravilha, não? Um exemplo real seria para fazer um sub-menu, para criar aquela
setinha que fica do lado:
<p data-height="265" data-theme-id="0" data-slug-hash="AXdBOY" data-default-

tab="css,result" data-user="designernatan" data-embed-version="2"
class="codepen">See the Pen <a
href="https://codepen.io/designernatan/pen/AXdBOY/">AXdBOY</a> by Natan Souza (<a
href="http://codepen.io/designernatan">@designernatan</a>) on <a
href="http://codepen.io">CodePen</a>.</p>
<script async src="//assets.codepen.io/assets/embed/ei.js"></script>
E se esses valores do `content` e do `display` forem repetidos muitas vezes,

podemos facilitar (mais) a nossa vida, passando valores _default_ nesses
parâmetros:
<p data-height="265" data-theme-id="0" data-slug-hash="XKYmov" data-default-

tab="css,result" data-user="designernatan" data-embed-version="2"
class="codepen">See the Pen <a
href="https://codepen.io/designernatan/pen/XKYmov/">pseudo-elemento-com-mixin-
parametros</a> by Natan Souza (<a
href="http://codepen.io/designernatan">@designernatan</a>) on <a
href="http://codepen.io">CodePen</a>.</p>
<script async src="//assets.codepen.io/assets/embed/ei.js"></script>
Eu mostro diversas dessas features com um projeto na prática para você **aprender
pré-processadores CSS** no meu [livro de Sass], da Casa do Código:
![Livro Sass - Aprendendo pré-processadores CSS - Natan Souza]
E clicando na imagem ou aqui [nesse link você ganha 10% de desconto], e vale para
qualquer livro!
Se você for aluno na Alura, o conteúdo do livro está no meu [**curso online de
Sass**] também.
Será que devemos realmente mudar nossas carreiras? Estudamos e dedicamos tanto
tempo na profissão que estamos agora para, de repente, mudar?
Como a [Marcela Santos] conta em seu blog "_[A Jornada de Tchellita]_" no post
"_[#1 mas pq você resolveu estudar inglês\*?]_" que quando decidiu mudar de
carreira várias perguntas surgiram:
> "_... e aí bateu o pânico: por onde começar? o que fazer? o que não fazer?_"
Aos trinta e quatro anos, Marcela, formada em Engenharia da Computação e com um

mestrado em Engenharia Elétrica decidiu viver a experiência de mudar de carreira.
Segundo ela, o planejamento é essencial para quem busca a mudança - "..._O

planejamento pode e deve ser a maior arma para quem quer fazer essa mudança de
carreira...._".
O planejamento é importante, pois, com ele, conseguimos traçar melhor os passos

para atingir nosso objetivo.
> "_Dito isso o primeiro passo do meu planejamento foi: o que eu sei e o que eu
preciso aprender para alcançar o meu objetivo. No meu caso, me tornar uma
desenvolvedora e ter uma carreira nessa área fora do Brasil._"
Sempre que traçamos um objetivo, seja uma viagem, ou a troca de carreira, temos que
pensar nos passos, no caminho que teremos que percorrer para alcançá-lo. Algumas
vezes, teremos que nos testar e enfrentar nossos medos para alcançar o objetivo
final.
No caso de Marcela, ela quer se tornar desenvolvedora e ir para fora do país. Por
isso, o seu primeiro passo foi aprender uma nova língua:
> "_Então a primeira coisa que eu decidi que eu precisava aprender urgentemente era
o tal do inglês. Para trabalhar em uma empresa fora do Brasil eu preciso me sentir
confortável para participar de uma reunião de trabalho e conseguir expor minhas
opiniões. Em outras palavras, teria que encarar esse meu medo/vergonha de falar em
outra língua._"
Já para o segundo objetivo, Marcela [**assinou os cursos da Alura**] e começou a

participar de bootcamps no Canadá - país no qual está fazendo intercâmbio.
> _"Como ainda estou decidindo qual caminho seguir: front ou back end, resolvi
começar com os cursos mais básico para entender a plataforma._ _Fiz o curso
**[Lógica de programação I: Os primeiros programas com Javascript e HTML]**.
**Apesar de já ter o conhecimento de lógica o curso foi bom para que eu pudesse me
acostumar com o ambiente._ _Em seguida fiz o curso: **[HTTP: Entendendo a web por
baixo dos panos]**, que me ajudou a reorganizar conhecimentos que eu já tinha, pois
como Engenheira de Computação eu já tinha estudado protocolos de comunicação mas o
curso me trouxe uma visão mais direcionada para o desenvolvimento._
**Agora estou finalizando os cursos: **[HTML5 e CSS3 I: Suas primeiras páginas da

Web]** e Curso **[JavaScript: Programando na linguagem da web]**.
**_Como eu tenho conhecimento de hardware, estou desenvolvendo alguns projetos que

possuem um hardware que vai ser controlado via Web, assim eu consolido meu
conhecimento fazendo coisas legais como um Robô ou uma luminária que muda de cor,
ambos controlados via Web._"**
[Planejar os estudos] é algo muito importante do processo. Dedicar uma parte do dia
para estudar é essencial, tanto para criar um hábito, quanto para se ir se
aprofundando no neste novo mundo. E o que estudar?
Em áreas como tecnologia, temos diversos campos de atuação. E quando estamos

mudando de carreira, podemos pensar: [que área seguir?] Programação, redes, talvez
[**algo mais voltado ao design**]?
Não existe uma resposta certa ou errada para essas questões. O bacana é
experimentar um pouquinho de tudo. Ler posts, livros, falar com pessoas das áreas,
fazer cursos. Criar mini-projetos, participar de eventos.
Aqui na [**Alura temos as formações. Uma série de cursos, podcasts, posts**] que te
ensinará as tecnologias que o mercado precisa. No final, você fará um projeto que
usará as tecnologias aprendidas durante o processo que será avaliado pelos nossos
instrutores.
Gostou de saber sobre a jornada da Marcela? Você pode acompanhar a jornada dela
seguindo seu [Twitter], o [Instagram] e seu [blog, A jornada de Tchellita]. :)
E você já pensou em mudar de carreira? Que tal dar uma conferida nas formações na
Alura?
imagem
O React é um dos assuntos que mais estão em alta no mercado e nas comunidades de
tecnologia. **E muito desse “hype” é por grandes empresas como Facebook, Netflix,
Instagram e outras, dizerem publicamente que a utilizam o que trouxe muito mais
credibilidade pra ferramenta.**
É bom investir em React? É claro que temos outros famosíssimos [frameworks

javascript], como Angular, Vue e [Svelte], mas, será que algumas dessas tecnologias
bate o React?
Neste episódio do Alura Live, recebi Christiano Milfont, engenheiro de software na

Rivendel para falar sobre React, front-end e as tendências do mercado neste momento
de turbulência com tantas novidades!
Quer saber mais do mundo React? Confere aí que tá bem legal o conteúdo! :)
https://www.youtube.com/watch?v=TlmYkKQJOQA
Achou bacana o vídeo? Você pode assistir o nosso [episódio completo aqui.]
Conheça nossos cursos de React! Eles estão divididos em 3 partes:
- [Parte 1]: Componentes reutilizáveis para sua webapp.

- [Parte 2]: Container components e o ciclo da vida do React.
- [Parte 3]: A arquitetura flux, implementação do Redux e server side rendering.
Outros cursos e carreiras na [Alura]!
Não deixe de seguir: [Christiano Milfont], a [Alura] e [euzinho] no Twitter! 😀
imagem
A Caelum Travel está fazendo uma campanha de um sorteio com alguns clientes para
passar o fim de semana fora com tudo pago. E recebemos algumas fotos para editá-
las. Vamos dar uma olhada em uma das imagens:
imagem:
imagem novamente.
Mas por que precisamos desfazer a ação? pelo simples fato de que não é essa parte
da imagem que foi pedida, o cliente gostaria de mostrar ambos os barcos e não
apenas um. E como só fizemos um passo, utilizar o **CTRL + Z** (Command Z no Mac) é
mais simples e prático.
## Rotacionando a imagem
Um jeito simples para conseguirmos rotacionar a imagem é, ao invés de clicar dentro

ou nas setinhas da borda de corte, podemos clicar fora da imagem e arrastar para
direita ou para esquerda:
imagem ativada.
![]
O que isso significa? Com a opção marcada o photoshop irá deletar todos os pixels
que foram cortados e nós iremos perder essas informações.
Não conseguimos recuperar as informações das imagens. Se não fizer diferença para
você, tudo bem. Mas o recomendável é manter a imagem original, afinal, caso você ou
o cliente queira fazer futuras alterações que necessitam daquelas informações,
podemos recuperá-las sem nenhum problema.
Então se desmarcarmos essa opção e tentarmos aumentar a imagem, podemos recuperar

as informações.
![]
Além de chegar no resultado desejado também podemos fazer futuras alterações sem se
preocupar com perda de informações.
## Para saber mais: aplicando máscaras
Vimos um caso simples que apenas uma rotação e recorte resolveria, mas para casos
mais complexos podemos utilizar outras ferramentas, como a Mask, que nos
possibilita fazermos trabalhos mais complexos, que você pode ver [aqui]
## Conclusão
Aprendemos algumas funcionalidades da Crop tool: como recortar, rotacionar. Também

descobrimos que podemos escolher entre manter ou não as informações após fazer o
recorte.
Além disso, vimos que é bem fácil e prático utilizar essa ferramenta quando
precisamos fazer algo simples como um recorte ou rotação.
Porém, um ponto negativo é que você não irá saber se contém alguma imagem oculta
ali ou não. Ou seja, se outra pessoa for editar essa foto, dificilmente ela irá
descobrir sozinha que há partes ocultas nessa imagem.
Gostou deste post? Aproveite e compartilhe com seus amigos, pode ser útil para eles
também 🙂
Quer aprender mais sobre o photoshop? Temos diversos cursos na nossa plataforma da
Alura como este de tratamento de imagens com [Photoshop para iniciantes]!
Aproveite para nos seguir nas redes sociais para ter acesso a outros conteúdos como
este! Estamos no [Facebook], no [LinkedIn], no [Youtube], e no [Twitter].
Hoje temos um post do nosso aluno Thiago Abreu contando um pouco sobre o seu
projeto.
Aproveitamos esse contato e fizemos uma entrevista com ele para saber mais do
projeto, ou seja, o que ele estudou e os desafios que aconteceram no meio do
caminho. Tá interessado em saber mais? Então continue a leitura!
imagem que permite às pessoas com necessidades de doação de sangue realizem

pedidos, assim a plataforma cruza as informações e notifica os doadores aptos a
realizar a doação. Além da plataforma somos extremamente ativos nas redes sociais
como [Facebook], trabalhando sempre a conscientização das pessoas sobre o tema para
a captação de novos doadores.
> Além disso a plataforma permite aos doadores gerenciar suas doações, obter
informações sobre doação, locais para doação e participar de campanhas. Estas
campanhas podem ser realizadas por instituições públicas ou privadas que apoiam a
causa. Com tudo, acreditamos que os hemocentros também precisam de um apoio maior
para captar doadores de forma mais simplificada, assim disponibilizamos também para
os hemocentros uma área administrativa para facilitar esta captação.
## Durante o desenvolvimento do projeto, quais tecnologias estudou e por que?
> Além de ser um projeto muito gratificante pelo seu objetivo, este projeto
possibilitou um grande aprendizado e aperfeiçoamento dos meus conhecimentos na área
de desenvolvimento. Eu tinha um bom conhecimento com a linguagem [Python]
juntamente com o [Framework Django], apenas com estes conhecimentos observei que
não conseguiria fazer uma plataforma do nível que imaginava como ideal. Foi então
que tomei a decisão de utilizar o Django apenas como backend e servir minhas
funcionalidades através de APIs Rest.
> Com isso, foi possível criar uma certa flexibilidade para possíveis integrações
com sistemas legados de possíveis instituições parceiras. Após esta etapa foi
necessário escolher qual tecnologia implementar para o frontend, foi neste momento
que eu escolhi o [Angular] por ser uma tecnologia de ampla utilização e fácil curva
de aprendizado. Esta decisão foi muito assertiva, pois permitiu um aumento
significativo na produtividade e a possibilidade de liberar o projeto em menor
tempo de desenvolvimento.
> Isto se deu pela escolha da tecnologia utilizada para implementar o aplicativo
móvel. Como utilizei o Angular na implementação do front, resolvi então conhecer e
utilizar o [Ionic].
> Além de ser híbrido permitindo a criação do aplicativo para várias plataformas
utilizando um único código, este tem como principal forma de implementação o
Angular JS. Isso facilitou bastante a implementação pois várias regras e serviços
que foram implementados no front, eu pude aproveitar no desenvolvimento do app.
## Quais foram os maiores desafios durante o desenvolvimento?
> O maior desafio foi sair da zona de conforto. Até o desenvolvimento desta
plataforma, eu me considerava um desenvolvedor backend e muito limitado apenas aos
conhecimentos em Python. Hoje me considero um [desenvolvedor full-stack], pois
consigo lidar bem tanto no back quanto no front.
## Algum curso da Alura em específico foi essencial para o desenvolvimento?
> Sou fã dos cursos da Alura, fiz 2 cursos de Iônic que foram essenciais para o
desenvolvimento deste projeto. Outro curso que me ajudou bastante e não envolve
muito a área de desenvolvimento foi o curso de [Lean Startup], pois adoro
empreender e sou fã dos conceitos e forma de trabalhar das startups.
## Tem algum objetivo futuro em mente com o seu projeto atual?
> Através da evolução deste projeto foi possível conhecer outras pessoas, como o
meu amigo Adriano que agora faz parte do nosso time e vem contribuindo
imensuravelmente para o nosso projeto. Ele nos mostrou outros projetos magníficos
que possuem o mesmo objetivo de salvar vidas como o [#LeucemiaZero], [#DoeSangue],
[#DoarMedula] entre outros. Com isso nosso objetivo é poder cada vez mais ajudar a
salvar vidas, contando sempre com o apoio da população e com organizações que visam
sempre o melhor para as pessoas. Quanto aos aspectos tecnológicos, novas
implementações na plataforma estão a caminho e em breve serão disponibilizadas.
Ainda existe muito a ser feito.
E que tal publicarmos também a sua história aqui no blog da Alura? Gostou da ideia?
Então entre em contato conosco por e-mail no **contato@alura.com.br** :)
Nesse mundo de [**Mobile, Web e Resposivo**], temos muito termos chiques para ditar
como fazer nossos sites. **Mobile-first** é um famoso - pense primeiro no mobile,
depois no desktop. Há quem fale agora de **Touch-first** - pense em touch screens
primeiro. Tirando a buzzword em si, há muita coisa interessante nesse conceito.
A ideia de Touch-first é priorizamos o código para a interatividade de touchscreen.

Hoje em dia não apenas os smartphones e os tablets possuem tal recurso. **O
touchscreen vem ganhando espaço entre os desktops.**
Como o touchscreen traz algumas dificuldades. Pensemos, desde o início da escrita

do código, na possibilidade de implementá-lo com as ferramentas necessárias para o
funcionamento do recurso.
Uma questão importante é a **otimização da área de toque**: devemos estar antentos

para o tamanho e a disposição dos botões, eles devem ser grandes e espaçados o
suficiente para que o dedo consiga tocar. Temos o mesmo tipo de problema com os
links: um tamanho recomendado, pela Apple, é 6,8mm. Pela Mozilla, 5,9 a 9mm, e
assim por diante. Perceba que é muito mais plausível apresentar esses números em
milímetros, uma vez que os links têm interação com o mundo externo, não com um
ponteiro de mouse.
Desses dados sobre o tamanho dos links, se destaca a documentação da Microsoft -

que recomenda 9mm -, a qual é baseada em um estudo prático sobre a largura média do
dedo dos usuários:
![]
Os desenvolvedores da Microsoft perceberam que o ideal de tamanho é de 9mm para

mais, pois com essa medida a taxa de erro é de 0,5%:
![]
Já em relação ao espaçamento entre os botões, a Microsoft indica que o mínimo seja

de 2mm.
Porém, na prática, quantos pixeis equivalem aos 9mm? Fazendo a conversão e deixando
de lado algum erro, os botões devem ter, em média, 50px.
* * *
Quer mais **boas práticas de sites responsivos**? Aprender Design Responsivo do

zero? Conheça o [Curso Online de Web Design Responsivo] do Alura.
imagem
Photoshop, Axure e Figma. Essas acho que foram as ferramentas que mais mexi na
última década como UX Designer. Com a Adobe perdendo terreno para o Sketch e
softwares similares, nasceu o Project Comet, que mais tarde se tornaria o
fantástico Adobe XD (_eXperience Design_).
imagem;
- Curva de aprendizado tranquila;
- Gera especificações de design;
- Publica protótipo navegável;
- [Atualizações mensais.]
## Um vídeo rápido mostrando a ferramenta
https://www.youtube.com/embed/Wwoq8HQpL0M
Acabei não comentando no vídeo, mas aquela linha azul que fica quando eu aumento a
altura da _artboard_ é o limite da altura do dispositivo escolhido. Então na hora
de ver a simulação do protótipo daria para _scrollar_ a página.
![Mostrando a linha que define a altura da artboard]
Recomendo seguir o [Twitter do Adobe XD] para ficar de olho em spoilers novidades
que o time posta diariamente.
E se você se interessou e quer aprender na prática sobre prototipação, UX e o Adobe

XD, dá uma conferida no nosso [**curso de prototipagem com Adobe XD**] na Alura e
comece a validar suas mágicas por aí também!
imagem
Existem algumas maneiras de se recuperar a **senha do usuário administrador (ou do

super usuário) no Linux**. Uma muito comum é alterar o modo que o sistema inicia,
ou seja, quando realiza o [**boot**]. Dessa forma, acessamos o sistema como
superusuário e alterar a senha.
Para isso, precisamos antes entender melhor o que seria o boot!
## Entendendo o boot
Boot nada mais é do que o momento em que sua máquina está sendo ligada. Nesse
momento, um programa chamado [**BIOS**] carrega algumas informações sobre o
hardware do computador e o checa. Após esse processo ela chama o gerenciador de
boot **(boot loader)** que carrega o sistema operacional.
Existem diversos gerenciadores disponíveis. No caso do Linux, esse gerenciador mais

comum é o [**GRUB**], porém existem [outros].
Utilizando o GRUB nós conseguimos acessar o sistema como superusuário executar

alguns comando, como trocar a senhas de usuários.
Mas como consigo acessar o GRUB?
## Acessando o GRUB
Conseguimos acessar o GRUB no momento em que a máquina está ligando. Basta apertar
a tecla Esc, ou Shift. Após um tempo, uma tela parecida com está deve aparecer:
imagem para editar essas informações:
imagem para o [**kernel**]), isto é, o núcleo do sistema operacional. Algumas

dessas informações são: o sistemas de arquivos do root, o tipo de montagem de uma
partição, entre outros.
Queremos entrar como super usuário no momento em que o Linux é carregado. Logo,
vamos até a linha `linux` para colocar essa configuração:
imagem, em **modo de leitura** (`ro`, read only), sem escrever na tela (`quiet`),
apresentando uma tela de carregamento (`splash`) e o modo gráfico (`$vt_randoff`).
Mas eu quero poder alterar a senha do meu usuário quando o sistema iniciar. Isto é,
quero poder escrever as configurações, então vamos alterar a opção **`ro` (read
only) para `rw` (read and write)**.
O sistema será acessado via o terminal. Então podemos retirar essas opções que
mostram a tela de carregamento e o modo gráfico:
imagem um [**Shell**], como o [**Bash**], um shell muito comum para os sistemas

Linux, que está localizado na pasta `bin`:
imagem do usuário `yuri`":
`passwd yuri`
imagem o comando ìnit`, que está localizado na pasta `/sbin/init`, passando como
parâmetro o nível 6 (reiniciar):
imagem.
Essas mudanças feitas no GRUB são temporárias. Isto é, só valem na vez que foram
configuradas no boot. Caso queira que as mudanças sejam permanentes é necessário
alterar o arquivo do GRUB.
Esse é apenas um dos muitos jeitos de recuperar a senha do usuário administrador ou

do usuário root no Linux. Além desse, outro muito utilizado é usando um **pendrive
inicializável com um sistema operacional**. Dessa forma conseguimos montar uma
partição e utilizá-la para alterar as senhas.
Veja que conseguimos acessar o sistema como root apenas com uma configuração no
gerenciador de boot. Isso pode ser muito perigoso caso alguém com más intenções
tenha acesso a máquina. Por isso existem algumas formas de [**proteger**] o GRUB
desse tipo de ataque.
Nós acessamos o sistema como super usuário, por isso, **cuidado!** Caso não tenha
certeza do que um comando faz, não o execute.
## Senhas recuperadas
Um problema comum que pode acabar gerando muitas dificuldades é esquecer senhas de
usuário administrador. No caso do **Linux**, percebemos que isso pode ser revertido
utilizando o gerenciador de boot para iniciar o sistema como super usuário e
realizar essa alteração.
Para isso, precisamos antes de mais nada, entender como funciona o **boot no
sistema** e como configurar o boot loader para carregar o sistema como root.
Só então acessamos o terminal e alteramos a senha do nosso usuário. Porém, não

podemos esquecer que isso também é muito perigoso, pois um usuário com más
intenções conseguiria acesso ao sistema. Por isso existem algumas formas de
proteger o GRUB desse tipo de ataque.
Gosta de Linux? Aqui na **Alura** temos uma [**formação completa**] nesse sistema.
Nela você aprenderá sobre os comandos do sistema, sobre sua estrutura de
diretórios, gerenciar usuários, grupos, além de muitas outras coisas.
Para quem busca uma colocação profissional na área de Tecnologia da Informação e

Desenvolvimento de Software, saber o que é **ITIL é fundamental**. Esse framework é
amplamente utilizado no setor de TI e é, também, um dos padrões de mercado da área.
Nascido na década de 80 no Reino Unido, ITIL é uma sigla para o inglês “Information
Technology Infrastructure Library”, que pode ser traduzido livremente como
‘Biblioteca de Infraestrutura para a Tecnologia da Informação’. Efetivamente, o
ITIL é um conjunto de boas práticas e modelo de gestão de TI.
Neste artigo, vamos explicar melhor o que é o ITIL e porque você deve usá-lo.
## Mas, afinal, o que é o ITIL?
O ITIL é um conjunto extenso de publicações com as melhores práticas para o

gerenciamento de serviços de Tecnologia da Informação. Apesar de ter sido
originalmente criado na década de 80 pela agência governamental de TI do Reino
Unido, a biblioteca foi recebendo atualizações constantes ao longo dos anos e,
atualmente na versão ITIL V3 2011, continua sendo um padrão de mercado.
Ele é composto por [cinco volumes] que listam 26 processos e funciona como uma
referência de caminhos e boas práticas para o gerenciamento de serviços, dando uma
estrutura para que essas rotinas sejam aplicadas e que exista um ciclo constante de
melhoria nesses serviços.
Algumas vezes, é confundido como uma metodologia de projetos. Mas não, o ITIL não
serve para a criação de coisas novas, mas sim em práticas de rotina. Mas ainda
assim, algumas pessoas confundem o propósito do ITIL e imaginam que ele possa ser,
por exemplo, um concorrente dos **métodos ágeis**.
## Agile é melhor que o ITIL?
Quando um especialista em TI escuta esse tipo de pergunta, já sabe que ela parte de
alguém que não é da área. Praticamente não existe sobreposição do ITIL em relação
aos vários métodos ágeis. Uma coisa não tem muita relação com a outra e um setor de
TI pode utilizar ambos sem problemas.
Por ser antigo, muita gente imagina que o ITIL é algo ultrapassado. Mas, na
verdade, não: além das [**atualizações frequentes**], o ITIL é uma biblioteca de
conceitos de gestão e boas práticas, que não ficam obsoletas com tanta velocidade
como um computador.
Um fato é que, apesar de ser um padrão de mercado, o ITIL é adotado com mais
intensidade em grandes empresas de tecnologia ou companhias que tenham um setor de
TI robusto e bem estruturado: [nessa lista], é possível verificar que a biblioteca
é usada por boa parte das maiores empresas norte-americanas, além de muitos órgãos
governamentais.
Em micro empresas e startups, a biblioteca ainda é valiosa, mas não tão utilizada
como nos exemplos anteriores. E, claro, existem companhias que não contam com setor
de TI bem estabelecidos e não usam o ITIL, ao custo de muito desperdício, falhas
evitáveis em serviços e uma gestão desorganizada.
Independentemente disso, um conselho para quem vislumbra uma [**carreira na área de

TI**] é conhecer mais do ITIL e entender a sua importância. E se está querendo se
colocar entre as melhores empresas do mundo, precisa investir em [**certificações e
cursos**] sobre ele.
## Como ITIL é utilizado na prática?
Os cinco volumes do ITIL são conteúdos extremamente técnicos e muito densos,

concebidos para funcionar como uma espécie de manual.
Ler tudo é uma recomendação, mas não exatamente uma obrigatoriedade. Para quem está
[**iniciando na área**] é mais interessante buscar guias e cursos sobre a
biblioteca para entender melhor como os volumes podem ser usados como referência na
condução do ciclo de vida dos serviços de TI.
E claro, quem quer se destacar como gestor e se especializar nisso, pode fazer uma
leitura linear dos volumes para uma compreensão mais aprimorada, mas ainda assim
terá o ITIL como uma referência, que será regularmente consultada.
## Quais são os volumes do ITIL?
Cada um dos volumes do ITIL lista boas práticas relacionadas a um estágio

específico do serviço de TI. Conheça quais são eles:
### Estratégia de Serviço (ITIL Service Strategy)
Esse é o primeiro volume e que relaciona processos e orientações para a priorização

de investimentos e direcionamento de recursos na organização. Ele abrange, por
exemplo, a gestão do portfólio de serviços e o gerenciamento da demanda, processos
que integram a TI com a parte de negócios da empresa.
### Desenho de Serviço (ITIL Service Design)
Voltado para os processos referentes à criação de um novo serviço ou modificação de

um já existente, com base em requisitos que foram levantados no estágio anterior,
da estratégia de serviço. O gerenciamento de fornecedores, a coordenação do design
e o gerenciamento de disponibilidade e capacidade são alguns dos exemplos de
processos desse volume, todos voltados para o planejamento.
### Transição de Serviço (ITIL Service Transition)
Na sequência, chegamos no terceiro volume. Ele compreende o estágio de transição de

um serviço, quando os requisitos demandados na estratégia e elaborados no design
são executados na prática. Além disso, mudanças no serviço também estão no escopo
deste volume, que inclui processos como o gerenciamento de mudanças e o
planejamento e suporte da transição.
### Operação de Serviço (ITIL Service Operation)
Esse é o quarto volume do ITIL e que, muitas vezes, é enxergado como o mais
importante, já que trata das atividades e processos de rotina do setor de TI. Nesse
estágio, o serviço já é consumido pelo usuário final. Com isso, a percepção do
valor é aprimorada e tudo se torna mais delicado. Alguns dos processos desse volume
são o gerenciamento de incidentes, o cumprimento de problemas e o gerenciamento de
acesso.
### Melhoria de Serviço Continuada (ITIL Continual Service Improvement)
Por fim, temos o quinto volume. Esse encadernado trata da evolução constante do
serviço de TI de acordo com as demandas impostas. O conteúdo dele usa conceitos do
[**ciclo PDCA**] (Plan, Do, Check, Adjust), também chamado de roda de Deming. O
objetivo aqui é identificar e incorporar melhorias constantes ao serviço.
## Por que eu devo aprender o que é ITIL?
O ITIL é um padrão aprovado pelo mercado e largamente utilizado em todo o mundo.

Isso faz com que quem se capacite em seus conceitos esteja apto a trabalhar em
empresas de TI de qualquer país.
Para a empresa e o setor de TI, a adoção do ITIL traz benefícios palpáveis, como um
aprimoramento da qualidade e confiança dos serviços oferecidos. Em um setor tão
complexo como a Tecnologia da Informação, em que lógica e criatividade se misturam,
ter um padrão de boas práticas forjadas pela experiência de outras empresas é uma
grande vantagem.
E claro, outro incentivo para saber o que é ITIL e [**fazer cursos na área**] é que
profissionais certificados ganham um salário maior que colegas sem a certificação
em cargos equivalentes.
Agora que você já sabe o que é ITIL e qual a importância dessa biblioteca,
aproveite para seguir a Alura no [Twitter], [Facebook] e [LinkedIn] para ficar por
dentro dos melhores conteúdos de TI!
Escrevi sobre uma [**análise de dados inicial que fizemos de nossas notas**] na
Alura, o que levou à decisão de utilizarmos uma normalização do NPS para nossos
alunos e alunas. Já usamos o NPS tem muitos anos internamente portanto é possível
analisarmos o histórico de nossos cursos através do uso dele.
Começando com os NPSs mais recentes do banco (usando `pandas` e uma conexão ao
banco), mostramos os primeiros N elementos de um grupo de cursosque selecionei para
analisarmos:
python
imagem e a aproximação de uma distribuição (o KDE).
É curioso notar a assimetria da distribuição, repara como o lado direito cai mais
rapidamente. As caudas também tem pequenos "bumps". Será que nossa distribuição não
se comporta como uma normal?
Mas estamos analisando um tipo de medida que se assemelha uma média, e a

estatística clássica diz que tais médias (sob determinadas situações) distribuem
como uma normal, o que será que está acontecendo com essas caudas?
Vamos pensar. É basicamente impossível tirar somente notas 10 ou 0 eternamente.

Nada no mundo costuma ser perfeito, ainda mais nada no mundo costuma ser perfeito
para os olhos de todo mundo que olha - ou estuda - aquele curso.
Em algum momento da história alguém vai dar uma nota que não é 10. Mesmo que seja
9.99, não será 10. Por isso é impossível a longo prazo manter uma nota 10, como
discuti no post anterior. Ter somente nota 10 indica, portanto, uma de duas coisas:
1. o curso não teve alunos/as suficientes ainda, e não chegou alguém ainda que não
foi tão fã do curso
2. houve uma filtragem prévia, expulsando quem não daria nota máxima
Portanto os cursos próximos ao 100 são na verdade cursos com poucos votos, que em
um momento ou outro no futuro terão pelo menos uma nota 9. O mesmo vale para um
curso que teve só duas avaliações, uma primeira nota 10 e depois nota 6: a fórmula
para essas duas notas dá um **NPS** 0.
Um NPS 0 costuma indicar um produto ruim ou, como no nosso caso, simplemente que
não teve alunos suficientes e foi azar de que a pessoa que daria nota 6 foi a
segunda estudante do curso. (é possível analisar a distribuiçnao de notas possíveis
e esperadas e entender o quão comum é o efeito das duas pontas, e é super comum,
uma vez que o NPS esperado é alto).
Levando em conta esses pontos, é interessante considerar somente cursos com mais
de, por exemplo, 50 notas, já fugindo dessas anomalias:
sql
imagem e replotamos esses dados, já focados onde estão basicamente todas as notas
normalizadas:
python
imagem
O próximo passo? Usar outra biblioteca para plotar nosso histograma. Vamos testar
agora a àltair`. Criamos um gráfico (chart) em cima de nossos dados `nps` e
queremos desenhar barras (`mark_bar`).
python
O que colocaremos dentro do gráfico? No eixo x virá o campo `nps` que é uma

variável quantitativa (`Q`), e vamos agrupar em `20 bins`, como em um histograma.
Já no eixo y usaremos a contagem de elementos em cada `bin`:
python
Por fim, vamos dizer que estamos interessados no intervalo 7 a 9.6, cortando
(`clamp`) o resto:
python
imagem ajuda a manter o código a longo prazo.
[**Com essa abordagem e linha de pensamento chegamos a fórmula de normalização

citada que utilizamos para distribuir "melhor" (melhor = notas mais espalhadas) as
notas de nossos cursos.**] Na Alura temos [**diversos cursos que abordam a análise
exploratória de dados**].
Já criou algum objeto próprio em Javascript? Tipo:
javascript
O objeto anterior tem várias propriedades: `nome` é uma string, ìdade` é um

number, èndereco` é um outro objeto com suas propriedades, `telefones` é um array
e `calcula-ano-nascimento` é uma function. Tudo bonito!
Mas esse objeto é um _JSON_?
A sigla JSON significa _JavaScript Object Notation_ ou Notação de Objetos

JavaScript, em inglês. Pelo nome da coisa, parece que sim...
Parece mas **não é**. Um JSON é um formato de transferência de dados muito usado em
chamadas AJAX entre o navegador e um servidor. Você está interessado nos dados,
apenas nos dados...
Um JSON tem algumas restrições:
- não pode ter funções

- não pode ter comentários
- todo texto sempre tem aspas duplas
- as propriedades sempre tem aspas duplas
Aquele objeto é um JSON? Não, porque viola alguma dessas restrições. Estamos
interessados só em dados, afinal de contas. Teríamos que tirar a function, os
comentários e colocar aspas duplas.
O JSON baseado naquele objeto seria:
javascript
Portanto, um JSON é mais restrito que um objeto JavaScript.
**Interessante, não? Aprofunde seus conhecimentos com nossos [**cursos

Javascript**] da Alura.
Você está procurando [**emprego na área de tecnologia**]? Então é muito provável

que já tenha preenchido cadastros para empresas e agências, certo? Nos dados
solicitados tinha um campo escrito portfólio?
Pois, cada vez mais, esse documento tem se mostrado obrigatório para a participação
em processos seletivos, além de ser fundamental para quem já está no mercado mas
deseja estar sempre aberto a novas oportunidades.
E não apenas isso: se bem feito, o portfólio pode ser decisivo entre um “a vaga é
sua” e um menos entusiasmado “vamos guardar seu currículo para uma próxima
oportunidade”.
Até aqui, temos certeza que você já entendeu sua importância, mas, só para não
restar dúvidas, vai uma explicação direta sobre o que o portfólio é: uma coletânea
de todos os principais trabalhos realizados por um profissional.
Trata-se de uma espécie de resumo do que você já fez ao longo da carreira. É a

vitrine para programadores, designers, profissionais de marketing digital e muitos
outros se apresentarem para o mundo.
A seguir, apresentamos um guia completo para construir um portfólio na área de

tecnologia. Confira tudo com atenção e não perca mais tempo para criar o seu e
alavancar sua carreira!
## 1\. Qual é a melhor opção: físico ou online?
Um dos primeiros passos é pensar no formato como ele será divulgado e apresentado
a recrutadores e clientes. Até alguns anos atrás, era comum preparar uma pasta
caprichada, incluindo imagens e informações de seus principais trabalhos.
Mas, vamos falar a verdade, apesar de todo o cuidado envolvido nesse método, não é
algo exatamente funcional. Imagine a situação: a cada entrevista ou reunião, ter
que levar uma pasta; a cada processo seletivo, preparar cópias para deixar com o
entrevistador. Nada prático, concorda?
Portanto, para tornar a vida do candidato e do recrutador mais fácil, a solução
indicada é o portfólio online. Além da praticidade de apresentação, esse formato é
mais simples para atualizar, incluir ou retirar trabalhos, mais barato do que
mandar imprimir, acessível de qualquer lugar 24 horas por dia, e permite uma
divulgação mais ampla.
Mas fique atento: quando for solicitada a apresentação do seu portfólio no momento

da entrevista de emprego, não conte apenas com o virtual — a internet pode falhar
ou pode não haver rede na sala em que a conversa ocorrerá.
Por isso, leve consigo um pen drive ou HD externo com os trabalhos que deseja
apresentar. Assim, não é por falta de internet que você ficará sem exibir seus
projetos.
## 2\. Quais são as ferramentas para criar um portfólio na área de tecnologia?
Escolher a ferramenta ideal para criar o seu portfólio é um passo que exige
paciência e persistência até achar aquela com a qual você se entende e se adapta
melhor. O fundamental é fazer testes com algumas e não desistir de primeira.
Faça seu cadastro, busque entender melhor a plataforma e peça ajuda e opinião dos
amigos antes de se dar por satisfeito. Fora isso, escolha uma ferramenta que
consiga atualizar com facilidade e que ofereça um design funcional, bonito e
profissional, de acordo com sua área de atuação.
Para ajudar nessa missão, listamos a seguir algumas ferramentas que são usadas por
muitos profissionais para criar um portfólio na área de tecnologia.
### 2.1 Carbonmade
Outra plataforma interessante para criar um portfólio na área de tecnologia. A

exemplo do Behance, o [**Carbonmade**] também permite organizar os trabalhos por
meio de álbuns, divididos por temas e com descrições específicas.
O seu uso é muito fácil: basta fazer um cadastro e escolher um layout preferido. Há

diversos prontos; determine aquele que mais tem a ver com seu estilo e área de
atuação.
Os templates não são muito customizáveis, ou seja, é indicado para quem não quer
ter muito trabalho pensando em layout e deseja concluir seu portfólio o mais rápido
possível. Além disso, a versão gratuita só permite o upload de imagens. Se tiver
vídeos e áudios, é necessário usar a versão paga, que é mais completa e com mais
opções de layout.
Se quiser essa opção, sai 6 dólares por mês para até 10 projetos, 12 dólares para
até 50 e 18 dólares na versão ilimitada.
### 2.2 Cargo Collective
Você tem conhecimentos técnicos e deseja usá-los na criação de seu portfólio?

Então o [**Cargo Collective**] é para você!
A ferramenta conta com boas opções de customização para quem entende de CSS e HTML,
ou seja, para deixar sua página do jeitinho que você quiser, completamente
exclusiva.
Mas, se você não tiver o básico de programação, fique tranquilo, o Cargo também é
para você. A plataforma tem mais de quarenta opções de templates à disposição dos
usuários, que permitem uma apresentação dos trabalhos de forma bonita e funcional.
Basta escolher aquele que mais gosta e seguir em frente.
Em poucos passos, e sem muito trabalho, a sua página profissional estará pronta
para ser divulgada a quem interessar. Tudo simples e de graça!
### 2.3 DevianArt
O [DevianArt] não é assim tão conhecido como o Behance, mas tem orgulho em ostentar
o título de maior comunidade do mundo para divulgação de trabalhos artísticos. E,
realmente, é muita gente que o utiliza — são mais de 20 milhões de usuários.
Os templates disponibilizados têm aparência profissional e são fáceis de usar. No

plano gratuito, é permitido apenas o upload de até cem imagens por usuário. Porém,
veja pelo lado positivo: a comunidade é grande, então mesmo com essa quantidade há
boas chances de conseguir visualizações.
Mas se desejar uma opção mais completa, existem planos pagos com mais
funcionalidades e possibilidades de personalização. Por fim, se tiver um domínio
próprio, pode usá-lo para criar um site com seu próprio nome.
### 2.4 Wordpress
O [**Wordpress**], apesar de não ser exatamente uma ferramenta específica para a

criação de portfólios online, atende muito bem a essa demanda. Ele é uma das
maiores plataformas para criação de sites e blogs do mundo.
A plataforma oferece uma [grande quantidade de temas], basta escolher aquele que
está de acordo com sua área e estilo. Alguns deles com mais de 700 mil instalações
ativas, como o tema Twenty Seventeen, mas como o layout é customizável cada site
fica completamente diferente do outro.
O Wordpress permite incluir diversas extensões e widgets, que deixam a página mais
completa e repleta de funcionalidades. Como a comunidade que trabalha na plataforma
é muito ampla, sempre tem atualizações e correções de bugs.
Além disso, em seu site é possível postar fotos, vídeos e textos de forma prática e
organizada, ou seja, é uma ferramenta que ser usadas por programadores, designers e
profissionais de marketing, entre outros. Se tiver um domínio próprio e desejar
usá-lo nesse projeto, será muito bem-vindo.
### 2.5 Github
O [**Github**] é uma plataforma usada por programadores para compartilhar e

divulgar códigos, projetos, programas com a comunidade, formada, principalmente,
por entusiastas do open source. Utilizada desde os mais novatos até os
profissionais experientes da área, permite que várias pessoas trabalhem
conjuntamente no mesmo projeto.
Como o portfólio, é uma ferramenta importante, já que empresas e clientes podem

conhecer os seus trabalhos feitos pelos desenvolvedores. Além disso, é possível
interagir com outros usuários, fazer networking e receber contatos profissionais.
**Os projetos no Github são organizados por pastas, que comportam um grande
variedade de arquivos, tais como: html,documentos de texto, php, css, pdf, jpeg,
gráficos, entre vários outros.**
Para usá-lo não há limite de upload de arquivos, porém na conta gratuita todos os
arquivos das pastas serão públicos, sendo acessados por qualquer pessoa. Quem
deseja manter privado e acessível apenas a um grupo específico, precisa fazer um
upgrade para a conta paga.
### 2.6 LinkedIn
Uma ferramenta que não é exatamente para criação de portfólio online, mas que
atende muito bem a necessidade de divulgação de jobs e projetos, e o melhor, para
todas as áreas. O [**LinkedIn**] é considerado a maior rede social do mundo
direcionada para assuntos profissionais.
Na plataforma, é possível relatar toda a sua experiência e receber recomendações de

colegas e ex-chefes. Além disso, é permitido divulgar links, vídeos, fotos e
documentos. Por fim, há a opção de escrever artigos e publicar na rede, sendo um
excelente portfólio para demonstrar suas ideias e opiniões, principalmente para
quem atua com diretamente com texto, como os profissionais de marketing digital.
## 3\. O que incluir em seu portfólio?
Escolhida a plataforma, vem a parte mais importante: o conteúdo. É hora de mostrar

realmente o seu trabalho e vender seu peixe, afinal, não basta um layout bonito em
uma ferramenta incrível se não tiver algo bacana para mostrar, certo?
Veja, a seguir, como escolher os trabalhos que devem entrar no seu portfólio para a
área de tecnologia:
### 3.1 Variedade
A primeira dica é a variedade de projetos. Ao selecionar o que será exposto, busque

um pouco de tudo. Se puder, escolha materiais que envolvam diferentes tipos de
público. Além disso, diversifique os clientes o máximo possível, tais como lojas,
agências, escritórios, fábricas e o que mais tiver em sua carreira.
A ideia é mostrar sua versatilidade para possíveis recrutadores e clientes,

garantindo que você é capaz de trabalhar com diferentes temas e necessidades.
Para ilustrar melhor a situação vamos imaginar um [**designer**] que já fez

trabalhos relacionados à música e essa é sua área preferida. Ótimo! Ele tem que
mostrar essas criações no seu portfólio, mas não só elas: é preciso diversificar.
Isso significa incluir projetos de áreas diversas, como produções voltadas para

crianças, outra para o ramo de viagens e turismos, outra para um escritório de
advocacia… Isto é, de ramos completamente distintos e que tenham suas próprias
exigências, linguagens e particularidades.
**Dessa forma, é possível demonstrar a versatilidade do profissional, conhecimento

e interesse sobre grande variedade de temas, além de flexibilidade, algo muito
valorizado pelo mercado.**
Por isso, por mais que você tenha atuado durante muito tempo no mesmo segmento,
busque produzir peças diferentes. A dica aqui é fazer alguns trabalhos como um
exercício, que, apesar de não serem divulgados, são úteis para demonstrar suas
habilidades. Incluir projetos da faculdade também é uma boa opção.
### 3.2 Ordem de apresentação
Pense na ordem de apresentação dos trabalhos. Aqui vale a máxima a primeira

impressão é a que fica, por isso dê destaque a algo realmente incrível, seja na
primeira página ou nos primeiros álbuns. A ideia é impressionar no ato e gerar um
sentimento positivo.
### 3.3 Qualidade
Escolha apenas peças de alta qualidade. Afinal, essa é sua vitrine profissional
e deve constar só o que tem de melhor. É muito comum que os profissionais tenham em
sua carreira algo que não ficou muito bacana ou que não tem mais nada a ver com os
dias atuais. Esse tipo de trabalho pode ficar de fora.
### 3.4 Cuidado com os direitos autorais
**Será que posso colocar tudo que já fiz na vida? Essa é uma dúvida comum e há
algumas considerações a respeito. Antes de alimentar seu portfólio, é preciso
ponderar sobre as questões dos direitos autorais.**
Há empresas e agências que estabelecem em seus contratos que o material criado por
colaboradores é de propriedade delas. Isso inviabiliza sua publicação em qualquer
outro meio, mesmo que não tenha fins comerciais e publicitários. Nesse caso, o
trabalho não poderá ser exposto em sua página na internet, sob o risco de gerar um
processo judicial.
Mas se você criou tudo e não há nada formalizado em contrato sobre a exclusividade
de veiculação, poderá incluir sem problemas. Anote essa dica: mantenha as portas
abertas e a boa educação com as empresas, agências e clientes a quem prestou
atendimento. Informe-os sobre a publicação e inclua as respectivas informações
sobre nome da empresa, ano de realização etc.
### 3.5 Quem está em começo de carreira, como faz?
Para quem já tem anos de estrada é muito fácil preencher um portfólio. Mas e quem
está no começo da carreira? Nesse caso, a única solução é produzir muito, não de
maneira comercial, mas sim para aprender técnicas, desenvolver métodos e ganhar
experiência.
Vale criar programas, aplicativos e sites que não serão publicados, mas que poderão
ser um terreno fértil para muitas ideias. Busque referências na web para suas
criações.
Aqui também vale o critério da diversificação: construa projetos com diferentes

propostas para ampliar seu conhecimento. Além disso, os trabalhos do período da
faculdade são muito bem-vindos. Os melhores devem compor a página.
O fundamental é ter atitude e não ter preguiça para desenvolver. Lembre-se de que
isso pode ajudar a conseguir um bom emprego na área de tecnologia!
## 4\. O que evitar no portfólio?
**Se existe o que deve ser incluído, também há o que deve ser terminantemente
evitado. Nesse momento, autocrítica é fundamental e muito valorizada no mercado.**
Como mencionamos, a qualidade dos projetos é essencial, então não inclua nada só
para encher espaços e aparentar volume e grande produção. O efeito disso será
justamente o contrário: qualquer recrutador ou gestor experiente perceberá que algo
ali não está legal.
Alguns outros trabalhos, pelos quais talvez você tenha um carinho especial, devem
ficar longe do seu portfólio, como materiais que você produziu para familiares,
seguindo o gosto deles.
A ideia não é censurar, porém esse tipo de trabalho costuma ter um aspecto amador,
e não é exatamente essa a imagem que se deseja passar para um possível chefe ou
empresa, não é mesmo?
Se, em algum momento, você participou de um projeto que gerou polêmica e que pode
ser mal interpretado na atualidade, é melhor não divulgá-lo também. A ideia é
mostrar tudo o que tem de melhor.
## 5\. Pode ser ousado na criação do portfólio?
Já apresentamos algumas [**ferramentas**] que ajudam na construção de um bom

portfólio, algumas mais customizáveis, outras menos. No geral, todas atendem
satisfatoriamente a essa necessidade.
Porém, existem profissionais que desejam ir muito além e criar algo completamente
diferente do que todos estão acostumados. Isso é ótimo, pois um pouco de ousadia e
criatividade são extremamente valorizadas na vida profissional.
Há quem já tenha criado portfólio em formato de [passaporte] ou em versão [Super

Mario Bros.] Foram ao extremo da ousadia e, nesses casos, o resultado final ficou
surpreendente.
No entanto, é preciso ter cautela antes de sair por aí esbanjando criatividade.

Buscar algo não convencional é bacana, mas é necessário discernimento. Você tem
certeza que conseguiria fazer algo nesse estilo com qualidade ou ficaria amador?
Para sua área de atuação, isso contaria positivamente? Trabalhar com algo
diferenciado assim combina mesmo com você ou só fez porque achou divertido?
Tudo isso tem a ver com autoconhecimento, saber o seu estilo e perceber o quanto
realmente deseja ousar. Crie algo que surpreenda, mas vá com calma para não gerar
má impressão.
## 6\. Dicas extras para criar o seu portfólio na área de tecnologia
Para que você possa criar o seu portfólio, selecionamos mais algumas dicas que
serão importantes no decorrer de processo de desenvolvimento. Veja a seguir!
### 6.1 Cuide da sua marca pessoal
Pense que a apresentação do seu portfólio é uma espécie de vitrine sobre sua
trajetória. Você é o criador, então cuidar da sua marca pessoal será indispensável.
Diante disso, é preciso selecionar uma foto com aspecto profissional (deixe aquela
com uma peruca e óculos engraçados longe disso), escrever sua biografia de forma
correta e interessante, e ter atenção ao e-mail para contato se o seu é algo como
lindinha7534@hotmail, é melhor criar outro mais sério. Ter um domínio próprio é
também um elemento que demonstra profissionalismo.
Um outro ponto especial é o seu nome. Evite usar apelidos, termos estrangeiros,
siglas ou abreviações que não querem dizer muito. O seu nome é a sua marca!
Mantenha-o o mais claro e direto possível: isso ajudará no contato com futuros
clientes e empregadores.
### 6.2 Seja formal e informal na medida certa
**A área de tecnologia é bastante conhecida pela informalidade, seja no processo

de criação de projetos ou na flexibilidade de horários e dresscode muitos do setor
trabalham de bermuda e chinelo, por exemplo.**
Não há problema nenhum nisso, na verdade é bem interessante. Só que o portfólio

precisa dosar bem o formal e o informal. Sendo sério demais, fica descaracterizado,
mas se for informal demais corre o risco de parecer imaturo. Por isso, a dica é ser
sutil, preferir a elegância e o bom gosto, sem exageros. Dessa forma, agradará a
uma gama maior de pessoas e possíveis empregadores e clientes.
### 6.3 Mantenha a atualização
Entenda o seu portfólio como um organismo vivo, que precisa ser alimentado, cuidado
e bem tratado para crescer e dar frutos. Pode ser que a primeira versão não tenha
ficado tão boa, por isso atualizar constantemente ajudará na conquista do alto
nível de qualidade desejado.
Além disso, a ideia é que haja produção constante, de acordo com as novas
tecnologias, funcionalidades e necessidades de mercado. Isso demanda a inclusão de
novos trabalhos com certa frequência.
### 6.4 Trabalhe a divulgação do seu portfólio
Já que você criou um material rico, repleto de bons conteúdos, que contam um pouco
do seu conhecimento e de sua trajetória como [**profissional de tecnologia**],por
que não divulgá-lo?
As mídias sociais estão aí para isso. Compartilhe com seus amigos e familiares na
sua página pessoal do Facebook e, se desejar, faça até mesmo uma fanpage. Crie um
perfil no Instagram, tenha um blog e mantenha-o sempre atualizado: isso aumenta as
chances de aparecer seu trabalho em resultados de pesquisa do Google.
E, claro, [**não se esqueça do LinkedIn**], a rede social mais indicada para

incluir um link da sua página.
Neste post, buscamos contribuir com o processo de produção de seu portfólio na área
de tecnologia. Como você pode perceber, é preciso dedicação para encontrar a melhor
ferramenta, produzir peças novas quando não há muita experiência profissional, e
também boa organização para manter a atualização constante.
Por isso, enfatizamos: tenha noção de que esse documento é realmente importante e
pode ser a diferença entre o sim e o não para uma vaga de emprego.
**Trate-o com carinho e atenção, faça revisões e, sempre que puder, peça a opinião
de outros. Às vezes, um olhar que não está acostumado com essa produção é capaz de
dar ideias ou ter sacadas brilhantes, que só vão acrescentar ao seu material.
Agora, mãos à obra e comece já a construir sua página!**
imagem
Depois de algum tempo na faculdade escrevendo código e programas que funcionavam

via terminal, ficava sempre com a impressão de que faltava algo.
Comecei escrevendo programas onde o usuário respondia via terminal, mas enquanto
isso o mundo já usa o navegador e sites para interagir com sistemas. Essa casca
final de interação com o usuário é a porta da frente de programas na web, e por
isso mesmo chamamos de **front-end**.
Partindo do princípio que praticamente todas as empresas estão na web hoje em dia.
É cada vez mais importante a **criação de interfaces amigáveis e acessíveis** a
[todas as pessoas], e o papel da pessoa desenvolvedora **Front-end** torna-se cada
vez mais importante nesses cenários.
Então quais os passos para aprender o Front-end e conquistar uma vaga no mercado de
trabalho ?
## A base do desenvolvimento web
Para criar as páginas que eu queria, comecei com o [**básico de HTML5 e CSS3**],
com essas tecnologias somos capazes de indicar ao navegador **o quê** mostrar e
**como** mostrar.
Ah, já que estamos falando de HTML5 e CSS3, que são a base do Desenvolvimento
Front-end, tem um conteúdo super bacana da [GeekHunter] que apresenta uma linha do
tempo do [Mercado Front-end]. Você vai ler sobre o surgimento do Flash, até
tecnologias em voga, como PWA e EcmaScript!
Após algumas semanas [**estudando**] aprendi a estruturar páginas de maneira

semântica, para que os buscadores e leitores de tela conseguissem tornar o nosso
conteúdo mais acessível ao usuário final. Aprendi o básico sobre posicionamento e
também sobre a [**importância de escrever um código CSS**] limpo, flexível e
reaproveitável.
O próximo passo foi aprofundar mais no meus estudo, aprendendo sobre alguns
[**tópicos mais avançados**] como pseudoclasses, pseudoelementos, transições,
animações, como criar formulários e tabelas semânticas e como utilizar alguns
seletores mais avançados.
Depois de mais algumas semanas estudando, foi a vez de aprender sobre a

[**diferença**] entre medida relativa e absoluta, e onde e como devemos utilizar
cada unidade de medida, como **em**, **rm** e o famoso **pixel** e como
[**organizar o meu código CSS**].
Por último, estudei [**as vantagens e desvantagens**] de se utilizar frameworks

CSS, como o famoso [**BootStrap**]. Foi então que percebi que o [**CSS tinha
deixado de ser simples**] e poderia ser utilizado o para realizar várias outras
funções, e não apenas estilizar texto.
Agora que já somos capazes de estilizar nossas páginas e estruturar nosso HTML,
vamos aprender a dar vida a nossa página, deixando ela com comportamento dinâmico e
interativo.
## Deixando nossas páginas dinâmicas
Hoje em dia uma das linguagens mais populares e comentadas do mundo é o

[**JavaScript**], e é com a ajuda dela que iremos dinamizar e criar interatividade
nas nossas páginas.
O meu plano para conhecer [o reino encantado do JavaScript] foi focar em tópicos
base da linguagem como **variáveis**, **operadores**, **arrays, laços e estilos**.
Para praticar essa parte fiz vários exercícios de lógica.
Após algum tempo comecei estudar os tópicos relacionados a [**interação com o

usuário**] como criação de eventos, manipulação de elementos, criação de filtros,
validação de formulários, até como utilizar o [**AJAX**] para preencher
automaticamente formulários HTML.
Como eu já estava escrevendo muito código, percebi que estava na hora de [aprender]
como organizar meu código JavaScript de maneira fácil.
Depois de estudar JavaScript puro foi a vez de aprender um pouco sobre
[**JQuery**], uma das bibliotecas mais conhecidas no mundo front-end. Além possuir
diversas funções e plugins criadas para auxiliar nosso desenvolvimento no dia a
dia, durante meus estudos aprendi que o [JQuery facilita nosso trabalho com AJAX] e
como fazer requisições HTTP como **GET e POST** e animações.
Por fim aprendi a usar [outras técnicas] com o JavaScript para contornar a difícil
tarefa de agradar as diversas versões e tipos de navegadores, ao mesmo tempo que
usamos os recursos mais modernos do HTML5 e CSS3.
Como já aprendemos muita coisa sobre a base do front-end, chegou a hora de estudar
técnicas mais avançadas para refinar nosso desenvolvimento.
## Evoluindo nosso Front-end UI
Agora que já criamos uma boa base nos fundamentos da web, chegou a hora de estudar
sobre tópicos mais avançados do desenvolvimento front-end.
Comecei entendendo o que são [**pré-processadores**] e como [**descomplicar o

CSS**]. Também aprendi o que são e quais os [**10 mixins em Saas**] que eu deveria
usar em meus projetos.
Uma das minhas maiores dificuldade durante meu aprendizado foi sobre posicionamento
e aprender sobre [**Flexbox**] facilitou muito esse processo. Assim como estudar o
[**CSS Grid Layout**] me ajudou a criar layouts de forma mais rápida e eficiente.
Uma dica que eu deixo para fugir da sobrescrita de estilos é criar componentes CSS
utilizando o padrão [**BEM**].
Por fim vamos estudar alguns dos tópicos mais importantes hoje em dia como,
desenvolver [páginas que se adaptam] a qualquer tipo de aparelho, como lidamos com
os [limites de resolução] em sites responsivos e porque usar [**‘em’ no CSS**].
Agora que já descomplicamos nosso CSS com a ajuda de pré-processadores e já sabemos

deixar nossa página responsiva, vamo voltar ao JavaScript e ver o que as novas
especificações trouxeram de novidade.
## JavaScript Moderno
Ao longo dos anos nossa linguagem favorita passou por várias mudanças e como
engenheiros front-end, não podemos deixar de acompanhar a evolução e especificação
do [**JavaScript moderno**].
A nova especificação do JavaScript simplificou nosso trabalho com programação

orientada a objetos e [trouxe recursos] como arrow functions, spread operator,
template strings e funções como **map** e **reduce**. Além de estudar os novos
recursos, também aprendi mais sobre alguns padrões de projetos como o [**Proxy e
Factory**].
Até agora aprendemos a usar boas práticas durante o desenvolvimento das nossas
páginas, mas inevitavelmente elas vão crescer, então precisamos conhecer algumas
técnicas e ferramentas que vão nos auxiliar a lidar com essa complexidade, sem
afetar o usuário.
## SPA e React
Uma arquitetura muito famosa e utilizada hoje em dia é a [**Single Page

Application**], com ela criamos uma única página que passa a sensação ao usuário de
estar em uma aplicação.
Temos algumas opções de frameworks para a criação de SPA, como por exemplo o
**Vue.js** e o **Angular.js**. Porém eu optei por escolher o [React] tanto pela
facilidade que ele oferece para manipular e atualizar o estado da nossa aplicação,
como pela sua grande adoção no [mercado de de trabalho].
Para ter uma melhor entendimento desse framework, primeiro vamos estudar como o
React realiza a [navegação e a comunicação] entre os componentes, depois como
funciona a criação dos container components e o [ciclo de vida do React] , até
chegar na [arquitetura flux], implementação do Redux e o server side rendering.
## Conhecendo a formação Engenheiro Front-end
Uma formação nada mais é do que uma trilha de cursos onde podemos nos tornar
proficiente em uma tecnologia. No caso, criamos a [**Formação Front-end**]. Nela,
você começará desde o básico com HTML,CSS e JavaScript, até tópicos mais avançados
como design responsivo e utilização de frameworks.
A formação não é formada apenas por cursos, mas sim por diversos outros conteúdos,
[como podcasts, posts e lives]. Cada conteúdo tem uma parte no aprendizado e eles
vão se complementando e integrando conforme avançamos na formação. Ao final da
formação, você realizará um projeto.
Isto é, irá colocar em prática tudo que aprendeu nos cursos que estudou. Esse
projeto será revisado por um instrutor ou instrutora aqui da Alura que te passará
um feedback sobre o código que escreveu.
Quando nosso projeto começa a crescer e ter uma quantidade significativa de páginas
diferentes, a gente precisa encontrar uma maneira de organizar o nosso código, e
começamos a ver um cenário muito comum de:
- Código duplicado
- Conflitos de nomes de classes
- Falta de padrão nos nomes das classes
A gente aqui na **Alura** já pensou e repensou sobre como resolver esses problemas
na hora de organizar nosso **CSS**. Nesse post vou trazer aqui um pouco desse
processo pra vocês!
Vamos pegar um componente que representa um curso da Alura, por exemplo:
html
Esse HTML representa um link de curso da Alura. Ele contém uma **imagem e um
título**, e visualmente deve ficar assim:
imagem
- Layout é o estilo específico de cada página ( courses.css, carreiras.css, etc )
- Module é o estilo de componentes que se repetem em várias páginas ( box.css )
E calma lá, vamos entrar agora no state!
**State**, mais conhecido em pt-br como estado, se relaciona com os estados dos
nossos componentes. Pense no seguinte componente de menu de navegação.
html
Digamos que o usuário clica no link **Cursos** do menu, o que deveria acontecer?
1. O usuário é redirecionado para a página courses.

2. O item do menu fica pintado de uma cor diferente, normalmente uma cor mais
forte para indicar em que página o usuário está.
Quando o item do menu fica nesse estado diferente após clicado, dizemos que ele
está agora no estado ativo.
E oras, como podemos fazer esse item mudar de estado? Perceba que mudar sua cor é
basicamente código CSS, ou seja, para alterar estado do item podemos simplesmente
colocar uma classe nele com a cor diferente!
Se clicamos no item do menu, o nosso javascript deve colocar nesse elemento a

classe
`.active {}`
Bam! Mudamos o estado dele, agora ele fica de uma cor diferente!
Legal, então temos esse outro mandamento do SMACSS, crie uma classe para seu
estado, coloque ou tire ela do elemento conforme você precisar modificar o estado.
Por fim, antes de falar do Theme que é o último mandamento do SMACSS, vamos fazer
um exercício aqui:
Dado que o menu é usado em algumas páginas, mas não todas, como ele é classificado
no SMACSS pelo que a gente viu até agora?
1. Base
2. Layout
3. Module
Se você optou por C você acertou! Ele é um module (pode chamar de componente).
Aonde quisermos usar o menu importamos o CSS dele no HTML!
Agora falando sobre o Theme do SMACSS, eles mesmos na documentação citam que é
pouco usado,e sinceramente não usamos na Alura.
Essa parte é basicamente para organizar CSS quando lidamos com projetos que podem
ter toda a sua interface visual modificada rapidamente por outra. Imagina sites que
você pode alterar uma opção e mudar para o tema DARK do site, que muda todo o
visual.
Legal gente, agradeço quem leu até aqui, conseguimos organizar a estrutura dos
nossos arquivos CSS para não ficar repetindo código e etc mas ainda temos uns
problemas que precisamos enfrentar.
Esses dias estava fazendo uns testes com o projeto da [**curso de ASP.NET MVC do
Alura**] e me deparei com a necessidade de ter que buscar um autor por Id ou Nome.
Eu teria então, duas rotas exatamente iguais, mas com tipos de parâmetros
diferentes: uma receberia um **int** e a outra, **string**:
csharp
Isso quer dizer então que se eu tentar acessar o endereço _/autor/busca/5_ o

framework deve me direcionar para o primeiro método. E para o endereço
_/autor/busca/gabriel_, o segundo método, certo? Errado! Se tentarmos acessar
qualquer um destes endereços, vai acontecer um erro parecido com esse:
csharp
Neste erro, o framework está te dizendo: _cara, você me passou uma url que bate com
duas rotas aqui. Eu não sei qual chamar._
### Indicando o tipo do parâmetro na rota
csharp
Consegue enxergar a diferença? Na rota do método que recebe um inteiro, adicionamos

:int na frente do nome do parâmetro.
**Agora, se tentarmos acessar a URL _/autor/busca/5_ o ASP.NET MVC irá direcionar

para o primeiro método, que eu especifiquei que recebe um inteiro, adicionando o
**:int** na frente do nome do parâmetro. Se passarmos qualquer outro valor que não
seja um número inteiro(como _/busca/autor/gabriel_, _/autor/busca/123123testando_ e
/autor/busca/!@autor$%¨$%¨&&) será o outro.**
Legal, né? Confira nosso curso [**Projeto Completo: Controle Financeiro com Asp.NET
MVC 5**] :)
A melhor forma de atrair público para o seu blog é criando conteúdo relevante e de
qualidade. Ao oferecer materiais que ajudam, educam e entretêm, você cria um
vínculo instantâneo com cada visitante, e essa relação é fundamental para o sucesso
do blog!
## Produza conteúdo relevante
Você já reparou a quantidade enorme de conteúdo que você consome todos os dias? São
notícias, vídeos engraçados, posts de opinião nas redes sociais, músicas,
videoclipes, imagens, GIFs, fotografias, etc. Mas, quanto disso realmente é
relevante?
Se você passar agora pela sua timeline em qualquer rede social, quais produtores de
conteúdo vão cativar sua atenção e ganhar seu clique?
Esse é o pensamento que precisa nortear a sua produção de conteúdo. Nós somos
atingidos por conteúdo o tempo inteiro, e o que define se ele é bom é a relevância
que tem para o público. Ao criar conteúdo para o seu blog, procure fazê-lo seguindo
esses dois princípios:
### 1\. Conheça seu público
O primeiro passo da produção de conteúdo é traçar bem a sua [**persona**]. A

persona é uma representação do seu público ideal, com as características e
problemas que você deseja atingir e solucionar.
Ao definir sua persona, você consegue entender melhor como cada conteúdo vai se
encaixar dentro da sua estratégia. Se ela gosta de textos longos, você não precisa
perder tempo produzindo conteúdos menores; se ela não tem tempo para ler, você pode
investir em criar vídeos ou um podcast.
Conhecer seu público é fundamental para produzir conteúdo relevante, e, com uma
persona bem definida, o processo de criação se torna muito mais tranquilo!
Utilizar personas é uma dica que pode facilitar bastante a sua vida caso você
deseje atuar como redator [**freelancer**], uma vez que ajuda você a conhecer
melhor quem seus clientes desejam atingir com conteúdo.
### 2\. Planeje cada conteúdo
O planejamento é a alma do conteúdo de qualidade. Ao ter uma ideia, coloque-a no

papel e faça uma pauta bem detalhada do que será produzido. Defina:
- formato: será um e-mail marketing ou conteúdo para o blog? Post, e-book,

infográfico, vídeo?
- tamanho e linguagem: curto, médio ou mais denso? Linguagem mais técnica ou mais
acessível?
- Call To Action (CTA): qual será o objetivo do seu conteúdo? Pedir que o visitante
compartilhe nas redes sociais, baixe um e-book, acesse outro artigo ou vídeo,
assine a newsletter?
Lembre-se de adequar cada um desses pontos aos objetivos e interesses da sua

persona. Uma pauta bem estruturada funciona tão bem porque permite que você ou
qualquer outra pessoa produza o conteúdo, sem prejuízos.
## Aposte em formatos diferentes
Além de um tema relevante, o formato também é importantíssimo para o sucesso do

conteúdo. A internet oferece muita liberdade nesse sentido, e a vantagem está ao
lado daqueles que sabem aproveitar todas as oportunidades. Confira os formatos mais
utilizados atualmente:
### Post
O bom e velho post de blog. Escrito em texto corrido, com imagens apenas ilustrando
o conteúdo, o post é o formato mais conhecido e produzido internet afora. Pode ser
curto ou longo, informativo ou educativo, tutorial, lista, guia e até mesmo um
texto opinativo.
Esse é um formato muito bacana de trabalhar, e a sua eficácia vai depender de cada
persona. Como falamos anteriormente, a linguagem, a extensão e até mesmo o estilo
de formatação do post vão depender das preferências da sua persona.
Entretanto, algumas dicas são universais:
- lembre-se de que poucas pessoas utilizam apenas o computador para ler posts.
Adapte seus textos para serem lidos em smartphones e tablets, utilizando fontes de
fácil leitura, cores contrastantes e tamanhos confortáveis. Um [**site
responsivo**] é fundamental;
- a internet é bastante flexível quando o assunto é Português. Gírias, abreviações

e até mesmo alguns errinhos de ortografia são aceitos nas redes sociais, mas nos
posts podem gerar uma má impressão. Não é preciso escrever como em uma tese de
doutorado, mas o básico da concordância, acentuação e gramática precisa ser
respeitado;
- textos bem escritos são aqueles que o leitor consegue ler e entender sem
dificuldades. Não se preocupe em enfeitar demais o post com citações, exemplos e
explicações. Na maioria das vezes, ser objetivo é a chave para o sucesso;
### Infográfico
Os infográficos são ótimos para fazer listas, mostrar números e estatísticas ou

explicar um assunto um pouco mais complicado. São materiais relevantes e ricos e
podem ser disponibilizados como conteúdo exclusivo (mediante cadastro, por
exemplo).
Assim, você conquista e-mails para a sua [**base de leads**] e recompensa o

visitante com um material rico. Para os e-mails cadastrados, você pode criar uma
newsletter semanal ou mensal, fazer e-mail marketing e muito mais.
A dica para criar bons infográficos é apostar em imagens e cores fortes,

chamativas, mas sem sobrecarregar o visual. Cores contrastantes e pouco texto
tornam a leitura mais fácil, ainda mais se você estiver trabalhando com números e
porcentagens, por exemplo.
### Áudio e vídeo
Os formatos audiovisuais fazem muito sucesso aonde quer que apareçam. Mais
dinâmicos, dão a sensação de conversa, de proximidade, muito mais do que um texto
ou imagem.
Existem várias formas de consumir esses conteúdos, o que os tornam uma alternativa
viável para os mais diferentes tipos de persona. Hoje, qualquer smartphone reproduz
vídeos com boa qualidade, e se não possui ferramentas próprias para executar
áudios, permite pelo menos a reprodução em navegadores.
Além disso, esses formatos podem ser consumidos em qualquer ambiente — basta que o
usuário esteja com seus fones de ouvido. Você pode levar conteúdo relevante para o
seu público enquanto seus leitores estão na academia, pegam ônibus ou metrô ou, até
mesmo, durante as pausas no trabalho.
Veja algumas dicas:
- não importa se você vai gravar um vídeo para o Youtube ou um áudio para podcast,
qualidade é fundamental. Escolha uma câmera com boa resolução (pode ser até a do
seu celular), um ambiente organizado, bem iluminado e silencioso e mande ver na
gravação;
- sobre edições: na maioria das vezes, menos é mais. Grandes produções demandam
investimento em equipamento de alta qualidade e tratamento pós-produção. É possível
criar produtos audiovisuais de boa qualidade [**sem gastar muito**]. Basta manter a
simplicidade e a objetividade, fazendo edições pontuais apenas para lapidar o
produto;
- você pode adaptar alguns conteúdos para formatos audiovisuais, como aulas e
tutoriais, e até transformar seus posts em vlogs. Estude sua persona e faça testes,
até encontrar o melhor formato para cada conteúdo.
E aí, já está preparado para produzir materiais irresistíveis para o seu blog?
Compartilhe este post nas suas redes sociais e ajude outros blogueiros a darem o
primeiro passo na produção de conteúdo relevante!
Em JavaScript o `String replace` é utilizado com frequência para fazer desde
simples **substituições em Strings** até complexas mudanças com **expressões
regulares**. Seu uso é simples como `variavel.replace('valor', 'substituicao')`. Eu
tenho certeza que alguma vez você já precisou pegar um trecho de texto no final de
um HTML, ou remover uma palavra específica de um código.
Nos formulários da web é comum termos de lidar com o **campo de CPF**. O que
realmente importa quando colocamos um campo desses são os números, mas construindo
interfaces para o usuário final é super importante mostrar para o usuário a
formatação como ele está acostumado a ver nos documentos. Vamos ver como poderiamos
resolver esse problema com os poderes do **JavaScript** e sua biblioteca padrão.
imagem
# Substituindo palavras com String replace
Se queremos pegar os números brutos do usuário e converter para a versão com a

formatação, ou mascara de campo. Uma solução ultra direta para resolver o problema,
pode ser pegarmos o valor que queremos modificar e aplicar a função `.replace` das
strings em cima dele.
Caso tenhamos interesse de manipular um CPF por exemplo, podemos pegar o valor do
CPF puro, e falarmos que queremos convertê-lo para a sua versão amigável para o
usuário:
js
A função `.replace` recebe como parâmetros o padrão que estamos procurando e como
segundo parâmetro o que queremos colocar no lugar
Nesse caso, nós estamos prevendo o futuro e criando um código assumindo que o
usuário possui detereminado valor de CPF. Para esse uso o replace pode soar bem
estranho, mas caso nosso objetivo seja restringir alguma palavra, como um palavrão,
o uso acima cai como uma luva:
js
Caso você queira visualizar esses exemplos dentro do VSCode de uma forma bem legal,
eu super indico esse plugin: https://quokkajs.com/
## Substituindo todas as ocorrências com o apoio das Regex
A ideia anterior de excluir palavras de um texto funciona super bem, mas se a

palavra aparecer duas vezes no texto, começaremos a ter problemas:
js
Repare que na segunda ocorrência da palavra que queremos remover da frase a função
replace não fez nada. Isso ocorre porque quando o primeiro parâmetro da função
replace é uma string, ela sempre busca a primeira ocorrência no texto base para o
valor buscado. Para ter algo mais dinâmico vamos precisar recorrer ao poder das
Expressões Regulares, que em resumo nos ajudam a encontrar padrões em texto de uma
forma muito mais completa.
Para resolver nosso problema anterior, basta trocarmos o primeiro parâmetro passado
para o replace de `'palavra-feia'` para `/palavra-feia/g`. O `g` no final da regex
indica que queremos buscar de forma global no texto base.
js
# Regex: expressões regulares
Muitos desenvolvedores, quando precisam trabalhar com Regex (*regular

expressions*), costumam pensar "_Eu sempre aprendo quando vou usar e esqueço logo
em seguida_". No dia a dia realmente na maioria dos casos nós não usamos Regex e se
formos utilizar talvez valha mais a pena uma lib de validação como a [Yup] ou
[Joi]. De todo caso, vamos dar uma relembrada que irá ser essencial para
conseguirmos lidar com o caso do CPF aqui do post:
As Regex procuram padrões, a forma mais direta é escrever a própria `palavra` que
você deseja encontrar:
> [/palavra/]
o mesmo funciona para números:
> [/12345679810/]
Porém, se você quiser algo mais abrangente com caracteres especiais e tudo mais,
onde a ordem não importe, será necessário definir um range de caracteres:
> [[A-Z0-9\!\-]]
E ainda no exemplo anterior, para pegar mais de um caracter é necessário declarar

quantas ocorrências você procura:
> [[A-Z0-9\!\-]{3}]
Também é possível simplificar, para capturar somente caracteres alfa numéricos você
pode usar:
> [\w]
Já para capturar caracteres referentes a digitos você pode usar:
> [\d]
E caso você queira capturar grupos dentro de um match de regex para poder trabalhar
melhor como veremos nos próximos exemplos, podemos utilizar os parenteses:
> [(\d{4})-(\d{4})]
Existem outros casos como utilizar a "?" para alguma parte da regex ser opcional,
os marcadores de começo "^" e fim "$", mas isso tudo renderia uma série de posts ou
mesmo um curso.
Caso queira ir mais a fundo, vou deixar esse [guia de bolso que eu sempre uso] e se
quiser aprender pra valer do 0 mesmo como trabalhar com expressões regulares, vou
deixar como dica esse [curso de regex].
# Resgatando group matches com a função replace
Agora que relembramos um pouco mais sobre as expressões regulares, podemos usar a
ideia de procurar padrões encaixando em grupos e usar no segundo parâmetro do
`.replace` o "`$`" seguido do número correspondente ao grupo na ordem em que a
Regex foi escrita:
js
<iframe height="265" style="width: 100%;" scrolling="no" title="WNezRPX"

src="//codepen.io/omariosouto/embed/WNezRPX/?height=265&theme-id=0&default-
tab=html,result" frameborder="no" allowtransparency="true" allowfullscreen="true">
See the Pen <a href='https://codepen.io/omariosouto/pen/WNezRPX/'>WNezRPX</a> by
Mario Souto
(<a href='https://codepen.io/omariosouto'>@omariosouto</a>) on <a
href='https://codepen.io'>CodePen</a>.
</iframe>
Caso você queira fazer algo mais complexo e somente passar uma string resgatando os
grupos não seja o suficiente, você também pode passar uma função no lugar da string
no segundo parâmetro:
js
# Dúvidas comuns em manipulação de strings com Regex
- [Capturando conteúdo entre abertura e fechamento de uma tag]. Tome cuidado,

nesses casos. [O HTML é uma estrutura que é impossível de ser parseada de forma
perfeita via regex], sempre prefira usar a API do DOM para manipular HTML ou uma
lib como o [JSDOM] para converter um texto para a estrutura de arvore e facilitar a
extração de conteúdo.
- [Dando match em slugs]
- [Lidando com hexadecimais]
- [Trabalhando com URLs]
# Métodos de String
Há muitos [métodos essenciais na String], alguns outros interessantes:
- [split]: É ultra útil quando você quer quebrar uma string em uma ou mais partes
agrupadas em um array.
- [trim]: É muito usada ao receber um input do usuário para remover espaços em
branco antes do começo da string e após o último caracter que não seja um espaço em
branco.
- [includes]: Essa é minha função favorita das strings, ela retorna `true` ou
`false` se houver ou não, respectivamente, na string base o valor que você passa
como argumento para o `.includes()`.
# Bibliotecas para manipulação de Strings
- Existe uma lib muito popular para lidar com datas chamada MommentJS
https://momentjs.com/, é necessário ter alguns cuidados quando for utiliza-la então
deixo a dica desse outro link que talvez tenha alguma alternativa que possa lhe
atender tão bem quanto https://github.com/you-dont-need/You-Dont-Need-Momentjs;
- Se você quiser lidar com mascaras e formatação (ajuda no cpf, telefone, cnpj...),
deixo essa lib aqui https://www.npmjs.com/package/mask-js;
- Libs super bacanas para lidar com validação por schema: [Yup] ou [Joi];
- Não é o foco do post, mas lidar com formatação e operações em cima de dinheiro
pode ser algo bem complicado https://sarahdayan.github.io/dinero.js/;
- Caso você queira garantir que um input do usuário esteja realmente seguro para
ser salvo na sua base de dados, é importante usar uma lib que faça o papel de
remover possíveis conteúdos que gerariam injeção de scripts como essa aqui
https://github.com/apostrophecms/sanitize-html
Se você for curioso como eu, deixo a dica para ver como [manipular Strings em
Python](manipulacao-de-strings-no-pandas-lower-replace-startswith-e-contains), e de
quebra esse site super maneiro https://regex101.com que eu tenho certeza que vai ti
ajudar bastante a criar regex de um jeito rápido e fácil de testar.
Nesse post nós abordamos uma série de tópicos importantes com relação a
manipulação strings. Vimos os poderes do `replace`, casos comuns de tratamento de
strings e espero que esse post ajude tanto você, quanto algum amigo seu que pode
estar agora sofrendo querendo **validar um CPF** ou algum dos exemplos que vimos
anteriormente.
Se você curtiu, não deixe de [seguir minhas redes sociais] e dar uma olhadinha no
[meu site] que toda semana está saindo algo novo por lá. Até a próxima :)
Normalmente quando pensamos em melhorar a UX de nossos projetos pensamos

automaticamente em itens como fonte, cor, [**microinteractions**], etc. Mas como
estão os textos desses projetos? E os microcopies?
Todo conteúdo, seja ele visual ou textual, é importante ser pensado quando queremos
criar uma experiência completa e agradável ao usuário. Para começar, podemos antes
entender melhor do que se tratam os microcopies, ou micro-textos.
# O que é micro-texto?
Microcopy são textos curtos e objetivos, bem escritos, que compõem a interface com
alguma proposta de interação ou explicação, seja isso um place holder, um subtítulo
explicativo ou label de botão, mas visando apelar para as esferas emocionais do
usuário, criando um vínculo de alguma forma.
Peguei a [**Alura Línguas**] para fazer alguns exemplos simulados, vamos dar uma
olhada:
imagem
Podemos nos perguntar e reparar algumas coisas nesses textos principais, por
exemplo:
1. O curso é presencial ou online?;
2. Qualquer escola vai me falar que com eles aprenderei inglês, faz sentido dizer
“Curso de inglês. Aqui você aprende inglês”?;
3. O label “Comprar” do botão não parece “seco” demais para um site que quer me
convencer a virar um assinante?;
Primeiramente, perceba que modificando o título para “Curso online de inglês”

podemos evitar possíveis alunos que procuram um curso presencial de assinarem a
plataforma e se frustrarem ao perceber que aquilo não era o que buscavam.
>“Mas Natan, não é ruim perder uma conversão aí?”
Pensando no lado do negócio, será melhor convertemos esse usuário e ele,

inevitavelmente ficar com uma má impressão de nossa brand ou focarmos em potenciais
usuários que realmente pagariam para aprender inglês online? Perceba que apenas uma
palavra pode mudar totalmente a experiência de uma pessoa numa plataforma.
Agora, com relação ao **item 2**, como poderíamos nos vender ali naquela frase?
“Aqui você aprende inglês” em qualquer “Juquinha Línguas” eu aprendo (segundo a
própria Juquinha, claro).
Aí chega um momento que devemos tentar vender nosso produto/serviço de alguma forma
diferenciada. E se alterarmos a frase para “Aqui você aprende inglês **de
verdade**“? Muda um pouco nossa percepção, mas ainda parece que um vendedor está
tentando me empurrar esse curso.
Como podemos apelar para o emocional da pessoa? Mexendo com seus sentimentos! Uma
outra alternativa para o texto seria “Inglês para não passar vergonha lá fora”.
Bacana, porém possui uma carga meio negativa. Podemos mudar a frase para “Reforce e
aprimore seu inglês, conecte-se com um mundo novo.” ou simplesmente “Conecte-se com
um mundo novo, em inglês.”
# Melhorando o call to action
Último passo agora é tirar essa carga sales do botão, como fazer isso mantendo a
ação que o usuário fará?
De “Comprar” podemos mudar para “Adquirir plano”, mas não estaríamos falando muito
a linguagem do usuário aí, afinal quem chega em casa falando “Amor, cheguei!
Adquiri um novo jogo de pratos hoje!”?
Que tal, em vez de “Comprar” um “Comece agora!”. Um pouco imperativo por conta da
exclamação talvez? Mesmo sem ela parece que estamos impondo uma ordem para nosso
usuário. Que tal “Aprender inglês”? Estou dando a dica que ao clicar no botão ele
vai começar a aprender inglês (emocional) e de fato esse seria o primeiro passo
para ele começar a aprender! Se ainda quiséssemos deixar algo mais imperativo
poderíamos colocar “Aprenda inglês”, por exemplo.
Por fim, com as alterações ficaria assim:
imagem
# Qual o melhor jeito?
Da mesma forma que não temos receita de bolo na UX, com microcopy não poderia ser
diferente.
Sempre devemos nos perguntar duas coisas:
* Qual o sentimento que quero transmitir para o leitor;

* Quem é esse leitor?
Respondendo essas duas perguntas, você consegue trabalhar muito melhor quando o
assunto é microtexto/microcopy!
O que eu faço atualmente é ir escrevendo em um bloco de notas tudo que me surge na

cabeça, mesmo que eu não vá usar. Depois vou mudando palavras, contextos e tons.
Buscar referências de grandes players do mercado pode te ajudar, mas lembre-se: são
apenas **referências**, o negócio e o usuário deles não são o mesmo que o da sua
empresa.
# Bacana, tem alguns cases e outros exemplos?
Sim!
## O botão de $300 bilhões
Esse case não temos nomes de empresas, mas [Jared Spool publicou um artigo] sobre
um botão de um e-commerce que depois que os usuários escolhiam um produto,
encaravam um botão de “Registrar”. O ponto é que a taxa de abandono do carrinho era
alta. E eles descobriram que um dos motivos disso é que os usuários não queriam
criar um vínculo com a empresa, só queriam… fazer suas compras!
Nisso o texto do botão foi alterado para “Continuar”, e adicionado um microtexto

informando que não era necessário cadastrar para fazer o checkout no site deles.
Com isso, **a conversão aumentou em 45%**, e talvez esse seja um dos motivos que
hoje os grandes e-commerces oferecem a opção de compra sem cadastro.
## Tumblr
O [Tumblr] é um serviço de blog que, para cadastrarmos, pedia apenas email, senha e
a URL do quase-criado blog. Eles perceberam que muitas pessoas ficavam muito tempo
nesse terceiro campo pois acreditavam que a plataforma não oferecia a opção de
alteração depois de criado, o que na realidade era uma funcionalidade já presente
na ferramenta.
Então eles colocaram um microtexto acima do campo dando essa informação, algo como
“Você pode mudar isso a qualquer hora”. Com isso eles conseguiram diminuir o tempo
que as pessoas passavam nesse formulário.
imagem
## Porto seguro
A Porto Seguro tinha uma parte no site para fazer cotação de seguros online, mas
era imprescindível que, para agilizar todo o contato inicial do corretor com o
cliente, o nome inserido no formulário deveria ser 100% igual ao do CPF.
Vários chamados abertos pois a alteração não era simples de ser feita, eis que eles
colocaram justamente essa informação sobre o CPF junto com o campo. Vitória,
diminuíram os chamados e o processo continuou rápido.
## Apple
Na página do Apple Watch, ao clicar em “Comprar”, o usuário precisava escolher

entre dois tamanhos do relógio. Como sugerir que o tamanho é basicamente uma
questão de gosto? Colocando essa informação lá!
imagem
Hoje na página temos esse link de “Qual é o tamanho de caixa ideal para você?” que
abre uma modal contendo essa informação, além de coisas como os textos serem
maiores e a tela ser maior.
Não tenho os números, mas com certeza a quantidade de de pessoas falando no chat
deles “não sei qual tamanho comprar” deve ter diminuído.
Eu comento de alguns **cases de microcopy** e usabilidade em geral nos [**cursos de

UX na Alura**].
Afinal de contas, quando devemos ou não usar o **operador identico (===)**? Pra que
serve esse operador de comparação? Qual a diferença entre eles?
Ao trabalhar com formulários, é comum a necessidade de validar um email e não

existe uma forma padrão de fazer isso. Existem diversas regras de , por exemplo,
que haja algo escrito antes do `@`. Uma forma de verificar isso é usando a função
[**strpos**] que verifica a posição da primeira ocorrencia de uma string:
php
Mas, caso o usuario não digite nem o `@` precisamos, também, dizer que aquele campo
é especifico para email! No caso de não haver ocorrencia de string, a função
`strpos()` retorna `null`. Portanto, para validar, também, este caso teriamos:
php
Beleza, nossa lógica faz todo sentido! se o `@` estiver na posição `0` da string
`$email` falamos que faltou a conta. Se não houver `@` na variavel `$email`
exibimos outra mensagem dizendo que nosso usuario preencheu o campo errado!
Mas, se rodarmos esse código, as duas menssagens serão exibidas!
Isso acontece porque, na [**tabela de comparação de tipos do php**] o valor `0` é

igual a `null`! Precisamos, de alguma forma, comparar valores de uma forma mais
especifica onde o tipo faça diferença. Neste caso, `0` seria apenas um inteiro
qualquer, não outra representação de `null`.
E é aqui que devemos usar o operador identico `===`! Com este operador, diferente
do `==`, levamos em conta não só o valor mas também o tipo na hora da comparação.
Então, nossa validação de email deve ser escrita um pouco diferente:
php
Agora sim somente uma menssagem será exibida. Se a posição for zero, mostramos a
menssagem dizendo que faltou a conta. Se não houver `@` mostramos a menssagem
dizendo que o campo é especifico para email.
Uma pequena diferença de tipos, pode causar um grande impacto nas funcionalidades
do nosso sistema.
E você? O que achou do operador identico? Compartilhe com a gente sua opinião!
Para saber mais conceitos em PHP, aqui na [**Alura temos uma formação focada no
desenvolvimento PHP**]
imagem
Quer armazenar **seus LIVRO** no banco? Ou quer buscar **um PRODUTOS** no banco?
Minha orelha já dói e a sua?
Quando juntamos um monte de livro... temos livros, portanto tabelas levam o nome no
plural:
sql
Quando colocamos um livro entre os que já existem, colocamos um livro nos...

livros. Removemos um livro dentre os... livros:
sql
Fica um padrão pra todo mundo na empresa, e não fica aquele sofrimento para
relembrar... nesse projeto foi singular ou plural?
**Regra geral**, nome da tabela vai no **plural**.
Desafio para a próxima: qual a ordem dos meus usuarios?
sql
E que tal começar aprender sobre banco de dados hoje mesmo? Gostou? Então dê uma
olhada nos nossos cursos de [**SQL e NoSQL**]
Talvez o erro mais comum que os desenvolvedores enfrentam, principalmente quando

estão dando os primeiros passos no universo da programação, é o famoso
[NullPointerException] (NPE para os íntimos).
Entretanto, com alguns cuidados, que podemos chamar de programação defensiva,

conseguimos nos prevenir de tomar essa exceção.
Para nos ajudar a entender melhor como prevenir um NPE, vamos tomar como exemplo
uma aplicação que realiza pagamentos. Nela, temos uma classe que é a responsável
por salvar o cartão de crédito do usuário:
java
Também temos uma classe que representa o usuário desse sistema:
java
Vocês acreditariam se eu dissesse que este código já está propenso a receber um

NPE? Antes de explicar o porquê, vamos entender melhor essa exceção.
## NullPointerException
`NullPointerException` é uma exceção que indica que a aplicação tentou usar uma
referência de um objeto que estava com valor nulo.
Extende a classe [**RuntimeException**], que, por sua vez, engloba exceções que são
disparadas em tempo de execução. Além disso, NPE é uma _unchecked exception_, logo,
ela não precisa ser tratada e o compilador não acusa erro em tempo de compilação.
As _unchecked exceptions_ representam falhas no código feitas pelo programador,

(sim, a culpa é nossa). Normalmente são bugs da aplicação que poderiam ter sido
evitados caso o desenvolvedor tomasse mais cuidado na hora de programar.
> > Mas por que tomamos NPE’s? Quais as causas? O que deixa o código propenso a
essa exceção?
Se fossemos listar as ações que causam `NullPointerException` teríamos algo assim:
- Chamar um método de uma referência de objeto que esteja com valor nulo
- Acessar ou modificar um atributo de uma referência de objeto nula
- Em caso de array ou coleções, usar métodos de elementos nulos
- Lançar um `NullPointerException`
- Fazer uso de unboxing em um objeto de valor nulo
- Tentar pegar o tamanho de uma array nula
Voltando ao código mostrado no começo, vou provar para vocês, que aquele código já
está muito propenso a receber um NPE.
Bom, temos um método que, dado um novo cartão que o usuário está tentando
cadastrar, verifica pelo número se aquele cartão já consta cadastrado na lista de
cartões do usuário. Podemos ver o código do método logo abaixo:
java
Para mostrar para vocês esse método funcionando, vou criar um usuário novo e tentar
validar um novo cartão de crédito.
Como acabamos de criar o usuário, em teoria o resultado deveria ser `true` pois não
temos nenhum cartão cadastrado ainda. Para o teste, iremos usar o seguinte código:
java
Ao executar este código, temos o seguinte resultado:
imagem` que devolve o valor do atributo `numero` que, no caso, está nulo. Portanto,
quem está chamando o método èquals()` está nulo e, por sua vez, iremos receber um
NPE.
Para evitar isso podemos validar as informações vindas de fonte externa. Beleza,
podemos, mas também podemos ao invés de chamar o èquals()` pelo objeto preenchido
pelo usuário, chamá-lo pelo cartão iterado pelo `for`. Dessa forma:
java
Pronto, não tomaremos mais NPE pelo motivo que estávamos tomando, pois, sabemos que
o atributo `numero` dos cartões que já estão na lista do usuário estão preenchidos,
logo, o método èquals()` não será chamado por um objeto nulo.
## A classe Optional
Com o Java 8 veio uma nova classe chamada [**Optional**], que por sua vez, traz um
conjunto de métodos para tratar blocos de código críticos. O Òptional` pode ser
pensado como algo que pode ou não ter valor. Se não tiver, dizemos que ele está
vazio.
Para explicar essa classe de forma consistente, eu teria que escrever um post
completo, pois o assunto não é pequeno. [**Existem diversas vantagens no bom uso de
Optional dentre elas a proteção contra NPE**], mas também, é mais difícil entender
seu uso logo de primeira, portanto um estudo aprofundado dessa classe é necessário.
Para aprender mais sobre exceções, inclusive NPE, a Alura possui o curso [**Curso
Java II: Orientação a Objetos**]. E, também, se você ficou interessado pelo
Optional, tem o [**Curso Java 8: Tire proveito dos novos recursos da linguagem**],
que além de falar sobre esta classe, também mostra outras funcionalidades que o
Java 8 trouxe.
Operações com **ponto flutuante** podem ser uma grande dor de cabeça em diversas
linguagens, e não é diferente no PHP. Um simples 0.1 + 0.2 pode dar uma resposta
inesperada. **Como ter uma precisão que queremos?**
Recentemente estive trabalhando em um programa para que eu possa gerenciar o

dinheiro que entra e sai da minha conta bancária, guardando informações sobre cada
transação de débito e crédito.
Para armazenarmos estas informações, vamos iniciar criando um arquivo **PHP** com
um array que armazenará o débito e o crédito:
php
Agora, como realizei um pagamento de R$0,10, adicionamos a seguinte linha no

programa, para adicionar o valor no array de débitos:
php
E mais tarde, realizei outro pagamento de R$0,20, então adicionamos também mais uma
linha:
php
No final do dia eu recebi um pagamento de R$0,30, então adicionei um valor no array

de créditos do programa:
php
Por enquanto, o nosso código ficou assim:
php
Agora, preciso consultar o meu saldo e exibí-lo na tela, vamos criar uma função
para calcular isso, adicionamos no final do programa:
php
Para consultarmos o saldo, vamos imprimir na tela o resultado da função. Chamamos a

função e passamos os arrays de débito e crédito como argumento:
php
E se executarmos o programa, tanto pelo terminal quanto pela web, vamos ver que a
saída do programa ficou:
imagem é diferente da que o computador utiliza (base 2), e a conversão entre elas
pode causar erros de precisão.
Em números de base 2, com um dígito, podemos representar dois números (0 e 1). Com
dois dígitos 2² podemos representar 4 números (0 a 3), com três dígitos, 2³ = 8 (0
a 7) e por assim vai.
Em números de base 10, com um dígito, podemos representar 10 números (0 a 9), com
dois dígitos podemos representar 10² = 100 números (0 a 99). Com a base 10,
representamos mais números com menos dígitos, tendo uma precisão melhor.
Como o computador só entende números binários (base 2), tudo que digitamos nele
vira uma sequência de 0 e 1 para que o processador possa interpretar.
Para exemplificar a diferença entre um número em binário e decimal (base 10), vamos
pegar por exemplo o número 1025 que em binário, fica 10000000001, precisando de
onze dígitos, mas em decimal, seriam utilizados apenas quatro dígitos (1, 0, 2 e
5).
Normalmente não percebemos este erro por acabarmos não utilizando toda esta
precisão para representar números mais simples. Mas quando obtemos algo como uma
dízima periódica, ou usamos operadores de comparação, vemos que o arredondamento
acontece e causa problemas pois ela é infinita, e a **memória do computador é
finita**, então o arredondamento tem que acontecer em um ponto por questões de
arquitetura do processador.
imagem e armazenamos ele no programa como tipo Ìnt`, e fazemos todas as operações
nessa unidade, pois o tipo `nt` não tem arredondamento que nem o Float, portanto
não estará sujeito a perda de precisão devido ao arredondamento.
Utilizando o programa que construímos como exemplo, o código dele ficaria assim:
php
Mas como estamos tratando como centavos, assim que quisermos representar ele como
real, tratamos somente na saída.
php
Podemos utilizar a função **number_format** do PHP para exibir os centavos

armazenados internamente de uma maneira correta na tela.
imagem e se for 64-bit, o valor máximo é de R$ 92.233.720.368.547.758,07 (92

quatrilhões de reais).
Vale lembrar que o PHP não suporta tipos inteiros unsigned (onde só existem números
positivos), ou seja, esse máximo vale tanto para um valor positivo quanto negativo.
Você pode descobrir qual o limite na sua instalação do PHP imprimindo a constante
PHP_INT_MAX.
imagem:
php
Agora, para que o PHP consiga visualizar a extensão Decimal, precisamos colocar
nesse arquivo que criamos, o nome da extensão e a prioridade:
php
Agora podemos utilizar o tipo Decimal! Ele está dentro do namespace com o nome de
Decimal. Então para utilizá-lo, precisaremos adicionar a seguinte linha no começo
do programa:
php
Então, podemos instanciar a classe Decimal com uma string contendo o valor que
queremos representar, por exemplo:
php
Utilizando o nosso primeiro exemplo e adaptando ele para utilizar o tipo Decimal,
ficaria assim:
php
E se executarmos, podemos ver que a saída será exibida corretamente:
imagem, que mantém um guia sobre tudo que um programador precisa saber sobre
precisão numérica.
Outro site interessante para quem quiser saber mais sobre como essas coisas
funcionam no PHP específicamente é a documentação oficial do PHP na parte de
[**floats**].
Vimos que, para obtermos uma maior precisão numérica, o Float não é um tipo de dado
recomendado por ele arredondar valores.
Vimos também que o tipo **Int** não possui arredondamento, e que ele é uma solução
preferível ao **Float**, mas ele possui limitações em seu tamanho máximo.
Além disso, sabemos agora que o tipo Decimal, instalável através de uma extensão, é
o tipo recomendado para tratar com valores de uma maneira mais precisa.
Você gostou do que leu? Aqui na **Alura** temos uma [**formação PHP**],você vai
aprender desde os fundamentos da linguagem junto com as boas práticas e o essencial
conhecimento de uma boa modelagem orientada a objetos.!
imagem
Mais uma vez temos o depoimento de um aluno nosso! Eduardo Branquinho conta um
pouco como a Alura ajudou ele a conseguir seu atual emprego como desenvolvedor.
imagem e resolvi a integração! =D
## Em que empresa conseguiu seu novo emprego
No [**Hipsters.jobs**] consegui um emprego em uma empresa de desenvolvimento

chamada [**Bluesoft**]. Tanto no desafio técnico quanto na entrevista usei diversas
coisas que aprendi na Alura, como Spring, JPA,Git, Java 8 e tudo mais.
Já aproveitando o gancho, tirei uma certificação da Oracle de Java 8 no ano passado

só estudando pela Alura na carreira de certificação que aposto que ajudou meu CV a
ganhar uma visibilidade melhor ainda.
## Alguma dica para seus colegas desenvolvedores?
Crie o hábito de estudo! Não pense que "poxa, só tenho 15 minutos, nem compensa
estudar, pouco tempo". Uma aula de cinco minutos já pode te passar um conhecimento
bem bacana.
Outra dica seria para você se jogar na sua profissão. O que que quero dizer com
isso? Se você é um programador PHP, não apenas programe em PHP no trabalho.
Veja uma aula de PHP a noite, faça um programinha de final de semana, leia blogs
sobre o assunto, vá a palestras, leia livros no ônibus. Entre de cabeça na área.
Isso ajuda muito, você realmente se sente no meio, integrado com a programação.
Claro que este exemplo serve para qualquer outra área, seja de devops, front-end,
ux e tudo mais. :)
**Curtiu o relato do Eduardo? Você pode compartilhar o seu também! Entre em contato
conosco através do contato@alura.com.br**
imagem
Trabalhamos em um ecommerce e fomos incubidos de cuidar de um bug que está

ocorrendo no software da nossa empresa.
Para realizar a compra de algum produto é necessário fazer um cadastro no site.

Nele pedimos algumas informações para o usuário, como por exemplo: Nome, email,
endereço, telefone, CPF, entre outros.
O problema está ocorrendo exatamente no cadastro, alguns usuários estão colocando

qualquer valor no campo de CPF e nosso software está permitindo isso. Nossa missão
é conseguir capturar o CPF digitado e validá-lo.
**Mas, e aí? Como se valida um CPF? Não faço a menor ideia!** Para isso que existe
o Google, certo? Vamos pesquisar:
- CPF possui 11 dígitos
- Multiplica-se os 9 primeiros dígitos pela sequência decrescente de números de 10

à 2 e soma os resultados obtidos
- Multiplica-se o resultado acima por 10 e divide por 11, o resto da divisão é o

penúltimo número do CPF (caso o resto seja 10, o resultado se torna 0). Logo se o
número calculado for diferente do penúltimo número, o CPF é inválido.
- Caso o primeiro dígito seja igual, multiplica-se os 10 primeiros dígitos pela

sequência decrescente de números de 11
- Multiplica-se a soma feita acima por 10
- Verificamos se o resto da divisão da multiplicação acima por 11 é igual ao

segundo dígito, se for, o CPF é válido.
> Ah não, assim não dá, eu já me perdi na terceira regra. Validar CPF é algo muito
complexo.
Parando para pensar, fazer esse tipo de validação deve ser uma tarefa comum para
programadores, pois muitos sistemas necessitam dessa funcionalidade, logo, será que
já não tem algo pronto?
## Caelum Stella
Vendo esse tipo de funcionalidade sendo bastante requisitada por empresas e,

consequentemente, pelos seus desenvolvedores, a [**Caelum**] decidiu criar o
[**Stella**], uma [**API**] que já traz todas as ferramentas necessárias para que
possamos concluir nossa tarefa, ou seja, validar um cpf, de forma fácil e rápida.
O primeiro passo é instalar o Stella no nosso projeto. Para esse post, usaremos
apenas o Stella Core, que já traz as funcionalidades principais dessa API.
Para instalar o Stella temos duas opções:
Podemos importar a dependência dele, caso o projeto use [**maven**]:
java
Ou apenas [**fazer o download do caelum-stella-core**] e importar o jar para o
projeto.
## Validando o CPF
Pronto, agora que acabamos de instalar só precisamos usar suas classes.
Bom, precisamos validar um CPF, certo? Então, primeiro vamos criar um método que
nos devolve um `boolean`. Caso o CPF seja válido, nosso método irá retornar `true`,
caso contrário, `false`. Vamos meter a mão na massa:
java
Agora, precisamos instanciar a classe do Stella que cuida da validação do CPF. A

classe que faz isso é a `CPFValidator`. Ficando assim:
java
Boa, agora só precisamos usar o objeto criado e chamar seu método àssertValid()`,
que recebe como parâmetro um CPF para ser validado:
java
Para conseguir o CPF que o método `valida()` requer, precisamos usar o

`getPessoaCpf()` que nos devolve o CPF da pessoa que está se cadastrando. Com isso
temos o seguinte código:
java
Boa, mas perceba que nosso método `valida()èstá gerando um erro. No caso, ele está
reclamando a falta de um retorno para esse método, pois declaramos que nosso método
retorna um `boolean` e, por enquanto, não retornamos nada. E agora?
Poderíamos tentar retornar o método àssertValid()` mas olha o resultado:
imagem` que, por sua vez, vê se o CPF tem erros e no final adiciona todos os erros
encontrados em uma lista e a retorna. Se a lista não estiver vazia, ou seja, conter
algum erro, uma exceção é lançada.
Então caso tenha erro na lista, o método lança uma exceção. Logo, vamos envolver
nosso código em um `try`/`catch`, se não tiver erro retornaremos `true`, caso
tenha, `false`. Vamos lá:
java
Para testar, ao invés de mandar o CPF retornado do método `getCpfProduto` vamos

criar uma variável do tipo `String` e colocar nós mesmos valores para o CPF, assim:
java
Esse CPF é válido, logo nossa implementação, em teoria, tem que nos retornar
`true`. Além disso, vamos imprimir o `boolean` resultante do método para ver se
nossa implementação está funcionando adequadamente:
java
Agora vamos testar:
![]
Muito bom, por enquanto tudo certo, mas e se o CPF fosse falso? Como seria? Vamos
trocar alguns números e ver o que acontece:
![]
Eita! Além de retornar false, ele lançou uma [**Exception**]. Se traduzirmos,

basicamente ela diz: "Dígitos verificados inválidos", mas o programa continuou
funcionando perfeitamente.
O problema é que usar um `try`/`catch` nesse caso é algo inapropriado, devemos usar
`try`/`catch` para tratar erros que não estamos esperando, para que, assim,
possamos nos recuperar do erro obtido e, também, jogar regra de negócio dentro do
bloco `catch`, não é nada legal.
O que seria o ideal? O ideal seria apenas retornarmos `true` caso não tenha erros e
`false` caso tenha. Para isso vamos usar outro método do Stella.
Vocês se lembram do ìnvalidMessagesFor`? Que verifica se o CPF possui erros e

devolve uma lista contendo esses erros, caso exista. Ele se adequa bem as nossas
necessidades.
Se ele devolve uma lista vazia caso não tenha erros então vamos fazer uma condição
que, caso a lista esteja vazia, retornará `true`,ou seja, cpf válido, caso não
esteja, `false`, inválido.
Primeiro, vamos substituir todo o nosso `try`/`catch` por esse método e atribuí-lo
a uma lista, assim:
java
Nos resta criar nossa condição que verifica se a lista possui erros:
java
Pronto, para dar um toque final, além de retornar `false`, vamos imprimir os erros
que aquele CPF possui, desse jeito:
java
Ainda usando um CPF inválido vamos rodar esse código para ver o que acontece:
![]
Boa, não temos mais aquela exception lançada na nossa cara. Além disso, deixamos de
utilizar o `try`/`catch`, muito bom! Para finalizar vamos só arrumar o código que
estamos usando para migrar dos testes para os métodos reais que nosso programa
utiliza:
java
Parabéns, conseguimos completar nossa missão! Validamos o CPF de forma fácil e

rápida, agora quero ver os engraçadinhos tentarem comprar algum produto nosso
passando um CPF falso.
## Conclusão
Atualmente existem milhares de `features` prontas que resolvem muitos problemas

encontrados por nós, programadores. Imaginem só se tivéssemos que escrever esse
código de validação na mão? Pensa no trabalho que ia dar.
Antes de começar a programar coisas desse tipo, ou seja, funcionalidades comuns,

pesquise na internet se já existe alguma que se encaixe com a sua necessidade, com
certeza você vai ser muito mais produtivo.
## Para saber mais
O Stella é muito maior do que apenas validação de CPF, com ele podemos gerar
boletos customizados, calcular frete, formatar CPF e CNPJ e mais outras
funcionalidades bem interessantes.
Na Alura temos o curso [**Java Brasil**]. Nele, outras funcionalidades muito úteis
do Stella, como as citadas acima, são apresentadas. Para quem tem interesse em
saber mais sobre essa linda API, vale a pena dar uma conferida.
E se você não programa em Java, existe, também, o Stella para C#. Na Alura, temos o
curso [**C# Brasil**]. Neste curso você pode aprender diversas funcionalidades do
Stella, usando a linguagem de programação C#.
imagem
Estou trabalhando em um programa Python para conversão de valores monetários de

Real para Dólar que usa uma API externa que encontrei na Internet.
Através de [**requisições GET**] com os parâmetros de valor, a API nos devolve o

valor convertido. Se integrando ao Python, temos uma função
`converte_real_para_dolar()` que toma como parâmetro o valor em Real que queremos
converter:
py
Num dia específico de julho, o resultado foi exatamente `5.19` - a função funciona
bem! No geral, para fazer os relatórios que preciso tenho uma grande lista de
valores em Real (`valores_real`) a serem convertidos para valores em Dólar. Como é
bem direto, uma simples [**compreensão de lista**] resolve:
py
Entretanto, para melhorar a organização dos meus dados, precisava dispensar os

valores menores que 5 dólares.
A melhor forma de [**filtrar valores em uma lista**] é justamente através de uma

compreensão de lista, como já vimos em outro post. Podemos simplesmente adicionar
uma verificação à expressão:
py
O código estava correto. Porém, quando eu fui rodá-lo, acabei me deparando com um
grande problema - ele estava demorando muito!
O resultado, que antes estava chegando super rápido, agora estava tomando bastante
tempo para aparecer. O que essa simples verificação fez com todo nosso programa?
Fui olhar na documentação da API e de cara percebi o problema para evitar

[**ataques de negação de serviço**], a API que eu estava utilizando restringia um
mesmo cliente a uma única requisição igual a cada 30 segundos. Ou seja, conseguimos
fazer várias requisições diferentes rapidamente, como antes, mas temos que esperar
30 segundos para repetir uma mesma.
Nessa nossa compreensão de lista, estamos fazendo a mesma requisição duas vezes -
na verificação ìf` e no item da lista, por isso estamos tendo esse problema. Como
será que podemos resolver?
## Usando um `for` padrão
Intuitivamente, podemos pensar em uma solução usando um loop `for` padrão:
py
Dessa forma, guardamos o resultado da função `converte_real_para_dolar()` em uma

variável (`valor_em_dolar`) e podemos usar essa própria variável na verificação
ìf`, sem a necessidade de computar o valor novamente. Legal, funciona, mas fomos
de uma linha para cinco…
Muitas vezes, é até vantajoso que se use mais linhas, para a **legibilidade e
clareza do programa**. Entretanto, compreensões de lista já são claras o suficiente
para evitarem tudo isso. Será que realmente não poderemos usá-las?
## _Assignment expressions_ e a PEP 572
O legal seria se pudéssemos reutilizar um valor dentro da própria compreensão de

lista, sem precisar calculá-lo novamente, como se declarássemos uma variável dentro
da própria expressão:
py
Esse código, que não funciona em Python, resolveria nossos problemas de uma forma
clara. A questão é que, **até agora**, o Python não suporta atribuições de valor a
uma variável dentro de uma expressão (diferentemente de linguagens como JavaScript
e PHP). Por enquanto, só podemos fazer isso através de _[statements]_ em linhas
próprias.
Espera… **até agora**? Sim! Recentemente, tivemos a [PEP 572] aceita, uma PEP que
propõe a adesão das chamadas _assignment expressions_ no Python - uma forma de
definir variáveis no meio de expressões.
Na próxima versão do Python (3.8) já teremos essa funcionalidade incluída

nativamente na linguagem. A sintaxe é parecida com a que exemplificamos, mas o `=`
é substituído por um `:=`, para maior clareza:
py
Logo isso funcionará sem problemas!
## Polêmicas da novidade
Como toda novidade, essa já está causando bastante polêmica no universo pythônico.
Muitos usuários da linguagem alegam que essa nova implementação quebra o princípio
de código pythônico, indo contra o próprio [**Zen do Python**] em si.
Por outro lado, muita gente também defendeu arduamente a mudança, por conta das
facilidades e comodidades que ela trará. O embate é complicado e não acaba aqui.
Na verdade, [**toda a polêmica que veio junto com esse PEP foi um dos motivos**]
para o criador da linguagem Python, Guido van Rossum, se dar umas férias de seu
posto de [**BDFL**], o que deixou bastante gente chateada.
E aí, o que você acha dessa mudança? Se quiser aprender mais sobre Python, não
deixe de dar uma olhada em [**nossos cursos na Alura**]!
imagem
O desenvolvedor de um projeto de aplicativo recebeu a tarefa de adicionar as novas

microinterações planejadas para o app da marca, porém a única orientação que
recebeu foi:
> Adicionar botão intuitivo para verificar notificações.
Porém, quando o desenvolvedor ia começar a elaborar a nova feature algumas dúvidas

surgiram:
- Esse botão abre uma nova página, um modal ou será um [menu flyout]?
- Haverá um aviso de novas notificações de tempos em tempos? Se sim, qual será esse
intervalo?
- Como o usuário saberá que há novas notificações?
- O que acontece depois de acionar a microinteração?
Ao tentar desenvolver a ideia, mesmo com as dúvidas, chegou a este resultado:
imagem]?
- Qual a sequência de ações e o momento (timing) para acontecer?
- Existem informações nas quais se baseia? Localização, hora, clima, etc… E de onde
esta informação será retirada?
- Quais as configurações e parâmetros do algoritmo da ação?
- Qual feedback será apresentado e quando?
- A microinteração se repete? Com que frequência?
Seguindo mais ou menos essa ideia conseguimos preparar regras mais bem elaboradas
que facilitarão o trabalho do desenvolvedor ou mesmo a manutenção de cada um das
microinterações já existentes.
Para desenvolver suas próprias regras, é preciso seguir algumas considerações
importantes. Vamos ver um pouco mais sobre elas!
## Crie regras claras
Como já notamos, criar regras claras e de fácil compreensão é fundamental para

auxiliar em todo o processo de desenvolvimento de uma microinteração. Então, como
seria se alterássemos aquele exemplo inicial para algo como:
> Adicionar botão no menu principal para facilitar a visualização de notificações

não lidas. Ao receber novas notificações, apresentar uma indicação sobre o botão
com a quantidade de novas notificações não lidas. Após clicado, o botão abre um
menu flyout com as novas informações e retira a indicação de notificações não lidas
do botão. A cada nova atualização de notificações não lidas, o processo se repete.
Após clicar em uma das notificações, o menu fecha e volta ao estado default, sem
indicações de notificação.
Agora temos uma descrição muito mais detalhada do que precisamos, certo? Percebe
que, logo no início da descrição, temos determinado o objetivo da microinteração?
> _"Adicionar botão no menu principal para facilitar a visualização de notificações

não lidas."_
Antes de determinar as regras da interação, precisamos deixar claro o que

pretendemos realizar com aquilo para depois desenvolver as demais especificações.
Isto é, o objetivo será a base para desenvolver cada etapa da microinteração, por
isso a importância de tê-lo claro.
Mas, será que a apresentação das regras dessa forma, em um texto corrido, é a
melhor forma de apresentar nossas regras?
## Apresentando suas regras de microinterações
Que tal apresentar as orientações anteriores dessa forma:
![]
Note que temos uma visão completamente diferente da que tivemos com a apresentação
em um texto corrido. Agora conseguimos visualizar com mais clareza o que pretendiam
realizar e diminuímos ainda mais as chances de ambiguidade e erros.
O formato de texto corrido pode servir em algumas situações, mas **a representação
visual como base para as orientações ajuda muito na compreensão da ideia**.
E, como representação visual, podemos usar tanto um fluxo de telas, diagramas,

imagens ou qualquer outro apoio que seja relevante para tornar entendimento mais
claro.
Para orientar o que adicionar nessas representações, podemos considerar os

seguintes pontos:
- **O estado default:** Como será o estado inicial do objeto, como o usuário
encontrará em sua primeira interação?
- **Estado ativo:** O que acontece com o objeto enquanto a microinteração ocorre?
- **Estado atualizado:** O que acontece quando o usuário termina a interação?

Representando em algo visual a microinteração criada no projeto, teríamos um
resultado mais ou menos assim:
![]
Veja que agora deixamos nossa representação mais linear e fácil de entender!
Tenha em mente que a ideia é definir as regras de forma a ajudar tanto o

desenvolvedor a compreender bem a ideia antes de começar a executá-la, quanto a
própria equipe durante o planejamento das regras.
## Analisar e reajustar
Existem alguns tópicos muito relevantes a refletir enquanto desenvolvemos as

regras, para evitar que hajam lacunas que prejudiquem a experiência do usuário.
Um bom exemplo seria, ao terminar de desenvolver as regras, fazermos uma primeira

observação do geral elaborado e, a partir daí, começar a pensar os possíveis erros
e falhas no qual o usuário pode cair.
Essa é uma boa prática para **prevenção de erros**. Nesse momento sentimos o quanto
uma boa apresentação das regras da microinteração faz diferença! Quer dizer, tendo
uma definição clara é muito mais fácil de fazer análises críticas.
É importante sempre repassar as regras e realizar testes para analisar se o que

definimos faz sentido para o usuário.
## Definindo regras para microinterações
Assim como afirmou Dan Saffer em seu livro [Microinterações: Desenhando com
detalhes]:
> "As regras deveriam gentilmente guiar os usuários através da ‘interação’ com a
microinteração".
Ou seja, devemos ter um cuidado extra ao desenvolver as orientações para nossas

microinterações para que a experiência do usuário seja o mais natural e intuitiva
possível.
O mais importante, antes de mais nada, é definir o objetivo da microinteração e, a

partir disso, analisar todo o conteúdo e informações que poderão ser relevantes
para o seu desenvolvimento.
Quando estamos programando é bem comum termos listas de dados, listas de tarefas,
de produtos, de clientes... No dia a dia nós fazemos muitas operações que envolvem
listas.
Em uma parte de um programa que estou trabalhando, preciso pegar o nome e o

sobrenome de alguns alunos cadastrados no banco de dados. Para isso, existe uma
função que nos retorna o nome e o sobrenome de um aluno dado um id:
python
Eu quero mostrar para o usuário uma mensagem de bem-vindo quando ele acessar o
sistema:
python
Legal! Conseguimos imprimir nossa mensagem! Mas o que significa àluno[0]`? O

login? O nome do usuário? O sobrenome?
Veja que o nosso código não tem muita semântica, isto é, quando alguém for ler
nosso código, ou nós mesmos no futuro, não saberemos o que àluno[0]` significa só
de olhar o código. Claro, nós podemos atribuir àluno[0]` a uma variável:
python
Mas, mesmo assim, a legibilidade do código fica um pouco prejudicada. O que tem
dentro da lista àluno`? Um nome e sobrenome, uma lista de nome de vários alunos e
estamos pegando só o primeiro’?
Veja que mesmo nesse caso, nós precisamos parar e interpretar o código, já que a
leitura não está tão fluida. Hoje sabemos que a função `busca_aluno` nos retorna o
nome e o sobrenome, mas e amanhã? Talvez, quando nós, ou outra pessoa, no futuro
olhar a variável àluno` não vai saber o que ela significa de fato.
Como nós podemos resolver isso já que nossa função `busca_aluno` nos retorna uma
lista com o nome e sobrenome do aluno?
## Desembrulhando nossa lista
Nossa função `busca_aluno` já nos retorna o nome e o sobrenome de um aluno. Então

se fizermos algo assim será que funciona?
python
Em muitas linguagens de programação, esse código não funciona, mas em Python sim!
Com esse código, estamos querendo dizer para o Python pegar o primeiro valor da
lista e colocar na nossa variável `nome` e o segundo valor na variável `sobrenome`:
python
Nossa função retorna uma lista com dois elementos, nome e sobrenome, mas e se
tivéssemos uma lista com mais valores? Por exemplo, se tivéssemos uma lista com dez
números e queremos pegar os dois primeiros, precisaríamos declarar dez variáveis?
Uma para cada elemento da lista?
Bem, nós só queremos os dois primeiros números então talvez nós possamos declarar
só duas variáveis.
python
E quando nós executarmos nosso código, teremos um erro:
imagem segundo valor da lista, isto é, ignorar o sobrenome?
python
Com o operador `_` estamos falando para o Python ignorar o segundo valor da lista.
Com isso temos apenas a variável nome. Esse operador pode ser usado em conjunto com
a starred expression:
python
E aí, o que achou dessa forma de desempacotar dados com o Python?

O Python se tornou uma linguagem muito utilizada pelos desenvolvedores. Por ter uma
curva de aprendizado baixa e uma sintaxe amigável, ela ganhou muito espaço tanto
com as pessoas que estão começando a programar quanto com os programadores mais
experientes.
Aqui na Alura, temos uma [**vários cursos sobre Python**], nela você aprenderá a
sintaxe da linguagem, como criar funções e classes, conceitos como encapsulamento,
até padrões de projeto, e frameworks web, como Flask e Django.
imagem
Ao fazer uns testes de layout, a equipe de design avaliou esta primeira versão:
imagem.
Permanecemos um bom tempo utilizando essa mesma tendência em quase tudo, fugindo à
regra vez ou outra para incrementar um pouco mais aqui ou ali, e deixar as coisas
um pouco mais interessantes.
Agora, com o surgimento do Material Design, continuamos na linhagem do flat,

reaproveitando as qualidades dessa tendência ainda bastante forte, mas com o
incremento de alguns fatores.
Para termos uma visão melhor, vamos dar uma olhada neste comparativo prático feito
pela [Cleveroad]:
imagem
Leve (performance),Animações elegantes (motion design)
Responsivo, [**Guidelines**] muito bem definidos \[/table\]
Estes são os pontos básicos. No Material Design temos algumas características do

Flat, mas agora com novidades que buscam facilitar a interação do usuário.
Com a noção de **profundidade** conseguimos deixar mais clara a hierarquia de

camadas nos elementos da página, facilitando a compreensão do usuário.
Já as **animações**, assim como a própria Google define nos guidelines, vieram para
incrementar a experiência do usuário com melhor noção das relações espaciais,
funcionalidades e intenções, baseado em animações fluidas e elegantes. Veja o
exemplo de Jovie Brett:
imagem indicando a profundidade dos elementos;
- A característica do menu ativado, que deixa de ser um hover com o background

inteiro verde para apenas uma fita indicativa abaixo, típico do Material Design;
- Os blocos de cursos com o botão "Saiba mais" dentro dos padrões apresentados no
guideline.
Além disso, podemos inserir animações de interação para enriquecer ainda mais essa
experiência, tornando-a mais elegante e intuitiva.
## Então o Material Design é a solução?
Não podemos afirmar que as tendências serão sempre a melhor solução, justamente
porque são uma tendência.
Mas, além disso, temos alguns pontos a considerar, em contrapartida, antes de

implementar a mudança:
- As animações adicionadas podem acabar [consumindo um pouco mais da bateria] dos

dispositivos móveis.
- Não precisamos seguir os conceitos do Material Design _à risca_, mas precisamos

ter cuidado ao aplicar novas características ao design, para que, nem a linguagem
do Material Design, nem a linguagem do próprio projeto se perca nesse processo.
- Tanto o Material Design quanto o Flat Design são formas populares de criar um
design de layout, **mas será que essa é a melhor abordagem para o seu projeto**?
É importante que todos tenham clara a ideia de que o Material Design pode **nem
sempre ser bem aplicado** dentro do conceito de alguns projetos. Vejamos um
exemplo:
imagem
E aí? O que você achou? Curtiu a ideia do Material Design da Google? Comente ali em
baixo e compartilhe sua opinião com a gente!
Para validar a utilização do Material Design, nada melhor do que um briefing bem
elaborado do projeto, certo? Então dá uma olhada nesse curso de [Identidade visual]
da Alura para aprender algumas boas técnicas! ;)
imagem
Agora que você sabe as principais partes para produzir um bom marketing de
conteúdo, você começou a desenvolver diversos textos e publicações nas redes
sociais com informações de qualidade e relevantes.
Porém, ainda não está vendendo os produtos da empresa na qual trabalha da maneira
que queria.
Como, então, alinhar o marketing de conteúdo com a venda, efetivamente?
Uma das pessoas da equipe de marketing da editora na qual trabalhamos teve a ideia
de, ao fim de um post sobre a adaptação cinematográfica que será feita baseada em
um livro que foi publicado pela empresa, colocar uma frase como:
> "Gostaria de saber essa história antes do lançamento do filme? Compre o livro
aqui" e colocar o link do produto na frase.
Então, as pessoas que se interessarem pela história e pela curiosidade podem

comprar o livro e, assim, as vendas dele aumentarão.
Sem querer, essa pessoa utilizou uma das maiores técnicas do marketing de conteúdo
que é o [**Call-to-Action (CTA)**], na qual, depois de passar o conteúdo ou as
principais informações a respeito, você chama o cliente para realizar uma ação,
como saber mais informações, se cadastrar ou, como nesse caso, comprar.
## Tipos de Call-to-Action
Existem diversos tipos de Call-to-Action que podem ser utilizados nos posts do blog
da empresa, em posts de redes sociais, entre outros. Os tipos e modos em que são
usados mudam de acordo com o conteúdo passado e o intuito daquelas informações.
O principal, e mais conhecido, é o de venda, no qual coloca-se um link direto para

a página de compra do produto relacionado ao assunto.
Como o que a integrante da nossa equipe fez de, ao fim de um post no blog, já
colocou o link de venda do livro citado no texto para que a pessoa que ler o
conteúdo já possa comprá-lo, caso tenha se interessado.
Outro tipo é o de receber um contato da pessoa. Isso pode acontecer de diversas

maneiras, como fornecer um conteúdo mais completo, exclusivo e gratuito, em troca
de uma forma de contato, como o e-mail.
Com esse contato, a empresa pode passar a se comunicar mais diretamente com ela,
oferecendo ofertas e conteúdos que interessam aquela pessoa, já que sabem o que a
interessa.
No fim de um conteúdo, também pode haver um CTA para que a pessoa se inscreva na
newsletter da empresa e, assim, sempre receba conteúdos como aquele.
Um CTA pode ser feito para a questão de compartilhar o conteúdo, nas redes sociais
ou até mesmo por mensagens e e-mail. Assim, a própria pessoa faz a divulgação de
informações que ela gostou.
## Como colocar o CTA no seu post
Normalmente, o CTA vêm depois de todo o conteúdo. Após a pessoa ler todas as
informações a respeito de determinado assunto, cria-se um parágrafo adicional no
qual você pergunta se a pessoa quer realizar algo, como se fosse uma dica.
No caso do CTA que colocamos da venda do livro acrescentamos ao fim do texto mais
uma parte que dizia:
> "Que tal conhecer completamente a história lendo o livro? Você pode achá-lo aqui"
A palavra aqui fornecia um link que direcionava a pessoa até a página em que o
livro era vendido. A oferta veio por meio de uma pergunta, como uma sugestão e/ou
dica para a pessoa.
A mesma abordagem pode ser usada para adicionar os outros tipos de CTA. Como uma
pergunta que se a pessoa gostou do conteúdo, se ela gostaria de recebê-lo
diretamente em seu e-mail assinando a newsletter.
Ou se gostaria de se aprofundar mais ainda no assunto e fazer o download de um e-

book exclusivo desenvolvido pela empresa. Ou, até mesmo, seguir a empresa nas redes
sociais para sempre saber as novidades.
O CTA, inclusive, auxilia no SEO do produto ou link que será linkado no post do
blog. Alguns buscadores, como o Google, acreditam que quanto mais pessoas,
relevantes, citam aquele link, melhor ele é. Então, melhor será sua posição nos
resultados acerca daquele assunto.
Por exemplo, quanto mais textos tiverem o link de um livro da editora, melhor o
link para a venda daquele livro ficará no ranking de resultados de pesquisa.
Caso queira saber mais sobre criação de posts para o blog da sua empresa, faça o
nosso curso Blog do seu Negócio, ele é dividido em duas partes: a [primeira] que
fala sobre geração de lead e entrega de valor e a [segunda] que é sobre métricas e
SEO.
Caso também tenha interesse, pode fazer nosso [**curso de Marketing de Conteúdo**]
ou comprar o [**livro sobre Marketing de Conteúdo, da Casa do Código**].
Você está de olho nas atualizações do Google, não é mesmo? A sua maior vontade é
conseguir entender quais são os desejos da empresa para poder adequar suas páginas.
Ao final do artigo, você entenderá quais são os principais desejos da empresa para
que suas produções possam se adaptar a ela.
Boa leitura!
## 1\. Panda
O [Google Panda] foi criado pela empresa para melhorar a avaliação sobre a
relevância e qualidade das páginas na internet.
### Panda 1.0
Essa atualização visava encontrar sites que contratavam redatores que criavam
conteúdos fracos.
O único objetivo existente era posicionar o site entre os dez primeiros. A ação,
que foi pensada primeiramente para os EUA, afetou cerca de 12% dos resultados de
busca.
O problema não estava na contratação de redatores, mas não na qualidade do conteúdo

entregue.
### Panda 3.0
Essa atualização, utilizada a partir de outubro de 2011, [ajudou grandes sites,

como a FoxNews], a melhorar seu posicionamento nas buscas.
Nessa etapa, algumas recomendações feitas para auxiliar [**os profissionais**]

foram:
- dar força aos conteúdos antigos e permanecer com tudo quanto é valioso;
- adicionar sistematicamente novo conteúdo. Prezar principalmente pela
originalidade e evitar duplicar material já existente;
- utilizar dados com fontes confiáveis;
- prezar pela escrita fluída e gramaticalmente correta.
### Panda 4.2
Após o lançamento dessa atualização, a empresa confirmou que 2 a 3% das buscas

realizadas em inglês foram afetadas.
De acordo com o Google, as mudanças foram pequenas, porém as principais ressaltaram

algumas modificações importantes. Podemos citar a necessidade de atualização
frequente do blog.
O mais importante é que aqueles que sofreram impacto com a atualização puderam
recuperar o tempo perdido e voltar a se posicionar como antes.
## 2\. Payday Loan
Lançada em 2013, [a versão Payday Loan] teria inicialmente um impacto próximo a

0,3% nas buscas efetuadas nos EUA.
O principal objetivo era deixar as buscas mais limpas em mercados que

tradicionalmente eram conhecidos pelo uso de spam, como pornografia e empréstimo
bancário.
Assim, os principais impactados com a Payday Loan foram os sites que estavam
ranqueados em buscas com alto volume, mas possuíam conteúdo com spam e recebiam
links de práticas não naturais.
A principal ação para [**profissionais**] de SEO e blogueiros era (e ainda é)

conseguir links de forma natural. Além disso, preparar conteúdo para auxiliar, de
fato, seus usuários.
## 3\. RankBrain
Podemos dizer que o [RankBrain] é uma experiência de inteligência artificial, para

ajudar tanto o processamento de buscas quanto o ranqueamento das páginas.
O grande diferencial dele é a possibilidade de aprender sobre o comportamento de

páginas e diferenciar as formas com que lida com os resultados de forma dinâmica.
Isso significa que o RankBrain é capaz de identificar sinônimos, plurais e

coletivos dos termos utilizados pelos usuários na ferramenta de busca.
Além disso, ele consegue entender melhor o funcionamento de buscas com mais de uma
palavra-chave (palavra-chave de cauda longa).
Dessa maneira, podemos dizer que com esse algoritmo o Google consegue interpretar
melhor os termos buscados.
Também entende de forma mais eficaz qual foi a intenção do internauta para fazer a
busca. Assim, os resultados podem ser refinados para o usuário.
Diferentemente do que se pode imaginar, o RankBrain não substitui os sistemas

anteriores, mas auxilia na interpretação das intenções de busca do usuário, obtendo
a eficiência.
Para os blogueiros ou aqueles que trabalham com SEO, um ponto positivo é a

possibilidade de utilizar variações das palavras-chave sem ser penalizado na
classificação.
## 4\. Quality Update
O [Quality Uptade] modifica a forma como a empresa identifica quais são as páginas
com maior qualidade quando comparadas a concorrentes.
A principal mudança está nos sinais que identificam qualidade em uma página. [De
acordo com testes], a atualização proporcionou maior credibilidade às páginas e aos
blogs informativos, tutoriais e páginas de passo a passo.
Destaca-se que apenas a forma como o Quality Uptade entende que o conteúdo de
qualidade sofreu modificações.
Assim, todos os produtores ainda devem focar na criação de conteúdo útil para o
público-alvo.
## 5\. Mobile Update (Mobilegeddon)
Diferentemente das outras atualizações que eram mais pontuais, a [**Mobile

Update**] proporcionou mudanças na forma de ranquear os sites.
A principal diferença estava na preferência do algoritmo por páginas amigáveis a

Assim, sites que proporcionam uma experiência agradável para seus usuários (como
utilizar a responsividade) teriam maiores benefícios na classificação.
Embora a expectativa geral dos profissionais e donos de blogs fosse de uma grande
reviravolta, os resultados gerados não trouxeram o impacto esperado.
A principal preocupação do Google com o Mobile Update está em trazer uma melhor
experiência para os usuários de dispositivos móveis. Dessa maneira, os internautas
não se frustram com os resultados das buscas efetuadas.
O maior problema das páginas que não estão otimizadas para essas tecnologias são
para leituras e navegação: os visitantes não conseguem acessar a informação
desejada com facilidade.
Melhorar a forma com que esse usuário navega em seu site é muito mais do que
utilizar um tema responsivo.
Pense em criar um site considerando essas plataformas, ou aprimore seus conteúdos,

chamadas, slides, etc.
Se você tem dúvidas se sua página está adequada, o Google possui um [**teste para
ajudá-lo a encontrar pontos negativos**] e aponta eventuais mudanças e ajustes.
## Para não ter medo de nenhuma atualização
Provavelmente você tem medo de que alguma atualização mine todo trabalho que você
teve até aqui.
Para a sua alegria, temos boas notícias! Se você deseja melhorar a forma por meio
da qual seu site é compreendido pelos buscadores, pense nas ambições e desejos de
quem está fazendo as pesquisas em que você deseja aparecer.
As principais modificações nos algoritmos visam melhorar a experiência dos

usuários. E o objetivo é bem simples: levá-lo ao encontro do que ele busca.
Dessa maneira, as suas principais ações devem ser melhorar seu conteúdo e a
usabilidade do site como um todo.
Caso você seguir essas instruções, fique tranquilo! As atualizações do Google serão
tomadas para que os sites como o seu sejam mais bem classificados e recebam maior
tráfego.
Por outro lado, se você sempre procura alguma forma de obter visitas sem melhorar o
que é entregue para os visitantes, a qualquer momento, uma nova atualização pode
diminuir drasticamente suas visitas.
Certamente você já sabe que trabalhar com [**diagramação usando o Adobe InDesign**]
é uma das melhores alternativas para a criação de livros, revistas, folhetos, e-
books, aplicativos e outros tipos de documentos com altíssima qualidade.
No post de hoje, apresentaremos 7 hacks que podem ser aplicados no InDesign para
aperfeiçoar os seus conhecimentos práticos e realizar projetos ainda melhores.
Vamos começar?
## 1\. Criando o seu próprio ambiente de trabalho
A interface padrão do Adobe InDesign, assim como em outros produtos da linha, pode
ser customizada definitivamente pelo usuário.
Todos os elementos — painel, barra de controle, caixa de ferramentas, etc. — são

distribuídos no ambiente de trabalho de forma a torná-lo compatível com sua rotina
de trabalho.
### Como fazer?
O procedimento é simples: basta modificar o ambiente conforme a sua preferência. Em

seguida, vá em Window > Workspace > New Workspace; crie um nome para o seu novo
ambiente e dê OK. Pronto!
## 2\. Aplicando a cor preta corretamente
Esse hack pode parecer um pouco confuso, porém, temos certeza que até quem é menos
detalhista ou nem mesmo trabalha com imagens já notou o impacto que a escolha certa
do preto causa.
Imaginemos um cartaz com uma grande área de preto e que está exposto ao ar livre. O
seu fundo já está desvanecido, com uma cor mais próxima do cinza (preto fosco),
indicando que algo no pôster está inadequado.
Ao ler o conteúdo do cartaz, percebemos que há um outro problema: os textos

adquiriram uma mistura de cores além do próprio preto. Assim como o problema no
background, isso também se deve à má escolha do preto.
### Como resolver?
O preto que preenche os fundos ou a própria imagem deve ser aplicado em sua
configuração composta (preto chapado), usando o sistema de cores subtrativas (CMYK
– Cyan, Magenta, Yellow & Black (Key)). Um exemplo de como formar a cor é usando
Cyano (30%) e Black (100%).
No caso do texto, é imprescindível usar o preto puro (K 100%) para evitar que o
problema aconteça e assim preservar a integridade das cores impressas.
## 3\. Usando os recursos Find / Change
Trabalhar com uma significativa quantidade de texto é algo comum para muitos
profissionais que usam o InDesign. Editar manualmente um livro com centenas de
páginas, incluindo notas de rodapé, glossários e tudo mais, é um compromisso
bastante ingrato, porém, com uso do **Find Change** ele é simplificado.
### Como usar?
Pressione o atalho “Ctrl + F” (Edit > Find) e digite o termo que pretende editar.
Em seguida, digite o trecho a modificar ou dê o famoso “Ctrl + C” seguido do “Ctrl
+ V” e, logo abaixo, faça a alteração — ela se aplicará a todas as repetições do
mesmo termo.
Para atualizar nomes, termos e palavras em decorrência de erros ortográficos ou

adaptação para uma nova norma vigente, o Find Change presta um auxílio e tanto!
## 4\. Visualizando as impressões
O InDesign não tem por padrão a funcionalidade “disponibilizar a visualização da

impressão” (preview). Ter uma perspectiva de como o layout ficará após o conteúdo
ser impresso é fundamental para evitar falhas e desperdício de tempo / material.
### O que devo fazer?
Acesse o menu View > Extras > Hide Frame Edges ou digite a tecla “W”. Simples!
## 5\. Criando camadas (layers)
Imaginemos que você ficou responsável pela elaboração de folhetos promocionais que
serão distribuídos em três diferentes regiões do país. Em cada região o folheto
deve anunciar diferentes conteúdos — preços e condições de pagamento, por exemplo.
Como o layout será o mesmo, em vez de tratar cada imagem isoladamente, você poderá
usar camadas para economizar tempo construindo em um só arquivo.
Para trabalhar com camadas, acesse o menu “Window” e selecione “Layers” ou

simplesmente use o F7.
## 6\. Conhecendo o Story Editor
Editar parágrafos quando o conteúdo de várias páginas já se encontra formatado pode

ser inconveniente, principalmente quando se precisa mexer em um bloco de texto que
está posicionado verticalmente ou alterar a cor da fonte não é possível pré
visualizar a alteração da cor quando o procedimento é feito convencionalmente.
**O Story Editor é um excelente utilitário do InDesign para realizar edições desse
tipo, pois ele permite que o texto seja aberto em uma nova caixa e editado com
segurança.** Além disso, toda alteração feita é aplicada automaticamente e pode ser
rapidamente desfeita.
Dentre outras funcionalidades, o Story Editor facilita a inserção de comentários,

hyperlinks, notas, variáveis, referências e muito mais.
Para abrir o editor, basta teclar Ctrl + Y.
## 7\. Trabalhando com layouts dinâmicos
Quando se trabalha com textos e imagens no InDesign, é natural que o usuário queira
que as fotos / vetores acompanhem o texto conforme o mesmo seja ampliado ou
reduzido. Com isso é gerada uma frustração, pois, por padrão, as coisas não
funcionam assim na prática.
Usar layouts dinâmicos é uma das InDesign hacks mais úteis para esses casos e pode
ser a solução para a sua dor de cabeça. Por meio de um layout dinâmico, todas as
imagens “descem” na medida que cresce o número de linhas do texto e “sobem” quando
esse número decresce.
### Como fazer?
Vamos supor que as imagens, localizadas abaixo de um bloco de texto tenham que
acompanhar o parágrafo.
O primeiro passo será acessar o menu “Object” e selecionar a opção “Text Frame
Options” (ou usar o atalho Ctrl + 3). Clique na aba “Auto-Size” e você identificará
uma barra indicando que a função está desabilitada (Off). **Nessa mesma barra,
selecione a opção “Height Only”.**
Observação: existe um pequeno quadro desenhado logo abaixo da barra de opções,

contendo nove ângulos e posicionamentos. Selecione o topo no caso, os pontos
superiores no centro do quadro. Feito isso, clique em “Ok”.
Em seguida, use a ferramenta de seleção e selecione as imagens, localize o quadrado

preenchido em azul e arraste-o para a região do texto que será o “ponto de partida”
para a nova regra de posicionamento.
Clique com o botão direito do mouse sobre o conteúdo que selecionou, vá em

“Anchored Objects” e a seguir em “Options”. Na tela que acabou de abrir, localize o
recurso “Reference Point”, em “Anchored Object”, e selecione o ponto no canto
superior esquerdo.
Para finalizar, localize na mesma tela o “Anchored Point” > “X Relative To” > “X
Offset” e reduza o valor para “0”. Em “Y Relative To”, selecione (na barra de menu)
a opção “Text Frame” e, na caixa “Y Offset”, reduza o valor para “3p”. Marque a
caixa “Prevent Manual Positioning” e dê “Ok”. Pronto!
## Pronto para usar os InDesign hacks que aprendeu?
Os InDesign hacks facilitarão a sua rotina profissional em diversas ocasiões,

portanto, aproveite o momento para começar a praticar e explorar a fundo suas
funcionalidades. Dessa forma você [**reforçará o aprendizado**] e adquirirá uma
experiência mais rica.
Curtiu as dicas? Mostre o que você aprendeu para seus amigos ou ao seu chefe (por
que não?), compartilhe este conteúdo nas redes sociais!
Começar uma carreira não é nada fácil, especialmente no mundo dos negócios. Todos
os dias há empresas dando o seu pontapé inicial. Então, para conseguir se
[**destacar em meio a tanta competitividade**], além dos recursos financeiros,
muitos fatores são indispensáveis.
As startups não fogem a essa regra. É preciso apresentar boas ideias para
conquistar investidores e trabalhar muito para tirá-las do papel, transformando-as
em um produto que tenha valor no mercado.
Com a expansão dessas empresas de tecnologia nas últimas décadas e a necessidade de

impulsioná-las, surgiu um modelo de negócios inovador, capaz de acelerar os
resultados e,ao mesmo tempo, produzir com baixo custo: **o lean startup**.
Contudo, apesar de ser simplificada, visando associar a eficiência na produção com

a escassez de recursos, essa metodologia também conhecida como startup enxuta
requer bastante atenção para que não seja aplicada equivocadamente.
Por isso, neste post mostraremos como, mesmo com um método poderoso, ainda existe o
risco de fracassar. Continue lendo e confira os 5 maiores erros que podem ser
cometidos ao se aplicar o lean startup e saiba como evitá-los!
## 1\. Focar exclusivamente no plano de negócios
O plano de negócios é uma peça fundamental à concepção e desenvolvimento de uma

empresa. Contudo, ele engloba situações abstratas. Não há como prever se todos
aqueles fatores funcionarão da maneira esperada quando colocados em prática.
Segundo o renomado empreendedor [**Steve Blank**], nenhum plano de negócios resiste

à primeira interação com os clientes. Isso talvez explique o porquê de o método
lean startup vir sendo tão difundido no meio empresarial.
Por se tratar de um modelo democrático e dinâmico, as falhas são corrigidas com

base em informações concretas do público-alvo. **O propósito é simples: crescer com
o seu produto, à medida que as necessidades e dificuldades surgem.**
## 2\. Desenvolver um produto mínimo viável de baixa qualidade
Um aspecto que influencia diretamente no sucesso de qualquer produto é o feedback

obtido dos clientes. Afinal, qual opinião é mais importante senão a dos usuários,
das pessoas que realmente exploram de vários ângulos daquilo que estão consumindo?
No processo de criação, algumas hipóteses são levantadas para que se possa chegar à
conclusão de que o produto está apto a cumprir com o prometido. A intenção do lean
startup se baseia no conceito de que a maneira mais rápida e eficiente de encontrar
essas respostas é por meio do produto mínimo viável [**MVP**].
Entretanto, um erro fatal que o empreendedor pode cometer é acreditar que obterá as
respostas que precisa com um protótipo mal feito, que não expressa a real
necessidade daquele produto. Nesses casos, o intuito é economizar ao extrair o
máximo dos recursos.
## 3\. Fazer uma leitura equivocada sobre os indicadores do MVP
Quais cifras preciso alcançar para saber que o meu produto está comprovadamente
aceito?
Trata-se de um assunto para o qual não há uma resposta unânime. O que, para uns,
pode ser muito, talvez represente algo insignificante para outros. Tudo dependerá
de quais metas foram estabelecidas para a empresa, e quais objetivos ela pretende
alcançar.
Por esse motivo, ao lançar o projeto de teste, o empreendedor deve analisar os seus
resultados de forma cautelosa, tendo em vista que eles é que demonstrarão se você
está percorrendo o caminho certo, ou não. Em outras palavras, eles funcionarão como
um termômetro do seu produto no mercado.
## 4\. Desistir de forma precipitada não se enquadra ao lean startup
No momento em que as pessoas decidem empreender e começar um negócio, além de

buscarem por uma melhor [**capacitação profissional**], é natural que elas se
inspirem em outra trajetória de sucesso e queiram trazer alguns conceitos para o
seu caso concreto.
Só que não existe uma única fórmula a ser seguida por todas as empresas. Até
porque, essa é uma atividade que envolve riscos e, mesmo com uma estrutura bem
planejada, sempre haverá dificuldades a serem superadas.
Logo, a perseverança é uma qualidade essencial para quem deseja ser bem-sucedido.
Muitos têm a ideia equivocada de que, frente a primeira dificuldade, seja melhor
abandonar o projeto e partir para uma nova direção, a fim de evitar mais prejuízos.
Mas será que as grandes organizações ocupariam o lugar em que se encontram caso
tivessem desistido diante de um obstáculo?
De fato, aprender com os próprios erros faz parte do crescimento dos empresários.
E, nesse sentido, a utilização correta do lean startup lhe ajudará a encontrar o
melhor caminho. Com um MVP bem planejado fica muito mais fácil mapear suas
hipóteses e identificar eventuais falhas.
Portanto, em vez de abandonar o seu projeto porque algo deu errado, dedique-se ao
seu processo de elaboração, cumprindo todas as etapas do lean. Assim, suas chances
de conquistar as metas e, consequentemente, diminuir os riscos de prejuízo serão
bem maiores.
## 5\. Deixar de verificar continuamente a satisfação dos clientes
Por fim, outro descuido fatal na [**carreira de empreendedor**] é pensar que a fase
de desenvolvimento do seu produto com o cliente se restringe tão somente ao início
do negócio.
Vivemos em uma sociedade que está em constante transformação, e nenhuma criação é

perfeita o suficiente que não precise ser atualizada. A exemplo disso, temos a
história da startup [**Iridium**], criada pela empresa Motorola e alguns sócios, em
1991.
Baseada em um plano de negócios revolucionário, a proposta da empresa era

desenvolver um sistema de telefonia que tivesse cobertura até nos lugares mais
remotos do planeta terra.
O que aconteceu em seguida foi um investimento pesado em equipamentos capazes de

alimentar essa ideia e a falência da empresa, poucos meses após a realização da
primeira ligação. De fato, o grande erro cometido foi subestimar a interação com os
verdadeiros interessados.
Àquela época, a comunicação entre as pessoas em pequenas distâncias já era

complicada. O serviço, por sua vez, era caro e nem todos poderiam ter acesso a ele.
Logo, será que eles teriam necessidade de fazer uma ligação para alguém que
estivesse na selva, por exemplo? Os resultados falam por si só.
Bom, com tudo isso, podemos concluir que o crescimento de uma [**empresa de
tecnologia**] depende muito mais das experiências práticas vividas no dia a dia do
que da proposição de grandes ideias.
Nesse sentido, o empreendedor que conseguir captar a verdadeira essência do lean

startup e empregá-lo corretamente terá, sem dúvida, as maiores chances de sucesso.
Enfim, gostou do nosso post? Aprendeu um pouco sobre quais erros devemos evitar ao
aplicar o método de lean startup? Então, aproveite agora para compartilhar essas
informações nas suas redes sociais!
Na Alura, eu preciso do nome e da data de lançamento de um curso:
java
Porém, quando eu recebo a informação `dataDeLancamento` ela é passada em

**`String`**:
java
## Especificando o formatador
Para converter essa `dataRecebida` para a classe **`Date`** precisamos [definir o

formato esperado utilizando a classe `SimpleDateFormat`]:
java
Essa definição está especificando que esperamos uma data que contenha dia/mês/ano.
## Usando o formatador para converter para Date
Mas e para **converter de `String` para `Date`**? Utilizaremos o método

**`parse()`** do objeto `formato`:
java
Agora basta adicionar a data formatada para o objeto da classe `Curso`:
java
E se eu imprimir essa data? Qual resultado aparece?
java
Resultado:
java
## Imprimindo a data no formato desejado
Calma aí, não era isso que eu queria… Mesmo conseguindo converter uma `String` com
um formato específico para `Date` o resultado esperado será de um tipo `Date`. Para
que seja impresso o objeto data no formato dd/MM/yyyy usaremos o método `format()`
do objeto `formato`!
java
Resultado:
java
## Convertendo com a API Calendar
Ótimo! Conseguimos o resultado esperado. Para manter a compatibilidade com

bibliotecas antigas, e converter para `Calendar,` é fácil:
java
Resultado:
java
Mesmo sendo mais antigo, é importante compreender a existência da compatibilidade.
## Conheça as APIs do Java mais recentes para datas
A partir do **Java 8**, foi introduzida a classe **`LocalDate`** do pacote

**"java.time"**, o qual possui uma melhor abstração no tratamento de datas. Mas
como posso converter *String* para `LocalDate`?
java
Resultado:
java
Ops! Vamos lembrar que a impressão ainda é a padrão da classe, ou seja, da

`LocalDate`. Da mesma forma que fizemos com a classe `Date`, temos que utilizar o
objeto responsável pelo formato para imprimir a data conforme o esperado:
java
Resultado:
java
Como vimos, para lidar com a tarefa de conversão de datas, precisamos utilizar uma
classe responsável pelo formato que desejamos.
Pensando nisso tudo, o criador da Caelum, Paulo Silveira, resolveu criar um

[**curso de java 8**] e suas bibliotecas. Além disso, esse é um assunto amplamente
coberto nos cursos [presenciais de Java da Caelum] e na [**formação Java**] aqui na
Alura.
Você é um dos [**29 milhões de brasileiros que estão no LinkedIn**]? Se a sua

resposta é positiva, excelente! Temos boas dicas para você. Caso a sua resposta
seja negativa, acompanhe o conteúdo de hoje com o dobro de atenção.
Não é exagero: ter um perfil de alta qualidade no LinkedIn pode ser decisivo para
conseguir um emprego. Hoje em dia, muitas empresas nem olham mais para o currículo
tradicional, indo direto para essa rede social.
Sendo assim, é melhor criar um perfil turbinado, não é? Para ajudá-lo, preparamos
algumas dicas. Confira!
## Tenha uma boa foto de perfil no LinkedIn
Talvez você tenha o costume de tirar selfies e divulgar pelo mundo digital. Isso é
bom, porque dá a você uma certa intimidade com a câmera. Mas, para o LinkedIn, a
história é um pouco diferente.
A ideia é que, para uma rede social de trabalho, sua foto demonstre
profissionalismo. Para isso, evite retratos com elementos como perucas, óculos
engraçados ou caretas. Busque um fundo mais neutro e mostre mais o rosto — não é
necessária uma foto de corpo.
Não se esqueça de um detalhe muito importante: um belo sorriso, que seja sincero e
cativante. Nada de sorrisos amarelos e forçados, certo?
## Decida qual é o seu título profissional
Logo abaixo da foto, estará o seu título profissional. O que isso significa? Que
ali, no topo do perfil, estará descrito o seu cargo atual ou, então, a posição que
deseja ocupar.
Para isso, o importante é ser direto e usar palavras-chave relacionadas ao cargo.

Essa informação será fundamental para que possíveis contratantes o identifiquem
como a pessoa que estão procurando.
A propósito, para quem está trabalhando, é válido colocar no título o nome da

empresa. Portanto, a estrutura básica é a seguinte: cargo mais empresa.
Já para quem não está com um emprego no momento, a dica é evitar termos como
“desempregado” ou “em busca de uma oportunidade”, pois são verdadeiros repelentes
de contatos. Opte por incluir seu último cargo ou a área que [**estuda na
faculdade**].
## Faça um resumo primoroso
Na área de resumo você pode vender o seu peixe. Portanto, use esse espaço com
sabedoria e dedicação. Mas, o que escrever?
Trata-se de uma seção para se apresentar e contar um pouco sobre interesses,

conhecimentos, áreas de atuação e trabalhos. Você tem até 2 mil caracteres para
isso — ou seja, espaço suficiente.
Vale lembrar, porém, que autoelogios e excesso de adjetivos não pegam nada bem.
Busque originalidade e criatividade, mas não perca a humildade de vista.
Ainda temos mais uma dica, já que a ideia é que você seja encontrado por empresas e
outros contatos: use palavras-chave estrategicamente. Se a sua área é design, por
exemplo, empregue termos relacionados, como design web, [**UX design**], entre
outras.
## Relate com detalhes suas experiências
Essa é uma parte do perfil do LinkedIn que deixa muita gente com os cabelos em pé.
Isso porque paira uma dúvida quanto a ser mais objetivo ou detalhar mais as
experiências.
Já que a ideia é que você se mostre para a comunidade, quanto mais rico for o
conteúdo, melhor será. Logo, procure detalhar cada experiência profissional — sem
ser prolixo — com atividades realizadas, resultados alcançados, conhecimentos e
tudo o que ocorreu no período.
Para quem está em início de carreira, a dica é relatar sobre os estágios. Cite,
inclusive, os acadêmicos e voluntários, pois, para essa fase, tudo é importante.
## Adicione competências
Uma das áreas mais interessantes e simples do LinkedIn é a dedicada às

competências. Nessa parte, você deve adicionar diversas habilidades e, depois, suas
conexões poderão recomendar você por elas.
A dinâmica é muito simples: basta digitar uma palavra relacionada à sua área de
atuação no campo escrito “adicionar competência nova”. Ao digitar esse termo,
aparecerão outros relacionados.
Escolha aqueles que têm tudo a ver com sua pretensão (cerca de 10 opções). Pronto,
suas habilidades já estarão listadas! Legal, não é?
## Customize sua URL de perfil
Outra funcionalidade do LinkedIn que contribui para a criação de um perfil de alta

qualidade é a customização da URL. Isso mesmo: a plataforma permite que você tenha
um endereço próprio de perfil com o seu nome.
Essa possibilidade demonstra mais profissionalismo e deixa a sua página completa. A

alteração é simples — basta acessar a área de edição e criar a sua [**URL
amigável**].
## Participe de grupos do seu interesse
Há grupos para todas as áreas de interesse no LinkedIn. Participar deles é uma

forma de fazer networking, acompanhar atualizações de mercado e adquirir
conhecimento.
Procure pelos mais interessantes e faça parte. Procure interagir com os

participantes, envie perguntas e ajude os demais quando houver oportunidade. Além
dos benefícios já citados, pode ser que um recrutador o encontre por ali, o que
seria muito bom, concorda?
## Siga empresas e personalidades
Uma das vantagens do LinkedIn é a possibilidade de se conectar com organizações e

personalidades, como grandes empresários e especialistas de diversas áreas. Quanto
às empresas, essa é uma oportunidade de acompanhar suas novidades e, até mesmo, a
publicação de vagas que, em diversos casos, só ocorre nessa rede social.
Já em relação aos demais, é interessante seguir suas postagens, suas ideias e seus
pensamentos. Afinal, acompanhar quem é líder de mercado é sempre proveitoso, não é
mesmo?
## Atualize com frequência seu perfil no LinkedIn
Uma das vantagens de ter um currículo na internet é a agilidade na divulgação de

seus dados. Com apenas alguns cliques, todo mundo pode conhecer o seu perfil
profissional e, a partir daí, há a chance de boas oportunidades de trabalho
surgirem.
Mas, para que isso realmente aconteça, é preciso ficar de olho na atualização
frequente (não exatamente todos os dias, mas sempre que houver alguma alteração).
Informe qualquer mudança de cargo ou empresa, uma nova competência adquirida, um
curso recente e tudo o que possa acrescentar valor ao seu perfil.
Além disso, você pode postar atualizações, artigos interessantes, infográficos e

até mesmo o [**link do seu portfólio**] para manter mais proximidade com seus
seguidores. Lembre-se daquela máxima: quem não é visto não é lembrado. Pois é,
aparecer por lá de vez em quando ajudará na sua visibilidade.
Entretanto, tenha cuidado com as postagens, já que essa é uma rede profissional.
Nem cogite piadinhas ou assuntos que não acrescentam valor ao seu público. Tenha
muito cuidado com o que o vai postar. Entendido?
Gostou das nossas dicas para fazer o seu perfil no LinkedIn? Compartilhe este
conteúdo nas redes sociais inclusive no próprio LinkedIn e ajude seus amigos a
melhorarem a página deles!
No mercado de design, em 2016, muitas tendências apareceram e se fortaleceram:

o uso de gestures, o aumento da conectividade entre plataformas, uma preocupação
ainda maior com o UX e a interação, além de muitas influências do design no
marketing digital.
Mas 2016 já acabou. Bem, muita coisa está por vir. Algumas tendências que se
fortaleceram no último ano, continuarão ganhando força e, claro, muitas novidades
estão nesse novo horizonte! Neste artigo, vamos apresentar algumas previsões do
design que vão te ajudar a sair na frente neste novo ano.
## Cores para 2017
Desde 2000, a empresa [Pantone], mundialmente famosa pelo seu sistema de escala de
cores, anuncia qual será a cor do ano. Esse anúncio é muito importante, pois ele,
de certa forma, dita os tons a serem usados em várias áreas do design, como a moda,
o web design etc.
A cor de 2017 é a Verde Folhagem (Greenary, 15-0343). Essa cor foi escolhida devido
ao fortalecimento de movimentos relacionados ao meio ambiente, práticas naturais e
incentivos a hábitos saudáveis.
Juntamente com a Greenary, a tendência para este ano é uma paleta de cores com tons
da natureza, do verão e da primavera. Esses tons de cor são vivos e geram destaque,
sendo comumente utilizados na aplicação em layouts de flat ou material design. Uma
boa [**combinação dessas cores**] pode garantir uma atmosfera vibrante às
composições.
## Design responsivo categorizado
Atualmente, o [**design responsivo**] é uma técnica utilizada para que um mesmo

conteúdo possa ser exibido em diferentes tamanhos de tela sem que haja perda no
layout, desorganização do conteúdo e a necessidade de uma folha de estilo (CSS)
para cada resolução diferente. Um exemplo de design responsivo são os sites que se
adaptam automaticamente de acordo com a tela, como é o caso de computadores e
smartphones.
Porém, a tendência que está emergindo no mercado de design atualmente é outro tipo
de design responsivo. Além de responder a diferentes tipos de telas, o design irá
responder ao perfil do usuário. Baseado na idade, hábitos e preferências desse
usuário, os conteúdos serão mostrados da forma que lhe é mais atrativa. Atualmente
isso já acontece em relação a anúncios publicitários e algumas interfaces famosas
(como a do Netflix), mas agora se pensa em extrapolar essa área e fazer com que
diversos outros conteúdos sejam adaptáveis ao usuário.
## Design de interação
Em 2017, algumas práticas de design de interação que emergiram nos últimos

anos ganharão ainda mais força. Uma dessas práticas são as de micro e mini
interações em apps. Essas interações são pequenas ações que o usuário pode
executar, ou que são executadas como resposta a outras, dentro de aplicativos.
Hoje, aplicativos como Facebook e Instagram possuem uma extensa lista de recursos
que permitem uma grande quantidade de interações por parte do usuário. Sendo que
cada vez mais os apps conversam entre si, tais pequenas interações podem
possibilitar que o usuário leve uma ação de um programa ao ambiente de outro de
maneira natural.
Outra prática que vai se fortalecer neste ano são os gestures. Eles são interações
feitas através de gestos, em touch screens, que funcionam como um gatilho (ou
atalho) para alguma função específica, tanto dos sistemas
operacionais quanto de apps. Para a UX, estes gestos podem contribuir muito
positivamente, pois permitem que o usuário gaste menos tempo para acessar
determinada função, além de tornar a utilização de elementos, como menus e
transições, mais intuitiva.
## Haptic feedback
O haptic feedback, apesar do nome um pouco complicado, já está presente em diversos

aparelhos eletrônicos há alguns anos e será ainda mais presente em 2017. Um exemplo
usual do haptic feedback são os controles de videogame, que vibram conforme certa
situação de jogo. Essa resposta por meio de vibração é uma maneira de o design de
UX e de interação permitirem uma maior imersão no conteúdo,simular ou até
intensificar uma sensação, o que pode trazer um grande diferencial para seu
projeto.
Para entender um pouco melhor, existem dois tipos de haptic feedback:
### **Feedback tátil**
Esse tipo de resposta utiliza do tato do usuário para que, através do contato com
uma superfície, ele possa ter sensações de vibração, pressão, toque ou até textura.
Atualmente, vários aplicativos de teclado para celular permitem que o usuário
configure se ele deseja, e em qual intensidade, uma resposta por vibração ao tocar
em uma letra. Isso permite com que usuário tenha certeza de que ele acertou uma
letra, permitindo que ele possa digitar mais facilmente sem ter que olhar para o
teclado.
### **Feedback cinestésico**
Esse tipo de resposta utiliza de vários sentidos do usuário em conjunto para

simular uma sensação de peso ou tamanho. No mercado de design atual, onde as
tecnologias de VR também estão em ascensão, esse tipo de resposta é extremamente
funcional, pois permite que a imersão seja muito mais profunda.
## Design no marketing digital
Uma das formas mais efetivas de empresas conseguirem atingir seus públicos-alvo é
através do [marketing digital]. Hoje em dia, com o massivo uso das redes sociais e
smartphones, essa área do marketing ganha cada vez mais espaço, pois consegue
direcionar o conteúdo a determinado tipo de usuário.
Agora você pode estar se perguntando: “Ah, mas como o design entra nisso?”, e a
resposta é a seguinte: o design é um agente de diferenciação. Na seleção natural do
mercado, as empresas que investem mais no design aplicado ao marketing digital
obtêm mais resultados, pois conseguem atrair a atenção do usuário para seu anúncio.
Veja algumas formas de como um designer pode atuar nesse mercado:
### Identidade visual

Apesar de soar como básico, muitas empresas não entendem a importância da
identidade visual para o seu sucesso. Ela faz com que o usuário perceba uma marca
de forma individual, facilitando a associação de produtos e serviços à mesma.
Quando for projetar uma identidade visual, lembre-se sempre de que ela deve remeter
a valores que a empresa possua, condizendo com seu posicionamento no mercado.
### Web design
É essencial que uma empresa que invista em marketing digital tenha algum meio de
comunicação online. Apesar da ascensão das redes sociais, o principal deles ainda é
possuir um site independente.
Em conjunto com a identidade visual, o site de uma empresa é uma maneira rápida e
efetiva de um possível cliente saber mais sobre uma marca ou produto, até
mesmo podendo ser um canal de vendas da empresa. Nesse projeto o designer é peça
essencial, pois é o profissional mais hábil para transformar tais informações em
conteúdo visualmente adequado.
### Conteúdo para redes sociais
O gigantesco número de usuários em redes sociais atualmente as torna um ótimo canal

de marketing para as empresas, além de possibilitar um contato um pouco mais
pessoal com seus clientes. Porém, em redes sociais como Facebook e Twitter, o feed
possui uma grande quantidade de informações, e (novamente) o grande diferencial que
pode fazer um possível cliente parar seu scroll para ler um post é o [**conteúdo
visual**].
Capas para páginas, avatares e imagens para posts são apenas alguns dos conteúdos
que um designer pode atuar para promover o marketing digital nesse ambiente, e a
demanda das empresas por uma maior qualidade cresce diariamente.
### E-mail marketing
Apesar de ser uma ferramenta antiga de marketing digital, o e-mail marketing está
voltando com tudo. O aprimoramento das ferramentas de análise de conteúdo
atualmente permite com que uma empresa saiba qual foi a efetividade que um e-mail
marketing teve em uma determinada campanha.
O designer desenvolve dois tipos de e-mail para mesma campanha, com elementos
visuais diferentes, e, ao fim da campanha, poderá saber qual obteve mais retorno,
assim podendo moldar a próxima geração de conteúdo.
## Mãos à obra, designer!
Com essas dicas sobre o mercado de design em 2017, você pode capacitar-se ainda
mais para sua atuação. Se você quer começar a trabalhar como freelancer nessa área
ainda esse ano, dê uma olhada [**neste artigo**] para saber sobre onde conseguir
jobs, além de muitas outras dicas.
Não deixe de nos seguir nas redes sociais para manter-se atualizado sobre as
tendências do design neste ano!
Estou realizando os testes de uma aplicação de loja virtual. Os testes, garantem o

funcionamento do carrinho de compras
Os métodos de testes estão dentro da classe `TestCarrinhoDeCompras` e cada método

testa um caso das regras de negócios relacionadas às compras. A classe está
disposta dessa forma:
python
Os testes estão passando, mas o que tem de estranho nessa classe? Temos muito
código repetido!
## Copiou e colou, copiou e colou, isolou
Aqui na Caelum, tenho uma amiga que sempre fala: Copiou e colou, copiou e colou,
isolou! O mesmo trecho de código espalhado pelo sistema prejudica a manutenção do
código.
Caso o maneira de criar um carrinho de compras mude, ou então a maneira de se criar

usuário, precisaremos alterar todos os testes que criam o usuário. Sabemos que
isolar os trechos repetidos é uma forma de evitar essa repetição:
python
Dessa forma, podemos invocar essa função cada vez que precisarmos de um usuário:
python
Os testes continuam passando, mas, para quem está acostumado com testes, ou já usou
outros frameworks de testes, sabe que existe outra forma de criar os cenários para
os testes.
## Conhecendo as fixtures
Podemos dividir os testes em, basicamente, três partes: o cenário - aquilo que o
teste precisa para ser executado -, a parte da execução do caso de uso e a asserção
- a validação do resultado da execução e do resultado esperado.
Em muitos testes, o cenário é o mesmo! Ou seja, grande parte dos testes utilizam o
mesmo cenário para rodar. No nosso caso, o `CarrinhoDeCompras`, o Ùsuario` e os
itens são utilizados em todos os testes.
Podemos isolar a criação desses objetos. Dessa forma, reutilizamos eles em outros
pontos da aplicação.
Na biblioteca ùnittest`, já deve conhecer o método `setUp()`. Este método, que é

herdado da classe `TestCase`, permite que criemos cenários de testes.
No caso, estamos utilizando a `pytest` e não herdamos de nenhuma classe, ou seja,

não temos um método para sobrescrever. O que podemos fazer então?
Vamos quebrar esse problema em partes. A primeira coisa que queremos é isolar a
criação de um objeto, por exemplo, de um usuário:
python
Bacana! Já temos a função que cria um usuário para os testes. Como fazer a `pytest`
invocar essa função para rodar os testes?
O cenário de um testes, também é conhecido como `fixture`. Logo, precisamos falar

que esse trecho de código é uma fixture da `pytest`
python
Legal! Agora só precisamos falar quais os testes que precisa desse objeto, fazemos
isso passando o nome da função como parâmetro do método de teste:
python
Os testes continuam passando. Vamos criar as `fixtures` para os outros objetos

também:
python
Agora, só precisamos receber como parâmetro dos métodos:
python
Os testes continuam passando, mas o que exatamente está acontecendo?
## Entendendo as fixtures
Quando decoramos uma função, ou método, com `@pytest.fixture`, por padrão, essa
função é executada antes de cada método de teste que precise dela. Ou seja, para
cada vez que o teste é rodado, um novo objeto é instanciado na memória e é
utilizado por aquele teste.
Esse comportamento é declarado pelo parâmetro `scope` que por padrão recebe o valor
`’function’`, indicando que antes de cada função de teste, essa fixure é executada.
Logo, decorar o método com `@pytest.fixture` é a mesma coisa de
`@pytest.fixture(scope=’function’)`:
python
Em alguns casos, na maioria deles na verdade, é legal que as fixtures sejam

executadas antes de cada teste. Assim, temos um cenário limpo, sem efeitos
colaterais de outros testes.
Porém, algumas vezes criar as fixtures podem ser custosas para o sistema. Vamos
imaginar que temos uma conexão com o banco de dados. Abrir a conexão antes de cada
teste é custoso. Neste caso, o que podemos fazer é abrir a conexão no começo do
módulo de testes e só fechá-la ao final.
Conexão com o banco de dados, com um serviço de e-mails, com um serviço externo, ou
até mesmo, um objeto que tem um valor imutável. São exemplos de objetos que podemos
criar uma única vez e ir reutilizando nos testes.
Por exemplo, o objeto ùsuario` não altera estado, ele é apenas passado no
construtor do carrinho de compras. Ou seja, se quisermos, podemos alterar seu
escopo, mas qual escopo colocar?
Existem diversos escopos que a `pytest` disponibiliza para nós utilizarmos. Nesse
caso, temos apenas uma classe de teste no módulo, o que é bem comum, logo, podemos
fazer que esse objeto seja instanciado apenas uma vez na classe, podemos fazer
isso, alterando o escopo para `class`:
python
Dessa forma, o objeto é instanciado uma única vez, logo que a classe de testes é
instanciada, e sua instância é compartilhada com os métodos.
É importante notar que como a instância é compartilhada entre os métodos, é

importante **tomar cuidado com efeitos colaterais**. Por exemplo, se colocarmos o
escopo do carrinho como `class`, apenas o primeiro teste que é executado passa, já
que o carrinho está vazio, enquanto os outros testes falham.
imagem e de classe (`‘class’`), existem também os escopos de módulo (`’module’`),

sessão (`’session’`) e pacote (`’package’`) - este último, até a data de escrita
desse post, é considerado experimental.
Cada um deles carrega o objeto em alguma fase. O escopo de módulo instancia um

objeto no começo do módulo de testes, ou seja, no arquivo de testes.
O de sessão se encarrega de instanciar o objeto no começo da sessão de testes (mais

de um módulo de testes, por exemplo), já o de pacote, instancia o objeto quando o
pacote de testes - o diretório -, ou um subpacote, é carregado.
Além de criar objetos, quando trabalhamos com escopos é comum termos que nos
preocupar sobre como esses objetos são destruídos. Quando abrimos a conexão com o
banco, ou com um serviço de e-mail, temos que assegurar que a fecharemos. Isso é
chamado de `tear_down` no mundo de testes.
Conseguimos realizar isso com a `pytest` da seguinte forma. Vamos pegar um código
que realiza uma conexão com um serviço de e-mail:
python
Podemos falar para o Python que não queremos retornar a conexão imediatamente, mas
só quando ela for realmente necessária, ou seja, podemos transformar essa função em
uma [**função geradora**].
python
Após gerar esse objeto, podemos falar para a função fechar a conexão:
python
As fixtures são um dos recursos mais importantes que existem na `pytest`. Para cada
situação, podemos utilizar uma estratégia diferente. Por isso, uma coisa que é
sempre bacana a gente fazer é [**dar uma olhada na documentação**] para ver como a
biblioteca pode melhor nos atender.
Se você quiser [**saber mais sobre Python, aqui na Alura temos diversos cursos
sobre a linguagem**]. Desde o básico, até recursos **avançados de orientação a
objetos, sistemas para a web com Django ou Flask, padrões de projeto e muito
mais**.
Vamos entender como implementar desde o design à lógica por de trás dos panos da
criação de uma **tela de abertura no Android (Splash Screen)** de uma App que eu
estou desenvolvendo para a Alura.
imagem
Recentemente, adicionei uma tela para autenticação nessa App, onde armazeno os
cursos que realizei:
imagem`**, e por fim, chamamos a **`LoginActivity`** que representa a tela de

login.
Então vamos implementar o código:
java
Rodando a App temos o seguinte resultado:
imagem**]) que recebe dois parâmetros:
- **1º parâmetro**: uma interface `Runnable` que é justamente a `Thread` que será
executada após o tempo de delay.
- **2º parâmetro**: tempo de delay em millisegundos.
Então o nosso código fica da seguinte forma:
java
Pronto! Criamos a nossa thread que rodará com um delay. Portanto, vamos executar a
App novamente e verificar o resultado:
![splash_com_delay]
Maravilha! Agora está funcionando conforme esperado. Entretanto, observe que a

nossa splash screen ainda exibe o horário, notificações e am[**ActionBar**]. Em
outras palavras, seria legal se a nossa splash screen fosse full screen, ou seja,
tela cheia, por exemplo:
![splash_fullscreen]
Como será que podemos fazer isso?
## Ajustando o tema para tela cheia
No arquivo **ÀndroidManifest.xml`**, podemos definir temas para cada Àctivity`

por meio do atributo **àndroid:theme`**. Existem diversos temas disponíveis,
porém, nesse caso, utilizaremos um **tema existente** chamado
`Theme.AppCompat.NoActionBar`:
xml
Poderíamos utilizar outros temas para tirar a ÀctionBar`, mas porque utilizamos
esse em específico? É justamente pelo motivo de estarmos estendendo da classe
ÀppCompatActivity`
Vejamos o resultado:
![splash_sem_actionbar]
## Melhorando o visual da Splash Screen
Já melhorou bastante comparando com o resultado anterior, porém, ainda não está em
full screen... E agora? Como podemos fazer isso mantendo a ÀppCompatActivity`?
Podemos criar um tema personalizado no arquivo `res > values > styles.xml`:
xml
Então vamos criar um tema nosso chamado ÀppCompat.TelaCheia` :
xml
Criamos o tema, mas e agora? O que podemos fazer?
Precisamos utilizar as mesmas propriedades do tema `Theme.AppCompat.NoActionBar`,

porém, com uma configuração extra para deixar full screen. Será que é possível?
Da mesma forma que fazemos com as classes do Java, podemos estender de temas já
existentes! Como, por exemplo, fazer com que o nosso ÀppCompat.TelaCheia` herde do
`Theme.AppCompat.NoActionBar` a partir do atributo `parent`:
xml
Então, adicionamos o item necessário para deixar full screen, que é o

àndroid:windowFullscreen`:
xml
Por fim, basta apenas utilizarmos esse tema para a nossa `SplashScreenActivity`:
xml
Vamos rodar a nossa App e verificar o resultado:
![splash_full_screen]
Bem mais bonito né? E aí? Gostou de criar uma splash screen?
Que tal aprender a desenvolver a sua App Android desde o zero? Aqui na Alura, temos
uma [**formação Android**] onde ensinamos você a desenvolver sua primeira App com
os principais conceitos do início ao fim.
imagem
Se te perguntassem hoje todas as mulheres ícone que você conhece na história da

humanidade, quantas conseguiria lembrar? E dentro da sua área profissional?
Muitas pessoas (até mesmo eu) poderiam acabar lembrando de alguns poucos nomes…
Ao longo da história acabamos dando pouca evidência às grandes conquistas femininas

e passamos batido por uma série de eventos muito interessantes.
Por isso, dia 8 de março homenageamos as mulheres de todo o mundo, trazendo algumas
informações bem legais.
Mas, já se perguntou por que celebramos esse dia?
## O Dia Internacional da Mulher
Existem algumas hipóteses sobre a origem da escolha para o dia 8 de março como Dia
Internacional da Mulher, mas, basicamente, podemos dizer que esse dia foi um marco
instituído pelas diversas reivindicações feitas por mulheres no século XX.
Esse foi um período de intensa industrialização e as mulheres começaram a

participar ativamente dessas novas atividades, trabalhando em grandes indústrias
com intensas jornadas e péssimas condições de trabalho.
Passaram então a reivindicar seus direitos trabalhistas, assim como diversos outros
movimentos na época, através de greves e outras manifestações.
Só na década de 1970 a ONU oficializou a data e, dali pra frente, diversas

celebrações começaram a acontecer anualmente.
E, se formos olhar a fundo pelas diversas coisas que encontramos da participação

feminina na história, podemos destacar algumas pessoas que marcaram grandes feitos.
## Personalidades femininas na história
Nas diversas áreas temos a participação de mulheres que trouxeram sua presença de
forma muito significativa.
Especialmente hoje, [**a Alura preparou um visual diferente para a página

inicial**] da plataforma, com algumas dessas mulheres que revolucionaram na área de
TI.
Temos, por exemplo, alguns nomes como **Margareth Hamilton**, que desenvolveu o
programa de voo usado no projeto Apollo 11, software que impediu que o pouso na Lua
fosse abortado por falha humana, assim como **Dorothy Vaughan**, liderando a seção
de programação da Divisão de Análise e Computação do Langley Research Center
(NASA).
imagem
Mas ainda podemos falar um pouco de alguns nomes muito relevantes em outras áreas,
como em UX, com **Elizabeth Churchill**, diretora de User Experience na Google,
trabalhando com HCI (Human-Computer Interaction), **Paula Scher**, na parte de
Design Gráfico, uma das mais influentes designers no mundo atualmente,
especializada em tipografia.
imagem
E veja também outras homenagens super legais que tivemos por aí, como a websérie
[**Vida de programadora**], com o primeiro episódio aqui:
https://www.youtube.com/watch?v=Usnp2ht_Upg
É muito comum no nosso dia a dia, como desenvolvedores, lidarmos com códigos
escritos por outros desenvolvedores, seja para compreender uma regra de negócio
como também para a evolução do programa de modo geral.
Para compreendermos melhor essa situação, vamos considerar uma aplicação Java para
um estoque de produtos. Nessa aplicação temos o seguinte código:
java
Observe que se trata de uma classe [**DAO**] para produtos. Para esclarecer mais o
exemplo, vamos considerar o seguinte model para a classe `Produto`:
java
Ao executarmos o método `produtosResumido()` temos o seguinte resultado:

java
Observando o resultado, temos um resumo dos produtos salvos no estoque. Porém,

olhando rapidamente a implementação do método `produtosResumido()` é fácil
compreender que esse resultado seria apresentado? A princípio, não...
## Entendendo a refatoração de código
Em outras palavras, observe que entramos em uma situação na qual faz todo o sentido
parar e pensar em maneiras para melhorar o nosso código atual, certo?
Esse processo de melhoria de código é conhecido tecnicamente como _code

refactoring_, ou em português, refatoração de código.
Essa técnica, de modo geral, é constituída por diversas práticas que visam a
melhoria no código nos seguintes pontos:
- **Simplicidade**: minimizar a quantidade do código.

- **Legibilidade**: melhorar a leitura do código para nós humanos.
- **Performance**: aumentar a velocidade de execução.
A princípio você pode estar pensando:
> **_"Refatoração é bem bacana, mas se eu fizer isso estarei modificando o

comportamento da minha aplicação!"_**
A primeira impressão que temos durante esse tipo de processo é imaginar que a nossa
aplicação vai ser modificada e vai apresentar comportamentos diferentes!
Isso é bem comum mesmo, porém, a ideia da refatoração é **aplicar técnicas que
modificam apenas o aspecto visual do código**, ou seja, o comportamento inicial
ainda é mantido!
Parece muito bom pra ser verdade, né? Sendo assim, vamos aplicar algumas técnicas
de refatoração no código que vimos inicialmente e veremos a mágica acontecer!
## Renomeando variáveis
A primeira das técnicas que iremos aplicar será a renomeação das variáveis. A
princípio parece besteira, porém, vamos dar uma olhada em um trecho do nosso
código:
java
Pra você, `psr`, `p`, `dse` possuem algum significado? Pra mim e para qualquer
pessoa que vai ver esse código pela primeira vez, não tem significado algum olhando
à primeira vista, então que tal fazermos a seguinte modificação:
java
Veja que agora é nítido que estamos lidando com umas lista de `produtos`, e para
cada `produto` de `produtos` estamos pegando uma `descricaoSemEspaco`.
Note que até pra ler fica mais fácil! Em outras palavras, durante o processo de
refatoração, renomear variáveis facilita a leitura do código. Portanto, quanto mais
significativo for o nome da variável, mais fácil será a leitura. Vamos ajustar nos
demais pontos:
java
Observe que ainda foi mantida a variável `sb` referente à instância da classe
`StringBuilder`. Por ser uma instância de uma classe compreendida pela maioria dos
desenvolvedores e por não ter um nome tão enxuto, não há problema em deixar como
`sb`.
Em outras palavras, para casos em que estamos fazendo uma instância de uma classe
com um nome grande podemos usar uma abreviação. Nesse caso do `StringBuilder`
poderíamos até mesmo usar o `builder` que ele teria significado o suficiente.
> **Lembre-se**: Durante esse processo de renomear as variáveis, o mais importante

é que no momento que for ler o código seja feita uma leitura fácil e objetiva, ou
seja, mesmo para quem não conheça tanto da implementação compreenda apenas lendo.
## Extração de método
Embora o nosso código tenha melhorado significamente a leitura, isto é, com nomes
mais claros para nós humanos, ainda sim ele está um tanto quanto complexo. Se
observarmos, temos uma boa quantidade de linhas dentro de apenas um único método!
Levando em conta essa situação, o que podemos fazer para resolver esse detalhe?
Para esse tipo de cenário, podemos aplicar a técnica conhecida como extração de
código. Agora você deve estar pensando:
> **_"Legal, mas como funciona essa técnica?"_**
Basicamente, durante a leitura do código, fazemos uma análise e verificamos o que

um conjunto de código faz, como por exemplo esse trecho:
java
Se observarmos com bastante atenção, todo esse código tem como objetivo **ajustar
uma descrição de um produto**, certo? Então, que tal transformarmos todo esse
código nesse método aqui?
java
Então basta apenas realizarmos a seguinte chamada dentro do nosso código anterior:
java
Veja como o nosso método diminuiu! Fica até mais fácil de ler dessa maneira,
podemos até mesmo fazer isso para outros pontos do código. Por exemplo este aqui:
java
Basicamente o código à direita formata o valor de acordo com a moeda, certo? Nesse
caso nada nos impede de extrair um método aqui também, que tal deixarmos assim:
java
Aproveitando, podemos também aplicar o mesmo conceito no trecho de código em

seguida:
java
Vamos extrair para:
java
Agora vamos ver como fica aquele nosso método inicial:
java
Bem mais fácil de ler, certo? Podemos facilitar mais ainda, ou seja, ao invés de
enviar 3 parâmetros para criar a descrição final, podemos enviar apenas o produto e
chamar os demais método dentro do método `resumeDescricao()`:
java
Veja o quanto o nosso código modificou:
java
Agora o nosso método `produtosResumidos()` ficou bem mais fácil de compreender,

sabemos logo de cara que ele passa por cada um dos produtos, pega uma
`descricaoFinal` e faz uma impressão da mesma.
## Conclusão
Veja que mesmo o código parecendo complexo apenas aplicando algumas técnicas de
refatoração fomos capazes de melhorar e muito o aspecto de leitura e compreensão do
nosso código, no caso, vimos a técnica de extração de método e renomeação de
variáveis para nomes mais amigáveis.
Quer aprender mais técnicas de refatoração? Então dê uma olhada no nosso curso de
[**refatoração na prática com Java**] no qual aborda tanto as técnicas que vimos no
post como também algumas outras que fazem uma grande diferença nesse processo de
melhoria de código.
imagem
Dê uns tempos para cá, fazer testes em software se tornou popular e trouxe uma
série de benefícios que evitam erros bobos para quem está desenvolvendo projetos e
não quer deixar passar nada que atrase a entrega.
Neste episódio do Alura Live, o host Gabs Ferreira recebeu Fernando Daciuk, uma
fera do desenvolvimento JavaScript pra falar mais sobre esses testes e que
benefícios podem te trazer.
https://www.youtube.com/watch?v=r1rndQwFLMY
Tá afim de saber um pouco mais sobre o assunto? Assista esta [live completa!]
- Dê seus primeiros passos com JavaScript: [**Lógica de programação I**]: Os

primeiros programas com JavaScript e HTML.
- Faça testes automatizados com Jasmine: [**Jasmine:**] Testes automatizados em

JavaScript.
- Veja outros cursos do mundo web: [Meteor:] Crie single page applications com
JavaScript. [React Native parte 1:] Criando apps nativas com JavaScript e React.
- Faça [**Formação Front-End**]

Não deixe de nos seguir Twitter: [Gabriel Ferreira], [Fernando Daciuk] e a
[Alurinha]! ;)
Com o desenvolvimento das técnicas de administração e gestão, quem começa uma

startup pode ficar perdido em meio a tantas inovações. No entanto, com tantas
teorias, é essencial [**separar o joio do trigo**], uma vez que algumas ideias são
simplesmente estéreis. Isto é, carecem de qualquer aplicação ou benefício
comprovados na prática. Felizmente, esse não é o caso do lean startup!
Seus princípios são bastante simples: o excesso de desenvolvimento leva à

desmotivação da equipe e a produtos caros, ao passo que um **desenvolvimento rápido
e simples** pode lançá-los rapidamente para alguns consumidores. Desse modo, você
obtém informações reais sobre a aplicabilidade do seu conceito.
Acima de tudo, substitui-se o excesso de gestão que tem atingido a todas as

empresas pelo aprendizado consolidado pela experiência. Se você quer entender mais
sobre esse assunto, então nosso texto será uma excelente introdução, confira:
## Entendendo o lean startup
**A Lean startup é uma metodologia para o desenvolvimento de negócios e produtos.

Assim, ela visa encurtar os ciclos de desenvolvimento de produtos**. Para isso,
adota uma combinação de experimentação e inovação embasada em hipóteses
empresariais, lançamentos de produtos iterativos e aprendizado consolidado nas
experiências.
A hipótese central é que, se as empresas iniciantes investem tempo em produtos ou

serviços de forma iterativa para atender às necessidades dos clientes iniciais, são
reduzidos os riscos de mercado, não havendo a necessidade de grandes montantes de
financiamento inicial e de lançamento de produtos caros e pouco competitivos.
Para atingir esse objetivo, ela utiliza as seguintes estratégias:
### Produto mínimo viável
**Um produto mínimo viável MVP (do inglês, Minimum Viable Product)** é um
protótipo de um novo produto cujo objetivo é auxiliar a equipe a coletar o máximo
de aprendizado sobre a reação dos clientes com o menor esforço possível. Então, em
vez de ficar anos elaborando um projeto complexo e de difícil implementação, a
empresa deve criar um produto que:
- contenha os conceitos básicos do produto final imaginado pelos empreendedores;

- esteja dentro dos princípios e da mudança que eles desejam criar no mundo;
- tenha resultados testáveis;
- tenha o mínimo de custo para que o foco seja dado no desenvolvimento dos
conceitos ao longo dos testes;
- não exija um esforço que desgaste e desanime a equipe antes de o produto começar
a sair do papel.
Como exemplo, o inventor desse conceito, Ries, observou o fundador da [Zappos],

Nick Swinmurn. Ele queria testar a hipótese de que os clientes estavam prontos e
dispostos a comprar sapatos online, o que hoje é óbvio — mas na década de 1990 nem
tanto.
Para isso, em vez de construir um site e um grande banco de dados de calçados,

Swinmurn aproximou-se de lojas de sapatos locais, tirou fotos de seu inventário,
postou elas em um site. Então, comprou os sapatos das lojas a preço de
varejo e, depois de fazer uma venda, os enviou diretamente para os clientes.
Com isso, Swinmurn deduziu que seu conceito hipotético estava correto —
havia demanda dos clientes. Desse modo, a Zappos acabaria crescendo em um negócio
bilionário baseado no modelo de venda de sapatos online nos EUA.
### Teste A/B
**Um teste split ou A/B** é um experimento em que diferentes versões de um produto

são oferecidas a dois grupos de clientes ao mesmo tempo. O objetivo é observar
diferenças de comportamento entre os dois grupos e medir o impacto de cada versão
em uma métrica de impacto para o negócio.
Os testes A/B também podem ser realizados em sequência: um grupo de usuários, em

uma semana, pode ver uma versão do produto ao passo que, na semana seguinte, os
mesmos usuários veem outro.
Essa última metodologia, apesar de mais simples, pode ser menos eficaz pois há
circunstâncias em que eventos externos podem influenciar o comportamento do usuário
em um período de tempo, mas, em outro, não.
### Métricas úteis
As métricas úteis podem levar a decisões de negócios mais bem informadas uma vez
que utilizam informações que realmente são estratégicas para a startup, aumentando
a chance de sucesso das ações subsequentes.
Elas se contrapõem às métricas de vaidade — cujo objetivo é florear a imagem do

negócio, mas que, na verdade, não refletem com precisão os principais fatores que
mensuram o êxito da startup.
Um exemplo típico de uma métrica de vaidade é "o número de novos usuários ganhos
por dia". Embora um número elevado de usuários ganhos por dia pareça benéfico para
qualquer empresa, sua utilidade real pode variar.
Por exemplo, em uma empresa cujos lucros vêm dos anúncios publicitários, essa
métrica é muito útil visto que aumenta a visibilidade dos anúncios.
Por outro lado, em uma empresa de varejo que necessita da conversão desses usuários
em clientes, a métrica pode ser inadequada. Essa startup precisaria de uma métrica
útil, como "taxa de conversão de visitantes do website em clientes".
Então, neste caso, se nos preocuparmos somente com o número de novos visitantes,
estamos nos apegando à vaidade. Afinal, a startup pode ter uma ótima estratégia de
atração de usuários, mas uma péssima estratégia de conversão de clientes.
Portanto, tudo depende da empresa e da situação. Não existe preto e branco nesses
casos. O valor de uma métrica pode parecer muito bom, mas, se ela não traz
benefícios claros para uma empresa, é melhor abandoná-la.
### Pivô
Um pivô é uma correção de curso estruturada para testar uma nova hipótese
fundamental sobre o produto, estratégia e mecanismo de crescimento. Um exemplo
notável de uma empresa que emprega o pivô é o [**Groupon**]: quando a empresa
começou, era uma plataforma de ativismo social online chamada The Point.
Depois de receber quase nenhum impacto, os fundadores abriram um blog WordPress e
lançaram sua primeira promoção de cupom para uma pizzaria localizada no edifício em
que mantinham seu escritório. Embora só tenham sido feitas 20 compras, os
fundadores perceberam que a ideia era boa e capaz de mobilizar grupos de pessoas
para as promoções. Três anos mais tarde, o Groupon se tornou um negócio de bilhões
de dólares.
Steve Blank — um dos expoentes do lean startup — define um pivô como mudar o plano
em vez do executivo (o executivo de vendas, [**marketing**] ou mesmo o CEO). Assim,
em vez de atribuir culpas, olhamos para o projeto e definimos se há realmente
alguma falha de conceito.
### Contabilidade da inovação
Esse ponto enfoca como os empreendedores podem manter a responsabilidade

empresarial e maximizar os resultados, medindo constantemente o progresso e os
marcos de planejamento. Com isso, é possível investir no que realmente traz retorno
para a empresa, seja do ponto de vista financeiro, seja do pessoal.
### Construa – mensure – aprenda
**O construa – mensure – aprenda** enfatiza a velocidade de um ingrediente crítico

para o desenvolvimento de produtos. A eficácia da equipe ou da empresa é
determinada pela sua capacidade de idealizar, construir rapidamente um produto
minimamente viável, medir sua eficácia no mercado e aprender com essa experiência.
Em outras palavras, é um ciclo criado para transformar ideias em produtos, medir as

reações e os comportamentos dos clientes contra e, em seguida, decidir se deseja
insistir ou descarta a ideia. Esse ciclo se repete quantas vezes forem necessárias,
sempre com os seguintes passos:
**Ideias → Construir → Produto → Medir → Dados → Aprender**
Essa rápida iteração permite que as equipes descubram um caminho viável para o
ajuste do produto/mercado e continuem a otimizar e a aperfeiçoar o modelo de
negócios depois de alcançar o sucesso.
### Business Model Canvas
O [**Business Model Canvas**] é um modelo de gestão estratégica inventado para

desenvolver novos modelos de negócios e também para documentar e otimizar os
já existentes. É um gráfico visual com elementos que descrevem o valor real da
empresa: infraestrutura, oferta, clientes, finanças e recursos.
Mais detalhes podem ser obtidos no [**excelente modelo desenvolvido pelo SEBRAE**].
## Lean startup e design thinking
Entre os especialistas nesses dois modelos de produção para startup, há sempre a

contraposição do [**design thinking**] com o lean startup. Essa "rivalidade", no
entanto, pode criar algo bastante negativo: presa aos dogmas de uma delas, as
startups podem acabar perdendo as vantagens que a outra apresenta.
Por isso, vamos mostrar como cada uma pode complementar a outra:
### Corrigindo os excessos do pivô
A prática do lean startup pode ser mal interpretada, de modo que os empreendedores
que a adotam percam o foco do seu negócio. Desse modo, no meio do processo de
crescimento da empresa, foram tomadas tantas correções de rumo que os envolvidos
começam a se perguntar: foi por isso que eu comecei esse negócio?
Tendo isso em vista, pode ser muito útil usar o Design Thinking para elaborar
minimamente o caminho que a startup vai tomar. Diante de um desafio realmente
interessante para a empresa, em vez de mudar de rumos, que tal todo mundo se
reunir em uma sessão de brainstorm moldada pelo Design Thinking?
Nela, não colocamos amarras na nossa imaginação! Qualquer ideia — por mais maluca
que seja — pode ser sugerida. Depois de um tempo, é só reunir todas essas
informações e extrair o que tem de interessante em cada uma das ideias da equipe.
Se uma solução inteligente surgir, talvez não seja necessário adotar o "pivô" nesse
momento.
### Desenvolvendo um pensamento voltado a soluções de problemas
Frequentemente, reuniões têm se tornado um espaço de criação de problemas em vez de

soluções. Com o Design Thinking, a tomada de decisão pode ser melhor orientada: sua
equipe vai tentar pensar criativamente em soluções para os problemas atuais.
Sobretudo, não é hora de pensar em limitações.
Assim, todos os colaboradores e envolvidos se sentirão constantemente instigados a

pensar cada vez mais fora da caixa.
### Trazendo empatia para o lean startup
Um dos principais pontos do Design Thinking é o desenvolvimento da empatia. Durante

cada etapa do processo, a equipe se desafiará a pensar: como meu cliente deve se
sentir? O que ele vai pensar do produto? Como atingirei as suas dores?
O foco sai do produto e é direcionado para o próprio usuário. Afinal, não importa
se você incorporou a última tecnologia disponível, sendo que ela não melhora algum
aspecto importante da vida das pessoas para quem as suas soluções são voltadas.
## Vantagens do uso do lean startup
Com as estratégias citadas acima, sua startup pode ser elevada a um outro patamar e
assim, destacar-se da concorrência. Infelizmente, no mercado de startups
brasileiras, muitas têm começado sem adotar o modelo rápido e eficiente das
startups. São simplesmente empresas tradicionais iniciantes que se autointitulam
"startups".
Para realmente ser uma startup, é preciso adotar as estratégias e o modelo que
explicamos ao longo deste conteúdo. Desse modo, você pode otimizar ao máximo o
capital e o tempo, diferenciando-se dos seus concorrentes. Por isso, fizemos um
breve resumo das maiores vantagens do uso da metodologia do _lean startup_:
### Você está mais perto de seus clientes
Como uma startup, você tem as enormes vantagens de ter acesso mais direto à entrada
de seus clientes, tendo ainda a capacidade de implementar mudanças muito mais
rápida e eficientemente.
Essa é uma vantagem que a maioria das grandes empresas gostariam de ter, pois não
estão mais na fase inicial. Nesse sentido, veja a seguir algumas maneiras de
aproveitar ao máximo a proximidade com os seus clientes:
- exponha todos os seus funcionários aos seus clientes;

- estabeleça laços de feedback entre o setor de vendas e o resto de suas equipes;
- estude suas interações com o serviço de atendimento ao cliente;
- monitore as interações sociais;
- entre em contato com seus clientes (ou melhor ainda, conheça-os pessoalmente);
- faça a mineração de seus dados na web;
- incorpore a coleta de dados diretamente a seu produto;
- torne os comentários dos clientes altamente visíveis em toda a organização.
### Qualquer ganho é extremamente excitante
Agilidade não é uma característica muito comum de grandes empresas. Normalmente,

quanto maior a organização, mais dependente e burocrática ela se torna em relação
às estruturas e aos processos previamente estabelecidos.
Há mais etapas em cada decisão, as linhas de comunicação se tornam cada vez

menos diretas e eficientes, e o pior de tudo: há uma dose maciça de uma das maiores
inimigas da produtividade — as reuniões. Como resultado, horizontes de planejamento
tendem a se estender por anos, em vez de dias, semanas ou meses, como felizmente
acontece na sua startup.
Confira, então, quais são as dicas para explorar essa vantagem:
- escolha um mercado de produtos que esteja evoluindo rapidamente ou tenha

necessidades ou gostos dinâmicos;
- escolha um mercado de produtos que tenha um potencial de inovação significativo a
longo prazo;
- construa seu mercado antes que as grandes empresas saibam o que as atingiu;
- use tecnologias novas e inovadoras assim como modelos de negócios modernos;
- evolua rapidamente todos os aspectos do seu negócio.
### Você pode iniciar com um foco intenso em determinado nicho de mercado
Grandes empresas têm um problema complicado com o foco. Geralmente, elas têm de

aumentar seu escopo para sustentar o crescimento, desenvolvendo produtos voltados
para inúmeros segmentos de clientes e usando muitas abordagens de divulgação.
Portanto, mesmo que elas tenham mais recursos, elas precisam distribuir esses
recursos por uma variedade maior de mercados.
Em comparação, você pode dedicar tudo o que você tem para focar em um segmento-alvo
muito específico. Isso lhe dá uma vantagem poderosa. Não só você pode desenvolver
uma compreensão mais rica em profundidade dos seus clientes — suas
dores, necessidades e processos de compra, como realmente eles usam e percebem o
valor do seu produto).
Com isso, você também pode obter uma imagem no mercado incrivelmente precisa e
concisa. Portanto:
- vá atrás de um nicho;
- mantenha todos na empresa focados nesse nicho;
- reforce esse foco a cada chance que você tiver — do topo à base da hierarquia;
- mantenha suas equipes tão pequenas quanto possível.
### Você pode ir atrás de pequenas oportunidades
As grandes empresas precisam ir atrás de grandes oportunidades de mercado. Por

isso, não podem se dar ao luxo de explorar pequenos mercados — especialmente se
eles têm necessidades especiais. Isso deixa um número significativo de
oportunidades, que você pode atacar.
A chave para empreendedores de startups que adotam a filosofia _lean_ é identificar

e atacar mercados que podem ser pequenos agora, mas estão em uma trajetória
ascendente e têm o potencial para o crescimento. Um exemplo claro vem das startups
de turismo econômico como o [**Airnb**] — que focou no público universitário,
oferecendo vagas de hospedagem mais baratas e alternativas.
A grande vantagem de focar nesses mercados é muito simples: demorará muito tempo
para que as grandes empresas percebam você. Com isso, quando elas tentarem entrar
na disputa, você já vai ter uma startup consolidada no mercado.
Foi assim, por exemplo, o caso da startup de marketing de

conteúdo [**RockContent**].
Para explorar plenamente esta vantagem:
- olhe para os mercados que são muito pequenos para grandes empresas ou que estejam
fora do radar delas;
- procure segmentos de clientes com necessidades especiais que não sejam totalmente
atendidas pelas grandes empresas;
- identifique um mercado pequeno ou em potencial, que outras startups estão apenas
começando a atacar.
Com essa estratégia e a metodologia lean startup nas mãos, o crescimento rápido é
garantido.
### Você pode inovar de maneira muito mais rápida e eficaz
A mudança é algo contra o qual qualquer grande negócio com sistemas e processos

rígidos inevitavelmente luta. A mesma lógica vale para abraçar o risco com
estratégias arrojadas. Não só é somente extremamente difícil coordenar mudanças e
novas iniciativas de um ponto de vista logístico, mas também pode haver resistência
significativa dos funcionários e da gestão.
Para os grandes negócios, o pensamento criativo e a resolução rápida de problemas

são muitas vezes limitados à realização de pequenos ajustes e iterações nos
processos e estruturas já existentes. Em outras palavras, eles ficam presos em uma
mentalidade "é assim que sempre fizemos".
Como uma_ lean startup,_ você não tem essas limitações. Na verdade, quanto mais
inovador e perturbador você puder fazer o seu negócio, mais difícil será para as
grandes empresas copiarem ou competirem com o que você está fazendo. Para garantir
o êxito dessa estratégia, você pode:
- ser corajoso e correr riscos;

- desenvolver tecnologia que os concorrentes teriam dificuldade em construir com
sua plataforma atual;
- executar uma abordagem que seria muito prejudicial para uma empresa maior tentar
replicar;
- capacitar equipes e funcionários individuais em testar, iterar e adotar
abordagens inovadoras.
### Você pode conduzir seu negócio com a eficiência máxima
No_ lean startup_, sua missão é operar como uma máquina de lucro de alta

eficiência. Em outras palavras, a ideia básica é fazer tudo o que você faz — seu
produto, preços, atendimento ao cliente, etc — tão convincentemente, que você
consiga converter seus clientes-alvo com pouca ou nenhuma despesa de vendas
e marketing de sua parte.
Ou então, reduzir seus custos às estratégias mais eficientes, como o [marketing

digital.] Para isso, você precisa:
- ter o foco na [**experiência do usuário**];

- criar recursos de compartilhamento social diretamente em seu produto;
- fazer seu processo de subscrição e compra tão simples quanto possível;
- melhorar constantemente o seu produto e incorporar o feedback dos clientes com
ciclos de desenvolvimento rápido;
- aproveitar as versões beta e de teste gratuitas do seu produto para precificá-las
a preços extremamente competitivos;
- manter as despesas de vendas e de marketing tão baixas quanto possível.
Portanto, se você deseja se diferenciar das demais startups, aplique uma

metodologia inteligente e inovadora, cujo objetivo seja fazer com que o seu produto
seja lançado o quanto antes no mercado.
Com isso, você pode começar a influenciar seus potenciais clientes desde cedo e
testar efetivamente o conceito do seu produto sem ter gasto um grande volume de
capital com o desenvolvimento. Por esses motivos, a metodologia ideal tem sido a
lean startup! Somente ela tem aliado um crescimento rápido com a sustentabilidade
econômica ideais para o modelo inteligente e eficiente das startups.
imagem
Veja como utilizar o terminal para criar, excluir, renomear arquivos e diretórios.
Quando estamos programando, é bem comum nos depararmos com situações na qual temos
que utilizar o terminal.
Seja para dar um commit nas alterações, fazer uma consulta no banco de dados, ou
simplesmente [**procurar por um arquivo**], o terminal está presente. Apesar de
muitos não gostarem, ou terem medo de usar o terminal, este pode ser uma ferramenta
poderosa.
> _"Mas se hoje em dia possuem interfaces gráficas, por que utilizar o terminal?"_
Algumas interfaces gráficas, apesar de ajudarem muito, não são muito intuitivas, ou
são muito lentas, seja para iniciar, carregar módulos, ou outras coisas. Ou então,
queremos aprender como as coisas funcionam no seu core.
Com o terminal temos um resultado mais direto e, algumas vezes, mais rápido do que
pela interface gráfica, apesar de não ser tão bela a apresentação. Além disso,
podemos realizar algumas tarefas com poucos comandos, ou, até mesmo, criar os
nossos próprios.
Quando falamos em terminal, logo já vem uma imagem de alguma distribuição Linux na
cabeça, porém podemos utilizar o terminal no Mac também, alguns comandos são
idênticos entre esses sistemas.
No Windows, também temos a possibilidade de utilizar o terminal, nele é chamado de

**cmd**, ou **prompt de comando**, porém no Linux e no Mac essa prática é mais
comum. Por isso, os comando que veremos pelo terminal poderão ser usados no Linux e
no Mac, mas não são compatíveis com o Windows.
Mas então, como começar a utilizar o terminal?

## O primeiro passo…
A primeira coisa que devemos saber sobre o terminal é que podemos fazer tudo que
fazemos no ambiente gráfico. Desde buscar, criar e editar arquivos e diretórios,
obter informações do sistema, criar usuários e grupos, a até mesmo acessar um site
na web.
É importante saber onde estamos, isto é, em qual diretório estamos. Quando abrimos
o terminal, na maioria das distribuições Linux, vamos estar na pasta `home` do
usuário que estamos utilizando.
imagem:
`pwd`
imagem absoluto até o diretório que estamos. Já sabemos onde estamos, mas qual será
o conteúdo do nosso diretório? Podemos falar para o terminal listar (`ls`, list) o
seu conteúdo:
`ls`
imagem:
`cd Docker/`
imagem, até os arquivos ocultos .
`ls -a`
imagem onde podemos colocar nossos arquivos de estudos:
`mkdir Estudos`
imagem o nosso arquivo èstudos.py` para dentro do diretório Èstudos`, assim não
precisamos criar outro arquivo:
`mv estudos.py Estudos/`
imagem e pedir para o terminal renomear (`mv`) meu arquivo de èstudos.py` para
`coletando_dados.py`:
`mv estudos.py coletando_dados.py`
imagem um arquivo:
`rm coletando_dados.py`
imagem.
imagem.
`cat wordpress.yaml`
imagem o terminal.
`clear`
![]
![]
Existem diversos outros comandos e usos para o terminal. Podemos copiar arquivos e
diretórios, acessar outros [computadores remotamente], [editar] e [procurar
arquivos], atualizar o sistema, particionar e formatar HDs e pendrives, entre
diversas outras coisas.
Se interessou em descobrir o poder do terminal? Aqui na Alura temos um [**curso

sobre Linux**] onde você aprenderá sobre esses e muitos outros comandos para
utilizar o terminal.
Se você quiser se aprofundar um pouco mais no terminal, temos a [**formação sobre a

certificação LPI Linux Essentials**]. Nela, você aprenderá sobre a filosofia open
source, sobre como utilizar o terminal para realizar diversas tarefas, como buscar
ajuda pelo terminal, como trabalhar com arquivos e diretórios, permissões e
segurança, entre outras coisas.
Aqui eu converso com a Roberta Arcoverde, engenheira da Stackoverflow, sobre o que

é trabalhar remoto, como isso funciona, como ficam as reuniões, as relações humanas
e outros detalhes do **trabalho remoto**:
https://www.youtube.com/watch?v=V0FuAukFSzc
Abordamos desde assuntos simples como comemorações e a necessidade do cara a cara,

até problemas de fuso horário e produtividade. E temos uma discussão mais
aprofundada nesse podcast, juntamente com Mauricio Linhares, que trabalha da
Philadelphia para uma empresa que tem sede em New York:
<iframe src="https://open.spotify.com/embed-podcast/episode/0VFli4ZGxINwtOfWgYLUBZ"
imagem
Durante nossos estudos não é incomum que tenhamos dúvidas e encontremos problemas
durante o processo de aprendizado. Não temos um professor do nosso lado olhando
nosso código ou observando o design que estamos criando. Como tirar dúvidas e
encontrar soluções nestes casos? Recorremos aos fóruns e comunidades.
A comunidade de tecnologia com certeza é um lugar onde temos muitas pessoas que
gostam de contribuir com o crescimento das demais. É com certeza um de nossos
orgulhos na Alura.
A comunidade que se formou dentro do nosso fórum tem crescido e se tornado cada vez
mais forte conforme o tempo vai passando. Porém, temos algumas dicas na manga pra
você conseguir obter o melhor que essa comunidade pode oferecer. Vamos a elas?
## **1\. Seja específico.**
É muito fácil esquecer de descrever o problema que acontece com a gente

especificamente. Mensagens do tipo "meu código parou de funcionar" sem muita
especificidade do que é o problema dificulta a solução que já pode ser conhecida
por alguém que está passando pelo tópico. O que podemos fazer para ser específico?
Vejamos um exemplo:
> ### **Não consigo iniciar o projeto do curso de Spring MVC**

>
> Olá, estou com problemas ao iniciar meu projeto como está no curso. Ao tentar
iniciar o projeto, estou com erros.
No exemplo acima, estou sendo específico sobre qual passo estou tentando fazer e
estou tendo problemas. Quero criar um projeto e estou com erros. O título descreve
o que estou tentando fazer e em que tecnologia. O primeiro parágrafo fala mais um
pouco, porém ainda sem muita descrição. Aqui entra nossa dica número 2.
## **2\. Seja descritivo, exponha os detalhes.**
Aqui a idéia é descrever tudo que está relacionado ao que estamos tentando fazer.
Muitas vezes o problema está em algo que achamos não está relacionado. Usando o
mesmo exemplo anterior, podemos melhorar a mensagem, incluindo as mensagens de erro
e descrevendo nossas configurações.
> ### **Não consigo iniciar o projeto do curso de Spring MVC**

>
> Olá, estou com problemas ao iniciar meu projeto como está no curso. Ao tentar
iniciar o projeto, estou com os seguintes erros.
>
> // mensagens de erro.
>
> Atualmente estou usando Java 11 no Windows 10 com o Eclipse Juno, O Spring está
na versão 5.0 e meu pom.xml está assim:
>
> // código no pom.xml
Agora, além de ser específico sobre o que estou tentando fazer, ainda estou
informando detalhes tanto sobre minhas configurações pessoais quando configurações
do meu projeto.
Essas informações são ouro para alguém mais experiente, ele vai olhar a mensagem de
erro e saber rapidamente como te ajudar, explicar os erros e apontar soluções.
## **3\. Se necessário, disponibilize seu projeto.**
Às vezes o problema precisa ser testado. Dependendo da linguagem de programação

usada ou qualquer outro empecilho, a mensagem de erro pode não ajudar tanto e será
preciso que a outra pessoa que pretende te ajudar tente executar o projeto.
Para isso, use o [**GitHub**] ou mesmo disponha um zip no [**Dropbox**] ou

[**Google Drive**]. Poder baixar e executar seu projeto para tentar entender o
problema é algo que pode facilitar muito. Não é um passo essencial como os dois
primeiros, mas pode complementar.
Nos cursos de Design e Vídeos, esse passo é especialmente destacado, visto que
alguém vai precisar ver o resultado do seu trabalho para tentar ajudar.
## **4\. Se fizer sentido, anexe imagens.**
Sites como [**pasteboard.co**] e [**imgur.com**] podem ser usados para fazer upload
das imagens e seus links anexados no conteúdo da mensagem no tópico. Lembra do
Dropbox e do Google Drive? Vale usar eles também.
## **5\. Verifique as respostas com atenção.**
Leia com atenção a resposta da outra pessoa, às vezes elas perguntam coisas que já
resolvem o problema. Não é raro encontrar casos em que recebemos respostas pela
metade, alongando o tempo para solução do problema.
Extra: Acha que essas dicas valem apenas para o fórum? De forma alguma. Valem para
os emails que enviamos para o atendimento. Valem para outros fóruns e conversas com
os amigos.
O que achou das dicas? Já se consegue ver usando elas para tirar suas dúvidas?
Aproveite as dicas para tirar dúvidas agora mesmo abrindo um novo tópico em
[**nosso fórum.**]
O GNU Image Manipulation Program, mais conhecido pela sigla [**GIMP**], é uma livre
e poderosa ferramenta gráfica de manipulação _open source_ que pode ser usada para
tudo, desde a manipulação de fotos à pintura digital. Em desenvolvimento desde
1995, é uma espécie de "Photoshop livre", com a vantagem de ser mais leve e conter
atualizações e plugins feitos pelos próprios usuários que podem tornar o
programa muito mais versátil.
Claro, como qualquer ferramenta poderosa, leva tempo para aprender suas funções.
Foi pensando nisso que trouxemos neste artigo 10 dicas de GIMP para que você amplie
seus conhecimentos sobre este software maravilhoso e gratuito.
## 1\. Camadas
imagem, configurá-las em grupos (a partir da v2.8), mexer com a opacidade ou

transparência e muito mais!
## 2\. Mesclar a uma nova camada (e manter as originais)
imagem. Uma vez feito isso, vá em _**Filtro**_ ➢_** Melhorar**_, selecione

_**Remoção de olhos vermelhos**_, e será disponibilizado um controle deslizante e
um painel de visualização. Deslize o controle até que a descoloração seja removida,
e pronto! Você está livre de olhos vermelhos em sua imagem.
## 4\. Criar marca d'água
imagem; digite seu texto (configure fonte, tamanho e cor como você desejar). Uma
vez posicionada ao seu gosto, basta selecionar a camada de texto na barra lateral
**_Camadas_** e controlar o nível de _**Opacidade**_ até a marca d'água se misturar
bem com a imagem.
Caso queira um logotipo como marca d'água, vá em **_Arquivo_** ➢**_ Abrir como

Camadas_** para inserir o logotipo à cena como uma outra camada, onde é possível
redimensionar e reposicionar. Para finalizar, basta trabalhar o nível de opacidade
pelas barras laterais novamente.
## 5\. Personalizar pincéis
O GIMP já vem com um conjunto predefinições de pincel, mas usuários também podem
criar pincéis personalizados para seu próprio uso. A barra lateral na parte
inferior esquerda da tela permite que você crie um novo pincel com base em formas
geométricas, por meio de uma interface baseada em controles deslizantes e, em
seguida, guarde-o para uso posterior.
Os usuários mais confiantes podem criar uma imagem em tons de cinza (com branco
tratado como transparente e preto sendo a cor completa) e guardá-la como um arquivo
de extensão .gbr.
## 6\. Remover cores
imagem. Isso cria uma camada virtual que controla transparência (preto na máscara)
e opacidade (branco). Agora selecione a máscara (que deve aparecer como uma caixa
ao lado de sua camada cinza), a ferramenta de pintura na cor preta e depois pinte
sobre o elemento que deseja colorir a fim de revelar a camada de cor abaixo!
## 7\. Arredondar cantos
imagem e selecionar se deseja ou não adicionar algum plano de fundo atrás dos
cantos curvos - a cor de fundo atual é usada para isso. Clique em OK para
arredondar os cantos da imagem.
## 8\. Reatribuir atalhos
No GIMP você pode remapear seus atalhos de teclado selecionando _**Editar**_

➢_** Atalhos de teclado**_. Por exemplo, para mapear a combinação de teclas Ctrl +
D para a opção _Selecionar ➢ Nenhum_, clique para abrir o menu _Selecionar_,
localize a opção _Nenhum_ e clique nela para que as palavras Novo Acelerador
apareçam na coluna Atalho.
Em seguida, pressione a tecla para usar – por exemplo Ctrl + D, que é o equivalente
no Photoshop. Uma vez que esta combinação de teclas já esteja sendo utilizada, um
aviso aparecerá. Se estiver satisfeito com a substituição do atalho, proceda à
atribuição da nova tecla.
## 9\. Plugins do GIMP
Como muitos outros programas, o GIMP é projetado para ser capaz de aceitar plugins,
ou seja, extensões do programa que podem adicionar funcionalidades extras. O
[**GIMP Plugin Registry**] é uma coleção gigantesca de extensões, tais como
filtros, scripts e etc.
Precisa de um plugin para executar operações em lote através de um conjunto de

imagens? Procurando por efeitos de filtro, variantes de pincel, scripts
automatizados, e muito mais? O GIMP Plugin Registry é um bom lugar para começar.
## 10\. Recursos adicionais: GIMP portátil
O [GIMP portátil] é perfeito para uso em uma unidade USB, permitindo levar este
ótimo editor de imagens para qualquer lugar. Pode até mesmo manter seus plugins e
pincéis favoritos, tendo à disposição toda a suíte de ferramentas de manipulação de
imagens com você.
Com essas 10 dicas de GIMP, você viu que é possível atuar na área de

[**tecnologia**] e/ou [**design**] sem a necessidade de uma ferramenta como o
Photoshop que é paga. Em outras palavras, vimos uma amostra do que esse pacote
versátil de manipulação de gráficos é capaz mesmo sendo gratuito.
Não importa se você quer investir numa [**carreira como freelancer**] ou está
procurando um trampo fixo, se trabalha nas áreas de fotografia e design, construir
um bom portfólio online pode render muitas oportunidades de trabalho.
No artigo de hoje, você vai saber como expor o seu trabalho nas plataformas mais
tradicionais e também vai conhecer algumas que ainda não fazem tanto sucesso por
aqui, mas que valem a pena para acompanhar o que o que os gringos estão produzindo
na sua área. Então, vamos lá!
## Se você quer divulgar suas fotos, use:
### Flickr
Essa é uma das primeiras redes sociais voltadas para a exposição de fotografia
profissional. É uma ótima opção para quem quer criar um portfólio online, já que
ela permite a divisão por assuntos, temas e pastas, além de apresentar detalhes
como, por exemplo, qual o equipamento e as configurações utilizadas para fazer a
imagem.
É interessante dizer que o [Flickr] apresenta várias possibilidades de licenças de

uso para compartilhamento de uma foto. Inclusive, não faz muito tempo que o site
incluiu dois novos tipos: a licença de domínio público e a licença sem nenhum
direito reservado (ou [CC0]).
### 500px
Mais recente e menos popular que o Flickr, a plataforma [500px] (lê-se 500 pixels
em português) nasceu em 2009 com a promessa de se tornar uma rede social para
fotografia “de verdade”, em resposta ao Instagram.
De qualquer forma, ela conta com uma grande quantidade de usuários que compartilham
suas melhores fotos no intuito de divulgar trabalhos, fazer parcerias e também de
vender fotografia. Sim! É possível comercializar fotos por lá como se fosse um
[banco de imagens]. É legal ir a fundo e pesquisar tudo sobre a plataforma, que tem
funções gratuitas e outras pagas.
### Instagram
Ninguém duvida que o [Instagram] nasceu para o compartilhamento de fotografias,

certo? Pois bem. A rede social, que hoje pertence ao Facebook, é uma ótima opção
para divulgar seu trabalho ao público final. O aplicativo também oferece a
alternativa de criar uma conta empresarial, facilitando acompanhar o engajamento
dos seus seguidores.
No começo, era vista como uma rede social para fotografia amadora. Porém, com o
passar do tempo, fotógrafos profissionais também começaram a tirar proveito da
plataforma para divulgar seu estilo de trabalho usando as hashtags.
## Se você quer divulgar seus jobs de design, use:
### DeviantART
Conhecido como um dos sites com o maior número de imagens voltadas para designers,
o [DevianART] permite o compartilhamento de trabalhos em uma rede composta por
milhares de pessoas, que participam votando nos materiais enviados para a
plataforma.
Existe uma espécie de [comunidade brasileira] formada por artistas e estudantes

dentro da rede social. Para que seu trabalho seja aceito pelo grupo e exibido na
plataforma, é preciso conquistar pelo menos três votos. O site também aceita
fotografias, mas ele está mais difundido entre os profissionais do design.
### Behance
Também muito difundida entre os designers, a [Behance] é uma rede social

extremamente voltada à composição de portfólio. Em diversos sites de jobs e
[**freelas**] dessa área ela é indicada para essa finalidade.
Além disso, permite acompanhar o trabalho de outros artistas, curtir, comentar,

entrar em contato e compartilhar as imagens em outras redes como Facebook e
Pinterest. Conhecido como o [**LinkedIn**] dos criativos, o site na verdade possui
uma parceria com essa outra plataforma, permitindo a publicação simultânea de
conteúdo.
### Cargo
Outra rede social voltada para os designers é a [Cargo]. Para publicar imagens na
plataforma é necessário passar por uma avaliação, mas o acesso aos jobs de colegas
é totalmente free.
Uma vantagem em relação aos outros sites é que neste você terá uma URL exclusiva
para divulgar o conteúdo que produz. A plataforma promete ainda uma boa variedade
de templates personalizáveis para ajudar quem quer divulgar seus trabalhos.
## Se quiser divulgar os dois tipos de trabalhos, use:
### Tumblr
O [Tumblr] é conhecido como uma rede social de microblogs. O foco aqui são
conteúdos multimídias, já que a plataforma permite a inserção de texto, imagens,
vídeos, GIFs etc. Ao fazer a sua inscrição, você terá um endereço assim:
“onomeescolhido.tumblr.com”.
O legal é que é possível personalizar os temas disponíveis de acordo com o seu

gosto (alguns são pagos). Algumas pessoas usam o Tumblr para divulgar projetos
específicos, que vão sendo desenvolvidos ao longo do tempo. Outras, usam como
portfólio ou blog.
### Pinterest
O [Pinterest] é como um mar de referências. Usado tanto por fotógrafos quanto por
designers e outros profissionais, essa rede social tem crescido nos últimos anos. A
cultura do DIY (faça você mesmo) alavancou as inscrições de pessoas em busca de
dicas.
Também oferece a possibilidade de organizar o material em painéis e inserir

palavras-chave para direcionar as buscas. Os usuários do Pinterest podem guardar os
“pins” que mais gostam para vê-los mais tarde. É a oportunidade de tornar o seu
trabalho referência para outras pessoas e profissionais.
### Facebook
Deixamos por último a rede social mais popular que existe, o [Facebook]. Essa é uma
das melhores ferramentas de divulgação de trabalhos, seja qual for. As fanpages são
utilizadas tanto por empresas, quanto por artistas e profissionais liberais para
atrair curtidas.
Com foco em imagens e acessada diariamente por milhões de pessoas, essa rede social
merece a sua atenção. Embora tenha um mercado de anúncios pagos funcionando dentro
da plataforma, é possível usufruir das ferramentas orgânicas de divulgação:
publicar, curtir, compartilhar e marcar seus clientes, por exemplo.
Por fim, podemos afirmar que a associação entre imagens e redes sociais é
fundamental para quem trabalha com fotografia e design. Sem dúvida, esses meios de
comunicação surgiram para estreitar as relações e abrir novos caminhos
profissionais.
Não precisa se engajar em todas as redes que citamos aqui, mas entenda o
funcionamento de cada uma e escolha aquela que se encaixa no seu perfil.
Já que estamos falando de imagens e redes sociais, fique à vontade para

compartilhar o nosso artigo. Assim, os seus colegas de profissão também poderão
entender a importância de expor os trabalhos nesse universo cheio de possibilidades
que é a internet!
Quando estamos desenvolvendo um sistema web, eventualmente nos deparamos com os

dados de autenticação dos nossos usuários: normalmente login e senha. Vamos fazer
um pequeno exercício mental para verificar o quão seguros esses dados estão.
Pense por um instante nas informações mais importantes que **você** tem em um
serviço online. Talvez seja seu email, talvez uma conta na sua rede social
preferida, talvez alguma aplicação bancária. Pense na senha que você utiliza para
esse serviço e, em seguida, lembre todos os outros serviços nos quais você utiliza
essa mesma senha. O que aconteceria hoje se as informações guardadas em qualquer um
desses bancos de dados vazassem? Muito possivelmente seus dados de login e senha do
serviço principal também estariam comprometidos.
Vemos sempre por aí notícias de alguns sites famosos que sofreram algum vazamento
de informações, como [**Dropbox**], [**Patreon**], etc..
> Inclusive, você já checou se você foi vítima de algum vazamento de informações?
Dê uma olhada no site "[Have I been pwned?]" e descubra.
Para resolver esse problema, temos uma solução que funciona como no mundo real.
Você utiliza chaves diferentes para abrir a sua casa, o seu carro, o seu armário,
etc. No mundo virtual, temos a mesma solução disponível: um chaveiro eletrônico. Um
software que gerencia senhas aleatórias e seguras e, mais importante, diferentes
para cada um dos serviços que você queira utilizar. O meu chaveiro favorito é o
[**KeePassX**], mas também existem vários outros por aí.
Pronto. Problema resolvido. Nossas senhas já estão guardadas em um chaveiro. Então

discussão encerrada, certo?
Hmmmm, vamos com calma... Apesar da solução do chaveiro ser definitivamente

superior, sabemos que a esmagadora maioria dos usuários nunca nem ouviu falar dela.
Alguns até ouviram falar mas não utilizam. Usuários esses que utilizarão nossos
serviços com a mesma senha que utilizam nos serviços que consideram mais
importantes. Quem sabe o serviço mais importante de um usuário não seja exatamente
o seu!
Para garantir que o seu serviço tenha uma ótima qualidade e seja confiável,
precisamos garantir que os dados dos usuários estejam muito bem protegidos. Além
disso, se grandes empresas como Patreon e Dropbox tem seus dados roubados, temos
motivos o suficiente para acreditar que nenhum sistema é impenetrável.
Então como podemos fazer para nos assegurar de que, mesmo que os dados de
autenticação dos nossos usuários sejam acessados, não seja possível que algum
atacante os utilize?
Imagine que os dados do seu usuário, ao invés de serem guardados assim:
imagem possa ler.
Vamos ver um exemplo de uma técnica bem simples, aplicada sobre a senha `password`:
imagem mas ficou muito mais difícil. Ele vai precisar do mesmo dicionário que você
está utilizando e daí sair procurando palavra por palavra até encontrar uma que
gere esse "código".
Essa é a ideia que chamamos de **função de espalhamento** (também chamado de função

de _hash_). É um procedimento que recebe uma entrada e gera uma saída com algumas
propriedades específicas: cada entrada gera sempre a mesma saída e, dado uma saída,
é muito, mas muito difícil (vamos considerar que é impossível) descobrir qual foi a
entrada dada.
Nas funções de espalhamento que vamos utilizar, ainda temos outras propriedades que
nos ajudam mais ainda, por exemplo, a propriedade do **caos**. Ou seja, uma pequena
alteração na entrada gera uma alteração muito grande na saída, o que dificulta mais
ainda o trabalho do atacante.
Um exemplo de função de espalhamento é o algoritmo [**MD5**], que transforma o

texto Òla, mundo.` nesse hash: `fda090a568170fdc553dc4223ca9e367` e o texto Òla,
Mundo.` nesse outro hash: è372160d7e067a6c4b917e459a70a2e9`. Como podemos ver, a
diferença entre os dois hashes gerados é muito grande, apesar da pequena mudança na
entrada de apenas 1 bit (Note que mudamos a letra `m` para `M`).
### Adicionando um tempero ao Hash
Qual será que é a senha equivalente ao hash `6fd720fb42d209f576ca23d5e437a7bb`?
Se você tentar algumas das [**senhas mais usadas**], vai eventualmente descobrir
que utilizamos a string `senha` e o MD5 para calcular esse hash. Ou seja, se um
atacante tiver acesso ao seu banco de dados e descobrir que você está usando o MD5,
logo vai fazer um catálogo das senhas mais famosas hasheadas em MD5 e fazer uma
busca no seu banco de dados.
Assim, novamente, o atacante conseguiu identificar as senhas dos usuários. Mais do

que isso, já existem grandes tabelas relacionando senhas e hashes pela internet.
Elas se chamam _Rainbow Tables_. É fácil encontrar uma tabela de gigabytes de
senhas e hashes que facilitam a busca de qualquer atacante com acesso ao seu banco
de dados.
Poxa, mas agora complicou. Como fazemos para evitar esse tipo de tabelas?
A solução é adicionar um certo "tempero" à nossa string original, ou também

"**sal**", como é conhecido. A ideia aqui é jogar uma pitada de aleatoriedade à
senha do usuário, para que ela não apareça numa _Rainbow Table_. Por exemplo, se a
senha original era `senha`, nós sorteamos uma string `JBjGSJKcVf` e concatenamos à
string original, tendo `JBjGSJKcVfsenha` como string final. Assim, a propriedade do
caos da função de espalhamento garante que essa nova string terá um hash
completamente diferente da string original.
No caso, utilizando o MD5 e a senha sem sal, temos:
`senha` -> `6fd720fb42d209f576ca23d5e437a7bb`
Já com o sal, temos:
`JBjGSJKcVfsenha` -> àf34077cca67787a67faf84d044285e7`
### Melhorando o tempero
Olhando a imagem do nosso banco em texto aberto, vemos que a Maria tem duas contas
com a mesma senha: `login: "maria"` `senha: “senha”` e `login: “outraContaDaMaria”`
`senha: “senha”` porém no banco criptografado, temos dois hashes diferentes:
`login: "maria"` `senha:

“$2a$10$OTPxoxsAf18ZSQMD/EOwkeub7TKjNduBn5sY/tSd1SmkUhc54ap9.”`
`login: "outraContaDaMaria"` `senha:

“$2a$10$C3aGfh2ZRVf7d64jJgS36e90Gz.xxg/GkB8WwNFFSd0WeHhSX9Zb.”`
Isso é uma outra técnica que podemos utilizar para atrapalhar mais ainda o atacante
do nosso banco de dados. Agora, mesmo se ele conseguir decodificar uma senha comum,
ele não terá acesso às outras contas que utilizam essa mesma senha. Como os
usuários tem o péssimo hábito de usar senhas comuns e repetidas, isso é um grande
avanço no nosso sistema.
Isso é feito utilizando um **sal diferente** para cada senha, o que acaba criando
hashes completamente diferentes para duas senhas iguais temperadas com um **sal
diferente**. No caso do nosso banco, esse sal é guardado junto com o hash.
Bom, ganhamos bastante segurança mas agora precisamos desenvolver uma função de
espalhamento, guardar o sal de cada uma das senhas e escrever os métodos que fazem
tanto o hash da senha quanto a autenticação de um usuário. Aí vem a pergunta...
### Como usar isso no meu projeto?
Escrever o nosso módulo de segurança do zero, que inclui uma função de hash, um
jeito de inserir um usuário novo e um jeito de autenticar um usuário existente é
muito complicado e muito propenso a erros, então é recomendável utilizar uma
biblioteca já existente para fazer esse trabalho.
O padrão BCrypt é um ótimo método e existem implementações dele nas mais variadas
linguagens.
Em Java, por exemplo, você pode adicionar a biblioteca jBCrypt e utilizá-la com um
código bem simples, que utiliza as funções `BCrypt.gensalt`, `BCrypt.hashpw` e
`BCrypt.checkpw` para gerar o sal, gerar o hash e checar uma senha candidata,
respectivamente. A biblioteca é livre e pode ser baixada diretamente em seu código
fonte no [**site oficial do projeto**]. Um exemplo de como ficaria o código é o
seguinte:
java
### Agora é hora de deixar o seu projeto mais seguro!

Nesse post vimos alguns casos em que a segurança dos dados dos usuários, apesar de
ter uma importância muito grande, foi deixada de lado causando alguns problemas
para os próprios usuários e também para as empresas envolvidas.
Aprendemos como funciona a criptografia de mão-única, utilizando um sal aleatório e

individual para cada senha e como ela protege a senha dos nossos usuários. Note que
nem mesmo o desenvolvedor do sistema tem acesso à senha uma vez que ela está no
banco!
Por fim, vimos o padrão BCrypt e a biblioteca jBCrypt que facilita o nosso trabalho
e está disponível para várias linguagens de programação.
Para aprender mais sobre autenticação de usuários e segurança de informação no

geral, a Alura tem vários cursos que vão desde a explicação de como ser [**seguro
na web**] até a implementação na tecnologia específica, como o [**Java**], o
[**Spring Framework**], o [**Play Framework**] e também utilizando o [**ASP.NET**]
para você que utiliza o C#.
Esse é o primeiro codigo Java!
java
Compile com:
```
javac Xpto.java
```
E rode com:
```
java Xpto
```
Quando todos esses requisitos são cumpridos, nós conseguimos facilmente utilizar os
sons gravados, editá-los, aplicar efeitos e obter um bom resultado com a mixagem do
audio. Porém, se um desses fatores atrapalhar a gravação, devemos jogar fora o
audio e iniciar o processo novamente. Mas e quando regravar não é uma opção? Quando
precisamos obter o melhor resultado possivel com um audio que não foi captado
corretamente?
Algumas semanas atrás, passei por isso, gravei em um estudio uma locução para um de
nossos cursos da Alura, porém, esqueci de desligar o ar condicionado. Agora tenho
um audio com um ruído de fundo, que além de ser incomodo, deixa minha produção
pouco profissional.
Para tentar solucionar o meu problema vou abrir esse audio no Adobe Audition, assim
que abro esse audio com o software aparecem uns rabiscos de verdes no que parece
ser uma linha do tempo. Arrastando meu mouse consigo perceber que esses rabiscos
são a representação do meu som, mas o que exatamente eles significam?
![image00]
Para analisar melhor vamos expandir essa visualização. Chegando mais perto já
conseguimos perceber que esse rabisco na verdade é uma onda, que vai pra cima e
volta pra baixo. Mas porque uma onda? Não existia uma maneira mais simples de
representar um audio?
![image01]
**Na verdade essa é uma representação bem fiel de como um audio funciona. Todo som
que ouvimos é uma onda viajando pelas moleculas de ar, água ou materiais sólidos e
chegando aos nossos ouvidos. A a distância entre os picos vai dizer se esse som é
agúdo ou grave e a altura das ondas vai definir o volume do nosso som.**
Para remover o ruído precisamos identificar as ondas de ruído, e então remove-lo

das outras ondas. Vamos selecionar a parte do audio em que temos apenas ruído do ar
condicionado, clicando e arrastando esse pedaço.
**Depois precisamos garantir que o software salvou esse pedaço na memória, para
fazer a comparação. Então clicamos com o botão direito e selecionamos "Capture
noise print". Pronto, temos esse trechinho de audio salvo, precisamos agora
comparar com o restante do audio para remover esse ruído.**
![image02]
O que quero fazer é comparar com o audio todo não apenas com um trecho, então vou
selecionar o audio todo. Agora que tenho meu trecho selecionado, preciso navegar
até a aba Effects, e como preciso reduzir o ruído a opção que vou selecionar tem
esse nome mesmo redução de ruído, só que em inglês "Noise Reduction", e de novo
Noise reduction process.
![image03]
Agora uma nova janela foi aberta onde o processo de remoção do ruido já foi
iniciado, se você pressionar o play no canto inferior direito vai notar uma mudança
no som, o ruído foi retirado e com ele alguns pedaços da voz, para conseguir notar
essa diferença melhor ligue a opção "Output noise only"
![image04]
O que acontece é a comparação das ondas ruído que captamos com as ondas desse audio
todo,após essa comparação o software extrai as ondas de ruído de todo o restante.
Por isso o efeito em nosso audio principal pode ser uma distorção, dependendo da
quantidade de redução que selecionarmos e o quanto gostariamos de abaixar o volume
desse ruído.
**Para conseguirmos refinar essa redução e diminuir os efeitos negativos em nosso

audio podemos utilizar os recursos Noise Reduction e Reduce By da ferramenta.
Aproveite para mover os seletores das ferramentas e notar as diferenças que são
causadas no som. O recomendado é sempre mantermos um pouco do ruído neste audio,
com uma limpeza completa o audio vai soar "falso" e incomodo.**
Um bom audio é fundamental para um vídeo de qualidade, e com a redução de ruídos

conseguimos recuperar materiais que poderiam ser descartados na edição. Se você
deseja aprender mais sobre edição de vídeo, motion graphics e edição de audios para
video confira a [**Formação Edição de Vídeos**] da Alura.
Construir uma carreira na área de tecnologia é o sonho de muitos jovens. Existem
diversos motivos para essa escolha, tais como, habilidades em lidar com códigos,
computadores e redes. Além disso, o [mercado de TI é um dos que continuam em
crescimento], mesmo em tempos de crise econômica.
Outro ponto a destacar da área diz respeito às [remunerações], como há carência de

profissionais especializados, a tendência é sempre existirem vagas em aberto e,
consequentemente, salários mais elevados.
Porém, para conseguir ocupar uma das vagas disponíveis é preciso capacitação, muita
vontade de aprender e atualização contínua.
## Invista em capacitação para seguir carreira na área de tecnologia
**A área de tecnologia está em constante mudança e evolução. Sempre há alguma

atualização em um processo, software ou linguagem de programação utilizada. Os
profissionais que desejam encontrar uma boa oportunidade de emprego precisam estar
em sintonia com as demandas do mercado e saber falar a linguagem das empresas.**
Para suprir essa necessidade, a melhor forma é investir em cursos de capacitação,

que apresentam um panorama completo e atualizado sobre a área que pretende atuar.
Logo, a maneira mais prática de estudar é por meio dos cursos on-line. Com a
facilidade de estudar de casa ou de onde preferir, é possível conseguir a formação
em diferentes segmentos e adquirir o conhecimento necessário para atuar
profissionalmente em vários projetos.
Por exemplo, para quem pretende trabalhar com [**programação**] há uma gama de
opções de cursos para aprender as linguagens exigidas pelo mercado e conseguir as
certificações necessárias. Outra área que merece destaque é [**Design e UX**], que
exige conhecimento de diversos softwares e ferramentas para executar os projetos.
Como a atuação desses profissionais será em meio digital, buscar a capacitação com
os cursos on-line favorecerá a intimidade e a experiência com as ferramentas
necessárias para o dia a dia no trabalho. Portanto, os jovens que pretendem
encontrar o trabalho dos sonhos precisam investir em capacitação para sair à frente
e conquistar os melhores postos.
## Busque experiência profissional
A experiência profissional é um ponto muito importante para conseguir um bom

emprego na área de tecnologia. Mas é exatamente nesse ponto que muitos jovens,
principalmente em início de carreira, ficam inseguros.
É preciso ter calma e pensar em todas as possibilidades para adquirir experiência.

A primeira a destacar é a realização de estágios durante a fase universitária. O
período de estudos será mais bem aproveitado se for aliado a prática profissional.
Isso ajudará a obter mais conhecimento e noções sobre o mercado de trabalho, além
da possibilidade de atuar lado a lado com profissionais experientes.
Além da atuação em empresas e agências, dentro da própria universidade é possível

participar de diversas iniciativas e já conseguir atuar em projetos. Fora isso, há
a possibilidade de estágios voluntários, que podem ser em ONG (Organização não
governamental), associações assistenciais, entre várias outras. Essa é uma forma de
enriquecer o currículo pelo conhecimento técnico e atuação solidária.
Fora o estágio, uma maneira de conseguir experiência e implementar o conhecimento

adquirido na universidade e em cursos extras é desenvolver um projeto próprio.
Nesse caso, não é necessário ser algo comercial. A proposta é que seja um piloto
para demonstrar as suas habilidades.
As possibilidades para obter experiência não se esgotam por ai. Outra maneira é
criar um site. Isso é bastante útil para [**programadores**], que podem demonstrar
a habilidade e conhecimento das linguagens que domina. Os designers também pode se
beneficiar ao criar uma página na internet.
Essa é uma forma de mostrar o domínio das regras de usabilidade, arquitetura da

informação e beleza estética que os sites necessitam. Ainda há a possibilidade de
criar um aplicativo mobile, que é uma área em franca ascensão.
Fazer um projeto particular, além de contribuir para a experiência profissional,

conta como uma demonstração de proatividade, boa organização e disposição para
aprender e desenvolver.
## Desenvolva um portfólio on-line poderoso
Outro fator importante para construir uma carreira na área de tecnologia é

desenvolver um portfólio on-line poderoso. É nessa página que estarão relacionados
todos os projetos executados ao longo da carreira, mesmo que sejam apenas trabalhos
universitários e estágios.
Para ter uma ideia da importância do portfólio, algumas empresas só aceitam

inscrição para as vagas de empregos se houver link para o seu perfil on-line, ou
seja, é algo realmente fundamental.
Para que você possa criar o seu portfólio on-line, a seguir relacionamos algumas
ferramentas que são muito úteis nesse processo:
- [Behance:] uma das ferramentas mais usadas por profissionais, principalmente, os

designers. A plataforma é bastante simples de usar e é gratuita. Os trabalhos são
separados por projetos e em cada um deles é possível incluir todo o material
relacionado. A interface é limpa, organizada e bonita. Além disso, cada usuário
pode ter um pequeno currículo com as informações básicas sobre a sua trajetória
profissional.
- [Clippings.me]: apesar de a plataforma ter sido criada originalmente para

jornalistas, atualmente, ela pode facilmente ser usada por profissionais da área de
TI. Para criar o portfólio é possível incluir links para os trabalhos já feitos,
sendo bastante útil para programadores e designers que podem indicar os projetos
que desenvolveram. Além disso, os usuários podem escrever uma apresentação sobre as
suas experiências na plataforma.
- [Coroflot]: essa é uma ferramenta especialmente indicada para designers. Com

interface bastante simples de usar, possibilita o armazenamento de um número
ilimitado de trabalhos. Além disso, os usuários podem obter dados sobre o tráfego
de visitas nas páginas e acompanhar qual delas é a mais popular. Outra vantagem é
que empresas como o Google e Apple usam o Coroflot para buscar profissionais de
design.
## Mantenha uma presença on-line
Todo profissional da área de TI precisa manter uma presença on-line, mas isso não é
apenas para fazer amigos ou conversar amenidades. Trata-se de formar networking e
adquirir conhecimento.
**As redes sociais são grandes aliadas nesse ponto. Participar dos grupos de
discussão é uma forma de acompanhar o que profissionais experientes estão falando,
as suas recomendações, entender as demandas de mercado e também ficar atualizado
sobre as vagas de emprego em aberto.**
Além disso, é uma maneira de conhecer pessoas que podem contribuir para encontrar
um bom emprego ou mesmo indicá-lo para vagas. Outra maneira de manter a presença
online efetiva é com um perfil de [**LinkedIn atualizado**], diversas empresas
trocam o tradicional currículo pelo link dessa rede social.
Nesse artigo, aprenderemos a implementar uma solução mais adequada para a

implantação de um sistema de notificação utilizando o [**FCM (Firebase Cloud
Messaging)**].
Lembrando que estarei utilizando o [**projeto (de teste) para a casa do código**].
**O pré-requisito para configurarmos o firebase é pelo menos ter uma conta do
Google para entrar no sistema. Caso não tenha, [crie uma conta].**
Nosso primeiro passo é entrar no [**console do Firebase**], pois é a partir dele

que criaremos o nosso projeto:
imagem`:
groovy
Agora, vamos alterar o arquivo `build.gradle (Module: app)` do módulo, adicionando

o plugin `'com.google.gms.google-services'`:
groovy
O **próprio Firebase** indica que adicionemos o plugin na parte de baixo do

arquivo. Portanto, manteremos o plugin no final do arquivo. Por fim, clique em
"Sync now" para sincronizar a configuração que realizamos.
Após a sincronização, no console do Firebase, clique em "FINALIZAR":
imagem`:
java
Esse método pode ser chamado a partir das seguintes ações.
- Deletando o [Instance ID].

- Restaurando a App em um novo dispositivo.
- Usuário deletando ou reinstalando a App.
- Usuário limpando os dados da App.
A próxima classe que criaremos é a `CDCMessasingService` que estenderá da classe

`FirebaseMessagingService`:
java
Essa é a classe que ficará responsável em receber as mensagens do Firebase, ou

seja, a partir dela, a nossa App ficará escutando qualquer requisição referente às
mensagens vindas do FCM.
Por fim, precisamos informar ao Android que essas duas classes que criamos, serão
[**Services**], ou seja, elas ficarão funcionando em background sem nenhuma
intervenção do usuário em interface gráfica! Mas como fazemos isso? Simples! basta
adicionar no ÀndroidManifest.xml`:
xml
Agora sim podemos testar a nossa App. Ao abrir o emulador, ou então, no seu próprio
celular, desinstale a App para garantir que Firebase gere o token sem nenhum
problema. Então rode a App:
imagem
Além de enviar notificações via console, podemos também enviar via [**HTTP**] ou
[XMPP].
No próximo post veremos como podemos [**receber e exibir uma notificação também em
foreground**], isto é, com a App aberta.
E aí, o que achou do Firebase? Pretende utilizá-lo nos seus projetos atuais ou
futuros? Deixe seu comentário sobre o que achou ou sua experiência durante a
implementação.
Curtiu essa dica? Quer aprender mais ou iniciar sua carreira como um dev Android?
na Alura, agora temos [**uma formação Android**], onde você aprenderá a criar a sua
App do início ao fim com muita prática!
imagem
Estava jogando RPG com uns amigos outro dia. Era um RPG clássico de mesa. Nesse
jogo, éramos personagens em uma época medieval, cavaleiros, magos, entre outros
personagens.
Como estou estudando Scratch, resolvi começar a criar uma animação contando uma
parte da história que vivemos, mas como podemos criar nossa história?
## Era uma vez…
Como começar uma história? "Era uma vez em uma terra muito distante…", ou então,
“Em uma galáxia muito distante...”. Essas são algumas das formas que temos para
começar um conto.
Toda narrativa se passa em um lugar, um bosque, um castelo, em uma galáxia, numa

escola de magia e bruxaria… São tantos os lugares que podemos ambientar nossa
história. No meu caso, essa história se passará em um acampamento.
Então, temos que falar para o Scratch que o `palco` de nossa história será esse
acampamento:
![]
![]
Já temos um palco para a nossa história. Mas onde estão os personagens dessa
história? Precisamos dizer ao Scratch quem são os atores:
![]
![]
Nessa parte do jogo, estávamos conversando sobre a nossa próxima missão. Os

personagens ainda estão calados, precisamos fazer eles se dizerem alguma coisa
quando o jogo começar. Vamos começar falando para a fada falar alguma coisa:
![]
![]
Nossa personagem está falando, mas o balão de diálogo não está sumindo… Precisamos
que essa mensagem apareça só quando necessária e depois desapareça. Podemos
adicionar um tempo específico para isso, então, dois segundos, por exemplo:
![]
Legal, agora ela diz sua fala e depois de um tempo o balão some. Mas só um
personagem está falando. Como será que podemos fazer um diálogo entre eles?
Vimos que podemos adicionar o bloco `diga <alguma coisa> por <alguns> segundos`
para fazer os atores falarem:
![]
Os personagens estão falando todos ao mesmo tempo, as suas falas se sobrescrevem.
Se fosse uma revista em quadrinhos, ou uma situação que quiséssemos simular

confusão, faria sentido deixar todos os balões de falas aparecendo. Contudo,
estamos desenvolvendo uma animação.
O legal é que cada balão apareça somente quando a outro balão sumir. Dessa forma,
estamos criando uma progressão na conversa. Mas como podemos causar essa
progressão?
## Luz, câmera e ação
Quando atores estão fazendo um filme, eles têm suas falas no roteiro. Quando um
para de falar o outro começa. Isto é, um ator espera pelo tempo da fala do outro
personagem para começar a falar.
Como o diálogo é uma sequência de falas, podemos falar para o Scratch que a fada
começa a falar assim que o jogo começar.
Enquanto isso o outro ator fica parado, esperando a hora de sua fala:
![]
![]
Bacana! Conseguimos causar uma sensação de um diálogo, mas o que acontece se

aumentarmos um pouco o tempo de fala da personagem que começa a cena?
![]
O outro personagem começa a falar antes do balão desaparecer. Como nós alteramos o
tempo de fala do primeiro ator, temos que falar para o mago esperar um pouco mais:
![]
![]
Nesse caso temos apenas dois atores, mas o que aconteceria se tivéssemos dez
personagens na cena com diálogos maiores?
Cada vez que alteramos o tempo de fala de um personagem, temos que alterar o tempo
de espera de todos os outros atores, senão uma fala sobrescreverá a outra.
Se tivéssemos 100 personagens, imagine ter que repetir essa ação manualmente 100
vezes. Daria muito trabalho!
Então, o que nós podemos fazer para alterar o tempo que um personagem leva para
falar sem ter que modificar o tempo dos outros atores?
## As falas que falam
Dizer para um ator esperar a fala do outro terminar para começar a sua é um pouco
trabalhoso. Como vimos, se alterarmos o tempo de fala de um ator, temos que alterar
de todos os outros.
O ator sabe o tempo de sua fala. E se conseguíssemos que a fala de um ator fosse o
gatilho para a fala do outro? Por exemplo, se quando a fada parasse de falar ela
enviasse uma `mensagem` para o mago dizendo que ele deve começar a falar.
Dessa forma, não importa se o tempo de fala da fada mude, pois ela só enviará a
mensagem quando terminar seu diálogo.
Podemos falar para o Scratch que quando essa atriz parar de falar, envie uma
mensagem para todos na cena dizendo que eles podem tomar alguma ação:
![]
O mago espera até receber essa mensagem e somente quando ele receber sua fala:
![]
![]
Dessa forma, se alterarmos o tempo de diálogo de um personagem, não precisamos

alterar o tempo de espera dos outros.
Com mensagem, não deixamos as ações de um personagem tão dependentes das ações de
outros. Isto é, dizemos que as ações dos personagem tem um baixo acoplamento.
## Para saber mais
Começamos a criar a cena com os nossos atores, porém ainda precisamos trabalhar em
outros elementos. Podemos, por exemplo, mudar nosso cenário para passar uma
sensação diferente aos espectadores. Como definimos um tempo para as falas sumirem,
algumas pessoas podem não conseguir ler todo o texto antes disso acontecer.
Para evitar isso, nós podemos [**capturar um evento**] que altera as falas ou até
mesmo que muda o placo. Além de histórias, o Scratch nos permite criar jogos,
aprender lógica de programação, matemática e muitas outras coisas.
Aqui na [**Alura Start**], temos diversos cursos que utilizam Scratch. Neles, vocês
vão aprender a como [criar um jogo 2d de naves espaciais], ou então um [jogo de
cobrança de pênaltis]. Aprenderá sobre [**storytelling e técnicas de criar e contar
uma boa história**], e muito mais. Gostou dessas técnicas de criar diálogos com
Scratch? Não se esqueça de compartilhar conosco nos comentários. :D
Como melhorar a nossa produtividade de desenvolvimento de apps no Android ?
Durante o desenvolvimento da nossa [**lista de cursos**], vimos diversos assuntos

sobre Android, como por exemplo, criação e personalização de uma lista e até nos
comunicamos com apps externas... Porém, vamos verificar a quantidade de código que
utilizamos para construir essa app simples. Começaremos pela nossa activity:
java
Agora o nosso adapter:
java
Vamos dar uma olhada nesse trecho de código:
java
Olha o tanto de código que escrevemos apenas para buscar uma referência de uma
`ListView`. Agora vejamos esse outro trecho:
java
Perceba que para tarefas que são bem comuns como, por exemplo, pegar a referência
de uma `View` ou criar um _listener_ para implementar um clique, estamos escrevendo
muito código!
Será que não existe alguma biblioteca que nos ajude com esse tipo de tarefa?
Pensando justamente nesse detalhe, o [**Jake Wharton**] desenvolveu a biblioteca
[**Butter Knife**] capaz de facilitar todos esses procedimentos de pegar referência
de `View` ou até mesmo implementar um _listener_.
Mas como podemos adicioná-la no nosso projeto? Vá em "File > Project Structure". Vá
até o menu "app" e depois na aba "Dependencies":
imagem` da classe `ButterKnife` que recebe a Àctivity` que ele precisa associar às
`View`s, então podemos enviar a nossa própria Àctivity`, ou seja, o `this`:
java
Agora precisamos modificar todas as nossas referências de `View` de variável local,

para variável membro, ou seja, um atributo da nossa Àctivity`:
java
Mas porque tivemos que fazer essa alteração? É justamente pela questão do Butter
Knife utilizar [**annotations**] para associar as `View`s. Mas e agora? O que
fazemos? Simples! Basta apenas adicionarmos a anotação `@Bind` passando por
parâmetro o _id_ dessa `View`:
java
Só isso? Sim! Apenas isso já faz todo aquele código que escrevíamos por de traz dos
panos! Podemos até apagar aquele trecho do nosso código. Vejamos o resultado da
nossa Àctivity`:
java
Você pode estar se perguntando sobre o motivo de um atributo não ser `private` e é
justamente pelo motivo do Butter Knife não funcionar com o modificador de acesso
`private`, ou seja, é aquele famoso "Trade Off": "ganhamos em um lado, porém
perdemos em outro...".
O nosso código já melhorou um pouco, vamos verificar esse outro trecho de código:
java
Como será que podemos melhorar essa implementação toda? Vamos criar um método que
descreve o que esse listener representa:
java
E agora? O que faremos? Da mesma forma que usamos uma anotação para pegar a
referência de uma `View`, usaremos a `@OnItemClick` para representar o clique de um
elemento de uma lista passando o id dessa lista por parâmetro:
java
Por fim, basta apenas transferirmos o mesmo código dentro do antigo listener para
dentro do método àcessarUrl()`:
java
Pronto! Já podemos até apagar o listener antigo. Se testarmos nossa app novamente:
![tela-lista-personalizada2]
![abrindo-pagina]
A nossa app funciona normalmente! Porém agora vamos ver como ficou a nossa
Àctivity`:
java
O que achou? Bem mais elegante e de fácil compreensão! **O Butter Knife é uma
biblioteca que faz a "injeção" de `View` que é justamente pegar todas as
referências das `View`s de uma Àctivity` e permitir o acesso por meio de
anotações** que facilitam, e tanto, a nossa vida!
**O que você achou do Butter Knife? Gostaria de aprender mais sobre android? Que
tal dar uma na [formação Android] aqui da Alura?**
imagem
Como desenvolvedor Python, é possível que você já tenha se deparado com esse trecho
de código, mas você sabe o que ele significa?
Achei um programa em Python na internet com várias funções relacionadas a dados e

taxas de moedas, que podem me ajudar no meu projeto pessoal de criar um conversor
de moedas.
Baixei, então, o arquivo ìnfo_moedas.py`, para utilizá-lo em meu projeto,
especialmente uma função que pega a taxa atual de conversão entre duas moedas
(`get_taxa_conversao()`). O arquivo principal do meu programa ficou assim:
python
Fui testar o programa e logo quando eu o abri, olha o que apareceu:
python
Mas o quê? Apareceram dezenas de linhas com informações de muitas moedas, mas eu
não pedi por isso! Apesar disso tudo, no final ainda apareceu o que a gente
colocou… que estranho!
Resolvi checar o código que baixei da internet, então, e lá pro final encontrei uma
linha solta bem curta:
python
Essa linha executa uma função declarada lá no ìnfo_moedas.py` mesmo, cheia de

instruções, incluindo as de imprimir toda essa informação que a gente recebeu. Tudo
bem, achamos o código que faz isso, mas por que ele está sendo executado em nosso
programa?
A questão está no funcionamento do ìmport` no Python. Quando importamos um arquivo

Python, estamos de fato executando o código dentro dele.
Assim, a instrução ìmport info_moedas` executa a linha `main()` do arquivo que eu

baixei, fazendo aparecer tudo isso em nosso programa. Mas como podemos evitar isso?
Uma solução mais intuitiva seria simplesmente apagar a chamada da função `main()`
do arquivo ìnfo_moedas.py`. Isso aparentemente resolveria nosso problema, mas
quebraria o código original que eu encontrei, o que pode acabar nos trazendo mais
outras complicações no futuro.
O ideal seria simplesmente dizer para o Python, ao importar o arquivo, não executar
aquilo ali. Será que é possível fazer isso?
## A variável __name__
No Python, arquivos `.py` são chamados de **módulos**. Cada módulo pode ser
executado diretamente, como um programa em si, ou importado por outro módulo.
Precisamos, de alguma maneira, identificar essa diferença. Para isso, temos uma
variável nativa que pode nos auxiliar nisso - a `__name__`, que nos indica o nome
do contexto em que o módulo está rodando.
Resumindo, a variável `__name__` representa o nome do módulo. Entretanto, quando o

módulo é executado por si só como um programa, `__name__` é definido para
`’__main__’`, diferente de quando o módulo é importado, no qual o valor fica de
fato igual ao nome do módulo.
Vamos testar isso fazendo um simples programa que apenas imprime essa variável.
Chamaremos de `teste_name.py`:
python
Ao executarmos esse programa com `python teste_name.py` na linha de comando, olha o

resultado:
python
Agora, se abrirmos o console do Python e importamos esse módulo, olha como fica:
imagem` dentro do bloco dessa condição:
python
Fui rodar o meu conversor de moedas e, dessa vez:
python
Toda aquela informação sumiu! Conseguimos o que queríamos ;).
Nesse caso esse condicional foi bastante útil pra gente, já que o código que estava
rodando nem era nosso. Mas será que devemos usá-lo sempre? Quando e até que ponto
ele pode ser bom?
## Quando usar a checagem de escopo de execução?
Agora que já conhecemos essa técnica, como sabemos quando usá-la? Um impulso
inicial pode ser de colocar em todos os nossos programas, afinal uma verificação
nunca vai fazer muito mal, mas isso nem sempre é o ideal.
Normalmente, conseguimos atingir um maior nível de organização de nosso programa se

dividirmos em módulos diferentes o código que faz as definições e o código que
executa o que foi definido.
Muitas vezes, então, a melhor abordagem acaba sendo ter um módulo em que apenas se
define algumas funções, mas não se executa nada fora delas, para então ser
importado pelos módulos que as executarão.
Nem sempre, entretanto, isso é vantajoso para nosso programa, o que nos traz de
volta para o começo. Nesse caso, a convenção que vimos pode ser muito útil, seja
por simples garantia de que um código não executará em um ìmport`, seja porque de
fato queremos um comportamento diferente para diferentes tipos de execução do
programa.
Ainda há casos mais específicos em que este teste é de fato necessário, como no
[**caso do módulo multiprocessing**], que pode resultar em um `RuntimeError`.
Além disso, em testes simples e rápidos, essa única linha pode nos poupar bastante
dor de cabeça!
## Conclusão
Nesse post, aprendemos um pouco mais de como o **import** funciona no Python e um

de seus possíveis problemas. Assim, vimos qual a solução comumente usada pelos
desenvolvedores, e quando devemos usá-la.
E aí? Já conhecia essa técnica? Se quiser se aprofundar mais em Python, dê uma

olhada nos nossos [**cursos da Alura sobre a linguagem**] e continue estudando!
Bom... é verdade. Se alguém clica em **unsubscribe,** ele não está mais satisfeito

com o conteúdo que está enviando... pode ser que você esteja enviando um conteúdo
que não faz sentido nenhum, ai bobeou né, é hora de começar a melhorar seu
conteúdo.
Pode ser também que ele clicou por engano... ou ele está tão animado que deu
**forward** para um amigo, e este amigo clicou em _unsubscribe_. Ops! Ele nem
queria dar _unsubscribe_!
Pode ser também que o momento da vida do assinante mudou. Antes ele se interessava
por este conteúdo, agora ele se interessa por outro, e aí?
## O que devo fazer considerando todos esses cenários?
A sacada está em ter mais de um tipo de conteúdo disponível para seus **leads**.
Ele deixou de se interessar por conteúdo básico de otimização de sites? Que tal
oferecer o conteúdo de otimização de comunicação em redes sociais?
Ele deixou de se interessar por conteúdo básico de Java? Que tal oferecer uma
assinatura de conteúdo de certificação Java?
Não tem ideia de como abordá-los? Então veja algumas dicas.
## Algumas técnicas para o e-mail de despedida
- seja curto.
- dê algum conteúdo novo.
- inclua um link para **resubscribe**, afinal pode ter sido um erro.
E escolha uma ou mais opções, sempre curtas:
- dê a opção para que ele siga seu blog.

- dê a opção de outra lista.
- peça para explicar o que fez ele parar de consumir seu conteúdo.
Veja o exemplo da lista de novidades do Alura, ao se descadastrar você recebe um e-

mail de "tchau, muito obrigado e, se quiser mais informações, você tem outras
opções":
![Unsubscribe]
Como vimos, existem diversas técnicas e boas práticas em uma ação de _mailing_,
seja ela manual ou automatizada... e no dia-a-dia de criar os **mailings** do Alura
e nossos cursos de boas práticas de e-mail marketing online, juntei diversas para
você.
E aí, o que você escreverá no seu **goodbye e-mail**? E o que gostaria de ler nele?
imagem
No app Imagly a primeira versão da navegação utilizava apenas o side menu:
imagem.
imagem e o [Human Interface Guidelines] (Apple), uma das especificações que diverge
em cada opção é a scrolllagem, que, para Android, pode existir, enquanto para iOS
não.
No caso do iOS, recomenda-se que, para casos em que o menu precisar de mais itens a
serem apresentados, inclui-se um dos ícones como "more" (mais), para mais opções.
imagem tem um bom aproveitamento de espaço do conteúdo e não ocultam a Tab Bar
mesmo após a scrollagem.
Além disso, no Material Design temos as tabs e o bottom navigation, que comportam-
se de formas diferentes. No caso das tabs, permanecem visíveis, porém o "cabeçalho"
do menu é oculto, enquanto no bottom navigation temos o componente inteiro
ocultado.
Essas são algumas das considerações e pontos sobre as Tab Bars que devemos prestar
atenção quando decidimos desenvolver um UI utilizando esse recurso.
Ficar atento à utilização desse UI Design Pattern em cada tipo de SO é muito

importante para aqueles que planejam utilizar componentes nativos de cada um,
respeitando seus guidelines.
Também não podemos esquecer que a prototipação desses elementos contribui muito
para compreender como faremos a composição de todo o layout do app.
Na Alura temos um curso que ensina justamente como trabalhar [**protótipos mobile
no Axure**], que poderá te auxiliar na produção de protótipos navegáveis e
dinâmicos.
Aprenda a solucionar essa questão, congelando um arquivo Python em um simples

executável,com o **cx_Freeze** e compartilhe suas aplicações com mais gente!"
imagem
Recentemente, andei trabalhando em um simples projeto em **Python** para cálculo de

IMC. Meu código simplesmente pega o input de altura e peso do usuário e imprime o
IMC com a fórmula **Peso / Altura²**:
python
O programa funciona bem, podemos até testar:
python
Certo! Gostei do resultado e resolvi mostrar para alguns amigos. O problema é que,
como eles não são programadores, não tinham **Python** instalado na máquina deles.
E agora? Vou ter que pedir para eles instalarem o interpretador Python, ou uma IDE,
apenas para rodar meu pequeno programa? Ou pior, será que eu mesmo vou ter que
instalar no computador deles, já que eles não entendem muito disso?
Dando uma olhada no meu computador, percebi que tenho vários programas instalados
que executam arquivos sem a necessidade de eu instalar um interpretador ou algo do
tipo. Como eles fazem isso? E se a gente fizesse o mesmo?
O ideal seria se conseguíssemos transformar nosso arquivo
ìmc.py` em um executável mais genérico (como é qualquer executável no Linux, ou os

`.exe` no Windows), que pudesse rodar sem problemas. Felizmente, isso é até que bem
simples!
## Congelando nosso programa Python com o `cx_Freeze`
A ideia de transformar um programa`.py` em um executável comum não começou com a

gente, como você deve imaginar.
Assim, hoje em dia já existem diversas ferramentas e scripts que podem fazer todo
esse processo de conversão para gente, como o [**PyInstaller**], o [py2exe] e o
**[cx_Freeze]**.
Usaremos o **cx_Freeze**, por ser multi-plataforma e de simples usabilidade. O

primeiro passo, como sempre, é instalar esse pacote Python. Para isso, usamos o
[pip], no terminal:
python
> Em sistemas baseados em UNIX, é possível que esse comando necessite de permissão
sudo para funcionar
Instalado o pacote, com um simples comando no terminal podemos já criar nosso

executável. O comando base é simplesmente `cxfreeze`, mas, como queremos organizar
um pouco melhor, usaremos a _flag_ `--target-dir` para indicar a pasta onde
queremos que fique nossos arquivos:
python
Depois de um longo _output_, a pasta `calculadora-imc` é criada. Dentro dela, temos

a seguinte organização:
imagem é o executável.
Podemos até testá-lo:
imagem, ou até mesmo com pessoas que têm instalada apenas uma versão diferente da
que trabalhamos em nosso código.
Por conta disso, vários scripts foram criados para converter um arquivo `.py` em um
simples executável que poderia funcionar sem a instalação do Python. Hoje,
abordamos o **cx_Freeze**, que é multiplataforma e bem simples de usar!
No [**artigo sobre arrow functions**] criamos um módulo para imprimir o código da

turma e o nome dos funcionários da escola. Agora o back-end precisa utilizar esse
mesmo módulo, mas por enquanto o nosso código só funciona no lado do navegador.
O back-end possui um único arquivo chamado àpp.js` e o que queremos é encontrar

uma maneira de reutilizar nosso módulo dentro desse arquivo sem precisar reescrever
a classe novamente. Como podemos fazer isso?
## Importando nosso código
Como o back-end é escrito em [**node.js**], podemos fazer uso de uma função chamada
**require** que vai ser responsável por chamar o nosso módulo
`moduloDeImpressao.js` para dentro do nosso àpp.js`. É essa função que vai ler e
interpretar nosso módulo. Assim podemos reutilizar o nosso código sem precisar
reescrever a nossa classe.
js
![imagem do terminal com erro]
Como podemos ver, algo de errado aconteceu. Se o **require** é o responsável por

chamar o nosso módulo para a aplicação principal, por que então não conseguimos
utilizar o método ìmprime` para imprimir os nomes dos funcionários e o código da
turma?
## Exportando nosso código
O **require** é responsável por interpretar e retornar o conteúdo do código para

que possamos utilizar na aplicação principal, porém o que está acontecendo é que
ele não está encontrado nada exportável dentro do arquivo, ou seja, nada está
publico.
Para que o nosso código funcione na aplicação principal além de importar temos que
lembrar de exportar também, ou seja, deixar o nosso código visível para a aplicação
principal. Para fazermos isso utilizamos o [**module.export**], com isso nosso
código fica da seguinte maneira:
js
Agora conseguimos ver a saída:
![image alt text]
Com a utilização do `module.export` conseguimos atingir nosso objetivo que era

tornar nosso código reutilizável sem precisar reescrever dentro da aplicação
principal, mas como o `module.exports` funciona?
## Exports
O sistema de módulos do `Node.js` é responsável por criar o objeto `module.export`

e o **export** aponta para esse objeto, podendo ser usado para **retornar funções e
objetos** bastando somente adicioná-los ao export.
js
Como o exports é uma referência para o `module.exports` utilizamos essa sintaxe

apenas para adicionar objetos e funções, se precisarmos exportar algo como uma
classe vamos precisar utilizar o `module.exports`
Se ficou interessado em como o Node.js funciona e como você pode utilizá-lo melhor,
aqui na **Alura** temos uma [formação desenvolvedor Node.js]. Nela, você verá
**como criar um servidor web, trabalhar com persistência de dados, utilizar
middlewares**, dentre outras muitas coisas.
Estou me preparando para a certificação da Oracle e tive que lidar com a seguinte
situação:
Como pegar uma parte de uma `String`? Vamos verificar a classe `Livro`:
java
Adicionando um livro novo:
java
E essa descrição gigantesca? Vamos imprimir o livro e ver o que acontece:
java
Se apenas um livro já está ocupando todo esse espaço imagina uma lista com vários!
Não vai ser nada legal... Que tal, no momento da impressão, **pegarmos apenas os 30
primeiros caracteres**? Podemos fazer isso utilizando o método `substring()` da
classe `String`. Então vamos sobrescrever o método `toString()` da classe Livro:
java
Imprimindo novamente o livro:
java
Muito bom! Mas o que significa os parâmetros 0 e 30? O método `substring()` tem a
seguinte assinatura: `substring(int beginIndex, int endIndex)`. O índice inicial
começa no 0, por isso coloquei o 0 como primeiro parâmetro, mas e o segundo
parâmetro? Vai até a casa 30? Vejamos:
imagem` também recebe apenas o índice inicial:
java
Imprimindo o livro novamente:
java
Ué, o que aconteceu??? Como podemos ver está faltando uma parte da descrição, ou
seja, quando utilizamos o `substring()` com apenas um parâmetro, informamos que
queremos que ele pegue o pedaço da `String` a partir do índice informado, ou seja,
a partir do índice 30 até o final.
Legal, vimos que o `substring()` tem a capacidade de pegar um pedaço da `String` de

acordo com o índice, mas por que eu devo sempre começar por 0? Vamos **supor** que
precisamos fazer uma paginação pegando os 30 próximos caracteres de um texto e que
agora o **índice inicial comece pelo 1** e o **índice final é incluso**:
java
Aparentemente melhorou, mas vamos verificar a segunda página:
java
E aí? Ele vai pegar 30 ou 29 caracteres? Agora vamos verificar com o padrão atual:
java
Veja que é bem mais natural entender que serão devolvidos os próximos 30 caracteres
em cada uma das páginas. Devido a essa situação o padrão de iniciar pelo 0 e não
incluir o último índice foi adotado!
Gostou do `substring()`? Quer aprender mais detalhes da linguagem Java e se

preparar para a certificação da Oracle? Pensando nisso, o instrutor Guilherme
Silveira criou a [**formação de certificação Java**] com 9 cursos preparatórios
para a certificação da Oracle!
Uma empresa que vende roupas e acessórios criou dois novos modelos de saia e a
equipe de marketing deles decidiu realizar uma campanha de um mês no Facebook Ads e
Anúncios do Instagram com o objetivo de vender esses modelos.
Após o fim da campanha, a empresa queria saber qual retorno obteve dessas
campanhas, ou seja, quantas saias, efetivamente venderam. Ou seja, descobrir quanto
desse investimento retornou para eles.
Dentro do Marketing, existe uma maneira de calcular esse retorno, utilizando os

dados investidos e o quanto a empresa adquiriu depois de uma campanha. A fórmula é
a seguinte:
imagem. Além do investimento em hospedagem do site e domínio.
imagem, dá 5,66, o que significa que a cada 1 real investido, a empresa obteve R$
5,60 reais de retorno. Como é um resultado positivo, a campanha gerou lucro para a
empresa.
Por fim, para o cálculo do ROI no Marketing Digital é só utilizar a mesma fórmula
do Marketing tradicional, porém, focando em um período ou campanha específica, e
colocar no investimento tudo que foi gasto em plataformas digitais, o total gasto
com anúncios nas redes sociais, em domínio e hospedagem de site. E o retorno obtido
após durante o período ou campanha escolhido.
Se quiser saber um pouco mais de ROI e como ele pode ser aplicado em outros
investimentos, este post te ensina a [**como calcular o ROI dos treinamentos online
realizados na sua empresa**].
Caso também queira saber mais sobre como divulgar sua empresa nas redes sociais,
aqui na **Alura** temos uma [**Formação em Social Media**]. Nela você vai ver como
trabalhar, divulgar e impulsionar sua marcas nas redes sociais.
Ao pensar em uma carreira que envolva as redes sociais, você certamente se informa
sobre a formação e os conhecimentos técnicos que ela demanda, não é mesmo? Mas e as
habilidades que você precisa ter como [**profissional de social media**] para atuar
nesse mercado? Isso porque, em uma área sempre em evolução, são elas que vão fazer
você crescer, destacar-se e, claro, ter um bom retorno financeiro.
Neste post, apresentamos 7 habilidades do profissional de social media que vão te

deixar por dentro de tudo o que é necessário para seguir essa profissão. Confira:
## 1 Ser heavy user de redes sociais
Pode parecer óbvio, mas ser um profissional de social media requer que você seja um
**heavy user**, isto é, um usuário assíduo de redes sociais no seu dia a dia.
Afinal, não se trata apenas de ter algumas contas no Facebook, no Twitter e no
Instagram e monitorá-las no trabalho. Pelo contrário, é preciso passar boa parte do
seu tempo em frente ao computador trabalhando, pesquisando, criando novas ideias e
buscando na sua principal fonte, no caso a internet.
A cada dia, novas comunidades e aplicativos surgem e podem ganhar bastante
popularidade o que certamente vai atrair potenciais consumidores da marca da qual
você gerencia os perfis.
Logo, estar atento e ser proativo na sua rotina enquanto usuário dessas redes é o
que vai lhe permitir se destacar frente a concorrência. Em outras palavras: é
preciso saber explorar as mais diferentes ferramentas para se comunicar, interagir
e conhecer melhor os seus seguidores e o que eles desejam.
## 2 Saber mexer em programas de edição
Além do exemplo anterior, é importante que você tenha familiaridade com programas
de edição, especialmente os da Adobe (como o [**Photoshop**], o [**Illustrator**] e
até mesmo o [**Premiere**]).
Isso porque, em situações como coberturas de evento e **ações de marketing**

durante períodos sazonais como o Natal, pode ser necessário que você mesmo faça
algumas edições em imagens ou pequenos vídeos, seja para corrigir a cor, tratar a
luminosidade ou acrescentar legendas e ilustrações.
E isso não é válido apenas para quem trabalha em empresa ou como freelancer, mas
também para quem atua em agência de publicidade e está acostumado em contar com o
suporte de um ou mais designers para essas funções. Quanto mais conhecimento e
capacidade de adaptação, melhor.
## 3 Dominar a língua portuguesa
Outra habilidade requerida para ser um profissional de social media é ter domínio
sobre a língua portuguesa. E não se deixe enganar: isso não significa que você vai
usar a norma culta ao publicar nas redes sociais.
O motivo disso é que você vai escrever posts, gerenciar campanhas online e,
principalmente, interagir com os seguidores dos perfis em nome de uma marca,
representando-a. Ou seja, qualquer equívoco cometido recai sobre a empresa, e não
sobre você.
Por essa razão, é fundamental ter habilidade com o português para saber se
expressar, não ser prolixo e evitar erros ortográficos e gramaticais que
comprometam a imagem da empresa ou da figura pública que você maneja diariamente
online.
## 4 Ter noções de marketing
Um aspecto muito presente na rotina do profissional de social media são os

conceitos de marketing, especialmente o de [**marketing de conteúdo**] que serão
aplicados desde o planejamento do material que será veiculado online até o controle
de desempenho de cada ação pensada para as redes sociais.
Por esse motivo, você precisa ter noção dos conceitos e da aplicação dessa vertente
para tirar o melhor proveito de cada ferramenta virtual ao interagir com os seus
seguidores.
Dessa forma, é possível cativá-los com assuntos que sejam interessantes para eles e
que fujam do modelo tradicional de fazer publicidade (muitas vezes considerado
maçante e invasivo).
## 5 Atender e monitorar os clientes online

Outra habilidade indispensável é saber como monitorar o cliente, estando atento
àquilo que o satisfaz ou não, e interagindo com os consumidores que querem ser
ouvidos, especialmente quando eles têm dúvidas, sugestões ou reclamações.
Existe um conceito chamado **SAC 2.0**, que aborda justamente isso: estar presente
online e analisar como a marca se comunica com os seus seguidores, não apenas
vendendo produtos ou serviços, mas sim:
- criando laços e identificação;

- remediando crises de imagem;
- prestando um atendimento diferenciado que gere engajamento;
- e coletando o feedback das pessoas.
A partir disso, é possível utilizar todas essas informações obtidas diariamente em

futuras estratégias de marketing que têm como objetivo fidelizar e conquistar esse
público virtual.
## 6 Gerar e compreender relatórios
Gerenciar perfis nas redes sociais não se resume apenas à interação com
consumidores e potenciais clientes ou publicar conteúdo diariamente.
Isso porque, por trás da gestão de qualquer página ou afim, há uma estratégia que
busca alcançar algo — seja geração de leads, promoção de um produto/serviço ou
criação de uma identidade, por exemplo.
Para tanto, é necessário checar se o planejamento e o conteúdo elaborados estão

surtindo o efeito desejado. E a forma de conferir isso é por meio de relatórios
gerados nos analytics das redes e dos programas vinculados a elas para programar
posts e outros materiais.
A partir desses informes, você acompanhará o desempenho de diversas métricas, tanto

do conteúdo orgânico quanto do pago (incluindo promoções e campanhas), como:
- alcance;
- cliques;
- curtidas;
- engajamento;
- menções;
- visualizações;
- e muito mais.
## 7 Ser um profissional de social media criativo e antenado
Por fim, ser um profissional de social media requer criatividade e estar sempre
antenado, afinal, você vai trabalhar com criação de conteúdo. Portanto, é
necessário que você não fique engessado ou sem material relevante para publicar,
pois os seguidores podem perder o interesse e deixar de interagir com a marca.
Isso se torna mais grave graças:
- à efervescência de assuntos;
- à diversidade de postagens diárias no feed de notícias de cada pessoa;
- e à pressa em consumir que os usuários de redes sociais alimentam constantemente.
Ou seja, ser criativo é indispensável para se tornar relevante e gerar engajamento.

Logo, essa habilidade envolve desde questões de produção, seja escrita ou visual,
até o timing, isto é, aquela capacidade intuitiva de aproveitar assuntos virais e
usar a isso a seu favor.
Como você leu, ser um profissional de [**social media**] significa estar antenado
às novidades, disposto a se adaptar, ser proativo e dinâmico para representar uma
marca online e garantir que não apenas a visibilidade dela, mas também o
engajamento e a conversão sejam **métricas** sempre crescentes.
E, se você gostou deste artigo, não deixe de compartilhá-lo com os seus amigos que
também estão interessados nessa área de atuação!
A primeira vez que um usuário entra no app Imagly, se depara com essa tela:
imagem
Trabalhando bem esse primeiro processo de onboarding (primeira experiência de

navegação do usuário), conseguimos melhorar a UX. Para lapidar ainda mais a
usabilidade do seu app, a Alura tem um curso de [**UX Usability**] muito
interessante com mais orientações sobre essa etapa!
imagem
Uma escola precisa imprimir uma lista de todos os funcionarios e o código da turma,
e para realizar essa ação temos a seguinte classe:
js
O problema é que após o teste inicial:
js
Está sendo mostrado no console o seguinte erro:
imagem =>`.
Mas a Arrow Function não é só uma maneira menos verbosa de escrever uma função, ela
tem uma característica em particular que vai nos auxiliar em nosso problema: **o
escopo léxico**. Mas como assim o **escopo léxico**?
## Escopo Léxico
Escopo léxico, significa que podemos acessar a propriedade **código** dentro do

nosso forEach. O `this` não irá variar de acordo com o **contexto**. Agora o como o
contexto\*\* \*\*do `this._codigo` é o da classe `MóduloDeImpressão` temos acesso a
propriedade código:
js
Agora que sabemos como funciona o`this` e a arrow function, vamos aplicar no nosso
problema.
## Resolvendo o problema
Agora utilizando uma arrow function em nossa classe, temos acesso ao construtor no
momento em que entrarmos no laço do`forEach`, porque o `this._codigo` vai estar
sempre no contexto da classe `ModuloDeImpressao`.
Depois de aplicar a técnica da arrow function, nosso código ficou assim:
js
Quando instanciamos um novo`ModuloDeImpressao`:
js
Temos como resultado no console:
![]
Ótimo, conseguimos resolver nosso problema com relação ao contexto do `this`! Agora
já temos o código da turma e o nome dos professores.
## Outra solução
Além das arrow functions, outra maneira que podemos solucionar esse problema é
através do método [**bind**], que vai fixar um valor para o `this`, assim ele não
irá variar de acordo com o contexto em que está inserido.
js
Como podemos ver, o `bind` vai passar um contexto para um função que não é dela, ou
seja, o `this._codigo` dentro do `forEach` vai ter o contexto da classe
`ModuloDeImpressao`.
## Para saber mais
As [**Arrow functions**] tem outras propriedades interessantes como:
- **Retorno:** Não precisamos declarar explicitamente o retorno quando temos um

bloco apenas de código, a última expressão realizada vai ser o retorno da arrow
function.
js
- **Nome:** As Arrows functions ganham nome da variável atribuida quando da criação
js
- **Construtor:** Não é possível criar construtores com Arrow function
js
Se ficou interessado em como o Javascript funciona e como você pode utilizá-lo

melhor, aqui na Alura temos uma [**formação em desenvolvimento Javascript**]. Nela,
você verá como programar em Javascript, utilizar expressões regulares, dentre
outras muitas coisas.
Na App que estou desenvolvendo para armazenar meus cursos realizados na Alura, fiz
uma lista de cursos e listei alguns que realizei:
imagem` que nos permite criar um context menu para a `ListView`:
java
Porém, da mesma forma como vemos nos demais listener do Android, precisamos
implementar a interface `View.OnCreateContextMenuListener()`. Portanto, faremos a
implementação utilizando o recurso de classe anônima:
java
A partir do parâmetro `contextMenu` podemos criar opções para o nosso context menu
utilizando o método àdd`:
java
Note que enviamos 4 parâmetros:
- **1º parâmetro:** Refere-se ao `groupId`.

- **2º parâmetro:** Nesse parâmetro enviamos o ÌtemId` que é justamente o **id do
menu**, ou seja, é por meio dele que identificaremos esse menu.
- **3º parâmetro:** Nele informamos o òrder`, ou seja, a posição que queremos
ordenar o menu.
- **4º parâmetro:** Indica o nome que será exibido para o menu.
Note que tanto no `groupId` quanto no òrder` colocamos o valor `Menu.NONE`. Essa
constante equivale a 0 e significa que não queremos atribuir esses parâmetros. Em
outras palavras, no código acima, criamos um menu com ìd` 1 e nome `"deletar"`.
Vamos testá-lo?
Se rodarmos a nossa App, a princípio, nada mudou. Mas, se pressionarmos um item da

lista:
imagem` que equivale ao valor `true`. Mas o que isso significa? Quando retornamos
`true`, informamos que o click para esse menu, será consumido apenas por ele.
Qual é o nosso próximo passo? Precisamos verificar se a opção "deletar" foi

escolhida, porém, como podemos fazer isso? O parâmetro ìtem` corresponde ao item
que foi clicado, ou seja, a partir dele podemos verificar o ìd` e, se for igual a
1, saberemos que é o menu deletar.
Podemos utilizar ìf`s e èlse`s, porém, já que sabemos o que esperamos, isto é, o
ìd` 1, utilizaremos o `switch case`:
java
Agora precisamos implementar a funcionalidade para deletar o curso. Porém, qual

curso deletaremos? Em outras palavras, precisamos pegar primeiro a posição do curso
que queremos deletar. Para pegarmos informações do item que chamou o context menu,
precisamos utilizar o método `getMenuInfo()` do objeto ìtem`:
java
Então atribuímos o retorno desse método para um objeto do tipo

ÀdapterView.AdapterContextMenuInfo`:
java
A partir do objeto `menuInfo` podemos pegar a posição do item que chamou o context
menu por meio do atributo `position`:
java
Agora que temos a posição desejada, podemos deletar o curso! Porém, antes de
implementar o código, criaremos o método `deletar()` enviando a `position`:
java
Para deletar um item da lista, basta apenas usarmos o `remove()` da `listaDeCursos`

enviando a `position`:
java
E então, notificamos o àdapter` dizendo que a lista foi modificada por meio do
método `notifyDataSetChanged()`:
java
Vamos testar o nosso código? Vejamos o resultado:
imagem
Que tal aprender a desenvolver a sua App Android desde o zero? Aqui na Alura, temos
diversos [**cursos online de Android**] onde ensinamos você a desenvolver a sua
primeira App com os principais conceitos do início ao fim.
Ao desenvolver o layout de um site o designer entregou apenas a versão para desktop

e, no momento de realizar os testes em diferentes dispositivos chegou-se a esta
situação medonha/preocupante/esquisita:
imagem de layout para entregar, em diferentes tamanhos de tela e dimensões. Isso

facilitará na visualização e compreensão das mudanças que deverão acontecer.
Podemos escolher, por exemplo, trabalhar com a largura de 1920px, uma intermediária
de 1024px, e uma bem menor de 360px, já que são tamanhos bastante utilizados hoje
em dia, segundo o gráfico anterior.
E então, teríamos algo assim:
imagem no momento de redimensionar o layout para outros tamanhos, uma vez que
seguiremos sempre um guia de proporções iguais. Estes são os famosos grids.
**Mas, atenção! O conceito de grid, neste momento, não é o mesmo que aquele
aplicado em diagramação de revistas e jornais.**
Agora estamos falando de grids fluídos, isto é, grids flexíveis que ajudarão a
orientar as adaptações proporcionalmente para cada tamanho de tela.
## Preparando o grid
Certo, agora sabemos da necessidade de aplicar os grids fluídos no layout. Mas como
definir a quantidade de colunas e espaçamentos ideais?
No exemplo anterior aplicamos 3 colunas ao layout e conseguimos um resultado legal,

mas e se tivéssemos que mudar nosso layout para uma divisão em quatro colunas?
imagem, como 24, 36, 48... E, claro, é importante lembrar que, quanto mais colunas,
mais trabalhoso será lidar com essas adaptações.
Além disso, devemos sempre analisar como faremos essa organização dos elementos
pensando na experiência que cada dispositivo oferece.
Em telas maiores podemos dividir nosso layout em um maior número de colunas sem
sobrecarregar o visual da página, enquanto, em telas menores, menos colunas
garantem uma melhor visualização de textos e imagens.
![]
![]
Note que, além da diminuição de colunas, fizemos o reposicionamento dos elementos

seguindo uma ordem de prioridades, como as imagens que já não estão dispostas lado
a lado, mas sim, uma abaixo da outra.
Com isso, garantimos que o nosso layout não seja prejudicado visualmente e o
usuário possa interagir com a página sem perder a qualidade da visualização e da
experiência com a nossa interface.
## Recapitulando...
No início do post apresentamos um problema muito comum entre os designers: definir

as dimensões do layout que será entregue ao cliente.
A partir daí, vimos que esse problema fica ainda mais complexo quando nos damos
conta da quantidade de dispositivos e de diferentes tamanhos de que tela existem
atualmente.
Para isso, definimos que uma boa ideia seria escolher as 3 dimensões mais
utilizadas pelos usuários, um maior, um intermediário e um menor.
Em cima dessa escolha, desenvolvemos nosso layout em 3 versões diferentes e, para

garantir um layout bem adaptado para cada tamanho de tela, utilizamos os [**grid
flexíveis e reposicionamos os elementos**] convenientemente para melhorar a
visualização da página em cada dispositivo.
Por fim, podemos concluir que não existe um tamanho padrão de dimensões para
desenvolver o layout de um site, mas existem meios de estabelecermos essas
dimensões segundo as estatísticas que levantamos e das características do nosso
projeto.
Na Alura temos também um curso de **[Photoshop para web]** com dicas e tópicos
muito interessantes para quem aproveitar o máximo possível da ferramenta para o
desenvolvimento de layouts de sites.
imagem
Enfim, depois de muito pensar nos prós e nos contras, você resolveu fazer um site
ou blog para o seu projeto. No entanto, algo está errado: as pessoas simplesmente
não estão acessando a página. Pode ser algum erro de **SEO ou de divulgação**, como
também é possível que você esteja cometendo alguns erros de design.
Felizmente, existem maneiras para você tornar o seu site mais simples e mais
atraente para os visitantes. Continue a leitura deste post para identificar os
problemas mais comuns e aprender a resolvê-los:
## 1\. Falta de informações na página inicial
Existem muitos sites que não publicam as suas principais informações na página
inicial, e isso pode prejudicar [**a experiência do usuário**]. Por mais que isso
não seja um erro, o recomendado é facilitar o acesso para esse tipo de dado, a fim
de que o seu possível cliente entre em contato.
Além disso, o visitante pode achar cansativo ter que clicar diversas vezes para
encontrar as informações sobre sua empresa. Lembre-se: busque sempre priorizar o
que o usuário precisa, de forma simples e eficaz, por exemplo: seu e-mail, telefone
ou outra forma de contato. Assim, você aumenta as chances de conversão e evita a
perda de um possível consumidor.
## 2\. Poluição visual
Sabe quando você entra em um site e parece que você ficou sem ar? Tudo querendo
chamar sua atenção de alguma forma e você não tem nenhum descanso visual ali.
Atente-se se o seu site está visualmente poluído. Esteticamente falando, ter uma
página com vários pop-ups, anúncios e propagandas não agrada a ninguém e prejudica
a experiência do usuário.
Quem visita o seu site e observa esse monte de informações pode se perder em
relação ao que realmente procurava. Em geral, pessoas que entram na internet para
pesquisar estão em busca de algo que seja rápido e simples. Uma ótima solução para
esse tipo de erro de design é diminuir a quantidade de links que devem ser
clicados.
## 3\. Qualidade das imagens
Além da poluição visual, você deve se atentar à [**qualidade das imagens**] que
anexou ao site. Outra questão é se todas estão visíveis principalmente em lojas
virtuais.
Por exemplo: no seu portal são vendidos porta-retratos customizados, mas as imagens
que você postou aparecem como indisponíveis. Quem passar por essa imagem e ler o
que está escrito pode pensar que não há produto à venda.
## 4\. Sites que não se adaptam aos dispositivos móveis
Cada vez mais, as pessoas estão se sentindo confortáveis em acessar os sites por
meio do aparelho celular. Mas, para isso acontecer de maneira eficiente com a sua
página na web, é necessário que você adapte o layout, tornando o seu [**site
responsivo**] ou criando uma versão mobile.
Você já entrou em algum blog algum blog que precisava dar zoom para enxergar o
texto? Ou com tudo desconfigurado na tela quando acessa via smartphone? Se sim,
você provavelmente ficou muito frustrado.
Pois é exatamente isso o que acontece com os seus clientes e com os seus possíveis
clientes quando não conseguem acessar o seu site no smartphone, tablet ou outro
dispositivo móvel.
## 5\. Cores que não combinam com a identidade visual

Imagine que o banco que você tem conta resolve mudar a cor do internet banking de
roxo para laranja ou de vermelho para verde, provavelmente você vai ficar
assustado.
Por isso tome sempre cuidado com as cores utilizadas no seu projeto. É preciso que
elas estejam de acordo com a identidade visual da marca.
Além disso, seria interessante criar uma paleta para que os tons combinem entre si,
sem causar poluição visual. Melhor dos mundos seria a criação de um manual da
marca, um Manual de Identidade Visual
Também é recomendado utilizar a psicologia das cores, fazendo com que tudo no
[**design**] do seu site funcione a favor do seu negócio.
## 6\. Erros nos links
Links quebrados em qualquer plataforma web é um tanto desesperador. Será que é o

site, o computador ou a conexão que deu pau? É preciso tomar muito cuidado na hora
de linkar as páginas e artigos do seu site ou blog.
Qualquer usuário que esteja navegando na sua página certamente desistirá e sairá do
seu site ao encontrar um link que não leva a lugar nenhum.
**Então, tome cuidado seja com a linkagem interna (para outras partes do seu
próprio site),seja com a linkagem externa (quando você faz um hiperlink para um
site ou blog parceiro).**
Além disso, quando for atualizar qualquer parte do seu site, verifique se haverá
alguma mudança e confira se o hiperlink já inserido continua correto. **Google
Analytics** pode ser seu amigo nessa.
## 7\. Falta de cuidado com as fontes
Quando for criar a identidade visual do seu site, você também deve se preocupar com
a fonte escolhida. Busque algo fácil de ler e que não torne o site cansativo.
Sobre o tamanho, [**o ideal é acima de 16 pixels, pois esse é o padrão recomendado
para os navegadores**]. Os usuários poderão ajustar a fonte de acordo com o que
mais gostam. Mas lembre-se: nem todas as pessoas sabem fazer isso.
Por isso, mantenha a letra de forma que a maioria possa ler com tranquilidade as
informações.
## 8\. Excesso de publicidade
Imagine que você entrou em um site para buscar uma simples receita de bolo e, ao
clicar, 2 abas com publicidade foram abertas. Isso é muito incômodo!
Por mais que você queira divulgar o trabalho de um patrocinador, não é preciso
fazê-lo de forma tão invasiva.
O excesso de propaganda interrompe a leitura do usuário e incomoda bastante,

gerando uma rejeição ou fazendo com que ele nunca mais queira acessar o seu site.
## 9\. Problemas visuais nos textos
Nada pior do que clicar em um artigo e ver que ele é um texto que parece um bloco,
sem nenhuma divisão de parágrafos. Fazer o texto com trechos breves torna a leitura
mais fácil e menos cansativa.
Busque, também, criar subtítulos e dispor os textos de forma que o usuário consiga
“escanear” as partes mais interessantes para aumentar o seu envolvimento com o
conteúdo e a sua permanência no site.
Os erros que acontecem em sites e blogs, definitivamente, são muito comuns. Mas,
com o devido cuidado e com a ajuda de profissionais de confiança para criar ou para
atualizar o portal de sua marca, é possível ter um lugar impecável na web. Isso,
com certeza, vai fazer o seu negócio se destacar!
Gostou deste conteúdo sobre os erros de design mais comuns em sites e blogs? Então
compartilhe-o nas suas redes sociais para ajudar mais pessoas!
Já sabemos que quando se trata de SQL, [**nulo é nulo e vazio é vazio**]. Nosso
sistema permite o campo nulo, então temos alguns nulos no banco:
sql
Agora, queria trazer também a empresa(que é um campo opcional). Mas se ela fosse
_null_, gostaria que trouxesse algo mais significativo, como "Não informada". O que
quero então é trazer um valor padrão na hora de executar a query:
sql
O **coalesce** traz o primeiro valor não nulo do que passamos pra ele. Isto é: se a
empresa for nula, ele devolve "Não informada". Também podemos usar com números:
coalesce(valor, 0).
Dica do Rafael Dipold!
Uma floricultura me pediu pra criar uma funcionalidade em que **a cor de fundo do
site mudasse de acordo com as horas do dia**. Vamos ver como podemos encontrar as
horas do dia e **alterar o CSS** tudo isso usando JavaScript.
## Trabalhando com datas e horas
O **JavaScript** possui a classe `Date` que nos permite trabalhar com datas e
horários. Se chamarmos o construtor `Date` sem parâmetros:
js
Conseguimos obter a data e o horário atual:
`Thu Nov 01 2018 13:51:03 GMT-0300 (Brasília Standard Time)`
Ótimo, resolvemos uma pequena parte do problema que era descobrir como pegar a data
e hora, agora vamos tentar ser mais específico e encontrar somentes as horas do
dia.
## Encontrando as horas
Como `Date` é um classe, ela possui um método para nos auxiliar a encontrar as
horas como o método `.getUTCHours()`
js
Conseguimos ser bem específicos e encontrar as somente as horas, o problema foi que
o número que tivemos de retorno foi 15 e no dia em eu rodei esse código eram exatas
13:00 horas, logo o retorno deveria ter sido 13 e não 15. O que ocorreu ?
## Resolvendo o problema das horas
Conseguimos pegar a hora do dia, mas ela está vindo errada!. O problema da hora
encontrada não ser a hora real aconteceu por que o método `getUTCHours()èstá
trazendo a hora UTC (**Tempo Universal Coordenado)** Para resolver essa situação
vamos utilizar o método `getHours` da classe `Date`
js
Ambos os métodos trazem apenas as horas, a diferença é que `getHours()` retorna o

horário local.
No momento em que eu rodei o script a hora retornada foi `13` , Uma parte do
problema foi resolvido, agora vamos ver como alterar a cor do fundo do site usando
JavaScript.
## Alterando as cores de acordo com as horas
Atualmente a cor de fundo do site é amarelo, o que eu quero é deixar ele azul a
partir das 16:00. Com o JavaScript nós conseguimos alterar a cor do fundo da página
utilizando os seletores CSS.
js
## Alterando CSS com JavaScript
Agora que já sabemos como pegar a hora do dia, e como alterar a cor de fundo de uma
página, vamos criar um script com a ajuda do ìf` para fazer a mudança de horário
js
## Para saber mais
Além de invocar o construtor sem parâmetro, existem outras maneiras para encontrar
data e hora usando o objeto `Date`
Passando o valor da data em milisegundos. De acordo com a documentação do

[developer mozilla], a **data do JavaScript** é baseada no valor de tempo em
milissegundos desde a meia noite de [01 de Janeiro de 1970, UTC].
Com um dia correspondendo a 86.400,000 milissegundos.( essa parte é do texto da

mozilla)
js
Obtemos como resposta:
`2128-06-11T08:53:20.000Z`
Passando dia, mês e ano como parâmetro, lembrando que, nessa notação, o mês de
janeiro é o 0:
js
`2015-11-01T02:00:00.000Z`
Passando como parâmetro do construtor uma string:
js
`2015-10-01T03:00:00.000Z`
# Métodos e funções úteis em JavaScript
É importante conhecer bem as funções básicas do JavaScript, como o [replace e

outros métodos da String](/artigos/javascript-replace-manipulando-strings-e-regex),
[conversão de String para número](/artigos/convertendo-string-para-numero-em-
javascript) e a [formação de números em JavaScript](/artigos/formatando-numeros-no-
javascript).

melhor, aqui na Alura temos uma [**formação front-end**]. Nela, você verá como
programar em Javascript, utilizar expressões regulares, entre outras coisas.
imagem
Neste episódio do Alura Live, Gabs Ferreira recebe Jeferson Sensei pra falar sobre
Lua: uma linguagem de programação brasileira que se tornou muito popular entre os
desenvolvedores de jogos no Brasil e no mundo.
Conheça mais dessa área que tem crescido cada vez mais!
https://www.youtube.com/watch?v=WowR7qOygRw
Quer saber mais? [Assista essa live completa!]
[**Conheça a linguagem Lua**]. :)
- Que tal utilizar Unity para tirar suas idéias do papel?
[**Unity**]: Criação de um jogo de sobrevivência à zumbis para Web. [Jogos mobile

com Unity:] Diversão com a Game Engine.
- Quer algo diferente para aprender a modelar e animar personagens?
[Maya:] Modele e anime um personagem com motion capture.
- E que tal algo totalmente fora do comum e que vem virando tendência, como jogos
em Realidade Virtual?
[Unreal Engine parte 1]: Crie um ambiente em VR para arquitetura.
Siga a gente no Twitter: [Gabriel Ferreira], [Jeferson Silva] e a [Alurinha]! ;)

Na internet, você já se beneficiou do trabalho de um Social Media hoje. Duvida?
Então responda a estas perguntas:
- Já entrou no Facebook desde que acordou?

- Viu algum vídeo engraçado ou informativo na sua timeline, postado por uma das
páginas que você curte?
- Clicou no link de algum tweet que levou para um artigo de blog?
Se fez qualquer coisa parecida com isso, apareceu no radar de um profissional de

mídias sociais. Ele criou conteúdo pensando em gente como você, e agora analisará o
seu engajamento para melhorar esse conteúdo.
Vamos também dar dicas sobre sua rotina, responsabilidades e ferramentas úteis para
quem começará no ramo. Acompanhe.
# O que é Social Media?
A profissão de Social Media é algo relativamente recente, mas ninguém que a conheça
minimamente tem dúvidas de que veio para ficar e [**ditar tendências**].
O Social Media publica conteúdo em páginas empresariais, interage com os seguidores

dessas páginas, mede os resultados desse trabalho e faz os ajustes necessários para
melhorar o seu desempenho. E tudo isso levando em conta a imagem da empresa e sua
interação com o público, seja ele consumidor ou não.
O fato de haver tantos nomes diferentes para a profissão vem de uma confusão comum
aqui no Brasil aquela entre mídias sociais e redes sociais.
## Qual a diferença entre mídias sociais e redes sociais?
Quase todo mundo usa essas expressões como sinônimos, mas, se formos levar ao pé da
letra, há uma diferença importante que tem a ver com duas das principais tarefas do
Social Media: criação de conteúdo e relacionamento com clientes.
São consideradas mídias sociais plataformas como o Twitter, onde o conteúdo é a

parte mais importante. Quem lê e tuíta por lá quase sempre está interessado em se
informar e divulgar informação.
Aliás, o Twitter é considerado uma das melhores formas de ficar por dentro das
tendências. Ou, como são chamados por lá, os trending topics, marcados pelas
famosas hashtags, que são listas que reúnem os assuntos do momento.
Uma possível explicação para isso é o fato de que a rede social dos 140 caracteres
é dinâmica e sua estrutura de pouco texto favorece o compartilhamento de links,
vídeos e outras formas de conteúdo externo.
Já as redes sociais são focadas em relacionamento. Quando começaram no Brasil, elas

eram conhecidas como “sites de relacionamento”, aliás. A essa categoria pertencem
Facebook, Instagram e tantas outras plataformas em que você se relaciona com amigos
e conhecidos.
## Como é a formação do Social Media?
Se você se interessou por essa atividade, saiba que o perfil do Social Media é o de
uma pessoa bem informada, dinâmica e proativa. Habilidades, aliás, que são
[**requisitos para qualquer bom profissional**] hoje em dia, não é mesmo?
Grande parte dos profissionais da área vem do Jornalismo ou Comunicação Social,

embora não seja necessária uma formação acadêmica para atuar no mercado.
É claro que ser graduado é um grande diferencial para qualquer área em que se vá
trabalhar relacionada ou não à sua graduação. No Brasil, porém, não há curso
superior direcionado ao Social Media.
Mas já temos [**boas opções de especialização**], principalmente online, que

abordam as questões mais importantes da rotina desse profissional.
Tem também muita gente brilhante da área que aprendeu pelo caminho mais duro, isto
é, cometendo erros, experimentando e aprendendo com os resultados.
## Por que ser autêntico é importante nessa profissão?
Por outro lado, há muitos profissionais que não são tão voluntariosos assim. Eles
costumam copiar sem pensar estratégias prontas de empresas que são destaque no
Facebook ou Twitter.
Isso é péssimo para o trabalho do Social Media, já que um dos requisitos mais
importantes e empolgantes do seu trabalho é criar um diálogo entre empresa e
cliente que seja único e adaptado às necessidades das duas partes.
Então, esse é um erro que você não deve cometer. É muito válido aprender com
experiências bem-sucedidas (e também com as malsucedidas) de outras pessoas e
empresas. Mas seja criterioso ao utilizá-las fora do contexto original.
As empresas que contratam esse profissional só vão se destacar realmente se aquilo

que publicam em suas páginas for autêntico. Fora disso, tudo será sucesso de
momento.
# O que faz um profissional de Social Media
Se é como a maioria das pessoas, você tem mais de mil amigos no Facebook e curte
dezenas de páginas. Pode ser que tenha uma conta no Twitter e, quase com certeza,
já criou um perfil no Instagram.
Assim, é nas redes sociais que você se informa, interage com amigos, se diverte e
até mesmo trabalha. Quem é que nunca fez uma reunião de escritório pelo messenger
do Facebook, não é mesmo?
E as empresas sabem que, hoje em dia, todo mundo precisa das redes sociais para
todas essas tarefas. E também que todas essas pessoas são potenciais consumidoras
dos produtos e serviços delas.
Mas como elas vão fazer para selecionar o público certo para isso? Não adianta
passar o dia todo pagando anúncios. Você clicaria numa propaganda de algo que não
tem nada a ver com você?
Essa seleção da pessoa perfeita para o produto perfeito nas redes sociais é feita,
de certa forma, pelo Social Media.
## Ele cria conteúdo
Tire um tempinho e entre em algumas das suas páginas favoritas do Facebook. Há

grandes chances de elas serem de empresas. Aí, você se dá conta de que segue a
página de uma organização que vende produtos e, bem, não são só anúncios que chegam
até você.
Isso tem um motivo. Se essas empresas passassem o dia todo postando coisas do tipo
“compre o meu produto”, você já teria se cansado e descurtido as páginas delas há
muito tempo.
Toda empresa que sabe disso já contratou um Social Media para entender o gosto dos
seguidores e criar conteúdo do interesse deles. Ou seja, manter uma relação baseada
no interesse mútuo, e não apenas em propaganda.
Aí você pensou em alguém sentado à frente do computador, tomando café e postando

várias vezes ao dia na página das empresas que o contrataram.
De uma coisa você pode ter certeza, o trabalho do Social Media não tem nada de
aleatório. Qualquer mídia ou rede social mede o desempenho de cada postagem e, a
partir desses números, é possível saber exatamente quais tipos dão mais resultado.
Quando existem números ou “métricas”, como os profissionais de marketing e mídias

sociais gostam de chamar todo o trabalho adquire um sentido.
## E estabelece uma rotina
Dá para entender melhor o gosto do público-alvo e começar a criar conteúdo que

realmente tenha a ver com ele. E, como tudo isso só funciona com planejamento,
experimentação, análise de resultados e modificações, o Social Media precisa de uma
[**rotina**].
A maior parte deles começa o expediente respondendo aos comentários de clientes e

de todo tipo de gente que interagiu com a marca.
As pessoas valorizam as empresas que fazem isso. Todo mundo se sente mais
importante quando é ouvido. E não importa se o que comunicam é uma reclamação, um
elogio, uma crítica ou uma sugestão.
Depois, é hora de se informar sobre o que anda “bombando” na internet e ver, dentre
todas essas possibilidades, o que tem mais a ver com as empresas que são clientes
do Social Media.
A ideia é criar posts relacionados às discussões mais badaladas e que façam sentido
para os seguidores da página e o público-alvo da empresa.
Para nortear a prática de todas essas tarefas, o Social Media se reúne com o setor
de comunicação ou diretamente com os donos das empresas. Lá, uma estratégia é
definida ou modificada, tendo como base os números.
# Exemplos de boas práticas em Social Media
As redes sociais são um fenômeno que veio para ficar, com certeza. Só para você ter
uma ideia da importância delas, segundo um estudo, [**55% dos internautas
brasileiros acreditam que a internet se resume ao Facebook**].
Ou seja, muita, mas muita gente mesmo nem ao menos pensa em outra forma de se
conectar que não seja pela rede social de Mark Zuckerberg.
Imagine, num contexto desses, o tamanho da importância de um Social Media? Uma

falha grave em alguma das mídias sociais pode significar muito prejuízo para a
imagem de um negócio.
Hoje, todas as grandes empresas — e uma quantidade enorme de pequenos e médios

empreendimentos constroem a identidade da sua marca nas redes sociais.
E, como o consumidor também mudou muito por causa delas, é muito raro que uma
empresa se destaque em vendas e faturamento se seus clientes não tiverem algum tipo
de identificação com ela.
Um profissional com tantas responsabilidades precisa saber as “regras de etiqueta”

da internet a fundo. Mas, também, como é lá que as empresas se destacam, ele terá
que arriscar para entrar no gosto dos clientes.
Por isso, é muito importante conhecer, dominar e aplicar as boas práticas de um

Social Media. Muitas delas você só conhecerá colocando a mão na massa. Mas algumas
das principais a gente lista para você:
## Planeje tudo
Não há a menor chance de uma estratégia de redes sociais dar certo se você ficar o
dia todo tendo ideias aleatórias e postando nas páginas dos seus clientes.
As tarefas do Social Media são organizadas de forma esquemática e detalhista. Ele

cria calendários de publicação e estuda os melhores horários para as postagens.
Tudo isso deve estar pronto muito antes de postar pela primeira vez.
Aliás, boa parte das postagens deve ser programada antecipadamente. Você pode usar
alguns aplicativos para isso. Assim, alivia aquele problema de dormir tarde todo
dia porque tem um cliente que tem engajamento alto nas redes sociais depois da
meia-noite. E, acredite, isso existe.
Além do mais, posts só dão resultados se estiverem dentro de uma estratégia. Qual o
objetivo do seu cliente com a página do Facebook?
Pode ser divulgar a marca, conseguir vendas ou simplesmente manter um canal aberto
para comunicação com os clientes. Cada postagem da página dele deve estar de acordo
com esse objetivo.
## Entre na mente do seu público
Existe uma concepção de público do marketing digital que é preciosa para quem
trabalha com redes e mídias sociais. É o conceito de buyer persona.
Muito mais complexo do que uma definição simples de público-alvo, esse conceito
leva em consideração aspectos muito mais detalhados da vida das pessoas que
interagem com uma marca.
Ele compreende as necessidades específicas de um consumidor ideal que podem ser

preenchidas com um produto. Isso é conhecido pelos profissionais de marketing como
“as dores da persona”.
Quem lê posts que foram criados levando essas técnicas em consideração fica com
aquela sensação de “uau, isso foi escrito pra mim”, o que gera identificação
imediata com a marca e resulta em maior alcance, engajamento e curtidas.
## Crie textos curtos e entenda de experiência do usuário
As redes sociais são muito diferentes de blogs. Embora muita gente goste de
publicar os famosos “textões” nos seus perfis, o ideal para empresas é manter o
conteúdo dos posts bem curto. [Pesquisas] sugerem que o tamanho ideal é de cerca de
250 caracteres.
Toda a lógica do conteúdo produzido e consumido na internet atende a um tipo de
experiência do usuário específico do ambiente virtual.
São peças e textos que devem ser muito escaneáveis isto é, toda a sua proposta deve
poder ser assimilada num correr de olhos, em alguns segundos.
Mais uma vez, o conhecimento do público-alvo ou, numa hipótese melhor, da persona —
ajudará a criar conteúdo escaneável.
Seu público é impaciente? Tem o hábito da leitura? É ligado em design ou prefere

que os aspectos visuais sejam bem resumidos, apenas colaborando para a transmissão
da mensagem? Responder a essas perguntas é o primeiro passo para uma boa prática de
produção de conteúdo nas redes sociais.
## Evite polêmicas
Não dá para negar que polêmicas geram visualizações. Tanto que muitas das ditas
“celebridades da internet” vivem criando conteúdo sobre os assuntos mais
controversos do momento.
Fazer isso é uma estratégia de altíssimo risco para empresas. Se procurar em

qualquer guia de boas práticas das redes sociais na internet, você ouvirá que a
postura esperada das páginas de negócios é a neutralidade.
Isso é verdade em 90% dos casos. Mas há certas situações em que uma postura
indiferente incomodará de verdade o seu público. Logo, é preciso saber a hora de se
posicionar também.
Na maior parte do tempo, você deve evitar escolher assuntos polêmicos como tema das
suas postagens. Ninguém está por dentro de tudo o tempo todo, e o maior risco é
abordar esses assuntos de uma forma superficial e acabar perdendo credibilidade.
Ou, pior, tocar em assuntos sérios de uma forma oportunista e provocar a ira dos
seus seguidores. Foi o que fez o Catraca Livre, [**ao postar sobre o acidente
aéreo**] que resultou na morte dos jogadores da Associação Chapecoense de Futebol.
## Saiba lidar com crises
E já que tocamos nesse assunto, tenha em mente que, por mais que você evite
assuntos espinhosos, crises acabam acontecendo uma hora ou outra.
Esteja preparado para elas. Quando acontecerem, respire fundo, converse com a
equipe de marketing — se a empresa em que trabalha tem uma — ou com o seu cliente.
A partir daí, crie uma estratégia para solucionar o problema.
Evite tomar decisões impulsivas. Isso é uma ótima maneira de gerar mais
instabilidade.
## Meça tudo
As mídias e redes sociais fazem parte do marketing digital.
E esse novo modelo de marketing ainda tem muito de Ciências Humanas, mas incorpora
mais elementos da Matemática e Estatística a cada dia. Cada vez mais, os
profissionais de marketing estão interessados em medir suas estratégias.
Isso tem muito a ver com as facilidades do ambiente digital. Por exemplo, o próprio
Facebook gera todos os números que você precisa para saber se uma postagem deu
certo ou não.
Ele te fala quanta gente curtiu, comentou e compartilhou uma publicação. Além
disso, numa página empresarial, dá para verificar outras métricas bem mais
complexas, como o envolvimento com as publicações, alcance orgânico e pago e muitos
outros.
Twitter, [LinkedIn] e Instagram não possuem mecanismos de mensuração tão profundos.

Mas há ferramentas que podem ajudar nisso. Mais adiante, vamos falar um pouco sobre
como usá-las.
O fundamental é que haja sempre números que mostrem onde e como o Social Media deve
agir e que as estratégias levem essas métricas em consideração.
# Ferramentas de Social Media
Se chegou até aqui, é bem possível que você esteja [considerando seriamente a
profissão de Social Media].
E pode até já estar se perguntando como um profissional desses consegue criar uma
rotina de trabalho em que seja possível postar várias vezes ao dia em páginas de
vários clientes diferentes.
E, ainda, medir resultados e usá-los para refazer as estratégias, aprimorar a

linguagem e alcançar melhor o público da marca.
Para dinamizar o seu trabalho, você precisará recorrer a ferramentas online. Como
sabemos disso, listamos as principais para iniciar:
## Hootsuite
Não dá para começar por outro ponto. O [Hootsuite] te ajuda a gerenciar todas as
suas contas e postagens de uma forma mais organizada e, principalmente, rápida.
Com ele, você agenda posts de inúmeras redes sociais (na versão gratuita, o máximo
são 3). Além disso, pode responder a comentários com um clique, visualizar tudo que
é importante na mesma tela, lado a lado, e muito mais.
Uma solução que otimizará o seu trabalho, permitindo o gerenciamento de conteúdo em

diversas redes sociais, medindo os resultados e interagindo de forma mais prática.
## Facebook Insights
Como dissemos, o Facebook disponibiliza uma [ferramenta nativa] para medir tudo da
sua estratégia nessa rede social.
Para isso, basta clicar na guia “Informações” da página que deseja medir. Lá, você
encontrará ótimas métricas e ainda pode optar por fazer a integração com o Google
Analytics, o poderoso sistema de métricas do Google.
## Social Mention
Uma forma simples de usar, gratuita e eficiente de acompanhar e medir as menções de

um produto ou marca nas redes sociais e na internet de forma geral.
Para aproveitar as funcionalidades do [Social Mention], você só precisa entrar no

site, digitar o termo que quer acompanhar e ele retornará com uma análise detalhada
e os links dos sites em que ele é mencionado.
Se você precisa ficar por dentro do que andam dizendo sobre um produto de um dos
seus clientes, mas não tem tempo de fazer buscas todos os dias, não tem problema. É
possível programar alertas para cada nova menção.
## Pocket
Boa parte do trabalho do Social Media é ter ideias. Ideias de links para postar,
ideias de textos para ler e que vão te ajudar a ter ideias de postagens, GIFs,
fotos e memes.
O [Pocket] é um aplicativo disponível para desktop e dispositivos móveis, como

celulares e tablets. Ele permite, basicamente, que você salve conteúdo para ler
mais tarde.
Pode parecer meio banal, mas é incrível a diferença que faz na sua produtividade
guardar coisas e ler com uma certa regularidade. Você para de interromper o
trabalho para não perder uma referência e ainda lembra de algo que podia ter se
perdido pra sempre.
Muito bem! Pode ser que este texto te ajude a seguir uma profissão antenada, nova e
dinâmica. O mundo e o Brasil, especialmente se organiza cada vez mais em torno das
redes sociais.
E como tudo no ambiente da internet, o mundo desse profissional muda muito rápido.
Ao que tudo indica, são mudanças para melhor, já que o trabalho fica otimizado e,
para quem consegue uma rotina bem estabelecida, bem mais fluido.
Da próxima vez que olhar para a sua linha do tempo no Facebook, Twitter ou
Instagram, pense nesse profissional que está por ali, dando duro para reunir os
seus interesses ao de uma empresa. Você já está no radar dele há um bom tempo.
Quem sabe você não será o próximo gestor de mídias sociais e ajudar a tornar o
Twitter, Facebook e Instagram mais alegres, informativos e propícios para os
negócios?
Concluindo mais um curso eu irei alcançar o top 3 do Alura!
java
Para computar as informações dos pontos usamos a classe Àluno`:
java
Então vamos criar nossos alunos:
java
Agora precisamos de uma **List** para armazenar esses alunos:
java
Testando a nossa lista:
java
Resultado:
```
\[Alex Felipe - 13450, Maurício Aniche - 19930, Guilherme Silveira - 23143,
Rodrigo Turini - 13500\]
```
Pronto! Tenho minha `List` com os alunos. Agora vamos ordenar com o método estático
`sort()` da classe **Collections()**:
java
Espere um pouco... O meu código não compila!? O problema é que o método **sort()**
não sabe como ordenar um aluno, ou seja, ele não sabe qual parâmetro ou critério
deve usar para comparar alunos. Porém, nós podemos informá-lo implementando a
interface **Comparable** na classe Àluno`:
java
Quando implementamos a interface `Comparable`, precisamos preencher o campo do

[**generics**]_ com o tipo de objeto que queremos comparar, nesse caso queremos
comparar com Aluno mesmo. Por fim, precisamos implementar o método **compareTo().**
A regra de ordenação usando o método `compareTo()` compara dois objetos (alunos) e

funciona da seguinte maneira:
- Para alocar o aluno mais a esquerda da lista, retornamos -1.

- Para alocar o aluno mais a direita da lista, retornamos 1.
- quando retornamos 0 significa que os alunos comparados são iguais e não alteram
suas posições.
No nosso exemplo:
java
Estamos indicando que se os pontos do aluno forem maior, mande ele mais para
esquerda (-1), se for menor, mande para a direita (1) e se os alunos forem iguais
não faça nada (0).
Após a implementação do `Comparable`, o nosso código compila! Vamos testá-lo:
java
Resultado:
java
Veja que agora os nossos alunos estão ordenados!
Diferente da ordenação de números, para ordenar lista de objetos específicos, como

é o caso do objeto aluno, é necessário informar como o objeto precisa ser ordenado
implementando a interface `Comparable` e implementando o seu método `compareTo()`.
Há um post da **Caelum** que explica com mais detalhes essa e outras formas de
[ordenação de coleções].
O que achou da técnica para ordenar uma lista em Java? Dê uma olhada na nossa
[**Formação Java**] que tem o foco de apresentar em geral o mundo Java, bacana
né? ;)
Talvez tenhamos errado novamente nos nomes das áreas que temos na tecnologia, ou
muito provavelmente, esteja eu errado em escrever tudo que vem a seguir. E se
estiver, tudo bem, me avisem :)
O termo design ficou fortemente associado a interfaces/ambiente. Justo por que ao

pensarmos em design de interiores e /ou web design, temos aquela impressão de que
quem tem esse título, não só sabe deixar as coisas muito bem organizadas, como
também, bonitas. O que não é totalmente verdade.
Algo que pode deixar essa característica mais evidente é o processo de arquitetura
de informação. Onde o resultado pode ser um diagrama em preto e branco, organizado,
mas que não é bonito.
**Outro exemplo? Card Sorting. Onde agrupamos elementos que fazem sentido estarem
juntos e separamos aqueles que achamos que devem estar em outro grupo.**
imagem
O maior engano das pessoas está no termo design. Termo que tem mais de uma tradução
e que pode confundir bastante. Quem é desenvolvedor, com certeza já cometeu gafes
com o termo pattern, achando que era a mesma coisa que default. Sim, eu também já
errei nisso.
**Design tá mais ligado a projeto ou concepção (desenho também)do que realmente a

aparência (diga-se boniteza). Justo por que quem diz se está bonito ou não, é quem
está vendo, com outros olhos, em outro contexto. Não necessariamente quem desenhou
a interface. :)**
A interface na UX, é um dos resultados de um processo anterior. Antes de bonita,

ela precisa ser útil, fácil de usar e comunicativa. Precisa entregar o que o
usuário precisa de uma forma simples. Ela precisa ser intuitiva, ou seja, um botão
precisa parecer um botão.
Então, antes de pensar em uma interface muito atrativa em estética. Considere as

seguintes questões:
1. Ela é útil, fácil de entender e informativa?

2. É preciso pensar muito para interagir com ela?
3. Os elementos acionáveis, parecem acionáveis mesmo?
4. É confortável de interagir? Os botões são grandes o suficientes?
5. Os espaçamentos e alinhamentos estão bem definidos?
**Ótimo! Segue em frente com as cores e demais itens estéticos para dar aquele plus
de brilhar os olhos, sem prejudicar os itens anteriores. :)**
Conheça algumas ferramentas que podem ser boas alternativas ao photoshop, tanto em
custo benefício, como também, usabilidade e features.
O Adobe Photoshop é o aplicativo dominante no mercado de edição de imagens há mais

de 25 anos. Mas, de uns tempos para cá, já surgiram muitos bons concorrentes, que
se apresentam como opções tão funcionais quanto ele — mas muito mais econômicas.
Afinal, hoje, o custo individual de adquirir a última versão do premiado editor é

R$85,00 mensais, o que pode deter muitos iniciantes na aquisição do software
original.
Assim, para ser uma alternativa ao Photoshop, um software precisa ter excelente
usabilidade, ferramentas poderosas, compatibilidade com as principais plataformas
disponíveis no mercado e um preço inferior ao praticado pela Adobe.
Então, se você se interessou em saber quais são as principais ferramentas gratuitas

que pode utilizar no lugar do Photoshop, continue lendo este post!
## 1\. Gimp
Plataformas: Windows, Mac e Linux
Preço: grátis
Conhecido pelo acrônimo GIMP, o GNU Manipulation Program é um dos mais completos e
gratuitos editores de código aberto disponível para todas as plataformas. Com
ferramentas robustas, é provavelmente a melhor escolha que você pode fazer sem
colocar a mão no bolso.
Com uma comunidade ampla de entusiastas, o GIMP oferece os principais recursos do

Photoshop, embora não tenha uma usabilidade tão simples quanto a do aplicativo mais
conhecido da Adobe.
O software conta com a edição em camadas, uma excelente ferramenta de seleção e

retoques, recursos para [**correção de cores**] e o suporte a múltiplos plugins,
que vão deixar seu trabalho ainda mais fácil.
Quanto aos formatos, ele suporta a criação de GIFs, BMPs, JPEGs, PNGs e ainda
oferece compatibilidade com o formato original do Photoshop, o PSD. Com certeza,
[vale a pena fazer o download] e testar!
## 2\. Pixlr
Plataformas: online
Preço: grátis
Para quem prefere fazer tudo direto do browser ou possui uma máquina mais lenta,
que demande a utilização de recursos externos, a opção ideal é o Pixlr. Com ele, é
possível editar imagens direto da aba do seu navegador, com naturalidade, e
utilizando os mesmos atalhos do Photoshop.
Sua interface é simples, e ele também permite a edição de camadas, além de possuir
ferramentas de seleção, edição de textos e um recurso automatizado para correção de
olhos vermelhos.
Além disso, os filtros e efeitos tornam o Pixlr um dos melhores editores online que
você pode imaginar. Ele suporta arquivos BMP, JPEG, GIF, TIFF e também PNGs.
[Acesse-o e confira!]
## 3\. Paint.NET
Plataformas: Windows
Preço: grátis
Já brincou alguma vez de desenhar no Paint? Então, pense no Paint.NET como uma
evolução do editor nativo do Windows. A ferramenta foi desenvolvida para ocupar
justamente esse papel, e herda muito de sua interface e funcionalidade do
aplicativo que você já conhece.
É um pouco menos complexa que o GIMP, mas conta com todos os recursos que você
precisa para começar a editar imagens agora mesmo. E garante melhores resultados
com o uso de plugins, o que torna os recursos básicos desse software ainda
melhores.
Se quiser uma alternativa ao Photoshop por uma usabilidade simples de se entender e

usar,o Paint.NET é a escolha para você! Além dos típicos BMPs, JPEGs, GIFs, TIFFs e
PNGs, o aplicativo também oferece suporte a arquivos RAW e é completamente
gratuito. [Basta baixar e testar]!
## 4\. PicMonkey
Plataformas: online
Preço: grátis
Quando a Google adquiriu o Picnik, muitos designers ficaram desolados pois isso
significaria o fim do excelente editor de imagens criado por Justin Huff e Brian
Terry. Os engenheiros, porém, se reorganizaram para lançar uma nova alternativa,
completamente online e que consegue atingir o difícil equilíbrio entre uma
interface de usuário intuitiva e um conjunto avançado de recursos.
Começar a editar suas fotos com PicMonkey é simples e adicionar texturas, formas e
texto em suas imagens pode ser feito em poucos cliques. Há também alguns filtros
automáticos, semelhantes aos do Instagram, com os quais você pode se divertir.
Como o PicMonkey funciona do seu navegador é possível acessá-lo de qualquer lugar.

Para quem precisa de ferramentas ainda mais avançadas, existe uma versão premium do
software que remove os anúncios da parte inferior da tela e inclui alguns recursos
extra.
Quer experimentar? Então [clique aqui.] O PicMonkey oferece um trial gratuito de

suas funções de retoque profissionais.
## 5\. Canva
Plataformas: Windows, Mac e Linux
Preço: grátis
Que tal um editor de fotos simples, conhecido como o programa de design mais fácil
de usar no mundo? O Canva permite que qualquer um crie imagens incríveis,
precisando apenas se registrar na plataforma o que pode ser feito com um e-mail,
sua conta do Facebook ou do Google.
Ele possui efeitos de edição, corte e enquadramento que vão tornar suas imagens
ainda melhores, sem dúvida! Aproveite e adicione textos, ícones e edite imagens com
fundos transparentes, sem precisar sair de seu browser.
E use também os filtros automáticos disponibilizados pelo aplicativo para aprimorar

as cores, brilho e contraste de suas fotos, e empregue os ícones gratuitos para
criar imagens de impacto!
Além disso, de todas as ferramentas online citadas até aqui, este é o único que
possui os recursos que você precisa para criar layouts web — um diferencial e
tanto! Então, para começar a editar fotos agora mesmo, [visite o site.]
## 6\. CinePaint
Plataformas: Linux e Mac
Preço: grátis
Não esquecemos, é claro, dos usuários de Linux que consideram o GIMP um pouco
limitado. Para eles, o CinePaint pode ser a solução.
Afinal, essa não é uma ferramenta de edição de imagens comum. Possibilitando

retoques poderosos e uma alta-fidelidade de cor, ele permite que você saiba
exatamente como suas fotos ficarão quando impressas.
Vale ressaltar que esse editor gratuito foi utilizado por grandes estúdios de
Hollywood na criação de animações no passado. Só de saber isso, você já consegue
imaginar o tamanho potencial da ferramenta, certo? E, além de trabalhar com
imagens, o CinePaint ainda [cria e edita vídeos]!
Com suporte para arquivos BMP, CIN, DPX, EXR, GIF, JPEG, OpenEXR, PNG, TIFF e XCF,
ele funciona em qualquer sistema operacional baseado no Unix — portanto, é também
compatível com o Mac. Para baixá-lo, [basta acessar o site.]
## 7\. Seashore
Plataformas: Mac
Preço: grátis
Por fim, você usa Mac e não achou um aplicativo com a sua cara nessa lista? Não se
preocupe! O Seashore é uma ferramenta de edição de imagens de código aberto baseada
no framework Cocoa — o que significa que ele funciona perfeitamente no Macbook.
Utilizando a mesma formatação de arquivos do GIMP, o software oferece recursos

semelhantes, mas com uma interface muito mais simples.
Com vários pincéis, uma excelente ferramenta de gradientes e a possibilidade de

editar imagens em camadas, esse é um dos editores de imagem mais intuitivos da
nossa lista. Para [**começar a se aventurar**] pelo software, você pode fazer o
download [clicando aqui.]
**Enfim, substituir o Photoshop não é uma tarefa fácil. Afinal, se o software

ganhou o espaço que tem hoje no mercado, foi graças à sua usabilidade, aliada a
ferramentas de edição de imagem incomparáveis.**
[**Configurando VLans para segmentar nossa rede**], podemos ter várias redes
lógicas, com endereços IPs diferentes.
imagem
Sabendo disso, quando fui contratado por uma empresa para arrumar a rede em um novo
prédio me deparei com o seguinte cenário: No Prédio funcionam quatro departamentos:
Financeiro, Comercial, RH e Jurídic e cada departamento tem, em média, 50 hosts.
O departamento comercial envia muitas propostas técnicas que são arquivos bem
pesados, por isso a rede de todos os departamentos está ficando lenta e instável.
Além disso, como todos os departamentos estão na mesma rede, ou seja, caso algum
departamento tenha um problema, todos os departamentos serão atingidos.
Então, vamos atribuir os endereços de cada departamento. Nós podemos utilizar

qualquer [**IP privado**] para isso, como são poucos **hosts**. Vou utilizar os
[**endereços de classe C**] (192.168.x.x).
Podemos atribuir por exemplo uma departamento com o endereço de rede `192.168.0.0`,
outro com `192.168.1.0` e assim por diante.
Essa é uma opção totalmente válida, porém se pararmos para analisar, com esse tipo
de configuração, vamos estar desperdiçando endereços IPs.
# Mas como podemos diminuir esse número de endereços IPs na rede para evitar esse
desperdício?
Nós podemos dividir nossa rede em parte menores, cada uma representando um
departamento, ou seja, dividimos nossa rede em [**sub-redes**].
# O que é sub-rede
Toda endereço IP tem uma **máscara** correspondente. Essa máscara que identifica
qual parte do endereço pertence a rede e qual parte ao host.
Por exemplo, o endereço `192.168.0.50` com uma máscara `255.255.255.0`, identifica

como parte da rede o endereço `192.168.0` e o host como `50`:
java
Para dividir essa rede, nós podemos “dividir” essa máscara. Para isso, podemos usar
valores diferentes entre `0` ou `255`. Quando fazemos isso, damos o nome de [**sub-
rede**].
Mas quais valores podemos colocar?
## Calculando as máscaras de sub-rede
Cada três dígitos na máscara, correspondem a uma parte do endereço IP do host.

Essas partes são formadas por oito bits, por isso recebem o nome de octetos.
Cada bit no octeto, possui um valor em decimal correspondente a sua posição.
Por serem bits, só possuem dois estados, ou 0, representando o host, ou 1,

representando a rede.
No caso, essa máscara (`255.255.255.0`), pode ser representada em binário como:

`11111111.11111111.11111111.0000000`.
java
Caso todos os oito bits da máscara de sub-rede possuir valor `1`, o valor em
decimal `255`, caso todos os bits forem `0`, possui o valor `0` em decimal.
Mas por que quando todos os bits são `1`, o valor em decimal fica é `255`?
Isso é por causa da [**conversão de binário para decimal**][l].
## Criando sub-redes
Vimos que os bits `1` na máscara específica a porção da rede e que os bits `0`
especificam o host no endereço IP. Para criar nossas redes, podemos pegar alguns
**bits** `0` e transformá-los em `1`.
Por exemplo, se pegarmos o primeiro bit `0` na máscara e transformá-lo em bit `1`,
teríamos a seguinte máscara em binário: `11111111.11111111.11111111.1000000`
Mas como fica o valor dela em decimal?
Sabemos que os três primeiros octetos têm o valor em decimal de `255`. Já para
saber o valor do último, basta realizar a conversão:
java
Ou seja, temos: **1 x 2^7 + 0 x 2^6 + 0 x 2^5 + 0 x 2^4 + 0 x 2^3 + 0 x 2^2 + 0 x

2^1 + 0 x 2^0**. Que nos deixa com `128`.
Logo, a máscara dessa rede é: `255.255.255.128`.
Mas quantas redes temos com essa máscara?
Para saber quantas redes temos com essa nova máscara basta elevar o número **2**,
que são o número de bits possíveis,\*\* \*\*ao número de bits emprestados da porção
do host.
Neste caso pegamos um bit da porção do host, portanto temos \*\*2^1 \*\*redes. Ou
seja, temos duas redes.
Mas quantos hosts cada rede comporta?
Os hosts são definidos como bits `0` na máscara de sub-rede, certo? Então para
saber quantos hosts nossa rede comporta basta elevar `2` ao número de bits `0` na
máscara.
Neste caso temos sete bits `0` (`10000000`), logo, 2^7, que nos dá 128.
Então cada uma de nossas redes comportam 128 hosts?
Dentre os endereços IPs, dois precisam ser reservados. Um para especificar a rede e
outro para especificar o [**domínio de broadcast**]. Então, na verdade temos **128
- 2** hosts, logo temos `126` hosts em cada sub-rede.
Mas quais são esses endereços reservados?
O endereço que especifica a rede é sempre o primeiro endereço IP, já o de broadcast

é o último endereço IP da rede.
Em uma rede classe C com máscara padrão, o endereço da rede é `192.168.0.0` e o de

broadcast é `192.168.0.255`. Só que no nosso caso são duas sub-redes, cada uma com
um endereço de rede e de broadcast.
A primeira rede possui o endereço de rede `192.168.0.0`, já o endereço de broadcast

nós descobrimos somando `1` ao número de hosts, que neste caso são `126`, mais o
endereço de rede. Ou seja, temos \*\*1 + 126 + 0. \*\*Dessa forma temos que o
endereço de broadcast da primeira sub-rede é `192.168.0.127`.
Já o endereço de rede da segunda sub-rede é o endereço de **broadcast** da primeira

sub-rede mais `1`. Ou seja, temos como endereço de rede da segunda sub-rede
`192.168.0.128`. O endereço de broadcast conseguimos obter da mesma forma.
Somamos `1` ao número de hosts, mais o endereço de rede. Portanto, **1 + 126 +
128**, isso nos dá o endereço de broadcast `192.168.0.255`.
Bom, calculamos as sub-redes, mas com essa máscara temos apenas duas sub-redes.
Porém, temos quatro departamentos e queremos colocar cada um em uma sub-rede. Como
podemos fazer isso?
Se nós pegamos um bit a mais na máscara de sub-rede como no exemplo, nós temos duas
sub-redes. Então, se nós pegarmos dois bits, teremos dois elevado a dois, que é
número de bits que pegamos na porção do host, isso nos deixa com quatro que é o
número de sub-redes que queremos.
Ou seja, nossa máscara ficará em binário: `11111111.11111111.11111111.1100000`.

Realizando a conversão:
java
Logo: **1 x 2^7 + 1 x 2^6 + 0 x 2^5 + 0 x 2^4 + 0 x 2^3 + 0 x 2^2 + 0 x 2^1 + 0 x
2^0**. Que nos deixa com `192`.
Ou seja nossa máscara de sub-rede será `255.255.255.192`. Mas quantos hosts cada
sub-rede comportará?
Para saber isso, basta elevar `2` ao número de bits `0` na máscara, menos os dois
bits reservados de cada rede, ou seja, como temos seis bits zero nossa conta fica
**2^6 - 2**, isso nos deixa com 62 hosts para cada rede.
Se quisermos saber qual é o endereço de cada sub rede, basta realizar os mesmos
passos de antes.
O endereço de rede primeira sub-rede será `192.168.0.0`, já o seu endereço de

broadcast será um mais o número de hosts mais o endereço de rede. Isso nos deixa
com \*\* 1 + 62 + 0\*\*. Logo, o endereço de broadcast da nossa primeira sub rede
será `192.168.0.63`.
Dessa forma, após calcular cada sub-rede teremos o seguinte resultado:

java
Todos esses endereços utilizando a máscara `255.255.255.192`.
Dessa forma conseguimos alocar cada departamento em uma sub-rede, o que otimiza a
rede e isola os problemas.
## Para saber mais
Como cada sub-rede é uma rede distinta, elas precisam de um roteador para se
comunicarem umas com as outras.
Neste exemplo, utilizamos um IP da classe C para criar as sub-redes, porém

conseguimos realizar essa configuração com todas as classes de IPs disponíveis.
Nós podemos utilizar outra notação quando falamos de máscaras de rede. Ao invés de
utilizar a máscara em seu formato decimal, podemos dizer apenas a quantidade de
bits um contidos nela.
Por exemplo, a máscara padrão da classe C, `255.255.255.0`, em formato binário fica

`11111111.11111111.11111111.0000000`. Ou seja, ela tem `24` bits `1`. Então caso
desejemos falar que o endereço IP `192.168.0.35` utiliza a máscara padrão, podemos
utilizar a notação `/24`. Ficando assim `192.168.0.35 /24`.
O nome dessa notação é [**CIDR**].

## Dividir e calcular
Atribuir endereços IPs a redes é o um dos trabalhos de um **administrador de

redes**. Saber qual endereço atribuir e qual máscara utilizar faz parte desse
trabalho.
Quando estamos instalando uma rede, é bacana separarmos os departamentos para

isolar possíveis problemas, melhorar a performance da rede, além da segurança.
Uma forma de fazer isso é criando **VLans**, porém mesmo com essa configuração,
algumas redes podem ter problemas com o broadcast. Então uma forma de resolver isso
é dividindo a rede em parte menores, criando sub-redes.
A Alura tem uma [**formacao de redes**]. Nela, são apresentados os conceitos de

sub-rede e diversas outras situações bacanas de utilizá-las.
O [**Creative Cloud**], desenvolvido pela aclamada [**Adobe**], é o “canivete

suíço” das ferramentas de criação, e conta com uma coleção de mais de vinte
aplicativos e serviços para desktop e dispositivos móveis. Atendendo à áreas como
**design, fotografia, vídeo, Web, UX, UI** e muito mais, oferece recursos que
aumentam a produtividade, como a sincronização na nuvem e colaboração em tempo
real.
Com ele é possível utilizar programas como o **Photoshop, Illustrator, Premiere**,

entre vários outros, em um modelo de assinatura com atualizações frequentes e
suporte constante. Todas as suas funcionalidades são interligadas, o que permite
iniciar o trabalho em um programa e continuá-lo em outro.
O modelo flexível de assinatura do Creative Cloud oferece uma enorme vantagem: é

possível ter assinaturas que se adequem ao perfil de cada estudante ou empresa,
independente do tamanho da equipe e suas necessidades, com um plano de assinatura
que atende às demandas e não pesa no bolso.
# O que o Creative Cloud oferece?
- Mais de 20 aplicativos disponíveis para download.

- Adobe Fonts: para utilizar milhares de fontes tipográficas em projetos
diretamente nos aplicativos da Creative Cloud.
- Behance: para expor trabalhos de criação e descobrir novos artistas.
- Bibliotecas da Creative Cloud: para salvar, procurar e compartilhar ativos das
bibliotecas nos aplicativos do Creative Cloud.
- Adobe Portfolio: para criar e personalizar seu próprio site de portfólio.
- Armazenamento: 100 GB de armazenamento na nuvem disponíveis para o
compartilhamento de arquivos e colaboração.
Para quem é usuário do Adobe Creative Cloud, o ano de 2020 promete! A Adobe acabou
de anunciar na conferência Adobe MAX 2019, em Los Angeles, as principais novidades
para o próximo ano.
# Principais novidades da atualização

**Photoshop para iPad lançado:** O software mais conhecido e utilizado da Adobe, o
Photoshop, agora pode acompanhar os usuários aonde quer que estejam através da
aplicação para iPad. Desenvolvido do zero e com a interface otimizada para o toque
e para o uso com o Apple Pencil, sua primeira versão traz as principais
ferramentas, como as de composição e retoque de fluxos de trabalho.
**Photoshop Camera - novo aplicativo de foto com inteligência artificial:** O novo

aplicativo da Adobe para editar fotos, o [**Photoshop Camera**] por enquanto só
está disponível para testes em grupos de usuários iOS e Android mas deve ser
oficializado em 2020. O aplicativo pretende ser uma ferramenta de edição não apenas
para profissionais, mas para qualquer pessoa. Utilizando o [**Adobe Sensei**], a
inteligência artificial da Adobe, o Photoshop Camera sugere filtros e lentes, que
fazem desde pequenas mudanças até alterações mais significantes que as transformam
em ilustrações. Assim como no Instagram Stories, o aplicativo contará com lentes
criadas por influenciadores e artistas. Além disso, os usuários também poderão
criar e compartilhar lentes com outros usuários. Ainda que seja uma opção mais
simples de edição do que o Photoshop, com o novo aplicativo é possível editar fotos
manualmente e remover a qualquer momento filtros que foram adicionados à fotos.
<iframe width="560" height="315" src="https://www.youtube.com/embed/zRfG7cWqCG8"

frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope;
picture-in-picture" allowfullscreen></iframe>
**Adobe Fresco para Microsoft Windows:** Lançado no início do ano para o iPad, o
[**Fresco**] chega para usuários de dispositivos **Microsoft Surface Pro X** e
hardware Wacom MobileStudio Pro. A Adobe está trabalhando para expandir ainda mais
esta lista.
**Adobe Aero - novo aplicativo para Realidade Aumentada:** A Adobe lançou

recentemente o aplicativo de realidade aumentada [**Aero**]. Ele utiliza programas
da Adobe para que os usuários possam importar arquivos 3D do DImension e camadas 2D
do Illustrator e do Photoshop para gerar experiências de interação.
Para designers sem experiência em 3D, ele permite que seus usuários criem cenas de
realidade aumentada no aplicativo a partir de um passo-a-passo. Ele pode ser também
utilizado como softwares de terceiros, como Cinema 4D e Maya. No Aero também é
possível adicionar experiências interativas a partir do desenho do caminho de
movimento do qual deseja-se que o objeto siga.
<blockquote class="instagram-media"
data-instgrm-permalink="https://www.instagram.com/p/B2pjz7bplg6/?
utm_source=ig_embed&utm_campaign=loading" data-instgrm-version="12" style="
background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0
rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:540px; min-
width:326px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px);
width:calc(100% - 2px);"><div style="padding:16px;"> <a
href="https://www.instagram.com/p/B2pjz7bplg6/?
utm_source=ig_embed&utm_campaign=loading" style=" background:#FFFFFF; line-
height:0; padding:0 0; text-align:center; text-decoration:none; width:100%;"
target="_blank"> <div style=" display: flex; flex-direction: row; align-items:
center;"> <div style="background-color: #F4F4F4; border-radius: 50%; flex-grow: 0;
height: 40px; margin-right: 14px; width: 40px;"></div> <div style="display: flex;
flex-direction: column; flex-grow: 1; justify-content: center;"> <div style="
background-color: #F4F4F4; border-radius: 4px; flex-grow: 0; height: 14px; margin-
bottom: 6px; width: 100px;"></div> <div style=" background-color: #F4F4F4; border-
radius: 4px; flex-grow: 0; height: 14px; width: 60px;"></div></div></div><div
style="padding: 19% 0;"></div> <div style="display:block; height:50px; margin:0
auto 12px; width:50px;"><svg width="50px" height="50px" viewBox="0 0 60 60"
version="1.1" xmlns="https://www.w3.org/2000/svg"
xmlns:xlink="https://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1"
fill="none" fill-rule="evenodd"><g transform="translate(-511.000000, -20.000000)"
fill="#000000"><g><path d="M556.869,30.41 C554.814,30.41 553.148,32.076
553.148,34.131 C553.148,36.186 554.814,37.852 556.869,37.852 C558.924,37.852
560.59,36.186 560.59,34.131 C560.59,32.076 558.924,30.41 556.869,30.41 M541,60.657
C535.114,60.657 530.342,55.887 530.342,50 C530.342,44.114 535.114,39.342 541,39.342
C546.887,39.342 551.658,44.114 551.658,50 C551.658,55.887 546.887,60.657 541,60.657
M541,33.886 C532.1,33.886 524.886,41.1 524.886,50 C524.886,58.899 532.1,66.113
541,66.113 C549.9,66.113 557.115,58.899 557.115,50 C557.115,41.1 549.9,33.886
541,33.886 M565.378,62.101 C565.244,65.022 564.756,66.606 564.346,67.663
C563.803,69.06 563.154,70.057 562.106,71.106 C561.058,72.155 560.06,72.803
558.662,73.347 C557.607,73.757 556.021,74.244 553.102,74.378 C549.944,74.521
548.997,74.552 541,74.552 C533.003,74.552 532.056,74.521 528.898,74.378
C525.979,74.244 524.393,73.757 523.338,73.347 C521.94,72.803 520.942,72.155
519.894,71.106 C518.846,70.057 518.197,69.06 517.654,67.663 C517.244,66.606
516.755,65.022 516.623,62.101 C516.479,58.943 516.448,57.996 516.448,50
C516.448,42.003 516.479,41.056 516.623,37.899 C516.755,34.978 517.244,33.391
517.654,32.338 C518.197,30.938 518.846,29.942 519.894,28.894 C520.942,27.846
521.94,27.196 523.338,26.654 C524.393,26.244 525.979,25.756 528.898,25.623
C532.057,25.479 533.004,25.448 541,25.448 C548.997,25.448 549.943,25.479
553.102,25.623 C556.021,25.756 557.607,26.244 558.662,26.654 C560.06,27.196
561.058,27.846 562.106,28.894 C563.154,29.942 563.803,30.938 564.346,32.338
C564.756,33.391 565.244,34.978 565.378,37.899 C565.522,41.056 565.552,42.003
565.552,50 C565.552,57.996 565.522,58.943 565.378,62.101 M570.82,37.631
C570.674,34.438 570.167,32.258 569.425,30.349 C568.659,28.377 567.633,26.702
565.965,25.035 C564.297,23.368 562.623,22.342 560.652,21.575 C558.743,20.834
556.562,20.326 553.369,20.18 C550.169,20.033 549.148,20 541,20 C532.853,20
531.831,20.033 528.631,20.18 C525.438,20.326 523.257,20.834 521.349,21.575
C519.376,22.342 517.703,23.368 516.035,25.035 C514.368,26.702 513.342,28.377
512.574,30.349 C511.834,32.258 511.326,34.438 511.181,37.631 C511.035,40.831
511,41.851 511,50 C511,58.147 511.035,59.17 511.181,62.369 C511.326,65.562
511.834,67.743 512.574,69.651 C513.342,71.625 514.368,73.296 516.035,74.965
C517.703,76.634 519.376,77.658 521.349,78.425 C523.257,79.167 525.438,79.673
528.631,79.82 C531.831,79.965 532.853,80.001 541,80.001 C549.148,80.001
550.169,79.965 553.369,79.82 C556.562,79.673 558.743,79.167 560.652,78.425
C562.623,77.658 564.297,76.634 565.965,74.965 C567.633,73.296 568.659,71.625
569.425,69.651 C570.167,67.743 570.674,65.562 570.82,62.369 C570.966,59.17
571,58.147 571,50 C571,41.851 570.966,40.831
570.82,37.631"></path></g></g></g></svg></div><div style="padding-top: 8px;"> <div
style=" color:#3897f0; font-family:Arial,sans-serif; font-size:14px; font-
style:normal; font-weight:550; line-height:18px;"> Ver essa foto no
Instagram</div></div><div style="padding: 12.5% 0;"></div> <div style="display:
flex; flex-direction: row; margin-bottom: 14px; align-items: center;"><div> <div
style="background-color: #F4F4F4; border-radius: 50%; height: 12.5px; width:
12.5px; transform: translateX(0px) translateY(7px);"></div> <div style="background-
color: #F4F4F4; height: 12.5px; transform: rotate(-45deg) translateX(3px)
translateY(1px); width: 12.5px; flex-grow: 0; margin-right: 14px; margin-left:
2px;"></div> <div style="background-color: #F4F4F4; border-radius: 50%; height:
12.5px; width: 12.5px; transform: translateX(9px)
translateY(-18px);"></div></div><div style="margin-left: 8px;"> <div style="
background-color: #F4F4F4; border-radius: 50%; flex-grow: 0; height: 20px; width:
20px;"></div> <div style=" width: 0; height: 0; border-top: 2px solid transparent;
border-left: 6px solid #f4f4f4; border-bottom: 2px solid transparent; transform:
translateX(16px) translateY(-4px) rotate(30deg)"></div></div><div style="margin-
left: auto;"> <div style=" width: 0px; border-top: 8px solid #F4F4F4; border-right:
8px solid transparent; transform: translateY(16px);"></div> <div style="
background-color: #F4F4F4; flex-grow: 0; height: 12px; width: 16px; transform:
translateY(-4px);"></div> <div style=" width: 0; height: 0; border-top: 8px solid
#F4F4F4; border-left: 8px solid transparent; transform: translateY(-4px)
translateX(8px);"></div></div></div> <div style="display: flex; flex-direction:
column; flex-grow: 1; justify-content: center; margin-bottom: 24px;"> <div style="
background-color: #F4F4F4; border-radius: 4px; flex-grow: 0; height: 14px; margin-
bottom: 6px; width: 224px;"></div> <div style=" background-color: #F4F4F4; border-
radius: 4px; flex-grow: 0; height: 14px; width: 144px;"></div></div></a><p style="
color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; line-height:17px;
margin-bottom:0; margin-top:8px; overflow:hidden; padding:8px 0 7px; text-
align:center; text-overflow:ellipsis; white-space:nowrap;"><a
href="https://www.instagram.com/p/B2pjz7bplg6/?
utm_source=ig_embed&utm_campaign=loading" style=" color:#c9c8cd; font-
family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal;
line-height:17px; text-decoration:none;" target="_blank">Uma publicação
compartilhada por Adobe (@adobe)</a> em <time style=" font-family:Arial,sans-serif;
font-size:14px; line-height:17px;" datetime="2019-09-20T22:13:44+00:00">20 de Set,
2019 às 3:13 PDT</time></p></div></blockquote>
<script async src="www.instagram.com/embed.js"></script>
> "Crie experiências interativas sem precisar contar com um desenvolvedor. Aplique
comportamentos ao seu conteúdo para criar combinações de ações que atraem os
espectadores de sua experiência para direcionar a narrativa e se envolver com a
história. Adicione movimento aos seus objetos usando seu dispositivo móvel para
desenhar o caminho do movimento que você deseja que o objeto siga"
*- Adobe.*
**Adobe XD com recursos de co-edição adicionados:** Para quem trabalha com

desenvolvimento de UI em equipe, os novos recursos de co-edição do Adobe XD serão
muito bem-vindos. A atualização permite que vários designers colaborem
simultaneamente e vejam mudanças em tempo real. Além disso, as bibliotecas agora
estão totalmente integradas ao XD, permitindo que seus usuários aproveitem suas
criações em outros aplicativos, como o Illustrator, diretamente no XD. Agora também
pode ser acessado no Microsoft Word e no PowerPoint, capacitando os não-criativos a
criar documentos e apresentações com os recursos mais atualizados.
## Criatividade acelerada com o Creative Cloud

Para quem já utiliza as aplicações da Adobe, as atualizações para os principais
aplicativos e novos recursos de produtividade agregam ainda mais valor ao Creative
Cloud:
**Lightroom:** Agora são oferecidos tutoriais interativos na área de trabalho do

aplicativo, para que seus usuários inspirem-se em trabalhos profissionais e
aprendam novas maneiras de editar fotos. O Lightroom também traz o Panorama Fill
Edges, que preenche as bordas de uma imagem utilizando a tecnologia Content-Aware
Fill.
**Premiere Pro:** Para a aplicação de edição de vídeos da Adobe foi lançado o Auto
Reframe, que utiliza a inteligência artificial Sensei para analisar imagens e
aplicar movimento e corte inteligente, mantendo a ação no frame. Este recurso
otimiza tarefas comuns para os editores e permite que dediquem mais tempo à parte
criativa do processo.
**After Effects:** As atualizações trouxeram melhorias significativas para o

desempenho, que agora conta com reprodução fluida e suave de visualizações em
cache, arquivos Multichannel EXR mais rápidos e um Content-Aware Fill mais rápido,
que usa metade da memória.
**InDesign:** Para seu software de diagramação a Adobe lançou um novo suporte para
a importação de arquivos vetoriais SVG além da implementação do Variable Fonts, que
permite que os designers ajustem as propriedades do tipo como peso, largura,
inclinação e tamanho ótico. Além disso há um novo recurso para o Asset Link, que
permite a vinculação direta entre o os assets do Adobe Experience Manager (AEM) e o
InDesign, permitindo acelerar ainda mais a criação de conteúdo digital e de
impressão.
__
Sempre buscando otimizar os fluxos de trabalho e a inovação, a Adobe vem mudando o

mundo através de experiências digitais. A [Alura](www.alura.com.br) oferece
formação em [Design Gráfico] para quem deseja desfrutar de boa parte dos benefícios
que vêm no serviço.
**Criar uma animação no After Effects é um processo demorado, exige muita dedicação
e depois de semanas trabalhando incansavelmente em cada detalhe, chega a hora mais
prazerosa: dar o play naquele bendito .mp4, subir no Youtube, Vimeo, mandar pro
cliente, basicamente apreciar o momento de glória que é finalizar uma animação.**
Desde que comecei a trabalhar com o After Effects vejo que uma das razões
principais pelas quais as pessoas travam no inicio de seus estudos é simplesmente o
fato de não conseguir exportar o resultado final de tudo que criou. Ou não entender
esse processo. É uma situação extremamente frustrante que distancia iniciantes da
parte mais prazerosa: assistir o resultado final!
imagem, lembra? Para posteriormente fazer um GIF, podemos usar a pre-definição

Loseless. Mas o que muda nesse caso? O codec. É a mesma composição e a mesma
resolução. Para isso, vou apenas duplicar, clicando com o direito e selecionando
“Duplicate” e alterar o formato clicando deixando na pre-definição “Loseless”
mesmo, mas pera, eu estou criando duas exportações para a mesma coisa! imagem**
No meu sistema de cadastro de livros eu preciso do nome e do preço:
java
Para cadastrar um livro eu preciso passar as informações e enviar para o banco de

dados:
java
Todas as vezes que eu quiser cadastrar um livro eu terei que instanciá-lo, pegar
uma conexão, salvar o livro e fechar a conexão. Vamos supor que agora nós
precisamos verificar se o livro já existe no banco e, caso exista, precisamos
atualizar em vez de salvar:
java
Quanto mais procedimentos para poder salvar o livro eu precisar, maior ficará a
minha rotina de salvar livros. Imagine todas as classes que precisarem salvar um
livro, terão que ser atualizadas todas as vezes que houver uma mudança! É uma
péssima solução... Que tal mudarmos esse procedimento de salvar o livro para um
único método? Então, ficaria:
java
Agora não precisamos saber sobre conexão ou qualquer procedimento para salvar um
livro, apenas chamamos o método `salvaLivro()`, enviamos o livro, e ele faz tudo
por nós! Quando transformamos um procedimento que apresenta muitas regras de
negócio ou rotinas complexas em um método, chamamos isso de **encapsulamento**. E
se tivermos que fazer um _backup_ dos livros cada vez que salvar ou atualizar?
Bastaria adicionar esse trecho em um único lugar, ou seja, no método
`salvaLivro()`:
java
O código mudou e continuamos utilizando o método sem nenhuma preocupação se ele

mudou ou não! Além disso, o código foi modificado em apenas um lugar, ou seja, não
precisamos nos preocupar se vai quebrar o nosso sistema em todos os outros lugares
que usam esse método! Além de ser mais elegante, torna o nosso sistema manutenível.
É sempre importante verificar em todos os pontos do código aonde é possível aplicar

o encapsulamento, pois ganhamos muitos benefícios:
- Melhor manutenção de código.

- Divisão de responsabilidades.
- Reutilização de código.
**E aí, gostou do encapsulamento? Está pronto para analisar o seu código e
verificar aonde ele pode ser aplicado? O encapsulamento faz parte de uma das boas
práticas de refatoração de código onde é apresentado detalhadamente no [curso de
Refatorando na prática com Java], que demonstra como fazer manutenção em um sistema
com um código de qualidade utilizando as boas práticas de refatoração.**
Desenvolvendo um site para um cliente fictício me deparei com a seguinte situação:
imagem, que encontramos hoje em dia, como o [**Google Web Fonts**] e o [Font
Squirrel], por exemplo, oferecem muito mais opções de escolha.
Mas não são justamente as fontes externas que influenciam na [**velocidade de

carregamento da página**]? Bom, é uma questão de prioridades.
No entanto, vale lembrar que mesmo as Web Fonts podem não ser apresentadas ao
usuário, caso ele mesmo tenha desabilitado o download das fontes no navegador (Sim,
é possível!). Isso geralmente é feito para aumentar a velocidade de carregamento em
conexões mais lentas.
Então como garantir que teremos um plano B caso uma situação assim aconteça?
Podemos unir as duas ideias, ou seja, montar uma Font Stack com a Web Font de
primeira opção e adicionar uma Web Safe Font na sequência:
css
A primeira fonte é uma fonte externa importada do Google Web Fonts, enquanto a
segunda é uma das fontes mais genéricas entre as Web Safe Fonts.
Neste momento asseguramos ao nosso usuário que os textos serão exibidos

corretamente.
Quer saber mais técnicas para otimizar seu site e melhorar a performance das
páginas? Na Alura temos um curso muito legal de [**Performance Web**] ensinando as
boas práticas e recursos que podemos utilizar para conseguir isso.
O mercado vem sofrendo uma rápida e abrangente evolução tecnológica, sobretudo para
os designers. A tecnologia tem contribuído para a evolução de conceitos e hábitos
do consumidor, além de ter diversificado as áreas de atuação e dado espaço a novas
profissões para designers.
## Áreas do conhecimento
### UX Designer
Muito abordado para lojas virtuais, o User Experience (UX) é a classificação da

experiência do cliente ao navegar em um site. Ou seja, por meio dessa avaliação, é
possível identificar se o design do site e seu desempenho estão atendendo às
expectativas do cliente e fazendo com que este tenha uma boa experiência durante a
navegação.
Para desenvolver uma UX de [alta performance], é necessário contar com a

colaboração de web designers, que vão estruturar toda a usabilidade e interface do
site. Trata-se de uma importante área em crescimento, já que estamos falando de um
período em que o número de lojas virtuais tem crescido.
### Design de serviços
Pensando na importância dos produtos, além da tecnologia, percebemos a sua

usabilidade, o significado para os consumidores e sua estética. Tudo isso,
juntamente com a abordagem para a oferta desse produto, classificamos como Design
de Serviços.
Essa área de atuação consiste em programar todo o serviço a ser

oferecido. Significa estar ao lado da empresa cliente para projetar como atender o
cliente final com o produto e como este deverá ser. Por exemplo: se teremos um novo
aplicativo para transporte de pessoas, o design de serviços vai estudar qual a
melhor, mais inovadora e abrangente forma de atender esse cliente, além de criar a
identidade visual do aplicativo.
### Medicina
No ramo da medicina, a tecnologia também tem aberto portas para os designers. Com o
surgimento de novos tratamentos e inovação na busca de diagnósticos, os aparelhos
precisam alcançar o melhor resultado. Os cuidados com ergonomia e funcionalidade
são imprescindíveis para a checagem do paciente.
Designers passam a ter uma boa oportunidade para o desenvolvimento desses

equipamentos, assim como a criação de próteses mais adequadas à necessidade de cada
paciente, proporcionando a solução para o seu problema e mantendo o conforto aliado
à funcionalidade.
### Web Designer
Essa não é uma das profissões mais recentes para designers, mas a citaremos levando
em consideração o seu crescimento. Além dos sites institucionais, as redes sociais
se tornaram o cartão de visitas para qualquer empresa na internet. Conteúdos em
blogs e os anúncios são os maiores chamarizes para a visibilidade de sua empresa.
O web design compõe o [marketing digital], valorizando a identidade visual,
estética e boa expressão de anúncios por meio de criações específicas para web. O
profissional leva em consideração o conhecimento técnico e sua aplicação para o
contexto da internet, visando atender às expectativas do cliente.
### Designer de Front End
O conhecimento em [HTML e CSS] permite que os designers sejam imbatíveis na

construção de layouts para sites, blogs e demais conteúdos para a internet. Quando
falamos em [Front End], nos referimos a toda a parte da plataforma do site visível
para o consumidor.
Nesse ramo, o designer desenvolve o Front End, considerando seus conhecimentos

técnicos sobre [performance do site] e estética. O trabalho vai desde a
estruturação da navegação até a [harmonização de cores] a serem utilizadas. Essa é
mais uma das oportunidades para designer que foram ampliadas com a chegada da
tecnologia.
### Design de Interiores
Não muito relacionada à tecnologia, essa área de atuação considera a harmonização e

organização de informações e identidade visual de interiores de imóveis. O designer
tem a possibilidade de personalizar um ambiente a fim de atingir um objetivo de
captação de clientes ou, simplesmente, reforçar a identidade da empresa e garantir
o conforto da acomodação.
Esta área é importante para empresas que se preocupam com a estrutura física a ser
apresentada a seus clientes e o tipo de conforto que deseja fornecer. Nesse caso, o
designer atuará lado a lado com a equipe de Comunicação Interna, considerando que,
mesmo que direcionado aos colaboradores, há objetivos a serem alcançados com uma
boa harmonização do ambiente.
### Design gráfico
Os designers gráficos de veículos de comunicação impressos são aqueles responsáveis

pela criação de jornais, revistas, panfletos, folders, cartões de visita, etc. O
trabalho consiste em diagramar a informação de maneira interessante e chamativa,
que atraia a atenção do consumidor.
O conhecimento necessário vai desde o comportamento do público, para entendimento

de qual mídia abrangerá o maior número de pessoas, até o conhecimento técnico para
a estruturação do material, respeitando a identidade visual da empresa contratante.
## Formas de atuação de designers
Como já vimos até aqui, estão abrindo diversas oportunidades de atuação para
designers. Contudo, além de estar atento às tendências do mercado, é necessário que
o designer esteja interessado em conhecer culturas, para saber contextualizar
culturalmente o produto e, para desenvolver conceitos, é importante embasar-se no
comportamento e ambiente no qual o consumidor está inserido.
Todas as profissões para designers podem ser exercidas em empresas. Porém, temos
formas autônomas de atuação. Aqui, citaremos duas:
### Freelancer
Os trabalhos autônomos rendem um faturamento sustentável, se levados a sério. É

possível ser dono do próprio negócio ou trabalhar como autônomo, recebendo demandas
avulsas. Para que tenha sucesso, é necessário disciplina e organização. Somente
assim será possível manter um índice satisfatório de produtividade.
### E-commerce
Um e-commerce de design funciona tão bem como outro qualquer. O cliente acessa o
site, solicita um orçamento e ele próprio pode enviar material da marca para que as
peças que deseja sejam produzidas e enviadas. É possível atender a vários clientes
dessa forma, sendo como complementação da renda ou, até mesmo, uma renda fixa,
dependendo do fluxo de atendimentos.
As opções de profissões para designer são muitas e o aperfeiçoamento vai permitir

que tenha ainda mais chances de ter sucesso em qualquer uma das áreas.
Após muita observação, a resposta encontrada foi simples: os processos do design

davam liberdade ao pensamento e à iniciativa individual, enquanto os processos
tradicionais as restringiam. Isso ocorria pois os tradicionais se apegavam mais à
burocracia com diversas etapas desnecessárias de documentação, checagem e
hierarquia.
Por exemplo, um designer gráfico, ao ter uma ideia sobre um layout interessante
para um site, teria que criar um projeto formal, para então enviá-lo a um superior
hierárquico para ser aprovado.
No caso do design thinking, toda essa burocracia seria desnecessária. O colaborador

seria livre para pensar em alguma solução para o cliente, sem muita formalidade.
Ele apresentaria a sua ideia, ela seria melhorada pela própria equipe em um esforço
colaborativo e seria rapidamente aprovada caso fosse viável.
Assim, o **design thinking** nos negócios emprega a sensibilidade e métodos do

design para atender às necessidades das pessoas. Dessa maneira, a sua empresa pode
criar um plano estratégico capaz de converter essas necessidades em valor para o
cliente, o que transforma um problema antigo em uma oportunidade de negócio para a
sua empresa.
Por isso, confira como aplicar o design thinking como uma estratégia de negócios!
## Desenvolver a empatia
Nesta primeira etapa, sua empresa realiza pesquisas para desenvolver o conhecimento
sobre o que seus usuários fazem, dizem, pensam e sentem. Imagine o seguinte
cenário: o novo objetivo da sua equipe é criar uma forma de melhorar uma
experiência de integração de ferramentas para novos usuários.
Para isso, você deve conversar com diversos usuários reais e observar diretamente o
que eles fazem, como eles pensam e o que eles querem. Assim, você questionará
coisas como: "o que motiva ou desestimula os usuários?" ou "com o que eles se
frustram e se recompensam?".
A grande finalidade deste momento é reunir observações suficientes que você pode
realmente começar a desenvolver empatia com seus usuários e suas perspectivas.
## Definir
Combine todas as suas pesquisas e observe em quais áreas sua empresa pode
apresentar soluções úteis à vida dos clientes. Ao identificar as necessidades
deles, comece a procurar as oportunidades de inovação dentro do seu negócio.
Considere o exemplo da solução de integração anterior. Na fase de definição, use os

dados recolhidos anteriormente para obter informações-chave. Organize todas as suas
observações e busque os padrões nos relatos dos seus usuários. Existe um ponto
comum de dor em muitos usuários diferentes? Com isso, você identifica as
necessidades do usuário não satisfeito.
Por exemplo, tomando como referência o exemplo do início do post, você identifica
que seus usuários precisam de um design para uma página web que seja amigável às
mais diversas mídias, como smartphones, tablets e computadores pessoais. Então,
toda a equipe será engajada na pesquisa de quais mídias eles mais usam, quais
funcionalidades eles necessitam na página, etc.
## Idealizar
Faça um **brainstorm coletivo** em toda a empresa. Então, escreva todas as ideias

que passaram nas cabeças de sua equipe, por mais que pareçam uma loucura. Neste
momento, você quer ideias criativas que abordam as necessidades do usuário não-
satisfeito, que foi identificado na fase "definir".
**Dê à sua equipe total liberdade! Nenhuma ideia é muito complexa e, neste momento,
desejamos muito mais quantidade do que qualidade**. Afinal, algumas ideias
inicialmente ruins podem ser polidas até se tornarem o carro-chefe da sua empresa.
Por fim, você vai reunir os membros da equipe para esboçar mais ideias diferentes.
Em seguida, eles as compartilharão uns com os outros, misturando e remixando tudo,
construindo novos conceitos aprimorados sobre as ideias uns dos outros.
Neste momento, sua empresa vai utilizar todo o seu arsenal para criar uma solução
única e criativa. Todo mundo deve falar todas as ideias sobre o layout: a landing
page, os botões, as abas, as cores e as formas.
## Prototipar
Depois de sua equipe ter selecionado e aprimorado as melhores ideias, é hora de

**construir um protótipo** de cada uma delas. Então, construa representações reais
para elas. Por exemplo, se vocês gostariam de remodelar algum processo da empresa,
criem um modelo ou uma maquete que ilustre bem como os novos processos potenciais
funcionariam.
O objetivo desta fase é entender quais componentes de suas ideias funcionam e quais
não. Assim, nesta etapa, você começa a contrabalancear o impacto com a viabilidade
de suas ideias. Para isso, sua equipe deve se reunir novamente e cada um deve dar
um feedback sobre os protótipos.
Este momento é muito importante e jamais deve ser ignorado, pois nele vocês vão
perceber quais ideias podem ser aprimoradas e quais devem ser descartadas.
Na fase de protótipo provavelmente temo diversos wireframes. Precisamo ter em mente

que eles não são o produto final, então podem ser reformulados infinitamente com
base nos feedbacks. O conceito dessa fase é refazer, refazer e refazer.
## Testar
Retorne para os comentários dos clientes obtidos lá na primeira fase. Então,

pergunte a si mesmo: "esta solução atende às necessidades dos usuários?" e
"melhorou como eles se sentem, pensam ou fazem suas tarefas?".
Exponha seu protótipo para alguns clientes insatisfeitos e peça para que eles
verifiquem se a novidade atinge seus objetivos. Os processos internos estão mais
rápidos? A perspectiva dos usuários durante a navegação melhorou?
Como você ainda está em fase de criação, não tenha medo de testar e testar
novamente até obter um protótipo ideal. Aqui você submete os protótipos criados
para o cliente testar, então ele pode dizer o que gostou e desgostou em cada uma e
quais ferramentas ele deseja ou dispensa.
## Implementar
**Coloque suas ideias em prática efetivamente**. Não se trata mais de testar, e sim
de criar uma solução definitiva. Por isso, cuide bem das etapas anteriores para
chegar com sua solução materializada, que melhora a vida de seus clientes finais de
alguma forma.
Esta é a parte mais importante do pensamento de design, mas é o mais frequentemente

esquecido. Afinal, o pensamento de design não o liberta do projeto real. As etapas
anteriores não são um fim em si mesmas, elas têm um fim, que é a implementação.
**Por mais impactante que possa ser a idealização do projeto para a sua empresa,
ela só leva à verdadeira inovação se é executada**. O sucesso do pensamento de
design reside na sua capacidade de transformar um aspecto da vida do usuário final
em uma oportunidade de negócio para a sua empresa. Por isso, este passo é
essencial.
Por fim, depois de tantas etapas, você vai ver que surgirá um produto final
aprimorado tanto para seus clientes internos quanto os externos. **Afinal, o design
thinking pode ser empregado para uma gama imensa de atividades da sua empresa:
otimização de processos, criação de novos produtos, iniciação de uma estratégia de
rebranding**, etc.
Isso acontece, pois é uma metodologia para tirar as amarras da criatividade, uma
vez que,no dia a dia, seus funcionários passam a pensar somente em ideias
pragmáticas e se esquecem da importância de pensar livremente.
E quem quer aprender a [**analisar os resultados encontrados em uma experiência de

Design Thinking**], temos um curso na Alura ideal para conseguir olhar pra a
squestões e levantar soluções mais assertivas. ;)
Entrando na pasta **webapps** do seu Tomcat não encontramos nada, a não ser as

aplicações de exemplo do próprio Tomcat.
Ou mesmo quando queremos fazer upload de arquivos na aplicação e não sabemos para

onde o arquivo foi, uma vez que ele está na pasta de aplicações do Tomcat, algo
como:
sql
Ou seja, quase impossível de achar.
O que ocorre, é que o Eclipse tenta liberar nossa pasta do Tomcat, não alterando os
arquivos de configuração e/ou estrutura de pastas. Porém, muitas vezes, não é isso
que desejamos. Queremos que o Eclipse use a própria pasta do Tomcat para isso. E a
modificação para que isso funcione é bem simples.
**Passo 1**: Clique com o **botão direito** em cima do Tomcat na _aba Servers_ do
Eclipse, e depois vá em **Add and Remove** e remova todas as aplicações que
estiverem no servidor (apenas as que aparecem no eclipse). Confirme em **Finish**.
**Passo 2**: Clique novamente com o botão direito em cima do Tomcat e escolha a
opção **Clean**.
**Passo 3**: Agora, clique duplo no servidor Tomcat (novamente na aba **Servers**).
Na tela que abrir, procure pela opção **Server Locations** e marque a opção **Use
Tomcat installation (takes control of Tomcat installation).**
Antes de fechar a tela, Salve as alterações feitas, _ou terá que fazer esse passo 3
novamente_.
Isso vai fazer nosso projeto ir para dentro da pasta do Tomcat diretamente. Porém o
Eclipse separa as aplicações enviadas por ele na pasta _wtpwebapps_. Abrindo pelo
explorer, vemos que nossa aplicação aparece lá, e não mais na pasta temporária do
eclipse maluca que o Eclipse gerava antes.
**Passo 4**: Vamos colocar nossa aplicação de volta dentro do servidor, novamente
com o botão direito no Tomcat -> Àdd and Remove`, mandamos nossa aplicação para o
lado direito e confirmamos em `Finish`. Confira pelo explorer se a pasta da
aplicação foi criada no servidor corretamente. Algo
como _seu_tomcat/wtpwebapps/sua_aplicacao_.
Com essa simples modificação, nosso projeto fica mais fácil de ser encontrado no
Tomcat e até o upload de arquivos, que poderia não funcionar por causa das pastas
temporárias e permissões, agora devem funcionar corretamente.
E aí? Ajudou a resolver aquele problema de upload ou mesmo a encontrar melhor seus
arquivos? No nosso curso de **[Spring MVC 1 e 2]**, realizamos upload de arquivos,
e também precisamos realizar essa configuração do Tomcat dentro do Eclipse.
Para medir o volume de chamados de suporte da empresa fiz o seguinte gráfico, e

agora vou melhorar a sua visualização:
![]
Repare que a nossa atenção vai diretamente para a borda ao redor do gráfico, então
a primeira coisa que farei será removê-la.
![]
Removendo a borda conseguimos manter o foco principal no gráfico, o segundo passo é

melhorar a visualização das duas linhas principais, e faremos isso removendo as
linhas de grade.
![]
Melhoramos a visualização das duas linhas no gráfico, mas os pontos nessas linhas
atraem a nossa atenção antes que possamos compreender a linha inteira. Iremos
removê-los também.
![]
Neste ponto, conseguimos visualizar claramente as linhas principais. Vamos expandir
a nossa visão e olhar para os eixos.
Repare que o eixo vertical inicia no número 50, o que faz a distância entre 0 e 150
parecer menor. Nesse caso, a boa prática é iniciarmos no 0, assim deixamos claro
pela distância que são 150 chamados. Então, irei alterar o ínicio do eixo vertical
de 50 para 0.
![]
Olhando também para o eixo horizontal, veja que precisamos inclinar um pouco a
nossa cabeça para podermos ler os nomes de cada mês, logo, o que irei fazer é
reduzir os nomes dos meses para as suas três letras iniciais. Além disso, será que
a palavra **mês** ali nos ajuda a entender que são meses ou já sabemos? Irei
retirá-la do eixo para vermos se faz diferença.
![]
Veja que retirar a palavra **mês** não fez diferença, pois continuamos entendendo
que os meses estão sendo referenciados no eixo horizontal.
Agora, vamos fazer mais um teste. Há pessoas que não enxergam cor, e precisamos nos
preocupar com elas ao montarmos uma visualização. Será que conseguiremos entender
esse gráfico se ele estiver em preto e branco?
![]
Repare que ao passar o gráfico para preto e branco, não conseguimos entender qual a
linha de volume de chamados recebidos e qual a linha de volume de chamados
resolvidos. Para melhorarmos isso, precisamos anotar ao lado das linhas quais foram
recebidos e quais foram resolvidos.
![]
E também não precisamos mais da legenda abaixo do gráfico. Como já temos o gráfico
finalizado em preto e branco, vou também alterar as cores para o azul e vermelho
originais tanto do gráfico quanto das legendas.
![]
Nossa visualização está quase pronta. Vamos olhar para o gráfico, temos uma linha
de recebidos e outra de resolvidos, mas recebidos e resolvidos do que? Por fim,
vamos colocar um título que descreva a informação principal que queremos mostrar
com o gráfico.
![]
E nossa visualização está pronta! Podemos olhar os gráficos inicial e final lado a
lado agora para vermos a transformação:
![]
## Para saber mais
Gostaria de continuar aprendendo sobre visualização de dados? Você pode fazer os

cursos de [**Visualização de dados parte 1**] e [**Visualização de dados parte 2**]
na Alura.
Melhore a comunicação da informação por um gráfico aplicando práticas de
visualização de dados.
Mesmo em tempos de alta de leitura informativa e vídeos, é nos livros que podemos
encontrar informações mais ricas e relevantes. É como estabelecer um contato, ainda
que passivo, com uma grande referência no assunto.
Considerando, assim, todos os benefícios que uma boa leitura pode proporcionar,
separamos aqui 7 livros que podem ser de grande ajuda na sua formação em TI. Quer
saber quais são? Então continue acompanhando o nosso artigo e confira!
## 1\. O Poder dos Quietos, de Susan Cain
[Susan Cain] é uma verdadeira entusiasta do comportamento humano e se incomodava

com a forma como a sociedade trata as pessoas introvertidas. Estas são definidas
pela escritora da mesma maneira como ela define as [mulheres] de antigamente:
cidadãos de segunda classe, com enormes quantidades de talento inexplorado.
Caso você esteja se identificando com o tema — já que ele retrata o comportamento
de boa parte dos profissionais de TI — saiba que este livro revela como as
características desse tipo podem ser aprimoradas para auxiliar no seu [marketing
pessoal] e superar as dificuldades da introversão.
Logo na sequência, a leitura de _[O Poder dos Quietos]_, lançado em 2010, ajudará
você a enxergar a si próprio de forma diferente. E, para o líder de uma
organização, a obra ainda ensinará a enxergar o grande potencial que existe dentro
dessas pessoas e acaba por muitas vezes não sendo aproveitado.
## 2\. Engenharia de Software – Uma Abordagem Profissional, de Roger S. Pressman
Em quase todos os cursos de graduação na área de TI, a disciplina de Engenharia de

Software se faz presente — com mais ênfase em algumas instituições do que outras.
Mas, independentemente da matriz curricular, é essencial que o estudante compreenda
bem essa disciplina.
Por isso, lançado em 1982 e distribuído atualmente na sétima edição, [o livro de

Roger Pressman] aborda, de modo didático e com conteúdo bem elaborado (incluindo
ilustrações), diversos conceitos de TI e as etapas do processo de engenharia que
cada produto de software passa até chegar ao cliente.
Sobre o autor, sem dúvida, estamos falando de uma das maiores referências sobre o
assunto no mundo todo, tendo mais de 40 anos de experiência com engenharia de
software. E autor, também, de outras 9 obras até o momento.
Em outras palavras: você tem todas as razões para ler o que [Pressman] tem a dizer!
## 3\. Use a Cabeça! Programação, por David Griffiths & Paul Barry
[Esta edição da série Use a Cabeça! _(Heading first!)_] aborda todos os conceitos
básicos de programação objetos, variáveis, funções, loops etc. — usando a linguagem
[Python], que é considerada uma das [linguagens] mais fáceis de se aprender.
Trata-se de uma obra produzida para iniciantes na área de TI que desejam aprender a
escrever um programa a partir de um livro. A missão para auxiliar isso ficou a
cargo de [Paul Barry] e David Griffiths, duas grandes referências britânicas do
setor.
Assim, ao ler o livro e praticar os ensinamentos em um ambiente de desenvolvimento

básico, você será capaz de criar vários tipos de programas com funções primárias. E
sem desperdiçar tempo, já que os autores dão dicas para escapar de erros comuns que
atrasam o desenvolvimento.
## 4\. Redes, Guia Prático, de Carlos Morimoto
Os livros escritos por Carlos Morimoto, criador do site hardware.com.br e autor da

coleção Hardware, são considerados clássicos para o aprendizado de alguns conceitos
de TI. Para quem se interessa por redes, uma boa sugestão é ler a sua obra
específica sobre o tema, chamada [Redes, Guia Prático].
Nesse livro, Morimoto explica (em 560 páginas) tudo que o iniciante deve aprender
sobre cabeamento, configuração de redes Linux e Windows, firewall, protocolo
TCP/IP, redes locais, redes móveis e muito mais.
De fato, essa leitura pode ser um ótimo ponto de partida para quem deseja saber
como funciona uma rede e se essa é, de fato, a área que deseja seguir. — Caso for,
você poderá avançar para leituras mais específicas.
## 5\. Design de Navegação Web, de James Kalbach
Sem dúvida, o pensamento sobre web design não pode se limitar à estética, devendo
abranger também a funcionalidade e a otimização da experiência do usuário em sua
navegação pelo site.
E é justamente esse o conceito que [James Kalbach], autor do _Mapping Experiences

Rapidly_ (disponibilizado gratuitamente em seu [blog]) procura passar nesta obra.
Além de ensinar várias práticas aplicáveis no desenvolvimento, ele também ensina o
leitor a criar uma visão crítica sobre web design.
Então, se você se interessa pela carreira na área de design, sugerimos que

considere o livro [Design de Navegação Web] um dos seus guias de referência.
## 6\. Linux a Bíblia, de Christopher Negus
Para quem almeja seguir carreira em qualquer setor da área de TI, a importância de
aprender sobre o sistema Linux é muito maior do que se pode imaginar.
De fato, é difícil progredir na carreira dominando apenas o Windows, por exemplo —

ainda mais com a adoção cada vez maior do Linux em ambientes corporativos,
principalmente quando o assunto é redes.
Por isso, o livro [Linux a Bíblia], escrito por [Christopher Negus] — uma das
maiores referências em Linux e autor de mais outros sete livros sobre o tema —, vai
te ensinar a dominar habilidades tanto em desktop quanto em servidor, assim como a
dominar o próprio sistema a ponto de se tornar um usuário avançado.
## 7\. Um Bate-papo sobre T.I., de Ernesto Haberkorn
Talvez um dos maiores problemas que um estudante enfrenta no início de carreira

seja a leitura de conteúdos complexos, cuja linguagem é direcionada a usuários mais
avançados. O que torna essa leitura pouco proveitosa, já que o conteúdo não é
absorvido.
Então, pensando em proporcionar uma experiência mais “receptível” aos novatos, o

professor [Ernesto Haberkorn], um dos maiores especialistas em ERP _(Enterprise
Resource Planning)_ do Brasil, permite ao leitor do seu livro [Um Bate-papo sobre
T.I]. tirar dúvidas que não costumam ser encontradas em outros livros sobre o
assunto.
A maior parte da obra trata da carreira de um empreendedor e profissional de TI,
relatando alguns obstáculos enfrentados pelo próprio Haberkorn. Além de dicas sobre
aspectos motivacionais, sociedade, relacionamentos e, é claro, carreira em
tecnologia da informação.
## Dica preciosa: leia obras escritas em inglês!
Independentemente do segmento, o Brasil ainda é conhecido por não traduzir obras

essenciais para os seus leitores. E na área de TI a realidade é a mesma: são poucos
os conteúdos estrangeiros traduzidos para o nosso português.
Portanto, é fundamental até mesmo para crescer na sua carreira aprender a ler em
inglês para ter acesso aos melhores livros já publicados.
Afinal, o inglês é o idioma “oficial” para profissionais da área de TI, usado como
base nas linguagens de programação. Sem contar que é o idioma nativo da maioria dos
grandes especialistas do mercado!
Uma das perguntas que mais gosto de responder é para ajudar alguém a encontrar um
primeiro caminho na carreira de desenvolvimento de software.
Gosto de programar, comecei aos 9, e sempre pude ter meu irmão, o Paulo, fundador
da **Caelum** e do **GUJ**, como guia. Mas e quem não teve essa sorte? Tento
repassar um pouco do que aprendi com ele nesses últimos 25 anos.
Temos **Java**, **.NET**, **PHP**, **Ruby**, **Python**, **Javascript** e por aí

vai. O maior mercado de desenvolvimento hoje em dia é web (sites web e aplicativos
mobile usam aplicações web) e todas essas linguagens se encaixam nesse nicho.
## Passo 1 - Ainda não sabe programação?
O primeiro passo é um **curso de lógica**, mas não de diagramas, fuja de cursos de

diagramas puros. Nem você nem eu vemos diagramas no dia a dia, no mundo real. Não é
natural. Repito: fuja de aprender através de diagramas sem prática de código - eles
são válidos, mas limitados.
### Vamos então direto para aprender lógica na prática.
Comece logo com algo real ao [aprender lógica] ao desenvolver um jogo de

adivinhação em Ruby, [um jogo da forca] , e finalizando com um curso onde [criamos
um Pacman] em modo texto. Você verá não só conceitos de lógica, mas entenderá como
funciona o computador e os desafios de criar um programa no mundo real.
Prefere outra alternativa? [Aprenda lógica com Javascript] para resolver problemas

reais. E logo em seguida reforce essa base ao [criar um jogo] que envolve gráficos
também com Javascript.
## Passo 2 - A base para a web
Para quem já sabe programar ou quem já fez esses cursos acima, o leque de
oportunidades se abre e muito.
Aprenda agora o básico de [**HTML** e **CSS**] construindo um site na prática, e

logo depois o básico de [banco de dados relacionais] com **MySQL** novamente
resolvendo problemas reais.
## Passo 3a - Programando e ganhando dinheiro logo, de casa mesmo
Você quer começar a trabalhar logo, de casa mesmo, criando alguns sites para
familiares ou conhecidos? Se você fez o curso de lógica em Ruby, já pode [aprender
Ruby on Rails 5] para implementar um sistema real.
Se fez os cursos de lógica em Javascript, pode aprender PHP e Mysql com fundamentos

para criar um [sistema Web cookies, sessões e mais recursos].
Tanto **Ruby on Rails** quanto PHP são amplamente utilizados nesse nicho.
## Passo 3b - Conseguindo um estágio no mercado
Existe um grande mercado de vagas de desenvolvedores Java e C#. Claro que a maior
demanda é por desenvolvedores com mais experiência, mas mesmo assim a demanda é
muito grande.
Um próximo passo agora que você já entende como funciona a criação e os problemas
de se desenvolver um site é entrar no mundo Java ou C#.
- Comece com os [primeiros passos em Java].

- Aprenda [orientação a objetos com Java].
- Entenda as [principais APIs e bibliotecas de base].
- Aprenda os [fundamentos de C#].

- Entenda [**Orientação a Objetos** com C#].
- Continue com [tópicos mais avançados de C#].
Os dois caminhos são mais longos do que os de Ruby, PHP e até mesmo Python, sendo
que esses três cursos apresentam a base da linguagem. Claro que todas as outras
linguagens também possuem vagas no mercado, mas de acordo com o google trends a
busca por essas duas ainda é muito forte e é o que recomendo.
## Passo 3 - Criando um jogo no mundo real
[Criar um jogo no mundo real], no mundo físico, é uma tarefa muito divertida que
fazemos com o Arduíno. A linguagem é baseada em C, portanto se quiser ir para esse
lado aprenda lógica e programação com a [introdução a C], [avançando na linguagem
C], e [recursos avançados da linguagem] antes.
## Passo 4 - Como continuar
Não queria deixar em branco o próximo passo... já aprendi uma linguagem e já estou
programando para a web. Como todos os nossos cursos e livros, é fundamental
entender e utilizar boas práticas de código. Além disso é importantíssimo ter uma
[boa prática de estudo] para não deixar de estudar daqui a pouco.
E claro, além de todas essas opções que temos na Alura pra quem está aprendendo a
programar, também [temos os cursos presenciais na Caelum] pra quem preferir essa
forma de ensino. Eles vão desde a [lógica de programação], até [a formação Java],
assim em poucas semanas você vai sair programando suas próprias ideias.
Agora você está livre para continuar o caminho que escolheu, claro que sempre
buscando boas práticas e bons professores.
Visualizar dados é uma das tarefas de um cientista de dados, por isso estava
analisando os dias em que as pessoas mais acessam a plataforma da **Alura**. Para
isso, os acessos da plataforma em uma semana do mês:
python
Esse método dos devolve um [**Series do Pandas**]:
python
Cada dia da semana está representado por um número - **0** para o domingo, **1**
para segunda-feira, e assim para os demais.
Bacana! Já temos os dados, como podemos **calcular a frequência** agora?
## Cada dia, um valor
Precisamos saber o total de acessos em um dia, ou seja, temos que pegar cada dia da
semana e ir somando 1 a cada vez que ele aparece na nossa lista. Há algumas formas
de se fazer isso, uma é fazer um loop e ir iterando por cada valor no array, outra
é utilizar a classe `Counter` da biblioteca de **collections** do **Python**.
Para utilizar essa classe, precisamos importá-la do pacote de `collections`:
python
Agora, só precisamos passar a nossa variável de acessos no construtor da classe

`Counter`:
python
A classe `Counter` cria um dicionário onde a chave são os dias da semana e o valor
é a quantidade que cada dia apareceu na amostra.
Podemos pedir para o Python nos mostrar o conteúdo dessa variável:
python
python
Podemos ver que a saída são todos os dias da semana e quantos acessos tivemos em
cada um deles. Como estamos utilizando um `Counter`, podemos ainda pedir apenas os
dias mais comuns, isso é, os dias com mais acessos:
python
Humm… ele nos devolve uma lista ordenada, onde cada posição é uma **tupla** com o
dia e a quantidade de vezes que ele apareceu. Podemos filtrar esse valor e pedir
para o Python só nos mostrar, por exemplo, os três dias com mais acessos:
python
Bacana! Conseguimos visualizar aquilo que queríamos. Porém, ainda só conseguimos

olhar esses dados pelo terminal, qual outra maneira temos de visualizar esses
dados?
## Um gráfico vale mais do que mil palavras
Uma forma muito [**comum de visualização de dados é por meio de gráficos**].

Existem diversas formas de criar um gráfico e visualizar os dados. No nosso caso,
estamos calculando a frequência de acessos e um gráfico muito utilizado quando
queremos visualizar isso é o gráfico de barras.
Vamos plotar esses dados utilizando a [**Matplotlib**], uma biblioteca muito

utilizada no mundo Python para visualização de dados.
Antes de tudo, precisamos importar da biblioteca o módulo de plotar gráficos com

Python **pyplot**:
python
Podemos pedir para o `pyplot` plotar um gráfico de barras para gente, onde o eixo
**X** tem os valores dos dias (`quantidade_de_acessos_por_dia.keys()`) e o eixo
**Y** os valores das frequências (`quantidade_de_acessos_por_dia.values()`):
python
imagem` (de histograma), do que **bar**, falando sobre um gráfico de barras que
pode ser "genérico".
Outro ponto interessante é que com os histogramas, temos tipos de manipulações de

dados comuns para dados de frequências, como por exemplo, descobrir a frequência
acumulada da amostra que estamos vendo.
Para isso, basta dizer que o parâmetro **cumulative** é verdadeiro:
python
imagem 70 pessoas acessaram a plataforma. Esse valor vai se acumulando até o fim da
semana.
## Com que frequência?
Gráficos são muito utilizados na visualização de dados. Com eles, conseguimos ver
de uma maneira macro como nossos dados se comportam.
Existem diversos tipos de gráficos. O histograma por exemplo, também conhecido como
distribuição de frequências, é muito utilizado quando temos que visualizar a
**frequência de dados** em uma amostra.
No nosso caso, olhamos apenas a frequência acomulada absoluta. Porém, poderíamos

ter olhado a frequência relativa. Isto é, o percentual que cada grupo de dados
representa.
Por exemplo, na nossa amostra temos 9791 dados. Isso representa 100% da amostra.
Domingo tivemos 953 acessos, aproximadamente 9,73% dos dados. Já segunda tivemos
1477 acessos, ou 15,09%.
Acumulando essas duas frequências relativas, temos 24.82%. O que nos diz que 24.82%
dos acessos foram entre domingo e segunda.
Visualizar dados é uma das tarefas principais de um cientista de dados. Aqui na

[**Alura, temos uma formação sobre Data Science**]. Nela você aprenderá desde a
parte de visualização, mineração, exploração e avaliação de hipóteses e muito mais.
Sabia que hoje é possível fazer páginas Web **funcionarem offline**? Na verdade, há
uns bons anos o HTML5 permite isso com a _Application Cache API_. Mas se você já
tentou usar,sabe que é difícil, chato e limitado.
A nova especificação de **Service Workers** repensa a Web Offline inteira. E faz a

coisa direito. É o futuro das Web Apps! Nesta palestra, falo dos conceitos
revolucionários dessa API e mostro como fazer uma página offline na Web:
https://www.youtube.com/watch?v=mchPQdKbbus
(Palestra gravada no evento FrontInPOA em Porto Alegre)
Quando fiz faculdade de Marketing achei que Redes Sociais era a área mais
importante dentro do Marketing Digital e conforme fui me aprofundando nos estudos
percebi que Marketing Digital pode ser um universo dentro do Marketing.
Primeiro pergunte-se: você será responsável por todo o Marketing Digital de uma
empresa ou por só uma parte? Ou seja, você ficará responsável apenas pela gestão
das redes sociais (publicação de conteúdo e interação com os usuário), por exemplo
ou vai cuidar dos anúncios, **SEO (Search Engenier Optimization)**, envio de e-mail
marketing, gestão de conteúdo das redes sociais, blog, criação das imagens....
Percebeu que existem várias coisas para serem feitas?
Se seu papel é atuar em uma única parte do Marketing Digital de uma empresa, sugiro
primeiro estudar todos os cursos daquela área, para depois abrir seu leque de
opções com outros cursos.
Se irá atuar em todas as frentes de Marketing Digital de uma empresa, sugiro

estudar o primeiro curso de cada área, e ai seguir estudando aquelas que se
encaixam com o momento atual de suas tarefas na empresa.
Vamos então as diversas áreas que temos por aqui nesse instante?
**Opção 1. Conteúdo** Se você gosta de escrever e busca uma maneira de compartilhar

as suas ideias e experiências e assim criar autoridade em um determinado assunto
para a sua marca ou negócio, uma alternativa interessante é fazer o curso
[**Marketing de Conteúdo: Uma introdução ao Marketing de valor**].
**Opção 2. Social Media** Se pretende atuar nos perfis de uma empresa nas redes
sociais, entenda melhor qual é o perfil do profissional que faz a gestão de
conteúdo e interação com os clientes através das redes sociais.
No curso [**Social Media Marketing: como fazer marketing nas redes sociais**] você
vai entender a importância e as possibilidades que ter uma presença digital para um
negócio ou marca através das redes sociais pode ter.
Uma vez que isso fique claro para você, que tal conhecer mais as principais redes
sociais? Aprenda a criar uma fanpage no curso [**Facebook Marketing**] e melhore a
influência de sua pagina.
Se quiser também atacar a parte de design de ads para o mesmo, não deixe de fazer o
curso [**Facebook: criação de imagens e anúncios**].
No curso [**Instagram Marketing: Promova seu perfil e conquiste mais audiência**]

vemos como tornar o seu perfil mais relevante, como pesquisar referências para você
ter ideias sobre o que publicar e como mensurar os resultados das ações que você
realizar.
**Opção 3. SEO** Se você pretende aumentar o acesso a sua empresa e seu conteúdo
através de search engines como o Google, existe uma série de cursos ligadas aos
canais não pagos: começando com [**Introdução aos canais não pagos**], passando por
[**SEO I: Rankeie bem no Google**], [**SEO II: Mais técnicas para rankeamento**] e
[**SEO III: Métricas e Relatórios SEO**].
**Opção 4. Canais pagos** Entenda quando é o momento adequado de usar canais pagos
em sua empresa através do curso [**Introdução aos canais pagos**], depois entenda
como aplicar técnicas de ads no [**Google Adwords: Publicando a minha primeira
campanha**] e [**Google Adwords: Otimizando seus resultados**].
**Opção 5. E-mail Marketing** No dia a dia é interessante manter o contato com seus
clientes através de diversos meios e os cursos de Email Marketing vão permitir que
você entenda um pouco mais sobre como trabalhar esse canal. Primeiro entenda o
mesmo com [**Inbound marketing: Email marketing da segmentação ao AB**]. Depois o
curso de [**Email marketing: design do seu email**] ajuda aqueles que pretendem
fazer o design desses emails de forma tradicional.
**Opção 6. Criação de sites/Blogs** Muitas empresas e empreendedores que divulgam

conteúdo gerenciam sua própria plataforma e a mais famosa delas é o Wordpress.
Pensando nisso, se você será responsável pelo manuseio da ferramenta no dia a dia,
não deixe de estudar [**Wordpress: primeiros passos para não programadores**].
Se você quiser se aprofundar na parte técnica do mesmo, como instalação

configuração e customização, veja também [**Wordpress I: Hospedagem, Adm e
widgets**] e [**WordPress II: páginas, temas e boas prática**].
**Opção 7. Ecommerce** Por fim, se sua empresa é de ecommerce, uma das ferramentas
mais populares hoje em dia é o Shopify, e mantemos dois cursos sobre como utilizá-
la no dia a dia em [**Shopify I: Colocando sua loja online no ar**] e [**Shopify
II: Customizações e ajustes para a sua loja online**].
**Resumindo**
Independentemente de qual área seguir, é interessante saber medir os resultados de

sua empresa em sua presença online, e para isso temos o curso [**Medindo
resultados**].
Espero que esse post ajude você a traçar um caminho para sua carreira nessa área
que tanto cresce no Brasil, permitindo a criação e divulgação de sites e empresas
cada vez melhores e que trazem melhores resultados tanto para seus clientes quanto
para a empresa.
Completei mais um curso na Alura e aumentei a minha pontuação:

java
Para imprimir a minha pontuação basta concatenar a variável àluno + pontos` dentro
de um sysout:
java
Mas, como eu poderia fazer com que o aluno e a pontuação fossem uma variável só? É
simples! A mesma coisa, basta "converter" a variável inteira (ìnt`) para `String`:
java
Mas agora entrei no instrutor Guilherme Silveira, e olha os pontos dele:
java
Olhando de cara qual é o valor desse número? Um milhão e oitocentos mil? Dezoito
milhões?Cento e oitenta milhões? Vou ter que contar com o dedo na tela para saber o
valor exato, muito chato e é certeza que eu vou errar!
Para separar a pontuação por casas podemos utilizar a classe `NumberFormat`:
java
Resultado:
java
Ótimo! O número foi formatado como esperado, porém na maquina do João o resultado
foi:
java
Calma aí. Está dependendo da máquina??? Isso ocorre pois o getInstance devolve um
formatador baseado na linguagem configurada na máquina. Para informar uma região
específica basta definir uma localização, um `Locale`.
No meu caso, quero a língua portuguesa `("pt")`, com a variação do português

brasileiro `("BR")`.
java
Resultado:
java
Agora tanto a minha máquina como a do meu colega, ou ainda, a máquina de produção
imprimem o mesmo resultado.
Quando começamos a programar, aprendemos a concatenar e parece o suficiente… mas

mesmo em uma tarefa simples é importante seguirmos 3 passos:
- números acima de 999 ficaram legíveis?

- use o Locale adequado.
- teste em mais de uma maquina.
**[A classe Locale e o conceito de regionalização] é tambem explicado com mais

detalhes nesse post da Caelum.**
Acabei de terminar mais uma funcionalidade da minha aplicação e preciso testá-la.
Porém a minha aplicação possui o ambiente de desenvolvimento, teste e produção:
java
Agora vou usar a classe Scanner e fazer a leitura pelo teclado para testar o meu
código:
java
Resultado:
shell
Poxa vida...
Além de cansativo, existe a possibilidade de eu errar a opção e executar um

ambiente por engano ou até mesmo não executar nenhum. Como eu posso fazer com que,
ao executar o meu programa, ele já saiba que ambiente rodar? Pelo parâmetro args do
método `main`!
java
Ué, aquela variável que não serve pra nada?
O parâmetro args é um array que **recebe dados da command line** (linha de

comando), ou seja, no momento que executamos a nossa aplicação podemos enviar uma
informação por meio dele.
## Enviando o parâmetro args na execução
Vamos então fazer teste enviando o valor **DEVELOPMENT** durante a execução da

classe `Main`:
imagem`:
java
Testando o ambiente de desenvolvimento:
imagem`, como por exemplo usuário (user.name) ou o sistema operacional (os.name).
E aí, já passou por alguma situação em que precisava testar ambientes diferentes? O
que achou dessa alternativa utilizando o `String[] args` e as Properties da classe
`System`?
Afinal, qual a diferença entre as tuplas e as listas na linguagem **Python** ? Veja

quando utilizar uma e outra e perca essa grande dúvida :)!
Estou trabalhando em uma aplicação de mapeamento que se baseia em [**coordenadas

geográficas**] para localizar endereços. Mas como posso armazenar estas
coordenadas?
Uma ideia é termos uma variável para latitude e uma para longitude, mais ou menos
dessa forma:
py
Por enquanto tudo bem. Mas quero trabalhar com rotas e distâncias, então preciso de
mais de uma coordenada. E aí, como fazemos? Temos que criar outras variáveis de
latitude e longitude?
py
Bem… isso já está ficando estranho, não é? À medida que a quantidade de coordenadas
vai crescendo, nosso código está ficando mais confuso e nos dando mais propensão a
erros.
O ideal seria não deixar **latitude** e **longitude** separados, mas juntos em uma
variável só, realmente organizados como uma coordenada. Quando queremos guardar
juntos mais de um valor no Python, a primeira coisa que vem à mente são… [**as
listas**]! Vamos usá-las, então:
py
Agora já melhorou bastante, temos as nossas duas coordenadas separadas e

organizadas! Mas será que uma lista é o melhor tipo para o que queremos fazer no
Python?
## Os problemas da lista
Listas no Python são incrivelmente poderosas e úteis, mas será que são o ideal no
nosso caso? Em primeiro lugar, podemos pensar no que pode ser problemático na
prática, como a mutabilidade das listas.
Já sabemos que [**listas são mutáveis**], ou seja, que os valores de um mesmo

objeto lista podem ser alterados. O que aconteceria, então, se alguém adicionasse
um valor em `caelum_coordenadas` com o método **append()** ou ainda removesse um
com o **remove()**. Essa variável não teria mais sentido nenhum!
Pior seria se alguém simplesmente mudasse um dos valores, fazendo por exemplo isso:
py
`caelum_coordenadas` agora apontaria para uma coordenada sem relação nenhuma com o
que era pra ter o endereço da Caelum São Paulo. Agora, na verdade, [aponta para o
meio do Oceano Atlântico]! Isso não faz sentido nenhum pra nós…
Além dessa questão prática, temos um grave problema de **semântica**. Usamos uma
lista para representar a coordenada, certo? Mas se é uma lista, **é uma lista de
quê?** Afinal,são dois valores diferente - **latitude** e **longitude**.
A [**própria documentação do Python**] indica que os elementos de uma lista são,

geralmente, **homogêneos**. Ou seja, têm o mesmo tipo e significado. Com as nossas
coordenadas, temos valores **heterogêneos**, pois representam duas coisas
diferentes (para então formar uma só).
Não só; direto de uma definição de lista no dicionário: uma relação **ordenada** de
coisas **relacionadas**. Repare que o que queremos não é **ordem**, mas
**estrutura** a relação não é de que latitude vem primeiro que longitude, mas que
latitude está na primeira posição, enquanto longitude na segunda.
O que além da lista poderia ser usado para satisfazer melhor nossa necessidade?
## Conhecendo as tuplas
O Python nos disponibiliza um tipo que preenche muito melhor as características que
procurávamos - [as **tuplas**]. Tuplas podem ser consideradas similares às listas,
mas suas diferenças são cruciais.
Quanto à sintaxe, a tupla se diferencia por substituir os colchetes (`[]`) das

listas por parênteses (`()`):
py
Só para checar o tipo:
py
Em primeiro lugar, a diferença mais explícita pela própria comunidade Python é que
**tuplas são imutáveis**. Isso significa que não podemos alterar um mesmo objeto
tupla, ou seja, mudar uma de suas referências internas (seus valores), nem
adicionar ou remover elemento algum:
imagem:
imagem no final do valor, mesmo com os parênteses, ou o Python não interpretará

como tupla.
Outro ponto importante e que pode gerar confusão a respeito dessa imutabilidade é
que **tuplas podem conter objetos mutáveis**, como listas:
imagem que, por conta disso, tuplas ocupam menos espaço na memória comparadas a
listas:
imagem`
Já que as tuplas se baseiam na estrutura dos nosso dados, seria interessante poder
nomeá-los. Pensando nisso, no Python, já existe uma maneira para implementarmos
nossas tuplas com campos nomeados - com [**a função namedtuple()**], localizada no
módulo **collections** da biblioteca padrão da linguagem..
A função `namedtuple()` é, na verdade, uma fábrica de tuplas nomeadas. Isto é, ela

nos retorna um objeto de uma subclasse de tupla que, além de darem acesso aos
elementos pelo índice, nos permitem dar significado nomeado para cada um deles e
acessá-los dessa forma:
imagem.
## Conclusão
Listas e tuplas são algumas estruturas de dados muito utilizadas quando estamos
programando. Essas duas estruturas nos permitem guardar nossos dados agrupados,
contudo suas semelhanças se encerram por aí, como pudemos ver nesse post.
Conseguimos desmistificar a ideia de que a tupla é **apenas** uma lista imutável, e

entendemos como as listas têm uma função semântica diferente das tuplas.
Listas são usadas para guardar dados de mesmo tipo e significado, de modo que a
ordem pode fazer diferença.
Já as tuplas, além de serem imutáveis, têm uma semântica muito mais estrutural,
armazenando dados heterogêneos. Isto é, a posição do dado pode alterar o seu
significado.
Também conhecemos um outro tipo que pode nos auxiliar com o bom uso da tupla - a
tupla nomeada, gerada pela função `namedtuple()`. Com ela, podemos dar um nome para
cada elemento da nossa tupla.
E aí? Gostou de entender mais sobre esse tipo no Python? Se quiser aprender mais
sobre a linguagem, dê uma olhada em nossos [**cursos de Python na Alura**] e
continue estudando!
Veremos nesse artigo como podemos **baixar uma imagem a partir da url** que o
servidor nos retorna para exibi-la em um **UIImage**.
Estou desenvolvendo um aplicativo que lista filmes recentes. Para pegar as

informações dos filmes, estou fazendo [**uma requisição para a API do The Movies
DB**].
Vamos começar discutindo sobre esse assunto, utilizando como base a API do The
Movie DB para listar os filmes
imagem` onde passamos por parâmetro a url da imagem:
swift
Vamos rodar o app para testar:
![]
Ótimo, dessa forma conseguimos setar todas as imagens dos filmes.
Uma imagem vale mais do que mil palavras
No nosso catálogo de filmes é legal mostrar sua capa. Geralmente, quando batemos em
uma API, nós recebemos uma URL com o endereço da imagem. Então como podemos exibir
essa imagem?
Vimos que podemos utilizar a biblioteca ÀlamofireImage` para baixar a imagem. Mas
só baixar a imagem não garante que conseguimos mostrá-la na tela. Para isso,
precisamos utilizar a classe UIImage.
Aqui na Alura, temos uma [**formação IOS**], nela você aprenderá a construir
aplicativos para **iPhones** com a linguagem Swift, técnicas de construção de
layouts e sincronia com serviços web.
Uma professora de matemática elaborou uma técnica de avaliação diferente, em uma

tentativa de aumentar a interação entre os alunos para a próxima prova, a nota de
todos seria a mesma, equivalente à média de todas as notas.
Todo esse processo seria feito por um sistema automático em **Python**. As notas
dos alunos da sala avaliada foram arquivadas em uma estrutura de **lista**:
python
A fórmula para calcular a média aritmética de uma lista de números é a **soma dos
números dividida pela quantidade de números**. Precisamos, então, descobrir duas
coisas: a **soma das notas** e a **quantidade de notas**.
## Somando todos os elementos de uma lista
Para somar todos os elementos da lista, vamos começar inicializando nossa variável
que conterá o resultado da soma das notas com o valor `0`, indicando que a soma
ainda não foi feita:
python
Assim, uma abordagem que podemos seguir é através da iteração sobre as notas - para
cada nota, soma-se seu valor à variável `soma_das_notas`, dessa forma:
python
E o resultado da soma:
```
98.0
```
Funciona perfeitamente! Mas será que não há uma maneira mais simples de somar todos
os elementos de uma lista?
## Somando os elementos de uma lista com a função sum()
Somar todos os elementos de algum conjunto é uma tarefa bastante comum em

programação. Sendo assim, o Python também tem uma função nativa dedicada ao cálculo
da soma de todos os elementos de uma lista - a função **[sum()]**!
Vamos usar essa nova abordagem:
python
Novamente, o resultado esperado:
```
98.0
```
Não só é mais simples usar a função `sum()` do que implementar um algoritmo de soma
nós mesmos, como [sua performance é muito melhor] - um loop `for` é executado como
**_bytecode_** Python interpretado, enquanto a função `sum()` é escrita puramente
na linguagem C.
Agora que já sabemos a soma das notas, precisamos descobrir a quantidade delas.
## Descobrindo o tamanho de uma lista com a função len()
A quantidade de notas é o tamanho da lista. Podemos, é claro, contar nós mesmos e

armazenarmos essa contagem nossa em uma variável:
python
Tudo bem, mas essa abordagem seria problemática caso a lista mudasse de tamanho, ou
até mesmo se a lista fosse maior (imagine contar número a número em uma lista de
mais de 100 elementos!)
Se já trabalhamos com outras linguagens de programação, provavelmente vimos que

geralmente há uma maneira nativa mais simples para se calcular o tamanho de uma
lista. No Python isso não é diferente!
A função _built-in_ **[len()]** retorna o comprimento de um objeto cuja classe

implemente o **[método **len**()]** , como por exemplo uma string, ou, no nosso
caso, uma lista. Vamos testá-la com nossas notas:
python
E o resultado é o esperado:
```
15
```
## Calculando a média aritmética
Agora que temos os dois valores que precisávamos, vamos calcular a média utilizando
a fórmula `soma_dos_numeros / quantidade_de_numeros`:
python
Agora já temos a média:
```
6.5333
```
O resultado foi divulgado aos alunos, que responderam com reclamações - a nota foi
mais baixa do que o esperado.
Depois de uma análise das notas, descobrimos que a média estava sendo calculada com
a nota **0** de dois alunos que faltaram no dia da prova, o que não era justo!
Precisamos, então, remover essas notas **0** de nossa lista e recalcular a média.
## Removendo um elemento de uma lista com o método remove()
Agora que já temos nossa lista completa, como podemos remover um elemento de dentro
dela? Para isso, o Python nos traz o método **`remove()`**, que recebe como
parâmetro o **valor** que queremos remover de nossa lista. Vamos testar:
python
E o resultado:
```
[0, 9.0, 8.0, 5.0, 10.0, 7.0, 0, 7.5, 4.0, 10.0, 7.0, 7.0, 8.0, 8.0, 7.5]
```
Ok! Conseguimos remover um dos **0**, mas o outro ainda ficou. Por que será?
Acontece que o método `remove()` remove apenas o primeiro elemento encontrado cujo
valor é igual ao parâmetro passado, não todos os elementos com esse valor.
Precisamos, então, chamar o método `remove()` duas vezes? Tudo bem, isso daria
certo, mas e se, em vez de duas, tivéssemos dez notas **0**. Será que realmente
precisaríamos repetir uma mesma linha de código dez vezes? Isso não parece o ideal.
Conhecendo o Python e lógica de programação, uma abordagem intuitiva para esse

problema seria iterar sobre a lista com um loop `for` e remover o valor caso ele
seja igual a **0**, para não precisarmos nos preocupar com a quantidade de notas
**0**. Vamos tentar:
python
E o resultado:
```
[0, 9.0, 8.0, 5.0, 10.0, 7.0, 7.5, 4.0, 10.0, 7.0, 7.0, 8.0, 8.0, 7.5]
```
Ué! De novo sobrou um **0**! Por quê, dessa vez? Nesse caso, o que houve foi uma
confusão entre o laço `for` e o método `remove()`.
O `for` itera sobre os elementos de uma lista através do índice - ou seja, ele
começa com o elemento na posição 0, passa pro elemento na posição 1 e assim por
diante, até que o índice (a posição) atinja o comprimento da lista.
O método `remove()`, por sua vez, ao apagar um elemento, realoca os outros dentro
da lista para que não haja um espaço vazio no lugar onde havia o elemento removido.
Quando removemos um elemento da lista, a lista realmente diminui de tamanho!
Sabendo disso, vamos fazer uma simulação passo a passo para tentar entender o que
aconteceu:
**PRIMEIRO LOOP**: índice = **0** lista = \[**0**, **0**, 9.0, 8.0, 5.0,
10.0, 7.0, 7.5, 4.0, 10.0, 7.0, 7.0, 8.0, 8.0, 7.5\]
**SEGUNDO LOOP**: índice = **1** lista = \[**0**, **9.0**, 8.0, 5.0,

10.0, 7.0, 7.5, 4.0, 10.0, 7.0, 7.0, 8.0, 8.0, 7.5\]
Note que o segundo `0` foi ignorado pelo `for`! Quando o `for` chegou no índice 1,
onde estava esse `0` inicialmente, o `0` já havia sido realocado para o índice 0,
resultando nesse problema.
Por isso, devemos sempre lembrar que é recomendável **nunca alterar uma lista
enquanto se itera sobre ela!**
Precisamos de uma forma melhor de remover todas as ocorrências de um mesmo valor em

uma lista.
## Filtrando uma lista utilizando _list comprehensions_
Já conhecemos uma técnica no Python chamada de **[compreensão de lista]**. Como

podemos usá-la para resolver nosso problema? Queremos uma lista com todos os
valores da nossa lista de notas, contanto que o valor seja maior que `0`.
Vamos lá, então:
python
E agora sim:
```
[9.0, 8.0, 5.0, 10.0, 7.0, 7.5, 4.0, 10.0, 7.0, 7.0, 8.0, 8.0, 7.5]
```
Enfim, basta recalcularmos a média com essa nova lista de notas:
python
Dessa vez, uma média melhor para os alunos:
```
7.538461538461538
```
Após a média ser calculada e arredondada para **7.5**, a professora quis conferir
se seu método de avaliação tinha sido efetivo - isto é, se a nota da sala realmente
representava como os alunos tinham se saído na prova.
Para isso, ela precisava calcular quantos alunos tiraram a nota na média, com uma
margem de diferença de **0.5** (ou seja, quantos alunos tiraram uma nota entre
**7** e **8**).
## Contando elementos em uma lista com o método count()
Para contar quantas vezes um elemento aparece numa lista, podemos usar o método
**`count()`** dessa forma:
python
E o resultado:
```
3
```
Para de fato fazermos o que queremos precisamos usar o método com três valores -
**7**, **7.5** e **8**:
python
O resultado:
```
8
```
Certo! No nosso caso, essa solução com o `count()` funciona bem, porque sabemos que
são apenas esses três valores (`7.0`, `7.5` e `8.0`) que queremos.
Mas e se nossa lista tivesse, por exemplo, valores como **7.1**, **7.2**... e assim
em diante até **8.0**. Teríamos que fazer um `count()` para cada um desses valores?
Parece complicado, não é?
Uma outra abordagem que poderia ser utilizada, que evitaria o problema de haver
mais valores no intervalo que queremos contar, seria utilizar um laço `for` e
armazenar o valor da contagem em uma variável, dessa forma:
python
Temos o mesmo resultado:
```
8
```
Juntando o que aprendemos do método `sum()` e de compreensão de lista, e sabendo

que no Python a classe `bool`, que representa os tipos booleanos, herda da classe
ìnt` (**True é igual a 1 e False é igual a 0**), podemos até fazer isso de uma
forma bem mais sucinta:
python
Temos o mesmo resultado:
```
8
```
## Conclusão
Nesse post pudemos ver a utilidade da listas, quando podemos usá-las e o que
podemos fazer com elas.
Passamos por necessidades como remover todas as ocorrências de um valor na lista,

somar todos os elementos da lista, saber o comprimento da lista e até remover todas
as ocorrências de um elemento na lista, e conseguimos resolver uma a uma através de
nossa lógica e das próprias funcionalidades do Python!
## Para saber mais
Quer aprender mais sobre listas em Python? Dê uma olhada nos nossos outros posts no
blog sobre o assunto e aprenda mais sobre **[adicionar elementos a uma lista]**,
**[ordenar uma lista]** e até conheça a funcionalidade da **[compreensão de
lista]**.
Além disso, pode ser legal dar uma lida na [documentação das listas no Python],
para conhecer mais possibilidades no tratamento delas.
Gostou do conteúdo? Está mais confiante para usar listas no Python, agora? Que tal
aprender um pouco mais? Confira nossa [formação Python para web] e continue
estudando!
imagem
A Alura decidiu criar um canal no youtube para expandir o seu público. O [**canal
foi criado**] e esta é a aparência atual:
imagem antes de começar a publicar os vídeos.
Pensando nisso, chegamos neste visual para a capa e o avatar da Alura:
imagem para cada aparelho existente?
Será que existe alguma medida padrão que funcione bem para os diversos tamanhos de
tela? Seja pelo computador, celular, tablet, etc.
## Os padrões de medida do YouTube
No intuito de conseguir redimensionar de acordo com o necessário (seja celular,

desktop, etc), o Youtube determinou alguns padrões que auxiliam nesse processo:
imagem é um dos principais lugares para fazer uma declaração sobre você e sua marca
ou empresa.
Se um usuário entrar pela primeira vez no seu canal e não conseguir entender do que
se trata, é bem provável que perca o interesse em assistir algum vídeo seu.
Será que também há um padrão para a criação de capas de acordo com o seu gênero?
## O que fazem por aí
Um dos exemplos que podemos utilizar é o da própria Alura:
imagem e na capa com algum fundo que você acha bonito dando o foco a foto (e talvez
até algum texto com a frequência em que você posta).
Há diversas outras formas para se criar uma capa, vai muito de cada contexto ou
necessidade. :)
## Resumindo...
Apesar de não existir nenhuma regra de fato para criar capas e avatares, temos
algumas orientações e padrões importante para considerar quando estamos
desenvolvendo nosso canal no Youtube.
O limite é sua criatividade! Há diversas formas para se fazer. O importante é

manter a coesão com a sua identidade e o conteúdo.
Quer aprender mais sobre as diversas áreas e possibilidades de Design? Temos uma
[**formação**] na Alura que pode te dar uma ampla visão sobre o assunto!
Na empresa existem três coisas que posso fazer: responder emails, fazer reunião ou
trabalhar. E assim segue a piada...
Claro que, na verdade, responder um email é uma pequena parte da execução de uma
tarefa. Assim como adoro reuniões que são na verdade um trabalho em par ou uma
revisão de algum conteúdo que foi criado anteriormente.
Depois de responder 30 emails, 30 mensagens diretas e 4 reuniões ou pareamentos,

quando vou escrever um post no blog? Definir a ementa de um curso novo? Bolar a
idéia de um novo livro ou testar uma tecnologia? Quando vou produzir algo
diretamente palpável?
A categorização que escolhi entre "fazer algo palpável" e "colaborar com outros"
foi proposital. A maior parte do meu dia passo colaborando com outros em algo que
eles estão fazendo uma vez que sou responsável pela qualidade do conteúdo criado
para o Alura. E sou chato.
Mas e esse vazio que sinto? As "minhas" tarefas que não executei? Como encontrar
tempo para tudo isso sendo que o dia continua com 24 horas sendo só 8 para meu
trabalho direto.
**A primeira técnica que quero compartilhar(comecei a usar em 2016) por idéia
própria e é bem simples. Até o almoço eu colaboro, eu sento junto, converso com
quem quiser conversar. Almoçei, voltei, coloco o fone de ouvido e o mundo agora é
meu. Agora eu produzo, tenho meu produto em minhas mãos e só um foco.**
Se você é um desenvolvedor, um designer, um jornalista ou qualquer outro

profissional cujo tempo de pareamento e colaboração com outro profissional é
importante, você já sabe: precisa de um tempo para colaborar. Mas sabe também que
se entupir de reuniões e emails pode levar a produzir zero. Balanceie. Comece com
uma regra fixa e só pense em flexibilizá-la bem pra frente, quando dominá-la.
**Tudo bem Guilherme, de manhã colaboro com outros, puxo outros para opinarem no
que fiz, faço as reuniões e opino no que eles estão fazendo. Chega a tarde e vou
ter um único foco: minha produção direta.**
Mas começa a pipocar mensagens na aba do meu email, pipocam notificações de

mensagem privada no messenger da empresa (Slack alguém?), eu abro e desfoco do meu
produto. De repente estou indo e vindo de uma aba pra outra. Além do Facebook, que
não para de me pingar na aba. Ah, sem contar o o celular, piscando e vibrando com
as mesmas notificações de email, messenger, facebook, whatsapp etc.
Como não me distrair com essas notificações e focar a tarde inteira produzindo?
A segunda dica que quero dar é de diminuir suas distrações. Feche a aba do
facebook, do email e do messenger. Aliás, ao voltar do almoço você vai dar um único
comando: ALT+F4 no windows ou COMMAND+Q no Mac. Feche o navegador. Abra novamente
com uma única aba, a do seu trabalho atual.
**Mas e o celular? Desativa todas as vibrações e vira ele pra baixo na mesa. Deixe-
o voltado pra baixo, para que você não tenha como saber nem que horas são, nem se
recebeu mensagem. Desconecte-se do mundo e dos outros. Não desligue o celular, você
pode precisar em emergências, claro. Se o seu trabalho não envolve a internet,
desligue o wifi. Se você é chato como eu, coloque a plaquinha do lado "reunião
agora? só amanhã".**
Em dois passos você terá o que todo profissional precisa: um momento de

criatividade colaborativa, e um momento de criatividade solitária, reflexão e
produção.
O segredo da produção em quantidade não está na qualidade extrema de um

profissional, está na sua capacidade de focar. Desligue o que você não precisa.
Desligue o que você não quer.
Você não quer aquela outra aba que está aí em cima. Fecha ela agora. Vira o seu
celular pra baixo. Se como eu, você voltou do almoço, fecha tudo.
Abra uma aba e começa a produzir. Muito.
**ps: tire a foto do seu celular virado pra baixo, de sua placa "reunião hoje, só
amanhã" ou cabo de internet/wifi desconectado e compartilhe comigo no twitter com
#produtividadedogui**
imagem
Max Wertheimer foi um dos principais representantes da Gestalt e definiu o
_Fenômeno Phi_ em 1912 que, junto da _Teoria da Persistência da Visão_**,** daria
forma à _Teoria do Cinema_ de Hugo Münsterberg. A **persistência da visão,** ou
**persistência retiniana,** nos diz que uma imagem dura um certo tempo em nossa
retina, uma fração de segundo, e que, se dispormos imagens estáticas em uma
sequência, teremos a sensação de movimento.
Dizer que exibir imagens em sequência pode produzir a sensação de movimento parece
até senso comum, pois já temos noção de como os desenhos animados e filmes são
produzidos, mas não era tão simples assim quando não havia referência. Wertheimer
conseguiu provar o _Fenômeno Phi_ por meio do seguinte experimento: ele direcionou
um feixe de luz para uma tela, onde formou-se um ponto, então apagou essa luz e
acendeu outra ao lado, formando outro ponto, que depois também se apagara, e
repetiu o procedimento cada vez com intervalos menores entre um feixe de luz e
outro. Ao diminuir o intervalo de tempo, Wertheimer percebeu que havia uma
característica de movimento na percepção, a qual o cérebro produzia uma ponte entre
uma imagem e outra – o **_Fenômeno Phi_**.
![experimento_max_wertheimer_1]
Wertheimer sugeriu que o _Fenômeno Phi_ fosse considerado um fenômeno sensorial

primário, pois não dependia de outros fatores para ser percebido. Assim como temos
a sensação de tato ao tocar em algo, de olfato ao sentir um cheiro, o _Fenômeno
Phi_, segundo Wertheimer, nos dá a sensação de movimento mesmo que as imagens
estejam paradas e, portanto, poderia ser considerado um sentido primário, que não
depende de outros sentidos.
![experimento_max_wertheimer_2]
O _Fenômeno Phi_ possibilitou o desenvolvimento do cinema, dos desenhos animados,

de técnicas de _stop motion_ e muitas criações que passam a sensação de movimento a
partir de imagens estáticas.
**Quer saber mais sobre Gestalt, Animação e Design? [Acesse a formação de Design &
UX do Alura]!**
O mercado de aplicações mobiles não para de crescer e com isso a demanda por
desenvolvedores tem crescido também. Se você tem interesse em entrar nesse mercado,
vai ver que tem várias opções para construir suas apps.
Uma dessas opções é o desenvolvimento com o Ionic, um framework que foi criado em
2013 e vem ganhando muito espaço dentro da comunidade.
## Desenvolver utilizando HTML, JS e CSS e consegui exportar para Android e IOS
Esse tipo desenvolvimento é chamado de desenvolvimento híbrido. Você não precisa

escrever na linguagem nativa do sistema operacional, você pode usar HTML,
JavaScript e CSS e no final do desenvolvimento, você consegue exportar essa
aplicação para Android e iOS.
## Tags que facilitam o desenvolvimento
A equipe do Ionic desenvolveu várias tags que podem ser usadas para a construção
das nossas telas. Além de nos oferecer velocidade na hora de desenvolver, a tag já
se preocupa com o layout que vai ser apresentado no Android e iOS. Por exemplo,
quando criamos um componente de tabs o Android segue o padrão de deixá-las no topo
da tela, já o iOS deixa bem no rodapé. Podemos ver um exemplo na imagem abaixo:
![android_ios_tabs]
Quando estamos desenvolvendo com o Ionic e usando as tags que ele nos oferece, ele
já cuida dessa diferença pra gente, ou seja, para obtermos o mesmo resultado como
vimos acima, basta apenas escrevermos o seguinte código:
xml
## Ferramentas da próprias, como o Ionic Creator e o Ionic View
A empresa por trás do framework é bem ativa e está sempre trazendo novos produtos
para poder agregar ao seu produto. Dentre os produtos disponibilidade eu destaco o
[Ionic View]. Com ele é possível testar a aplicação que você está desenvolvendo sem
a necessidade de colocar em alguma loja, como o Google Play ou a App Store, basta
você instalar esse aplicativo no celular que você quer testar a aplicação e fazer o
download da aplicação que você subiu para sua conta no Ionic.
**Outro produto interessante é o [Ionic Creator]. Com ele é possível você

prototipar uma aplicação de forma visual arrastando componentes e personalizando
eles e após isso, você pode baixar o código da aplicação e continuar o
desenvolvimento da mesma.**
Muito dos serviços são pagos, mas quase sempre eles tem algum plano free para você
pode testar.
## Integração com o AngularJS e seus bibliotecas
Junto com o Ionic, temos uma versão do famoso framework da Google, o AngularJS.
Todo o seu conhecimento de AngularJS pode ser usado para criar aplicações mobile e
não só seu conhecimento é bem-vindo mas também as bibliotecas do Angular que você
já usa nas aplicações web. Então caso você tenha uma biblioteca que gostou de usar
e queira usar aqui, você pode.
## Produtividade
Com todo esse ambiente que foi construído ao redor do ionic, a produtividade é
alta. Várias tags para os componentes mais comuns em uma aplicação mobile, layout
personalizado para cada plataforma é feito pelo framework nos poupando desse
trabalho, várias ferramentas a seu dispor para ajudar a criar, desenvolver e testar
suas aplicações e a integração com o Angular deixa esse framework cada dia melhor e
mais produtivo.
Durante meu trabalho com o Ionic, foram esses os pontos positivos que achei e
gostaria de compartilha com vocês, e assim agregar mais conhecimento para nós e a
comunidade de aplicações híbridas que cresce a cada dia.
**O que achou do Ionic? Está afim de aplicá-lo nos seus próximos projetos mobile?
Então não perca tempo, dê uma olhada no nosso [curso de Ionic] aqui na Alura.**
imagem
Hoje quando desenvolvemos um site já devemos nos certificar da adequação dele para
telas de diferentes tamanhos, em especial o ajuste para smartphones e tablets,
afinal, sabemos que o número de pessoas que acessam sites e contas através destes
dispositivos têm aumentado exponencialmente.
Sendo assim, estamos diante de um cenário, de um contexto que sabemos que querendo
ou não nosso projeto estará inserido. Haverá sim, pessoas que vão acessar nossas
páginas dentro do ônibus, do metrô, em casa, deitado na cama ou de inúmeras outras
formas.
Se existem tantas forma diferentes de se utilizar uma solução, talvez seja ideal
refletir sobre estes cenários fictícios desde o início do projeto, a fim de criar
soluções mais assertivas e criativas para o usuário.
Mais do que pensar somente em funcionalidades e telas, hoje devemos pensar muito
além para o desenvolvimento de um bom produto: devemos contextualizar.
## Entendo o contexto
Quando se fala sobre contexto em Ux, estamos nos referindo à cenários, geralmente
hipotéticos, onde o usuário estará interagindo com a nossa solução. Tais situações
são geralmente relatadas através de [narrativas escritas, storyboards, vídeos ou
até histórias em quadrinhos][.]
Unir a criação das [**personas**] com a reflexão sobre os momentos de uso do

produto nos permite enxergar com mais clareza, quais fatores externos poderão
influenciar positivamente ou negativamente a experiência do usuário.
Toda experiência, mesmo em produtos digitais, está suscetível ao mundo real durante
a sua utilização, afinal, **o produto se adapta ao contexto e não o contrário**.
Um aplicativo deve pensar na disposição das principais funcionalidades na tela

[**com base nos dedos que o usuário utiliza**], por exemplo, as atividades
principais da solução geralmente se mantém na parte inferior da tela devido ao uso
preferencial dos dedões. Quanto mais no topo da tela o botão estiver menos
confortável é para o usuário utilizá-lo.
> A Internet das Coisas (IoT) vem reforçar ainda mais a necessidade da
contextualização, através da ideia de trazer a internet para diversos objetos do
nosso cotidiano, influenciando profundamente a forma como interagimos com o mundo a
nossa volta.
Há projetos em que os cenários já fazem parte dos requisitos iniciais, como por
exemplo, um aplicativo de caminhada, onde sabemos desde o começo que nossos
usuários estarão de pé, se movendo, na rua ou em algum outro local e não na frente
de um computador ou sentado no metrô.
Mas quando estas necessidades não fazem parte tão diretamente da ideia do projeto,
há a grande possibilidade de não refletirmos sobre o uso do mesmo.
## O valor do contexto
**Contextualizar nos ajuda a visualizar a experiência desejada**, levando em conta

quais serão as expectativas e motivações daquele usuário, qual o cotidiano em que
ele está inserido e qual será o momento em que em meio a tudo isso ele irá procurar
a nossa solução.
De que forma dentro destes cenários eu vou poder agregar mais valor para o meu
produto utilizando todos esses fatores externos em benefício de uma experiência
relevante e personalizada para o meu usuário?
Por este motivo e outros, é de suma importância para o profissional da área de UX,
sair da frente do computador e **descobrir novas informações para o projeto através
de técnicas como pesquisas com os usuários e entrevistas**.
Na **Alura** existem inclusive cursos como o de [**UX Produto**], que mostram

algumas práticas de testes e métricas para por em práticas em seus projetos.
imagem
É bem comum o desenvolvedor JavaScript precisar testar a obrigatoriedade de

parâmetros das funções que cria. Vejamos um exemplo:
javascript
Excelente, mas se nossa função tiver cinco parâmetros obrigatórios, teremos que
repetir cada instrução ìf` cinco vezes. A boa notícia é que podemos utilizar um
recurso adicionado no ES2015 (ES6) já consolidado entre os navegadores para tornar
nosso código menos verboso e elegante. Primeiro, vejamos que recurso é este:
## Parâmetro padrão (default parameter)
Temos como exemplo a função `temporizador` que executará uma função depois da
quantidade de milissegundos definida pelo usuário:
javascript
Muito bom, mas o programador terá que passar toda vez, como último parâmetro, a
quantidade de milissegundos. Que tal adotarmos um valor padrão caso o parâmetro não
tenha sido definido?
Alterando nossa função temos:
javascript
O valor de `milissegundos` será 1000 caso seu valor seja avaliado como `false`. Em
JavaScript, ùndefined, null, ""` e `0` são avaliados como `false`.
No entanto, podemos simplificar bastante nosso código atribuindo um valor padrão

diretamente no parâmetro, novidade do ES2015 (ES6):
javascript
Na própria declaração do parâmetro `milissegundos` atribuímos seu valor padrão, que

só será considerado caso ele tenha sido omitido. Muito mais enxuto, não?
Agora que já entendemos como valores padrões são definidos na linguagem JavaScript,
podemos utilizar esse recurso para tornar parâmetros obrigatórios.
## Parâmetros obrigatórios com ajuda de parâmetros padrão
Vamos voltar para a função `moveFrame`, apresentada no início do artigo:

javascript
Podemos simplificá-la bastante estruturando nosso código da seguinte maneira:
javascript
Reparem que o valor padrão dos dois parâmetros da função `moveFrame` é a chamada da
função òbrigatorio`, isto é, ela só será chamada se alguns dos parâmetros não
forem definidos. A única responsabilidade de òbrigatorio` será lançar uma exceção
indicando a obrigatoriedade dos parâmetros. Inclusive, essa mesma função pode ser
reutilizada por outras funções do sistema.
## Conclusão
Combinar diferentes recursos para criar uma nova funcionalidade faz parte da arte
da programação de todo Cangaceiro JavaScript! Aliás, a Alura possui [**cursos de
front-end**] que podem ajudá-lo a ficar ainda melhor em JavaScript e outros
tópicos.
**Twitter: @flaviohalmeida**
Essa semana o instrutor Alberto Souza disse que conseguia criar um projeto com
Spring, Hibernate e todas as dependências em 5 minutos.
E ai, será que ele conseguiu? Confira no vídeo :)
https://www.youtube.com/watch?v=-U9QpXcCh10&feature=youtu.be
Neste último mês passamos por uma grande mudança. Não só uma mudança
visual/estética, mas também resolvemos um problema que vínhamos enfrentando: a
organização dos cursos.
**Desde o redesign passado, nossa quantidade de cursos aumentou muito, expandimos

os assuntos e passamos a ensinar não só programação, mas também [UX], [design],
[edição de video], [marketing digital] e outros assuntos.**
Com esse crescimento, precisávamos nos reorganizar, facilitar a vida dos nossos
alunos e futuros alunos.
Nossa missão: um site com uma navegação simples, um visual leve, limpo, mais jovem
e com o menor caminho do usuário até o ponto final. Foram algumas reuniões com o
[**Sérgio Lopes**] e o [**Paulo Silveira**] para definir esses primeiros pontos:
organização de conteúdo, rotulação de categorias e subcategorias, fluxo de
navegação, etc.
De início, decidimos seguir com nosso próprio conhecimento, sem a consultoria de um

especialista de UX, afinal os 4 anos de Alura nos fizeram conhecer bem nosso
público, criar nossas personas e trabalhar em cima delas.
E vamos ao trabalho: primeiro acabar com aquela quantidade de trilhas que tínhamos
(quase 20), as quais viraram 6 categorias rotuladas de [**Mobile**],
[**Programação**],[**Front-end**], [**Infraestrutura**], [**Design & UX**] e
[**Business**].
Já nas subcategorias, achamos suficiente o uso de "filtros" (usamos algo parecido
com o [Isotope], que mostrasse alguma interação no clique; em uma "transição seca"
o resultado do clique nos filtros poderia passar despercebido pelo usuário).
Depois do conteúdo organizado e as categorias e subcategorias rotuladas, o próximo

passo foram os wireframes. Durante as reuniões de planejamento, acabamos rabiscando
alguns wireframes de baixa fidelidade, esses foram um bom guia para agilizar e
trabalhar com alta fidelidade nos wireframes seguintes.
imagem
imagem
Durante a criação dos wireframes de todas as telas do fluxo, pensamos: "Vamos

contratar a consultoria de um profissional de UX para ver o que ele acha do caminho
que estamos seguindo?", ainda nos restava um pouco de dúvida quanto à organização
dos cursos.
E assim fizemos. Entramos em contato com o [Edu Agni] ([Mergo]) e com outra
empresa, acabamos por contratar a consultoria do Edu. Ele sugeriu o card sorting.
Recrutamos 10 usuários de diferentes perfis e foram 2 dias de card sorting aberto,
com entrevistas de aproximadamente 1 hora/usuário.
Nesse card sorting imprimimos cards com os diversos assuntos e cursos do Alura e
pedimos para que cada usuário organizasse em grupo da forma que mais fizesse
sentido para ele. Como o card sorting era aberto, depois da organização cada
usuário rotulou os grupos que organizou, novamente, como mais lhe fizesse sentido.
imagem
Alguns dias depois das pesquisas com os usuários recebemos o relatório do card

sorting. O resultado foi satisfatório para a gente: praticamente validou o que
tínhamos feito, e assim seguimos o trabalho.
Em um post futuro pretendo falar sobre o novo design do novo Alura, um pouco de
informação mais técnica, softwares, interação designer com front-ender, etc.
**Enquanto isso você pode ler um ótimo post do Sérgio Lopes sobre a [Arquitetura do
novo site do Alura].**
Quero calcular o imposto de um investimento. A regra é simples:
Se o saldo for maior que mil reais, pagamos 10 porcento de taxa. Se o saldo for
maior que 500 até exatos 1000, o imposto é 5%. Caso o saldo seja menor ou igual a
500, o imposto é 1%.
Me diz em 5 segundos se a implementação a seguir está correta?
java
Para uma regra de três condições, algo tão simples... conseguimos complicar
horrores na hora de implementar. Imagine em regras do mundo real, ainda mais
complexas?
Complicado né? Que tal retornarmos logo?

java
Agora sim, em **5 segundos** bate o olho no código, ooooutra história! Os elses
desaparecem...
**Esse é o retorno rápido, o early return.**
Se eu quero retornar um valor, retorno poxa! Esse é um pequeno exemplo do poder da

refatoração.
imagem
Estou desenvolvendo um jogo em Scratch de batalhas em espaçonaves. Para batalhar

precisamos de inimigos, então vamos criar esse nosso inimigo.
Esse nosso inimigo, assim como o nosso personagem no jogo, é um ator, portanto,
vamos falar para o Scratch criar nosso novo ator:
imagem da nave inimiga, vamos falar para o nosso ator vesti-la:
imagem, quanto no eixo vertical (`y`). Vamos falar para o nosso ator que, assim que
o jogo começar, ele vá para a nossa o centro direito da tela. No meu caso, essas
são as posições `0` para `x` e `-260` para `y`
imagem, mas aparecesse em posição horizontal diferente (eixo `x`)?
Logo, queremos que a nave apareça em um local aleatório no eixo `x, no meu caso,
esse número deve ser entre`\-203è`203\`:
![]
![]
Legal, nossa nave está sempre começando em uma posição aleatória, mas ela está
sempre indo para a mesma direção. Isso pode fazer o jogador achar o jogo muito
difícil, ou muito fácil, então, vamos falar para a nave começar em um lugar
aleatório mas manter a sua posição `x`:
![]
Agora nosso inimigo já tem um comportamento definido para o nosso jogo. Nosso jogo
tem apenas um inimigo, mas e se quiséssemos adicionar outro? Teremos que criar um
outro ator e colocar nele os mesmos atributos e comportamentos deste que já
criamos?
E se quiséssemos alterar algum comportamento do nosso inimigo, teremos que alterar

em cada ator esse comportamento? Talvez com dois inimigos isso não possa ser um
problema tão grande, mas e colocarmos cinco, dez, cem inimigos? Teremos que alterar
um por um?
## A guerra dos clones
Nós queremos criar um outro ator que tem as mesmas características do nosso
inimigo. Ou seja, eles vestirão a mesma fantasia, terão os mesmos comportamentos e
atributos, nós queremos um clone!
Vamos falar para o Scratch que quando o jogo começar, ele crie um clone para a
gente da nossa nave inimiga:
![]
Nosso clone foi criado, mas ele ainda não está fazendo nada. Temos que dizer ao
nosso clone o que ele vai fazer. Então, vamos falar para o clone que **quando ele
for criado** ele vai ter o comportamento do nosso ator principal.
![]
Humm… nosso clone não está fazendo nada, veja que nosso clone é uma cópia do ator
principal, mas ele pode ter características e comportamento próprio. Então, nós
temos que dizer para o nosso clone realizar as mesmas ações do nosso ator
principal.
Mas se nós simplesmente copiarmos as características e comportamentos do nosso ator

principal no clone vamos voltar ao mesmo problema que estamos tentando resolver, o
código será duplicado.
O lado bom dos clones é que as características que passamos para um são propagadas
aos demais. Isto é, um clone sempre é igual a outro clone. Portanto, o que nós
podemos fazer é colocar todas as características e comportamento do nosso ator nos
clones.
Dessa forma, sempre que criarmos um clone, ele já terá tudo que precisa no nosso
jogo. Vamos falar para o nosso ator que quando o jogo começar ele crie os clones.
Enquanto isso, quando os clones forem criados eles terão o comportamento da nossa
nave inimiga.
![]
Agora nós podemos criar quantos clones quisermos que ele sempre terão os mesmos
comportamentos. Mas agora nossa nave principal, aquela que não é clone, está sem
comportamento.
Bem, como são os nossos clones que tem o comportamento, nós podemos falar para ela
se esconder depois que os clones forem criados:
![]
![]
## Para saber mais
Já temos um comportamento dos inimigos no nosso jogo, mas ainda precisamos criar o
nosso protagonista e outros elementos para deixar nosso jogo mais divertido e
dinâmico.
O Scratch é uma ferramenta muito utilizada para aprender lógica de programação,

criar animações, aprender sobre matemática e física e muitas outras coisas.
Essa ferramenta é tão usada que aqui na Alura temos uma plataforma com vários
cursos sobre o Scratch.
Na [**AluraStart**], temos diversos cursos sobre o Scratch, neles, você aprenderá

como [fazer um jogo de espaçonaves], como esse nosso jogo, como [criar um jogo de
cobrança de pênaltis], como [criar um robô que adivinha seu nome] e muito mais.
Muitos desenvolvedores já ouviram falar sobre **Clean Code, ou Código Limpo**, e

quando falamos sobre isso é comum associarmos à um **código com fácil manutenção**.
Mas, será que _Clean Code_ é só sobre um código fácil de dar manutenção?
## Design de Código e o Clean Code?
Se você já passou pela experiência de ter que adicionar algo relativamente simples
em um código existente, e percebeu que essa "adição simples" impactaria em vários
pontos do projeto, você sabe o que é um código difícil de dar manutenção. Sistemas
legados não são exatamente o "sonho de um Desenvolvedor" e existe todo um traquejo
para lidar com códigos de softwares assim, que tem pode dar muita, mas muita dor de
cabeça. Mas não se preocupe aqui é está um guia para [lidar com softwares legados].
Tudo o que você precisa saber está aqui :)
Mas, se você nunca vivenciou isso, imagine ter que alterar um fragmento de código e
essa alteração simplesmente quebrar todo o sistema. Definitivamente não seria
legal.
E passar por isso faz a gente pensar que escrever um código totalmente novo é uma
tarefa bem mais simples do que dar manutenção em código existente.
Mas, infelizmente, em nossas carreiras gastamos boa parte do tempo dando manutenção
em código existente e, se não pensarmos direito no código que estamos
escrevendo,vamos passar diversas vezes por situações semelhantes a essa.
Lembre-se sempre que todo código que escrevemos acaba se tornando um [**Passivo**])
(uma dívida) para a empresa. E quanto menos nos preocuparmos com a manutenção do
código maior é o valor desse _Passivo_.
### O que é um código com fácil manutenção ?
Quando falamos de um código com fácil manutenção estamos nos referindo à um código
com [**Baixo Acoplamento**]#Baixo_acoplamento), [**Alta Coesão**]#Alta_coes
%C3%A3o), usando [**SOLID**], [**Imutabilidade**] (quando fizer sentido), aplicando
[**Design Patterns**], minimizando [**Side Effects**]), maximizar o uso de
[**Funções Puras**] e várias outras coisas.
Tudo isso pode ser resumido em ter um bom **Design de Código**,uma parte muito
importante em ter um código limpo.
E o que mais meu código precisa ter para ser considerado um código limpo?
## Indo além da manutenabilidade
Pare 1 minuto olhando para esse código e tente responder: o que ele faz?
java
O que você achou dessa sequência de ìf`s ? E esse monte de expressões sendo
avaliada dentro de cada ìf`? Como poderíamos reduzir a quantidade de código
duplicado ?
Perceba que fizemos um esforço tremendo para tentar entender o que esse código faz
- e é possível que não tenhamos conseguido entendê-lo.
Esse código que acabei de mostrar tem a função de salvar uma sessão de cinema,
desde que a sessão que estamos tentando salvar não tenha conflitos de horários com
outras sessões existentes, ou com uma possível indisponibilidade na sala (por
exemplo a sala estar indisponível para manutenção).
Toda essa carga cognitiva que fizemos para tentar entender o código traz um cansaço
físico e mental. Agora leve em consideração que **passamos a maior parte do tempo
lendo código**.
Então [**legibilidade conta**] muito na hora em que estamos escrevendo código.
Então poderíamos [**refatorar**] o código para algo mais ou menos assim:
java
O código agora parece um pouco mais organizado, com alguns nomes melhores para
aumentar a semântica e sem boa parte da duplicidade, além de conseguirmos lê-lo de
cima para baixo em um fluxo contínuo.
Podíamos continuar refatorando o código infinitamente, movendo as responsabilidades

para as classes corretas e assim melhorando ainda mais o **Design do Código** e a
manutenabilidade.
Dessa forma temos muito menos esforço para ler e tentar entender o código.
**Lembre-se legibilidade conta muito para um código limpo.**
Porém como podemos garantir que após essa alteração nosso código continua
funcionando?
## Testes, testes e mais testes
Sim, para garantir que seu código continua funcionando precisamos escrever
[**testes**].
Testes fazem parte do jogo quando estamos desenvolvendo, e o fato de tê-los não
elimina totalmente a possibilidade de termos um [**bug**]) mas minimiza bastante.
Com os testes conseguimos garantir que **pelo menos os cenários previstos estão
funcionando** e extrapolar esses cenários é o que torna nossos testes mais
eficientes.
Quanto mais níveis de testes (unitários, integração, aceitação, regressão e etc…)

tivermos mais segurança teremos na hora de aplicar uma refatoração.
A tarefa mais díficil na hora de se escrever um teste é saber o que devemos testar.
E é justamente aí que temos que focar nossos esforços.
Testes são uma parte importante para todo o [**ciclo de vida de desenvolvimento**]
e sim **um código limpo é um código testável**.
## Agora sim o que é um código limpo?
Um código limpo é a composição de diversas características, como:
- Legível
Um código compreensivo possibilita a identificação de pontos que precisam ser
melhorados. Passamos mais tempo lendo código do que escrevendo então, quanto mais
fácil for ler o código menos esforço fazemos para entendê-lo.
- Testável
Devemos testar nossos código, pois isso vai dar-nos segurança para podermos
alterá-los. E garantir que os cenários que previmos estão de acordo com o esperado.
- Fácil de ser mantido
Nosso código deve passivo de alteração tanto para adição de novas
funcionalidades, quanto para aumentar a legibilidade ou manutenibilidade.
De uma forma bem resumida **um código limpo é um código testável, fácil de manter e
de ler.**
Na Alura nós criamos uma [**formação em Orientação à Objetos**] pensando justamente

nessas boas práticas.
Se você leu o título deste texto e se interessou pelo assunto, atenção: este
conteúdo não pretende ensinar como aproveitar templates feitos por outras pessoas
como se fossem seus.
Achamos importante chamar a atenção para esse ponto logo no primeiro parágrafo do
texto porque, como deve ser de seu conhecimento, existem muitos profissionais no
mercado que não se preocupam com a autenticidade e transparência em seus processos
de trabalho. Por isso, antes de usar um template para tornar o seu trabalho mais
ágil, lembre-se de:
- Dar créditos ao criador original do trabalho;

- Registrar que o material foi modificado com base no template original feito por
tal empresa;
- Informar ao cliente que você está usando um template que não é exclusivo;
- Comunicar que a criação de um template exclusivo demoraria muito mais tempo e
custaria bem mais que usar um pronto.
Depois das ressalvas feitas acima, é hora de saber como agilizar seu trabalho com o
uso de templates e se [**destacar na carreira**].
## Use templates free
Existem alguns sites no mercado que trabalham com templates free e não há nenhum
problema em usá-los. Você pode aproveitá-los para fazer sites, lojas virtuais,
apresentações ou outro material necessário. A única questão é deixar isso claro
para o cliente no momento de enviar o orçamento. Os valores e o tempo de produção
de um template exclusivo são muito diferentes de um free ou de um que foi apenas
modificado.
Em função da diferença de valores e também da falta de cultura de valorização desse

tipo de trabalho, muitos clientes vão optar pelo menor custo. O importante é que o
cliente esteja pagando apenas pelo trabalho que você desenvolveu e que isso seja
devidamente informado.
## Compre templates prontos
Além de usar os modelos free, você também pode optar por alguns modelos com licença
fechada. A vantagem em relação à primeira opção é que como são pagos, as chances de
existirem outros sites ou materiais parecidos são reduzidas apesar de existirem.
Por isso, a regra é sempre a mesma: informe ao seu cliente que você está usando um
template pago que permitirá que você faça algumas customizações. Dê os devidos
créditos conforme já explicamos.
Quando for mostrar a proposta ao cliente, é interessante até que você mostre o
original e como o dele vai ficar com as modificações propostas. É importante que
fique claro que você não vai partir do zero para fazer o material dele.
## Aproveite outros templates feitos por você
É possível também aproveitar os templates feitos por você. Claro que é preciso
observar uma série de detalhes, como o segmento das empresas, os objetivos de cada
uma, as ferramentas que cada instituição pretende usar, dentre outros aspectos.
Quando você avalia esses pontos, consegue perceber se o material pode ou não ser
adaptado.
O essencial é esclarecer esse uso para o cliente. Diga que você desenvolveu uma
solução para um cliente de outro segmento e que pode fazer modificações para que o
material atenda às necessidades dele. Mostre o original e fale sobre como o
material vai atender ao que ele precisa. Aceitar ou não fica a cargo do cliente.
## Crie templates neutros
Você também pode criar os seus próprios templates pensando nas customizações
futuras. Dessa forma, você cria uma estrutura mais básica, com cores neutras e
funcionalidades que possam ser facilmente adaptáveis e a deixa como coringa em
casos de necessidade. Verifique as principais demandas que você recebe e crie
modelos com base nelas.
Quando você mesmo cria as suas opções de templates, fica mais fácil oferecer e
defender o seu trabalho junto aos clientes. Mas lembre-se, você terá que dedicar
algum tempo na criação desse material prévio para que seja possível, mais à frente,
ter mais agilidade no trabalho. Aproveite os tempos livres e épocas que você não
tenha tantas demandas para realizar a tarefa.
## Mesmo com templates, seja original
Alguns profissionais que usam templates prontos se desobrigam totalmente da

originalidade quando não criam um material do zero. Isso é um erro, principalmente
para as pessoas que vivem do que criam.
Mesmo tendo um material pronto como base, sempre é possível dar o seu toque e
deixar o trabalho com a sua marca pessoal, além de adaptá-lo ao jeitinho do
cliente. Nunca se esqueça disso, aquilo que você agregar de valor a uma peça pronta
vai dizer muito sobre a sua forma de trabalhar.
É importante lembrar que, se fosse para o cliente fazer algo que já existe, ele não
o contrataria, e faria por conta própria. Para agilizar o trabalho você pode partir
de um template pronto, mas precisa otimizá-lo de forma que o cliente sinta que o
trabalho foi feito exclusivamente para ele, mesmo que você já tenha informado que a
peça não é exclusiva.
## Esteja atento às tendências
Muitas vezes, você poderá recorrer a templates prontos para agilizar o seu
trabalho, desde que não os venda como algo original. O importante é não deixar de
observar as tendências do mercado a todo momento. Desde um pantone até uma
linguagem de programação que está sendo mais requisitada observe tudo e saiba
exatamente quem entregará a você o que o mercado está pedindo.
As soluções voltadas para o mercado mobile estão em alta e as opções de smartphones

disponíveis aumentam a cada dia. É importante saber com precisão se os templates
disponíveis irão atender às necessidades dos clientes e se as customizações são
possíveis de acordo com a tecnologia oferecida por ele.
Em algumas situações, a opção de desenvolver uma solução própria pode ser mais
fácil e rápida do que se imagina. Avalie sempre, as mudanças acontecem muito
rapidamente.
Viu como os templates podem agilizar o seu trabalho de forma ética e original?
imagem
Criar e cortar hábitos é algo que tentamos combater e aderir diariamente, seja para
desapegar daquilo que tem nos atrapalhado com alguma coisa ou por exemplo, em algo
que possa nos ajudar em uma promoção de emprego.
E nos restam aqueles questionamentos: Como transformar seus hábitos e ser mais
produtivo?Como manter o foco em momentos de tarefas mais chatas ou que exigem uma
certa dificuldade?
Neste episódio do Alura Live, o host Gabs Ferreira recebeu Priscila Stuani,
instrutora da Alura, para conversarem sobre como criar metas que funcionam de
acordo com seus objetivos e muito mais.
https://www.youtube.com/watch?v=FmDD_A72-x0
Ficou interessado em como mudar seus hábitos? [Assista essa live completa!]
Curso de hábitos:
> [Mude seus hábitos] e aumente sua produtividade pessoal
Carreiras na Alura
> Melhore seus hábitos, aprenda a lidar com o próximo, impulsione seus negócios:
[Soft Skills.]
> Comece agora a programar:
[Iniciante em Programação.]
> Faça nosso curso de Javascript:
[Desenvolvedor JavaScript.]
> Quer aprender a criar aplicativos?
[Desenvolvedor Android.]
> Não quer programar e quer saber editar seus vídeos?

[Editor de Vídeo.]
> Ainda sim pensa em algo diferente, como ranquear sua página no Google?
[SEO Expert.]
Siga a gente no Twitter: [Gabriel Ferreira], [Priscila Stuani] e a [Alurinha]! ;)
imagem
Atualmente, uma transportadora tem em seu sistema web uma tabela que consome alguns
dados de uma API. Entre eles, as datas de quando os veículos deveriam ir para
manutenção.
O que está acontecendo é que os funcionários estão perdendo algumas datas de

manutenção dos veículos. Isso porque eles dizem que a parte da tabela responsável
por mostrar as datas não está visualmente clara. Ela tem muitas informações e as
pessoas se perdem na hora da leitura da tabela.
Parte da tabela de controle utilizada pelos funcionários:
imagem. Neste caso, vamos alterar a cor de fundo (`backgroundColor`):
js
O valor `#FF0F0F` é a representação Hexadecimal de um tom da cor **vermelha**.

Vamos fazer a mesma coisa para as funções àmarelo` e `verde`:
js
Ótimo, agora que já criamos as funções, vamos implementar a lógica para trocar as
cores do campo de acordo com as datas.
## Criando a lógica das cores
Como as datas que estão dentro do campo são strings, vamos capturar seu conteúdo
usando o `textContent`.
js
Como não conseguiremos fazer o cálculo correto com as datas, porque são `strings`,
vamos ter que encontrar uma maneira de transformar as strings em datas.
## Transformando uma string em data
[**Podemos instanciar o objeto**] `Date`, e obter a data atual
js
Agora para fazer a conversão de string para data, instanciamos outro objeto `Date`
com nome de `data` e passamos como parâmetro a data que está no campo da **Próxima
Revisão**.
js
Agora que já fizemos a conversão é só fazer a subtração das datas
js
Agora vamos implementar uma estrutura de controle ìf` que vai ser responsável por
trocar as cores do campo.
js
Seguindo nosso padrão de separar as responsabilidades do código em funções, vamos

criar a função `mudaCor()` que vai receber como parâmetro um `td` que representa o
campo da onde vamos tirar a data.
js
## Calculando os dias
A lógica de transformar de milissegundos para dia é a seguinte: Primeiro dividimos

por 1000 para obtermos os segundos, depois dividimos por 3600 para obter as horas e
finalmente dividindo por 24 e obtemos a quantidade de dias.
js
Como pode ocorrer de não obtermos um número inteiro, vamos usar a função
`Math.floor( )`, para arredondar para baixo a quantidade de dias.
js
Agora encapsulamos a lógica em uma função:
js
## Criando uma verificação
Vamos criar uma função chamada `verifica()` onde vamos usar o `forEach` que vai ser
responsável por executar a função `mudaCor()` em cada item do nosso array
ùltimasRevisoes`
js
## Deixando nossa tabela atualizada
Para termos a tabela atualizada, vamos usar um evento chamando `DOMContentLoaded`,

que vai escutar nossa página e toda vez que ela for carregada, as cores dos alertas
vão ser atualizadas.
js
No corpo da função, vamos usar o `querySelectorAll` para selecionar todas as

classes `.info-proximaRevisao` para passar as cores dentro dos campos, e depois
chamar a função `verifica`, que vai aplicar a lógica das datas
js
Tarefa concluida !
![]
## Estilos dinâmicos com Javascript
Alterar a cor é apenas uma das coisas que podemos fazer com Javascript, podemos
capturar eventos, como clicks em botões, scroll de páginas, entre outros para
deixar as páginas dinâmicas.

imagem
A responsabilidade é grande, uma vez que as empresas contratantes depositam ali

toda a expectativa sobre o seu negócio. Isso porque um logotipo deve transmitir com
criatividade tudo o que a empresa representa.
Ele deve ser capaz de traduzir a essência da marca para os consumidores, ajudando-
os a identificar e consumir produtos e serviços da empresa.
Uma responsabilidade grande, não é mesmo?
Para ajudar nesse processo tão complexo, resolvemos fazer um passo a passo com tudo
o que é importante para você mandar bem na criação de logo. Ficou curioso? Então
confira!
## Tenha um briefing bem-feito
O primeiro contato com o cliente após o fechamento do negócio é muito importante.

Isso porque é ele quem vai definir o rumo de todo o seu trabalho. **O briefing é um
documento em que estão dispostos todos os requisitos para a criação de logo.**
Nele estão reunidas informações extremamente importantes, como:
- Qual é o negócio da empresa;

- Quais são os tipos de clientes que ela atende;
- Preços dos produtos ou serviços;
- Os principais concorrentes;
- Cores já utilizadas;
- Preferências e tudo o que for necessário para criar uma marca estrategicamente
forte e cheia de conceito.
Nessa etapa, é importante que se saiba sobre a existência de um logotipo anterior

ou utilização de algum tipo de elemento específico.
Esse documento tão importante precisa ser lido com atenção e, caso não responda a
todas as suas dúvidas, elas devem ser acrescentadas e perguntadas novamente para o
cliente, afinal, isso é essencial para garantir a aprovação do trabalho!
## Pesquise referências e possíveis soluções
Depois de analisar o briefing e entender a proposta do cliente, o primeiro passo é

a pesquisa.
Investigue internamente tudo o que você puder sobre a empresa. Olhe com atenção o
site, redes sociais e materiais já existentes. Isso vai ajudar você a imergir na
realidade e captar a essência dos valores, objetivos e necessidades da companhia.
Em seguida, **analise as tendências de mercado para aquele segmento**, busque

referências, pesquise a concorrência e não se atenha ao universo local. Referências
nacionais e até internacionais são sempre bem-vindas e podem render boas ideias.
Essa etapa é muito importante, portanto, dedique-se a ela. Quanto mais conhecimento
sobre o universo da empresa, melhor. Atenha-se a cores, formas, elementos e tudo o
que puder ajudar você a chegar a um resultado bacana. Mas fique atento: referência
não é cópia! Utilize-as para criar suas próprias ideias!
## Colocando a mão na massa: encontre o conceito certo!
A segunda parte do processo vem em decorrência da etapa anterior; enquanto você

pesquisa e busca referências, anote tudo o que for interessante e, principalmente,
as ideias que forem surgindo. Elas serão de grande importância para que você
encontre o conceito criativo para seguir.
Nessa parte, todo o seu conhecimento prévio vai fazer a diferença, e elementos
adicionais vindos da psicologia, [**semiótica**] e sociologia podem ser
importantes.
Desenhe rabiscos no papel e associe os elementos. Misture pontos, texturas e linhas

que forem relevantes ao processo.
Depois disso, filtre as ideias de que mais gostou, peça opiniões e, então, refine o
trabalho, passando tudo para o computador, em um programa vetorial.
Agora você está pronto para a próxima etapa!
## Acerte na escolha da tipografia
Se seu logo utilizar tipografia, esta será uma das partes que vai fazer grande
diferença no seu projeto. A forma das letras, nesse contexto, vai agregar sentido
aos seus elementos, transparecendo certo posicionamento.
Letras finas, por exemplo, dão ideia de algo rebuscado, ao passo que **letras bold
transmitem robustez**. Nessa etapa, vale a pena buscar referências em sites
especializados em tipografias e também testar várias soluções, até encontrar a
ideal.
## Estude as cores
Depois de definida a tipografia, é hora de pensar nas cores que vão compor o seu
projeto.
Muitas vezes, já há uma paleta de cores definida, mas, caso necessário, você terá
que criar do zero.
Faça testes, junte cores diferentes, gradientes e texturas. É importante saber que
[**cada cor transmite uma ideia**] e um estado de espírito. Pesquise sobre elas e
veja se a ideia vai ao encontro do objetivo predefinido.
Preste bastante atenção nessa fase do processo, afinal, as cores são geralmente o
primeiro impacto do logotipo, e uma escolha malfeita pode comprometer o resultado
final.
## Faça testes de tamanho e proporção

Você já definiu os elementos, a tipografia e as cores. Agora chegamos aos detalhes
finais. Essa é a hora de prestar atenção se elementos e tipografia estão
conversando entre si em equilíbrio, unidade e, acima de tudo, legibilidade.
Para saber se aquele logotipo é legível quando reduzido, faça diversos testes.
Imprimi-lo em sua redução mínima também pode te ajudar muito nessa hora.
## Não se esqueça dos retoques finais
Após analisar a redução, seu logotipo está pronto para os retoques finais. Corrija
os últimos detalhes, melhore o acabamento, buscando sempre a harmonia entre todos
os elementos. Dessa forma, é muito mais fácil criar um conceito harmônico.
## Experimente o logo em diversos formatos
Logotipo pronto, é hora de ver como ele fica quando aplicado em diferentes peças.
Faça uma [**simulação da marca**] criada em cartões de visita, anúncios, folders,
canetas e tudo mais que for necessário. Isso, além de mostrar a composição com
diferentes cores de fundo, também deixa a ideia mais clara na cabeça do cliente.
## Prepare-se para o grand finale: a apresentação!
Além de um logotipo atraente, sua apresentação deve ser brilhante!
Mostre o quanto você pesquisou sobre o negócio do cliente e como a sua marca está
adequada a todos os objetivos e ideias a serem transmitidas. Seja original,
transmita confiança e provoque emoção. Assim você garante chances muito maiores de
ter sua arte aprovada!
Gostou deste passo a passo para criação de logo? Então, não deixe de seguir nossas
redes sociais ([**Facebook**], [**Twitter,**] [**LinkedIn**]) e ficar por dentro de
diversos artigos que podem te ajudar a realizar seus trabalhos!
[**São tantas disciplinas para se especializar**] que o iniciante na carreira pode

ficar confuso se está escolhendo ou não o caminho certo.
Mas, nos últimos anos, a tecnologia 3D se tornou um coringa da área e seu uso está
se expandindo para todas as práticas do design. Veja como ele está sendo usado e a
importância de estar atento a essa transformação profissional.
## Modelagem 3D: Dando vida ao design
Já faz um tempo que a modelagem 3D se tornou uma habilidade importante para

designers que querem [**trabalhar em jogos, filmes e outras mídias digitais**].
Essa não é mais uma tendência, é o padrão daqui para frente! Ter habilidades para
trabalhar com a concepção e criação de modelos pode gerar uma vantagem competitiva
muito desejada.
Veja como a tecnologia 3D vem crescendo para quem trabalha com modelagem.
### 3D em design de personagens
O design de personagens se tornou importante não só em filmes e jogos, mas também

em estratégias de marketing que abraçam o storytelling para alcançar seu público.
Quantos mascotes você tem visto por aí ultimamente?
A tecnologia 3D facilitou muito a concepção de personagens que, ao mesmo tempo, se

conectam com as pessoas emocionalmente e transmitem os valores da empresa. Assim,
as técnicas de modelagem são tão valorizadas para os designers que querem reforçar
a identidade visual de uma empresa.
### 3D em peças virtuais
A modelagem 3D também se tornou um grande aliado do design gráfico. O consumo de

design na internet e mobile cresce a cada ano. Os aparelhos se tornam mais potentes
e o uso de tecnologia 3D abre uma nova porta para criar peças de design
interativas.
Pense em aplicativos, vídeos, interfaces. Elementos tridimensionais servirão para

criar novas experiências. E ainda tem a realidade virtual, outra aposta da
indústria para o futuro. A modelagem 3D é a chave para o consumo de conteúdo
manipulável.
## Espaços 3D: Imaginando dentro da tela
A tecnologia 3D transforma a forma como temos que imaginar algo que ainda não está
lá. Profissionais que apostam nessa área são disputados entre as empresas que
querem oferecer aos seus clientes uma experiência de compra diferenciada. Veja
exemplos:
### 3D em design de ambientes
Uma sala reformada, a disposição dos móveis, as cores das paredes... O uso de
tecnologia 3D na criação de ambientes é muito valorizado no design de interiores
por conseguir mostrar ao cliente exatamente o que ele terá ao contratar o serviço.
Além disso, há também a organização de espaços para eventos, criação de ambientes

planejados, uma grande área dentro de uma especialização.
### 3D em criação de mundos
Sim, novamente falamos de realidade virtual e como ela se beneficia com a

[**tecnologia**] 3D. Profissionais especializados na criação de espaços e cenários
começam a ser muito requisitados para criar mundos dentro da tela, seja para o
entretenimento ou para campanhas publicitárias.
Nada de museus virtuais ou agências de banco em 3D. Pense nas possibilidades que um
designer pode criar no futuro, aliando a identidade visual de uma empresa à um
mundo exclusivo, cheio de experiências novas e interativas para os consumidores.
## Impressão 3D: O design autossuficiente
Nenhuma das novas tecnologias 3D promete mudar tanto o design como um todo do que a
impressão de objetos tridimensionais. Mesmo ainda em seus primeiros passos, a
técnica já vem transformando processos e até a forma como o design é pensado. No
Brasil, empresas do ramo estão lançando novos materiais e as possibilidades são
ilimitadas.
Uma grande vantagem da impressão 3D é a autossuficiência para o designer, que pode

criar suas peças e também produzi-las, para vender ou experimentar novos caminhos.
Veja como esta tecnologia está auxiliando diversas áreas do design:

### 3D em design de produtos
**A área de design de produtos talvez seja a mais beneficiada com o avanço das
tecnologias de impressão 3D. A possibilidade de criar um produto novo e poder
manipulá-lo ao vivo, na hora!**
Na especialização de design de produto só se fala em ergonomia, inovação e

praticidade. A capacidade de testar todas estas características em pouco tempo, ver
o que dá certo e o que não dá, não só economiza tempo de criação como dá ao
designer a chance de experimentar e encontrar novas soluções.
E nós sabemos bem. É na busca de novas soluções que o design transforma nossas
vidas.
### 3D em design de interiores
Estes produtos criados também podem ser peças de decoração. Podem até ser obras de
arte!
Designers de interiores, num futuro próximo, não vão precisar pesquisar pela cidade
inteira para encontrar a peça que falta para encaixar naquele lugar que está vazio.
Uma, duas, ou todas as peças, o designer será capaz de planejar um espaço da forma
como ele realmente planejou e colocar a assinatura do seu estilo no ambiente, seja
uma casa, um comércio, ou até um evento inteiro!
### 3D em design gráfico
Design gráfico? Você pode estar pensando que não existe área mais bidimensional no
design. Será que a impressão 3D também pode ajudar nesta parte?
É claro que sim, e muito! O design gráfico vem expandindo seus horizontes através
de [**experimentações**] há um bom tempo, com materiais diferentes, texturas
variadas, novas formas de apresentar um conteúdo gráfico.
Os designers dessa área ganharam com as impressoras de objetos tridimensionais uma

nova forma de expressão. Ao aliar o gráfico ao físico, tecnologias 3D estão
ajudando os profissionais a criarem peças inovadoras e criando novas formas de
divulgação e interação com o público.
Seja qual for a área do design que um [**iniciante na carreira**]escolher, aprender

a usar a tecnologia 3D pode ser garantia de sucesso em qualquer especialização. Se
você está projetando para o futuro, esta habilidade pode se tornar indispensável
para quem quiser atuar na área.
**E é claro que você está pensando no futuro, não é? Por isso, discuta o assunto.
Compartilhe este artigo nas redes sociais e converse sobre os rumos da profissão.
Só assim os profissionais irão crescer juntos e buscar novas possibilidades e
oportunidades.**
Recentemente estava precisando subir uma página estática para uma aplicação web.
Como estava **estudando Go**, resolvi realizar essa tarefa com a linguagem.
Segundo uma pesquisa feita pelo [**StackOverflow**], a linguagem de programação Go

já é a terceira colocada na lista de linguagens mais desejadas para aprender e vem
sendo utilizada por grandes empresas como **Uber, Google, Twitch... O próprio
Docker**, queridinho do mundo dos containers, foi desenvolvido em cima da
linguagem.
Um dos elementos que mais chamam a atenção para essa linguagem é sua alta
performance, facilidade de trabalhar com concorrência e também é **elegante e
concisa como Python e rápida como C**.
Para comprovar esses fatos, por que não fazer uma aplicação web e exibir uma
página? Mas antes de colocar as mãos na massa, é preciso fazer a instalação do Go.
# Instalando o Go
Para instalarmos o GO no Linux, basta fazer o download na página da Golang, navegar
até a pasta do arquivo pelo terminal com o comando: `cd Downloadsè executar os
comandos :
```
sudo tar -C /usr/local -xzf go1.12.5.linux-amd64.tar.gz
sudo export PATH=$PATH:/usr/local/go/bin.
```
No Windows, basta fazer o [download] e seguir o passo a passo do instalador
Para confirmar que tudo correu sem problemas executamos o comando `go version`, que
vai exibir a versão do Go instalada.
imagem
Voltando ao nosso propósito, vamos finalmente dispor a página web para a nossa
aplicação.
# Exibindo a página
Para finalmente exibir a página em nosso servidor, podemos utilizar a função

`http.ServeFile`.
Esse tal de `http.ServeFile` é responsável por dispor um arquivo, ou seja, estamos

simplesmente servindo uma página web utilizando nossas variáveis responsáveis por
escrever a resposta http e também o nosso request.
Nosso código com a adição do `http.ServerFile` ficou assim:
go
Agora que finalizamos nosso código, vamos executar o nosso programa.
# Executando
Para executar o nosso programa, precisamos navegar até a pasta onde está o arquivo
pelo terminal:
![]
E executar o comando `go run main.go`.

Caso tudo tenha dado certo, o terminal vai ficar “travado”. Isso significa que o
nosso programa está em execução.
![]
Agora vamos finalmente exibir a página!

# Exibindo a página
Ao abrir navegador e acessar a URL http://localhost:8080/. Vamos ver o seguinte

resultado:
![]
# Conclusão
Com esse simples projeto, vimos que em pouquíssimas linhas de código conseguimos
criar uma aplicação web e que o tempo para executá-la é quase instantâneo.
Essa não é nem a ponta do iceberg! Go está crescendo cada vez mais no mercado. O
uso para concorrência é ainda mais amplo e profundo do que em outras linguagens, já
que Go nos oferece algo chamado goroutines, mas isso é outra história…
E agora que você conheceu um pouco mais sobre a linguagem Go, aqui na **Alura**
temos um [**curso**] de Go onde vamos aprender a sobre controle de fluxo, fazer
requisições HTTP e muitas outras coisas!
Em um mercado cada vez mais competitivo, ter apenas conhecimento técnico não é mais
suficiente para os profissionais da tecnologia. Para se destacar, é necessário
também trabalhar um conjunto de ações e estratégias que atribuam maior valor à sua
imagem. Em outras palavras, é preciso investir no seu marketing pessoal.
Nesse contexto, se antes os profissionais da área tecnológica eram vistos como

os _nerds_ que trabalhavam isolados em uma sala, hoje é imprescindível que eles
apareçam mais e tenham um bom relacionamento com as demais áreas da empresa. Afinal
de contas, quem não é visto, não é lembrado.
Entretanto, desenvolver o marketing pessoal pode ser um pouco mais complicado para
algumas pessoas, especialmente para aquelas que não trabalham na área da
comunicação, como é o caso dos profissionais de tecnologia. Porém,
Por isso, elaboramos este _post_ com 6 dicas de marketing pessoal que vão alavancar
a [**carreira do profissional de tecnologia**]. Confira e comece a praticar desde
já!
## 1\. Cuide da sua imagem pessoal
Para ter uma boa imagem, você não precisa ser um modelo ou ter roupas caras. Mas é
importante que esteja atento e se adeque à maneira como as pessoas do seu trabalho
se vestem. Afinal de contas, a sua aparência é como um cartão de visitas, que
precisa estar sempre bem apresentável.
Nesse sentido, algumas atitudes simples podem fazer toda a diferença, como:
- Não vestir roupas amassadas;

- Estar com os cabelos sempre limpos e arrumados;
- Evitar peças muito curtas ou chamativas;
- Manter uma boa higiene pessoal etc.
O importante é que você se sinta bem, confiante e transmita credibilidade aos
demais colegas de trabalho por meio da sua aparência.
## 2\. Demonstre espírito de liderança
Tão importante quanto a sua imagem, são as atitudes que você terá no dia a dia. Uma
das qualidades mais admiradas no mundo corporativo é a capacidade de ajudar e
liderar pessoas, independente do cargo ou função que você exerce.
Para os [**profissionais de tecnologia**], o espírito de liderança pode fazer toda

a diferença, principalmente se você se predispõe a ajudar pessoas que estão com
problemas. Para isso, procure conversar mais com os seus colegas de trabalho,
pergunte sobre as dificuldades e os ajude, dando dicas e apresentando caminhos para
resolver os desafios.
Dessa forma, os seus companheiros passarão a enxergar você como um ótimo amigo e
orientador. Qualidades fundamentais para os líderes de hoje.
## 3\. Tenha cuidado com as suas redes sociais
Um bom profissional de tecnologia precisa estar sempre por dentro e conhecer as

principais redes sociais. Porém, elas podem ser grandes parceiras ou vilãs da sua
imagem pessoal. Tudo depende da forma como você as utiliza, do conteúdo que posta,
curte e comenta.
Para que você faça das suas redes sociais uma boa estratégia de marketing pessoal,
essas dicas serão fundamentais:
- Esteja presente nas principais redes sociais (Facebook, Twitter,

Instagram, [LinkedIn], etc.);
- Mantenha os seus dados sempre atualizados;
- Divulgue informações importantes de fontes confiáveis;
- Evite conflitos sobre política, religião e outros assuntos polêmicos;
- Não poste fotos com bebidas alcoólicas, cigarros e em situações constrangedoras.
O mais importante de tudo é ter bom senso e sempre ressaltar as suas qualidades.
Afinal de contas, as pessoas do seu trabalho e possíveis recrutadores podem entrar
em seus perfis para conhecer o seu dia a dia e o que você anda disseminando nas
redes sociais.
## 4\. Faça _networking_ para potencializar o seu marketing pessoal
Uma forma de os profissionais de tecnologia aumentarem a sua visibilidade é

investindo em _networking_. Manter uma boa rede de contatos é importante para
compartilhar informações, ficar por dentro das novidades e, quem sabe, ser lembrado
para futuras [**oportunidades profissionais**].
Para isso, é importante que você interaja com os seus colegas, mesmo aqueles com os
quais você não trabalha de forma direta. Além disso, você pode conhecer novas
pessoas fazendo cursos, participando de palestras, eventos e _workshops_.
Uma dica é fazer um cartão de visitas para compartilhar, sempre que você conhecer
novas pessoas. Dessa forma, você divulga seu trabalho e seus contatos de maneira
educada e profissional.
## 5\. Saiba trabalhar em equipe
Trabalhar em equipe é um dos grandes desafios de qualquer pessoa. Conflitos de

interesse, egos muito aguçados, incompatibilidade de ideias ou simplesmente pessoas
difíceis de lidar: quem nunca passou por alguma dessas situações?
Apesar de todos esses problemas, o profissional de tecnologia precisa ter jogo de

cintura e saber trabalhar em equipe nas mais diversas situações. Para isso, é
preciso ouvir, entender e conversar sobre as ideias alheias. Ao ressaltar o seu
ponto de vista, procure ser cuidadoso e respeitoso com as suas palavras.
Aos poucos, você vai conhecer cada pessoa e descobrir a melhor maneira de lidar com
elas.
## 6\. Tenha repertório
Você sabe conversar com as pessoas sobre vários assuntos? Você utiliza referências
para desenvolver os seus projetos? Tão importante quanto ter conhecimentos
técnicos é expandir a sua cultura geral e possuir um bom repertório.
Nesse contexto, o profissional de tecnologia costuma estar muito ligado às

novidades da sua área, mas muitos acabam pecando em outros assuntos. Dessa forma, é
preciso ter um pouco de conhecimento sobre tudo: música, artes, TV, notícias e os
principais fatos que estão acontecendo no mundo.
Existem diversas maneiras e caminhos para ampliar o repertório, como:
- Ver filmes com diferentes temáticas;

- Ir a museus, teatros e shows;
- Ler livros sobre diferentes culturas;
- Estar sempre ligado nas notícias e fatos recentes;
- [**Investir em cursos**] de extensão cultural etc.
Dessa forma, você será um profissional de tecnologia completo, capaz de opinar e

interagir sobre diversos assuntos, ser inovador em seu trabalho e ainda aumentar a
sua visibilidade e credibilidade junto aos colegas e ao mercado de tecnologia.
Muito interessantes essas dicas, não acha? Seguindo esses passos, será muito mais
fácil montar uma estratégia de marketing pessoal efetiva e que destaque você dos
demais colegas. Ser um bom profissional de tecnologia vai muito além de ficar
apenas sentado na frente do computador. Então, coloque em prática essas atitudes e
turbine a sua carreira!
Agora que você já sabe da importância do marketing pessoal, aproveite para assinar
a nossa newsletter e ficar por dentro dos principais assuntos e cursos sobre
tecnologia. Será mais um grande passo para a sua vida profissional!
imagem
A secretaria acadêmica de uma escola me pediu para fazer uma tela que mostrasse as
informações dos alunos matriculados. Só que existia um problema: cada aluno
preencheu o telefone usando traços em lugares diferentes
imagem`. passando como parâmetro a tag \`td.

javascript
O retorno do método `querySelector()` foi:
html
O retorno não foi bem o que queríamos, isso porque o `querySelector` está
procurando no documento HTML o parâmetro que foi passado, e está retornando a
primeira vez que esse parâmetro aparece, no nosso caso ele devolveu somente a
primeira coluna e não todos os telefones dentro do campo. Então o `querySelector`
não serve para o nosso caso.
Por convenção, fazer a busca por `tag` **não é recomendável**. Podem ocorrer
mudanças no documento HTML que acabam quebrando o código. Então precisamos de uma
maneira de buscar os telefones da tabela e que seja menos propensa a problemas com
mudanças.
## Seletores
Seletores são usados no CSS para marcar os elementos HTML que serão estilizados,
como estamos usando o método `querySelector` ele nos permite fazer uso de
[**seletores CSS**], como ìd` e `class`, e fazer uma busca mais específica.
## Acessando a tabela usando o id
A busca utilizando `querySelector` e tags HTML não servem para nosso caso.
Felizmente temos o método irmão do `querySelector` o `querySelectorAll` que ao
invés de retornar a primeira vez que o parâmetro aparece, vai retornar todas as
vezes.
Agora que já sabemos que podemos deixar nossa busca mais específica com o uso de
seletores, vamos fazer uso do ìd` para nossa busca.
javascript
Agora o retorno já foi um pouco melhor do que com `querySelector`
html
Mas de novo só conseguimos trazer as informações de um aluno, mesmo usando o

`querySelectorAll`... Isso aconteceu porque o seletor ìd` define um identificador
exclusivo, precisamos então de algo que consiga fazer uma busca mais genérica.
## Acessando a tabela usando classe
Como muitos elementos podem pertencer a uma classe ao mesmo tempo, podemos fazer
uso do seletor `.class`, já que todos os campos de telefone dos alunos tem a classe
`.info-telefone`
javascript
O retorno do `querySelectorAll` é parecido com um array:
Agora temos que encontrar uma maneira de iterar por todos os telefones e fazer a
alteração de acordo com o padrão escolhido pela escola.
## Alterando o telefone dos alunos

Uma maneira de percorrer todos os telefones para fazer a alteração é através do
loop **for**. Depois de iterar por todos os telefones, usamos o método
[**replace**], que vai substituir os traços do telefone por strings vazias.
javascript
## Para saber mais
Além do `querySelector()` e do `querySelectorAll()`, existem outros meios de

capturar elementos no DOM. Um exemplo é o método `getElementById` que retorna a
referência do elemento através do seu id.
Outro exemplo é o método `getElementByClassName` que vai retornar um vetor de

objetos com todos os elementos filhos que possuem o nome da classe dada.

**Trabalhar com datas e horários** é algo comum para um desenvolvedor. Mas como
podemos fazer isso com efetividade usando a **linguagem PHP**?
Fui contratado por uma empresa para desenvolver um sistema de controle de pontos, e
a solicitação foi bem clara ao pedir um sistema que funcione na _Web_.
Pensei comigo: Já que mais ou menos 80% de toda a _Web_ usa PHP, parece uma boa
linguagem para desenvolver essa solução.
Este sistema vai precisar exibir a data e hora de cada registro (entrada e saída)
do funcionário e exibir quantas horas têm de diferença entre eles (as horas
trabalhadas no dia).
## A função `date`
Velha conhecida dos programadores PHP, a função `date` pode ser a primeira opção
que vem à mente para pegar a data atual. Com ela é bem fácil definir o formato em
que queremos esta data, inclusive.
Para exibirmos a data atual no formato brasileiro, por exemplo, ficaria assim:
php
E este código exibiria: `20/03/2019`.
Como você já deve ter suposto, o `d` representa o dia, `m` representa o mês
enquanto `Y` representa o ano com 4 dígitos. Se quiséssemos o ano apenas com 2
dígitos (19 no nosso exemplo), bastaria utilizar `y` (em minúsculo).
Com esta mesma função podemos também pegar o horário atual, além da data. Continua
bem fácil:
php
E a saída seria: `20/03/2019 16:58`

Repare que como `m` representa o mês, para representar os minutos a letra ì` é
utilizada. Para saber mais sobre quais letras utilizar em cada caso, você pode dar
uma olhada na [**documentação da função**].
## Intervalo entre duas... strings?
Já conseguimos pegar as datas (como _string_, diga-se de passagem), então agora

vamos pesquisar sobre como calcular o intervalo entre elas para exibir as horas
trabalhadas.
Dando uma pesquisada, caí na documentação da função `date_diff`, mas vi que como
parâmetros ela não recebe _strings_. Esta função recebe objetos de classes que
implementem a interface `DateTimeInterface`. Bom, vamos com calma.
Até agora temos trabalhado somente com a função `date` que retorna uma _string_,
mas nós podemos de forma tão fácil quanto, utilizar **Orientação a Objetos** nesta
tarefa. Existe uma classe que podemos instanciar e obter a data e hora atuais e que
implementa a `DateTimeInterface` que precisamos. "O nome dela é `DateTime`, e eu
encontrei ela [**na documentação**]".
O código que tínhamos antes não muda muito. Veja como fica utilizando a classe que
acabamos de conhecer:
php
Caso a gente não passe nenhum parâmetro para o construtor de `DateTime`, o momento
atual será recuperado. Podemos ainda passar uma string informando o momento que
queremos, por exemplo:
php
Se já tivermos uma string em outro formato, e quisermos criar um objeto do tipo

`DateTime`, podemos utilizar o método `createFromFormat`, da seguinte forma:
php
## Agora sim, intervalo entre duas datas
Agora que já conhecemos uma forma de trabalhar com datas utilizando Orientação a
Objetos, vamos ver como pegar o intervalo entre 2 objetos do tipo `DateTime`.
A interface `DateTimeInterface` expõe um método chamado `diff`, que recebe um outro

objeto deste mesmo tipo como parâmetro, ou seja, podemos chamar a partir de nosso
objeto de datas, o método `diff` passando uma outra data como parâmetro. Vamos ver
como ficaria isso:
php
E com isso temos a seguinte saída:
php
Vamos por partes analisar o que acabou de acontecer. Primeiro, quando criamos as
datas e horas, passamos apenas os seus respectivos horários, não informando os
dias. Pois é. Se eu passar apenas o horário, ele pega a data atual no horário
informado.
Depois, quando exibimos o retorno do método `diff`, vimos que temos acesso a um
objeto do tipo `DateInterval`. Nele, temos acesso a quantos anos, meses, dias,
horas, minutos e segundos existem no intervalo entre uma data e outra. No nosso
caso, há 9 horas de intervalo, e podemos exibir isso da seguinte forma:
php
PS.: Caso você tenha analisado a saída do `print_r`, viu que há as propriedades `d`
e `days`. Num intervalo de exatamente um ano, a propriedade `y` teria o valor de 1,
enquanto a propriedade `d` teria o valor zerado, o que significa que há 1 ano e 0
dias de diferença. A propriedade `days` teria 365 como seu valor, indicando o
número total de dias.
## O problema do fuso horário
Com o sistema já implementado, fui implantar em um dos servidores da empresa, e

notei que o relógio dele estava com um fuso horário diferente do daqui no Brasil.
Isso estava causando inconsistências nas marcações de ponto.
Não é legal deixar que o fuso horário de cada máquina atrapalhe nossos sistema,
então seria interessante se pudéssemos informar no código com qual fuso estamos
trabalhando.
A boa notícia é que com PHP isso é até fácil de fazer. Na hora de criar nossa data,
basta informar mais um parâmetro que é o fuso horário desejado. Veja como fica:
php
Repare que nós colocamos o timezone como Àmerica/Sao_Paulo`. Mas e se quisermos

saber outras possibilidades? É possível ver a lista de fusos horários suportados
pelo `DateTimeZone` com o método `DateTimeZone::listIdentifiers()`:
php
Trabalhar com datas e fusos horários com PHP é moleza!
## Para saber mais: `DateTimeImmutable`
Conseguimos chegar na implementação desejada. Conseguimos pegar as datas que

queremos (utilizando Orientação a Objetos, inclusive), calcular a diferença entre
elas e até trabalhar com diferentes fusos horários.
Mas no artigo foi citada a interface `DateTimeInterface`. Que outra classe será que
implementa essa interface?
A classe `DateTimeImmutable`! Ela pode ser utilizada da mesma forma que a classe
`DateTime`, mas as operações que ela expõe retornam uma nova data, e não alteram a
original. Pareceu confuso? Vamos ver na prática essa diferença e de quebra aprender
a realizar mais operações com as datas:
php
Repare que com um intervalo de um dia, quando o adicionamos (com o método àdd`) ao
objeto do tipo `DateTime`, o próprio objeto é alterado. Já quando utilizamos
`DateTimeImmutable` seu valor permaneceu intacto, retornando o valor com a
alteração desejada.
Se ficou curioso sobre como criar um intervalo pode dar uma olhada [**na
documentação**]. Mas basicamente, `P` significa um período, e adicionamos `1D`, que
quer dizer um dia. Se quiséssemos adicionar 2 dias e 3 horas, ficaria: `P2DT3H`,
onde o `T` indica que as informações a seguir são sobre o horário (hora, minuto ou
segundo).
## Conclusão
Começamos o post com uma necessidade real de manipular datas utilizando PHP e vimos
que não é necessária nenhuma biblioteca externa para isso. A própria **API** de
datas do PHP é muito rica e nos fornece meios de criar uma data, realizar operações
nela, buscar intervalos, trabalhar com fusos horários e muito mais.
Você pode ainda dar uma olhada no que mais o PHP te oferece quando o assunto é data
na [documentação oficial], e pode conhecer mais da linguagem que domina a web [**na
formação PHP da Alura**]!
Estou estudando para a certificação da Oracle e preciso saber todas as restrições

do método main. Então vamos implementá-lo ora bolas:
java
Rodando a minha aplicação:
```
> executando código
```
Ótimo, mas eu sempre terei que escrever o método `main` da mesma maneira? Será que
não da pra modificar alguma coisa? Vamos tentar executar sem o modificador de
acesso _public_:
java
Executando o código:
java
Parece que não deu muito certo, ele não consegue achar o `main`... Vamos tentar
agora sem o _static_:
java
Testando mais uma vez:
java
Xi, tem que ser _static_ também... Bom e o `void`? Vamos ver se eu consigo retornar
um ìnt`:
java
Verificando novamente:
java
É, parece que ele não permite nenhuma alteração... E esse àrgs`? Eu nem uso ele,
então eu vou tentar tirar!
java
java
Puxa vida, será que não podemos alterar nada? Vamos tentar então, alterar o tipo do
array àrgs` para outro, por exemplo, um ìnt`:
java
java
Aparentemente, precisamos escrever a assinatura do `main` como o conhecemos... Mas

e se eu tentar variar o array de `String` (`String[] args`)? Em outras palavras,
que tal tentarmos um varargs de `String`? Vejamos o que acontece:
java
Testando minha aplicação novamente:
java
Finalmente a minha aplicação rodou! Além de apenas variar de array de `String` para
varargs, podemos também alterar o nome do parâmetro, não precisa ser àrgs`, pode
ser qualquer nome:
java
Testando novamente:
java
Excelente! Agora eu sei quais são as restrições para declarar o método `main`:
Como vimos, para nossa aplicação executar precisamos do método `main`, porém o Java
só entende que é o método `main` na nossa aplicação se seguir essa assinatura:
`public static void main(String[] args)`. Vimos também, que a única alteração
permitida é alterar o array de `String` para um varargs de `String`, pois na
prática funcionará da mesma maneira.
Não sabia que o método main era tão restrito? Quer se aprofundar mais na linguagem
Java? Aqui na Alura temos [**uma formação Java**].
Vamos fazer a requisição em uma classe chamada `WebClient`, ela será responsável
por fazer a conexão com o servidor.
Nossa app é um catálogo de novidades aqui do Alura e, assim que abrirmos ela, será
exibida uma listagem com todas as novidades. Essas novidades serão carregadas do
servidor. Toda comunicação que fazemos com o servidor está na nossa
**ÀsyncTask`**:
Java
Legal, nosso código está funcionando! Mas o que estamos fazendo no _onPostExecute_?
Estamos pegando a resposta e já estamos manipulando a tela.
Nossa ÀsyncTask` tem a **responsabilidade** apenas de fazer essa requisição mais
pesada,o que de fato tem feito no método `doInBackground`. Porém, no método
ònPostExecute` estamos manipulando a tela. Manipular a tela não é o foco da a
ÀsyncTask`! Temos um especialista em manipulação de tela: nossa Àctivity`. Ela
deve se virar para consumir os dados desta requisição.
java
Agora, nosso código está bem mais claro e deixou cada especialista fazer sua
função. Nossa _task_ para fazer a requisição pesada e nossa _activity_ para
manipular a tela.
Mas, qual é vantagem disso? Nossa ÀsyncTask` não precisa saber o que vamos fazer
com os dados! Desta forma nosso código fica bem mais simples de dar manutenção e
está bem desacoplado :)
Mas, e se tivermos a necessidade de fazer uma nova tela que também consumirá essa
lista, mas fazer outro comportamento?
Já temos uma ÀsyncTask` que retorna exatamente o que precisamos: a listagem. Mas
ela está acoplada diretamente com a Àctivity` que a chama, precisamos
**desacoplar** nossa activity e garantir que receberemos um objeto que possua o
método `lidaComNovidades`. Para garantirmos que qualquer classe que nós formos usar
possua este método, vamos estabelecer um contrato, atráves de uma Ìnterface`:
java
Agora precisamos fazer nossa Àctivity` implementar nossa interface :
Java
Agora, utilizando **polimorfismo**, podemos passar para nossa ÀsyncTask` a

interface em seu construtor! Desta forma podemos reaproveitar nossa task em
diversos locais, sempre passando uma Àctivity` que implemente a Ìnterface`.
Chamamos este padrão de **`Delegate`**:
java
Nosso código ficou bem mais desacoplado e agora podemos reaproveitar essa nossa
ÀsyncTask` em qualquer outro projeto! O único pré-requisito é que este projeto
tenha um `Delegate`, pois podemos passar um objeto que implemente de `Delegate` e
terá os métodos necessários para desempenhar seu papel. Essa abordagem que estamos
utilizando é um `**Design Pattern**` chamado de `Delegation`.
**E ai gostou dessa dica? Quer conhecer mais sobre desenvolvimento Android e talvez
iniciar sua carreira nessa área? Aqui na Alura temos [vários cursos] sobre Android.
Se preferir aulas presenciais, veja os [cursos da Caelum] :)**
Algo bem comum na vida do desenvolvedor é deixar que a sua IDE o ajude na hora do
desenvolvimento. Tão comum que geralmente pedimos a ela para dar aquele chute
inicial quando começamos um novo projeto.
No desenvolvimento Android, quando iniciamos um projeto, ele já deixa configurado

bastante coisa para gente: já cria nossa primeira Àctivity`(desde a classe ao seu
layout) e além disso também a registra no manifest.
Legal, mas quando estamos iniciando um novo projeto, temos que escolher qual é o
tipo de Àctivity` que queremos utilizar. Aí ele nos dá tela parecida com essa:
![tela de configuração ]
E geralmente não imaginamos logo de início qual será a melhor escolha de Àctivity`
e preferimos escolher uma tela em branco. Essa tela em branco geralmente já vinha
com um **Hello World** configurada nela, por isso escolhíamos `BlankActivity`. Isso
até a versão 1.5 do **_AndroidStudio_**.
Na última versão, quando estamos pedindo para ele gerar essa `BlankActivity`, estão
sendo gerados 2 arquivos de layout. Como assim? Se verificarmos, ele está gerando
um arquivo chamado **content_NOME_DA_ACTIVITY.xml** e outro com nome
**activity_NOME_DA_ACTIVITY.xml**. Vamos analisar um pouco esses arquivos.
Estávamos acostumados a criar uma Àctivity` e ela já vir com um único arquivo. Ao
verificamos o arquivo **activity_NOME_DA_ACTIVITY.xml** que está sendo gerado vamos
ver algo parecido com isto:
xml
`CoordinatorLayout, AppLayoutBar, Toolbar, FloatActionButton`...o que é tudo isso?
Há um tempo atrás o **[Google]** criou uma biblioteca especialmente para **design**

para aplicações mobile, você pode conferir mais sobre ela [aqui]. Todas essas
`Views` já estão incluídas nesta biblioteca de design.
Legal, mas no meio desse layout há um **include** para outro arquivo de layout:
xml
Este arquivo **content** já é aberto por padrão no momento que iniciamos um novo
projeto,ele está lá para colocarmos todas as views que serão exibidas em nossa
tela.
Esse novo padrão foi criado para deixar de forma mais organizada os arquivos xml.
Caso quisermos uma Àctivity` vazia, sem nenhuma `View`, podemos iniciar nosso
projeto utilizando `**EmptyActivity**`, que substitui a forma que `BlankActivity`
fazia até a atualização.
Conhecemos dois tipos de Àctivity` e ainda existem muitas outras prontas que
podemos utilizar!
No último post conseguimos fazer com que o zumbi chegasse até a posição da heroína.
Porém, ele estava se teleportando e não andando até ela. Como vamos resolver esse
problema?
![]
Até agora conseguimos calcular quanto o zumbi deve andar e para qual direção.
Podemos representar a `distanciaX` e `distanciaY` com uma seta ligando a posição do
zumbi até a posição de destino dele. Como estamos somando na posição do zumbi, a
distância total entre ele e a heroína ele acaba se teletransportando até ela.
Se queremos que ele ande mais devagar, não podemos somar essa distância inteira,
temos que somar menos. Mas quanto menos, será que metade dessa distância resolve?
![]
Ainda é muito rápido, será que 4 melhora?
![]
Ok, 4 frames é muito pouco para a jogadora fugir. Vamos dividir por um número muito
maior, 100 por exemplo.
![]
Dividindo a distância total por 100, vemos que o zumbi começa com passos largos e
vai diminuindo a velocidade de perseguição. Isso acontece porque calculamos a
distância entre ele e a heroína todo frame, e como essa distância é cada vez menor,
temos um número cada vez menor sendo dividido por 100.
Apesar de agora o zumbi não teleportar na direção da heroína, ele anda mais devagar
quando está perto dela e isso é um problema, pois ela sempre conseguirá fugir. O
zumbi precisa de uma velocidade constante, e como podemos fazer?
Estamos dividindo a distância por um número arbitrário que escolhemos. O ideal

seria dividirmos dois números e sempre obtermos o mesmo resultado, e podemos ter
isso se dividirmos qualquer número por ele mesmo, assim o resultado sempre será um.
![]
Ou seja, calculamos a distância e o sentido em que queremos andar e depois

dividimosessa distância pelo seu próprio valor, lembrando de ignorar o sinal na
hora de dividir. Como nossa `distanciaX` tem o valor de -100, -100/-100 = 1 e não
queremos isso, queremos o valor -1 como resultado.
Como isso fica no código?
csharp
Assim ,o zumbi sempre andará uma unidade na horizontal e uma unidade na vertical
por frame. Mas será que isso está correto?
![]
Dessa maneira, o zumbi não seguirá uma linha reta até a direção da heroína, como
falamos para ele andar uma unidade em X e em Y ele pode dar um passo para fora do
caminho.
Queremos que ele dê um passo de uma unidade na direção da heroína e isso, não
necessariamente, significa andar 1 na horizontal e 1 na vertical. Vamos redesenhar
esse diagrama para entendermos melhor.
![]
Desenhando dessa maneira fica visível que temos um triângulo retângulo entre os
eixos X e Y. Como falamos, o que queremos é que o tamanho do nosso passo seja 1,
assim, sempre que nos movermos teremos uma velocidade constante. Acontece que, se
andarmos um em X e um em Y, o tamanho do nosso passo será igual a √2 que é maior
que um.
O nosso passo está maior do que 1 e a direção dele não bate com a direção da
jogadora. Como fazemos para deixar tudo igual?
Da mesma maneira que desenhamos um triângulo retângulo com os valores de

movimentação do zumbi, podemos usar os valores da distância entre ele e a heroína.
![]
Desenhando dessa forma achamos que a distância entre o zumbi e a jogadora é de

134,53. Como queremos que essa distância vire 1, podemos dividir ela por ela mesma.
Só que também precisamos manter as proporções do nosso triângulo, ou seja devemos
dividir todos os lados do triângulo por 134,53.
![]
Agora sim, se andarmos -0,74 unidades na horizontal e -0,66 unidades na vertical

estaremos dando um passo na direção da jogadora. Mas depois de tudo isso, como
implementar o código?
csharp
O primeiro passo é achar quanto nós precisamos nos deslocar em X e Y, em seguida

calcular a distância entre o zumbi e o alvo. Com isso, dividimos o deslocamento nos
eixos horizontal e vertical para que o passo na direção da heroína seja igual a 1.
Por último, somamos a posição atual do zumbi com o deslocamento desejado e
atribuímos isso à propriedade _position_ do componente `transform`.
Esse tipo de comportamento é tão comum em jogos e simulações que existem classes
que encapsulam todos esse comportamento. A Unity utiliza a classe **Vector3** para
representar o conjunto de números que compõem a posição de um objeto e isso
possibilita fazermos operações com essa classe.
Por exemplo, ao invés de procurarmos pela direção do alvo utilizando eixos

separados, podemos usar a própria classe e encontrar os valores para ambos os eixos
em uma única linha.
csharp
Ao fazermos isso, recebemos um conjunto de números que representa o quanto o zumbi

deve se deslocar para chegar até a heroína . Como não queremos nos teletransportar,
precisamos dividir cada componente desse grupo pela distância entre os dois
objetos. Esse processo que retorna os valores de X e Y para que o "passo" seja
igual a 1 é chamado de normalização ou `normalized`do **Vector3**.
csharp
Agora precisamos adicionar esses valores na posição atual do zumbi e atribuir isso
ao componente **Transform**. Como nosso deslocamento é do tipo **Vector3**, podemos
apenas somar a posição atual e o deslocamento, da mesma forma que conseguimos
subtrair dois vetores.
csharp
Enfim, a classe **Vector3** da Unity é baseada em vetores da matemática. Eles são

uma maneira prática de fazermos operações em um conjunto de números e dessa maneira
podemos expressar alguns comportamentos complexos de maneira mais simples dentro do
código.
Vimos um pouco de como utilizar a soma, subtração e normalização de vetores para

refletir um comportamento de perseguição dentro de um jogo. Além disso eles são
muito utilizados quando queremos aplicar física aos jogos.
Caso você tenha interesse, pode procurar nos tópicos de álgebra linear para
entender um pouco mais de como funcionam os vetores.
Gostou da ideia de fazer um jogo sobre uma invasão zumbi? Veja nossos [**cursos na
Alura**] e de quebra aprenda muito mais sobre como trabalhar com a Unity.
Vamos ver como tratar as notificações do Firebase.
No artigo onde vimos como [**configurar o FCM**] (Firebase Cloud Messaging) e

integrar com a nossa App Android. Fizemos um pequeno exemplo de envio de
notificação, porém, no exemplo que vimos, a notificação não aparecia em
_foreground_, ou seja, enquanto estávamos com a App aberta. Em outras palavras,
queremos obter um resultado conforme o exemplo abaixo:
imagem` dentro da classe `FirebaseMessagingService`. Portanto, faremos isso:
java
A partir desse método, quando a nossa App estiver aberta, **receberemos a

notificação do FCM** e ela será representada pelo parâmetro `remoteMessage`. Mas e
depois? Aparecerá a notificação automaticamente como vimos anteriormente? Nesse
caso não, pois **recebemos apenas a mensagem**. Em outras palavras, precisamos
**criar a notificação manualmente**.
## Criando a notificação no Android
Já que estamos recebendo uma notificação, podemos extraí-la para um objeto do tipo
`RemoteMessage.Notification`:
java
Em seguida, vamos criar um método que vai criar e exibir uma notificação do
Android. Portanto, vamos criar o método `mostrarNotificacao()` que recebe um objeto
do tipo `RemoteMessage.Notification`:
java
Agora que criamos o método, o que precisamos fazer? Criar de fato a notificação que
será exibida para o usuário, certo? No Android, temos a classe [**Notification**]
que permite criarmos notificações. Porém, da mesma forma como vimos no
[**AlertDialo**`], é recomendado que utilize a classe interna `Builder` para
criarmos as notificações. Portanto vamos utilizá-la:
java
Por questões de compatibilidade, é recomendado que utilizemos a classe

[**NotificationCompat**]. Em outras palavras, por meio dela, daremos suporte para
versões do Android mais antigas. Portanto, vamos utilizá-la ao invés da
`Notification`:
java
Você pode estar se perguntando do motivo de estarmos passando o `this` por

parâmetro do `NotificationCompat.Builder()`, já que não estamos em uma Àctivity`
ou `Context`. Um detalhe curioso sobre a classe `FirebaseMessagingService` é que
ela, **bem internamente**, contém uma herança de `Context`, portanto, podemos
utilizá-la! :D
Agora que instanciamos o `builder`, precisamos montar a notificação. Para isso

temos que, pelo menos, preencher 3 informações:
- Título.
- Mensagem.
- Ícone.
Para adicionar um título, basta apenas utilizarmos o método `setContentTitle()`

enviando uma `String` como parâmetro. Mas calma aí, qual `String` mandaremos?
Lembra que temos o parâmetro `notification`? Então, nesse parâmetro temos todos os
dados que uma notificação do FCM pode ter, portanto, vamos extrair o título por
meio do método `getTitle()`:
java
E pra adicionar uma mensagem? Simples, da mesma forma como vimos no _builder_ do
ÀlertDialog`, a maioria dos métodos do `builder` também nos devolve o objeto. Em
outras palavras, basta apenas chamarmos o método que adiciona a mensagem após o
momento em que inserimos o título, nesse caso, o método `setContentText()`:
java
Mas qual mensagem enviamos para ele? Da mesma forma como fizemos com o título,
podemos também pegar a mensagem do objeto `notification` a partir do método
`getBody()`:
java
Agora que temos um título e uma mensagem, precisamos apenas adicionar um ícone.
Podemos fazer isso por meio do método `setSmallIcon()`. Mas qual ícone podemos
utilizar? Nesse projeto, temos o ícone da própria App no local
`R.drawable.casadocodigo`, ou seja, vamos utilizá-lo:
java
Da mesma forma como vimos no ÀlertDialog`, finalizamos a `builder` com o método

`build()`:
java
## Utilizando o serviço de notificações do Android
Se executarmos a nossa App nesse exato momento, a notificação não aparece! Por que
será? Diferente do `Dialog`, as notificações fazem parte de um serviço gerenciado
pelo sistema operacional, nesse caso o Android, ou seja, precisamos pedir para o
Android esse serviço. Para isso, utilizamos o método `getSystemService()`:
java
Porém, precisamos especificar qual serviço queremos enviando uma `String` por
parâmetro. Qual `String` podemos enviar? A classe `Context` contém algumas
constantes referentes a esses serviços e, para a nossa felicidade, ela contém a
constante `NOTIFICATION_SERVICE` que refere-se justamente ao serviço de notificação
que desejamos. Portanto vamos pedir esse serviço:
java
Agora precisamos referenciar esse serviço. Por padrão, ele nos devolve um Òbject`,
porém, precisamos de alguém mais específico! Qual classe podemos referenciar? No
Android, temos a classe [**NotificationManager**] que é um classe responsável em
gerenciar notificações do Android. Então vamos refenciar essa classe adicionando um
cast, pois temos a "certeza" que é essa classe que será retornada:
java
## Exibindo a notificação
A partir do objeto `notificationManager`, para exibirmos a notificação, basta

apenas chamarmos o método `notify()` enviando dois parâmetros:
- **1º parâmetro:** _id_ da notificação (Esse id é um valor único para a

notificação que está sendo criada dentro da App).
- **2º parâmetro:** um objeto do tipo [Notification].
Como primeiro parâmetro, podemos enviar qualquer valor, portanto, colocarei como 0.
Porém, e o objeto do tipo `Notification`? Como podemos enviá-lo sendo que temos
apenas o `builder` do tipo `NotificationCompat.Builder`?
Lembra do método `build()`? Adivinha o que ele retorna? É exatamente o que você
está pensando! Um objeto do tipo `Notification`, em outras palavras, basta apenas
refenciá-lo para um objeto do tipo `Notification`:
java
Então enviamos o objeto `notificacao` para o `notify()`:
java
Testando a nossa App e enviando uma mensagem a partir do firebase, temos o seguinte
resultado:
imagem` que nos devolve um objeto do tipo `PedingIntent` que inicializa uma
activity. Observe também que já enviamos alguns valores como parâmetro que tem o
seguinte significado:
- **1º parâmetro:** Contexto onde será inicializado.

- **2º parâmetro:** refere-se ao _request code_ que é um id para identificar o
peding intent dentro da App. (Nesse caso, podemos simplesmente passar qualquer
valor).
- **3º parâmetro:** Ìntent` que será executada.
- **4º parâmetro:** Flags que indicam o comportamento do pending intent, nesse
exemplo utilizei a constante PendingIntent.FLAG_UPDATE_CURRENT que indica que a
peding intent já existe e quero apenas atualizar os dados recebidos pelos extras.
(Para mais detalhes das flags consulte a [documentação])
Agora que temos o objeto `pedingIntent`, precisamos apenas _settá-lo_ no objeto

`notification` a partir do método `setContentIntent()`:
java
Se executarmos novamente a nossa App, temos o seguinte resultado:
imagem` que recebe um booleano como parâmetro, ou seja, passamos o valor `true`:
java
Pronto! Agora temos o mesmo resultado como vimos no início do post. Em outras
palavras, estamos recebendo e tratando uma mensagem do FCM em foreground.
Que tal aprender hoje mesmo a desenvolver a sua App Android desde o zero? Na
**Alura**, temos uma [**formação Android**] para que você crie sua primeira App com
os principais conceitos necessários para desenvolver uma App.
imagem ou pela identidade visual da sua empresa.
Com a cor base escolhida, dado as regras de combinações acima, podemos concluir que
existe um conjunto **finito** de combinações bacanas. Por isso que em alguns
manuais de identidade visual acabamos notando semelhanças na escolha das cores,
pois as combinações de cores para um resultado harmonioso é limitado.
O mesmo parece ser válido para a música e diversas outras áreas com um número
limitado de harmonias: começando em um tom, existe um número limitado de tons
harmônicos a ele, por isso muitas melodias “se parecem”.
## E o header?
Uma sugestão para a mudança do exemplo do header, baseada na regra de triangulação

(ou triádica):
![triadica]
Perceba que comparado com o primeiro exemplo, o header ficou mais elegante e as
cores não parecem brigar entre si.
Saber escolher as cores do seu projeto faz uma enorme diferença visual, seja para o
bem ou para o mal.
Você já se perguntou como são criados os cursos aqui na Alura? Com mais de 400
cursos em nossa plataforma, esta é uma dúvida recorrente de nossos alunos.
Pensando sempre na capacitação profissional e nas demandas do mercado, a criação de

um curso começa a partir do momento em que um instrutor identifica uma lacuna no
ensino de alguma tecnologia.
## Criando o conteúdo
Para criar um curso, é preciso que o instrutor escreva o que ele vai ensinar a
fazer. O foco não está na ferramenta que ele utilizará, e sim no que será feito com
ela, pois prezamos a teoria com base na prática.
Após escrever sobre o que ele vai ensinar, é preciso elaborar um projeto prático,
que servirá como base para o conteúdo do curso, baseado em situações reais do dia a
dia da profissão. Por exemplo, nos cursos de Web Design, o projeto é a modelagem
de um site web.
O passo a passo é documentado dentro de um arquivo de texto e, depois de uma

revisão detalhada, este projeto vira um roteiro para a gravação. Neste momento, é
discutido qual conteúdo pode ser cruzado com cursos já existentes na plataforma,
qual ordem é melhor didaticamente para apresentar o conteúdo, as boas e más
práticas que serão abordadas durante o curso, entre outras questões pertinentes
para garantir uma boa qualidade do conteúdo.
## Em frente às câmeras
Cada curso e instrutor têm demandas de tempo diferentes, por conta disso, não
determinamos uma duração fixa para as gravações. Nosso objetivo neste momento é
respeitar a individualidade de cada instrutor para que as gravações sejam uma
experiência enriquecedora, e o resultado seja o mais natural possível.
Após o término das gravações, nossa equipe de vídeos entra em ação para fazer os
devidos ajustes e cortes, mantendo a ordem correta e garantindo a qualidade da
imagem e do som.
Com a edição dos vídeos finalizada, é hora da equipe de transcrição escrever tudo o
que foi dito no curso para disponibilizar o conteúdo também em forma de texto,
deixando-o acessível a todos.
Mas o processo não acaba aí… Todos os nossos cursos possuem exercícios e projetos
exclusivos, focados no mercado de trabalho. O instrutor elabora esses exercícios,
que são revisados por uma equipe para evitar possíveis falhas.
Após todas estas etapas, temos um curso pronto para que os alunos possam aprender e
se capacitar cada vez mais. Para descobrir ainda mais detalhes sobre a criação dos
cursos, baixe o [**eBook Como os cursos da Alura e Caelum são criados**].
O que acha de treinar sua equipe para conseguir resultados ainda melhores em sua
empresa? Na [**Alura**], possuímos centenas de cursos pensados para capacitar
equipes e, dessa forma, auxiliar as empresas a atingir seus objetivos.
Durante a principal batalha contra Thanos o Doutor Estranho decide qual caminho
escolher: um entre 14 milhões de futuros, aquele que os levará a vitória, e o
[**Nerdologia Tech discute o assunto**].
Mas como ele é capaz de visualizar tudo ao mesmo tempo? Tentaremos resolver o
problema com **Python e Data Science**. Demonstraremos como ele foi capaz de
visualizar todos os resultados em menos de um minuto.
## O trabalho original
Nosso trabalho é [**baseado naquele do Gabriel Schade**]. Os heróis são: Ironman,

Spiderman, Nebula, Peter Quill, Drax, Mantis e Doctor Strange.
Cada round alguém bate em alguém: heróis batem em Thanos em uma de 3 estratégias.
Depois Thanos em um dos heróis aleatoriamente. Isso gera `3 * 7` possibilidades.
Com mais dois rounds são `3^2*7^2`, possibilidades crescendo exponencialmente com o
número de rounds.
O trabalho original faz o teste de uma heurística específica, que nos leva a
resultados super interessantes. Aqui queremos ver o que o Doutor Estranho viu.
Exatamente o que ele viu? Vamos ver... ele viu todos os futuros ao mesmo tempo?
Poderia ser, mas para isso o computador teria que simular todas as possibilidades
sequencialmente?
## Nossa implementação
Simularemos diretamente todas as possibilidades ao mesmo tempo. Para isso faremos

uso de um truque tradicional de algoritmos e maratonas de programação: nem todos os
estados futuros são únicos. Por exemplo, para o primeiro round:
```
a) 1/3 de chance, homem de ferro bate com bônus 1 => Thanos não sente nem cócegas,
continua com 500hp
b) 1/3 de chance, homem de ferro bate com bônus 2 => Thanos não sente nem cócegas,
continua com 500hp
c) 1/3 de chance, homem de ferro bate com bônus 3 => Thanos fica com 450hp
```
Opa... esses 3 futuros podem ser resumidos em 2 estados: (66% 500hp, 33% 450hp). O
mesmo ocorre com os estados futuros. Portanto podemos discretizar os futuros e
armazená-los na memória junto com a probabilidade de cada um deles ocorrer. Agora a
cada round rodamos um round ao mesmo tempo em *todos os futuros ao mesmo tempo*.
## Aqui a visualização após um turno:
- 66% de chance de um cenário onde Thanos possui 100% de energia, e os Avengers

100% - 33% de chance de um cenário onde Thanos possui 95% de energia, e os Avengers
100%
imagem que resultaria em exatamente 1 único sucesso e 14 milhões de estados

futuros.
## Desafios ao nosso estudo
Os gráficos usam surfaces para facilita a visualização mas deveriam ser pontos para
ser mais realista, sem extrapolação. Os pontos, porém, não ficam fáceis de serem
visualizados os personagens escolhidos pelo trabalho original, sinta-se a vontade
para mudá-los e recomendar alterações.
As estatísticas dos personagens, sinta-se a vontade para mudá-las e recomendar

alterações, a batalha é mesmo baseada em turnos? Em filmes, costuma ser, não há
perda de poder de ataque e defesa a medida que um personagem perde energia,
assumimos que o futuro é decidido somente pelo resultado de uma batalha e os
pesonagens envolvidos na mesma.
Pode ser que o universo dos Vingadores não seja real, e o filme não represente o
universo em que vivemos. Nesse caso é possível que os futuros encontrados não sejam
futuros de verdade, mas sim um **plot 3d de um jupyter notebook no cloud**.
Todo o [código fonte do projeto pode ser encontrado aqui no meu github].
Por esses dias a Mega-Sena acumulou de novo... Chegou ao valor de R$ 200 milhões!
Porém, eu sempre fico muito indeciso em qual jogo fazer, então vou pedir para que o
meu sistema jogue por mim. Vamos criar nosso _array_ de ìnt` de 6 posições para
armazenar os números:
java
Agora varremos nosso _array_ e preenchemos cada posição com um valor aleatório

entre 1 e 60, utilizando a classe `Random` e seu método `nextInt()`:
java
Imprimindo o nosso _array_ com o método `toString()` da classe Àrrays`:
java
Ele gerou 6 números aleatórios! Mas, espera aí... um desses números é o 0??? A
Mega-Sena sorteia apenas números entre 1 e 60... O método `nextInt()` com parâmetro
60 significa que será retornado um valor do tipo ìnt` entre 0 e 59. Para resolver
esse problema, precisamos somar 1 no momento que geramos os números aleatórios:
java
Ótimo! O sistema gerou um jogo da Mega-Sena! E, como podemos ver, dessa vez o
número 60 apareceu.
Mas ainda tem um probleminha, esses números estão desordenados... Imagina na hora
de preencher o volante da Mega-Sena: marco o 53, depois o 32 e depois terei que
avançar para o número 60! E quando sair o resultado? Terei que procurar a dedo? Que
horror! O método estático `sort()` da classe Àrrays` nos auxilia na ordenação de
vetores numéricos:
java
Excelente! Conseguimos gerar o nosso jogo da Mega-Sena! Mas agora, ao invés de

utilizar um _array_, eu quero usar uma solução mais sofisticada. Uma `List`,por
exemplo:
java
Agora, vamos preencher a nossa `List` com um `while`:
java
E para ordenar? Usarei o método `sort()` da classe Àrrays`? Infelizmente o método

`sort()` da classe Àrrays` espera apenas _arrays_ como parâmetro e uma List é uma
`Collection`... Porém existe o método estático `sort()` para `Collection`
utilizando a classe `Collections`:
java
Ele gerou o jogo como esperado! Mas, espera um pouco... 49 e 49? Como assim?? A
Mega-Sena não permite jogos com números repetidos... A interface `List` possui o
método `contains()` que permite verificar se um número já existe dentro da lista.
Então, basta adicionar um ìf` no momento da inserção dos números:
java
Nesse trecho estou dizendo que, se não existir o novo número aleatório dentro da
lista de números, adicione. Testando a nova implementação:
java
Agora o nosso sistema não permite números repetidos!
Vimos como é fácil ordenar números em Java, pois já temos métodos disponíveis para
resolver esse problema. Lembre-se sempre desses passos antes de ordenar:
- Quantos números preciso gerar?

- Posso repetir algum número?
**Gostou da `List`? Quer aprender mais APIs e bibliotecas do Java? A

Alura possui um [curso de Java] que explica com mais detalhes as principais APIs e
bibliotecas, com 3.158 alunos inscritos e com recomendação de 96%.**
imagem
Outro dia estava analisando dados de uma empresa que produz lápis de cor e canetas.
Fui começar a análise identificando quais eram os tipos de dados.
Para isso, abri o arquivo de uma planilha e na primeira linha, me deparei com os
seguintes dados:
```
----------------------------------
Azul | Vermelho | Amarelo | Branco
----------------------------------
```
Olhando para esses dados, nós conseguimos subtraí-los? Por exemplo, fazer uma conta
que é **azul menos vermelho**.
```
---------------------------------
Azul - Vermelho = ?
---------------------------------
```
Não conseguimos, certo?
Veja que não conseguimos fazer contas com **Azul, Vermelho, Amarelo, Branco**, mas
podemos usá-los para dizer algo sobre uma caneta.
Podemos falar que é uma **caneta azul**, e assim, estamos dando uma **qualidade**
para esse objeto.
imagem termos 0,12 lápis de cor, por exemplo.
Quando temos **dados quantitativos** que são **precisos**, que conseguimos

**contar**, como os de lápis de cor, esses dados são chamados de **discretos**.
Ou seja, ao falarmos daquela segunda coluna na tabela, estamos falando de **dados

quantitativos discretos**.
## Dados quantitativos contínuos

Agora que já vimos como classificar os dados dessa planilha, vamos seguir.
Eu ainda tinha um último arquivo para que eu analisasse no projeto. Abri o arquivo,
e mais uma vez encontrei uma tabela:
```
-----------------------------------------
| Caixa A | Caixa B | Caixa C | Caixa D |
-----------------------------------------
| 129 | 165 | 210 | 275 |
-----------------------------------------
```
Veja que temos a mesma coluna do que a tabela anterior, mas desta vez, ao invés de
quantidade de lápis, temos o peso de cada uma das caixas.
Para definirmos que tipo de dado é esse. Vamos iniciar as nossas perguntas.
Conseguimos subtrair 0,129 de 0,165? Conseguimos.
```
-----------------------------------------
0,165 - 0,129 = 0,36
-----------------------------------------
```
Beleza, então se conseguimos realizar operações aritméticas, sabemos que estamos

diante de **dados quantitativos**. Mas será que esses dados são **quantitativos
discretos**?
Para determinarmos isso, vamos repetir aquele processo de incluir uma Caixa E na
tabela e calcular o seu valor.
```
Caixa A = 129
Caixa B = 165
Caixa C = 210
Caixa D = 275
Caixa E = ?
```
Precisamos descobrir qual seria o peso dessa caixa, mas repare que não temos uma
balança e nem a caixa física para realizarmos uma pesagem, teremos que usar apenas
algumas contas.
Então vamos lá:
```
165
129
36
210
165
45
275
210
65
```
Veja que há uma diferença grande ao realizarmos o mesmo processo para essa tabela.
Primeiro, pois **não há um valor se repetindo** no resultado quando subtraímos os

pesos das caixas, segundo porque, como iremos ter **certeza** do quanto uma nova
caixa pesaria com as contas?
![]
Não temos como resolver o fato de que não há um número que se repita, então vamos
tentar melhorar nossos cálculos. Podemos pegar todos esses valores diferentes e
tentar ver o quanto cada um aumenta e depois somar uma média desses aumentos ao
último valor.
Vamos lá. Iremos ver primeiro o quanto cada um deles aumenta. Para isso, precisamos
saber quanto é diferença entre eles, fazendo também uma subtração:
```
45 - 36 = 9
65 - 45 = 20
```
Ok. Sabemos que o primeiro teve um aumento de 0,09 e o segundo de 0,20. Vamos somar
os dois valores e dividi-los pela sua quantidade que é 2 para ver o quanto dá.
```
9 + 20 = 29
29 / 2 = 14.5
```
Então temos uma média de 0,145 a mais de um valor a outro. Com esse número, podemos
tentar sugerir que a Caixa E, tivesse um aumento de 0,145 no peso. Ficando com a
tabela assim:
```
Caixa A = 129
Caixa B = 165
Caixa C = 210
Caixa D = 275
Caixa E = 420
```
Ir de 0,275 para 0,420 parece um pouco exagerado, certo? Os números estavam bem
próximos e de repente demos um pulo. Será que ainda precisamos melhorar mais?
Para isso, podemos tentar estimar fazendo mais contas e usando o peso da caixa, o
peso de cada lápis. E qual seria o problema disso? Ainda assim teríamos uma
**estimativa**, não teríamos como ter certeza. Diferentemente de quando fizemos
isso antes, agora só conseguimos estimar.
# Mas porque? Por causa do nosso tipo de dado.
Repare que estamos lidando com um dado diferente do **quantitativo discreto** aqui,
então as mesmas regras são se aplicam. Com esses novos dados, não temos quantidades
que podemos contar, não vamos apenas somando quilos, como 1kg, 2kg, 3kg e assim por
diante, temos variações como 1,200kg, 2,374kg e 3,821kg. Entre os números 1 e 2,
temos **infinitas** **possibilidades**, por isso fica tão difícil achar um número.
Estamos mais próximos agora do **28,11** do que do **60**, pois não estamos
**contando** lápis, mas **medindo** seu peso.
Quando estamos lidando com algo que **medimos**, temos números diferentes que
possuem **variações**, como se estivessem **continuando**. Então não são só 28, 29
e 30, mas 28, 1, 28,2, 28,3 até chegarmos ao 28,11 e podemos ir quebrando esses
números em 28,111 e 28,112, 28,113 sempre adicionando mais casas após a vírgula.
Quando temos dados quantitativos que são **medidas**, que tem essa
**continuidade**, eles são classificados como **dados quantitativos contínuos**.
## Dados e mais dados...
Vimos como temos alguns tipos de classificação de dados que podem se dividir entre
**qualitativos** e **quantitativos**. E além disso, como cada uma dessas
classificações se subdivide no caso do **qualitativo**, entre **qualitativo
nominal** e **qualitativo ordinal,** assim como para o **quantitativo**, entre
**quantitativo** **discreto**, **quantitativo** **contínuo**.
Mas não pára por aí. Além dessas classificações de dados, existem alguns outros
tipos de classificações que podemos utilizar. Como a classificação de dados em
qualitativos binomiais, quantitativos intervalares, até mesmo em qualitativo
discreto nominal, ou quantitativo contínuo racional, entre outros.
Muitas vezes ao procurar online ou em livros, você pode encontrar dados

qualitativos sendo classificados como categóricos, ou classificações que não
mencionam dados intervalares, iremos explicar porque isso acontece e ampliar a
nossa visão do que é uma classificação de dados.
A classificação de dados é algo muito importante quando estamos começando a

analisá-los, principalmente nas áreas de Ciência de Dados, BI e Estatística.
Aqui na Alura, temos um [**curso de estatística**] onde você irá aprender sobre
esses tipos de dados, e também sobre conceitos como a diferença entre moda, média,
mediana, e muitas outras coisas. Tudo isso será feito utilizando a linguagem R, uma
linguagem criada para cálculos estatísticos.
Aproveite esses recursos de estudo e até a próxima.
imagem
No app Imagly temos a primeira tela mais ou menos assim:
imagem de navegação.
Com esse recurso, liberamos o espaço que precisávamos antes e deixamos o layout
muito mais limpo.
E esse menu nem precisaria ser só o "menu hamburguer". Existem algumas variações,
como os ícones de configurações ou de 3 pontos que indicam a continuidade de
possibilidades no menu.
imagem. Porém, no iOS, esbarramos em algumas dificuldades…

Por ser um padrão de sistema, algumas coisas podem acabar assumindo um papel
diferente em contextos diferentes.
No caso do iOS, o menu hamburguer [**não é um componente nativo da plataforma**]. É

mais comum recorrerem a [**Tab Bars**], uma outra forma de expor as funcionalidades
do app.
imagem e
- O tipo de gatilho que acionará o side menu (menu hamburguer, por exemplo)
Manter ou não o menu escondido, ou mesmo optar por novas soluções, vai depender
muito de como cada app será recebido por seus usuários, por isso é tão importante
manter os testes de usabilidade para validar as possíveis necessidades de alteração
da UI.
Em alguns contextos é possível até que optem por utilizar a Tab Bar com todas as
categorias principais do menu e deixar o seide menu apenas como apoio a categorias
de prioridade secundária.
Incentive a equipe a sempre prototipar e analisar bem as opções antes de lançarem o

produto. E, para isso, na Alura nós temos um curso bem legal de [**prototipação com
Axure**], além das opções online que encontramos por aí para deixar os projetos
mais concretos, antes da implementação. :)
imagem
Saber a diferença entre **int** e **Integer** em JAVA pode nos ajudar muito no
nosso dia a dia.
Estou trabalhando em um sistema para uma loja de peças de carro online como revisor
de código, ou seja, revisamos o código dos programadores desse sistema. Em uma das
revisão nos deparamos com a seguinte classe:
java
Nessa **classe**, guardamos o nome e a idade de cada cliente, mas o atributo

ìdade` é opcional, o cliente não necessariamente precisa nos dar essa informação.
E aí, vocês estão vendo algo estranho nessa classe?
Para ficar mais fácil de visualizar, vamos **instanciar** essa classe e imprimir
seus valores:
java
Se executarmos este código, teremos o seguinte resultado:
java
Agora que vem a parte estranha. Por que a ìdade` esta com valor 0? Eu não preenchi
essa informação. E outra, idade “0”? Isso não existe.
Vamos entender o motivo disso. Se voltarmos para a nossa classe `Cliente` podemos
perceber que o **atributo** ìdade` é do tipo ìnt`. Esse tipo, por sua vez, é
considerado um **tipo primitivo**, que nada mais é do que um tipo que não
representa uma classe.
Quando declaramos um atributo (membro da classe) como sendo de algum tipo

primitivo, esse atributo tem um valor padrão. No nosso caso, o padrão de int é 0,
mas isso só vale para **atributos de uma classe**.
Não é isso que queremos, não é mesmo? Caso o cliente cadastre a idade, queremos
salvar a idade, caso contrário, não queremos salvar nenhum valor, ou seja, queremos
salvar o atributo idade como vazio.
# Classes Wrapper
Agora, se pensarmos, todos os tipos não primitivos são, por padrão, nulos caso não
seja atribuído nenhum valor a eles.
Pensando nisso, a linguagem Java nos disponibilizou o que chamamos de **Wrapper**,

que, basicamente, é uma classe que representa um tipo primitivo. Por exemplo o
Wrapper de ìnt` é o Ìnteger`. Perceba que o Wrapper começa com letra maiúscula,
ele segue a mesma nomenclatura que qualquer outra classe, pois ele também é uma.
> Mas o que eu ganho usando esse Wrapper?
Boa pergunta. Bom, a maior vantagem é conseguir atribuir nulo. Mas com grandes
poderes, vem grandes responsabilidades, logo, cuidado para não atribuir valores
nulos a rodo, pois seu código fica muito propenso a tomar **NullPointerException**.
Podemos falar também dos métodos que ganhamos, como agora estamos **tipando** nossa
variável com uma classe, essa classe pode ter métodos que podemos usar para o nosso
inteiro.
Para exemplificar vamos tentar ver os métodos disponíveis para ìdade`:
imagem`, que transforma o parâmetro para o wrapper que chamou este método.
Além disso, caso seja realmente necessário usar um dos **métodos não estáticos**, a
forma de transformar um ìnt` em Ìnteger` é trivial.
Para conseguir essa transformação podemos usar exatamente esse método `valueOf()`:
java
Ou então, como Ìnteger` é uma classe não abstrata, podemos instânciá-la:
java
Mas, poxa, é um pouco chato o jeito que é feita essa conversão né? Ter que ficar
dando **new** ou ficar chamando o método estático para conseguir um Ìnteger`...
# Autoboxing e Unboxing
Vendo a regularidade que a conversão de tipo primitivo para Wrapper e vice-versa

ocorria, foi desenvolvido para o Java 5 duas funcionalidades, **o autoboxing e o
unboxing**.
O **autoboxing** é um recurso que automaticamente converte tipos primitivos em seu

wrapper equivalente. Por exemplo, vamos supor que eu queira transformar o atributo
ìdade` que está com o tipo ìnt` para uma nova variável do tipo Ìnteger`. Com o
autoboxing eu poderia fazer dessa forma:
java
E pronto, legal,né? “Por baixo dos panos” o compilador compila para o seguinte
código:
java
E o unboxing é o inverso do autoboxing, ou seja, ele pega um wrapper e o transforma

em seu tipo primitivo. Assim:
java
E por baixo dos panos, temos o seguinte:
java
Agora que entendemos melhor as diferenças entre ìnt` e Ìnteger` podemos acabar de
revisar a classe `Cliente`. Como ìdade` é um atributo opcional e com certeza não
queremos que por padrão seja 0, vamos mudar o tipo dela de ìnt` para Ìnteger`.
Ficando com a seguinte classe:
java
# Operações matemáticas com Wrapper
Faltou falar sobre uma coisa. E para operações matemáticas? O que é melhor usar?
ìnt` ou Ìnteger`?
Para isso vamos criar um método para calcular o valor das parcelas das compras
feitas na loja online. Nesse cálculo temos que seguir algumas regras:
- Se a quantidade de peças comprada for maior que 3, é dado um desconto de 10% em

cima do total da compra.
- A comissão do vendedor é igual a 5% do valor total da compra após os descontos
dados.
- O valor das parcelas é adquirido pela divisão do total já descontado pelo número
de parcelas.
Bom, podemos criar um método que recebe o valor total, o número de peças compradas,
o número de parcelas e retorna um objeto do tipo `GerenciadorDeVendas` que recebe
em seu construtor o valor da comissão do vendedor e o valor de cada parcela:
java
Como o foco não é a operação em si, se fôssemos resolver esse método, poderíamos
fazer da seguinte forma:
java
Agora vocês devem estar se perguntando porque eu usei tipos primitivos ao invés de
Wrappers, né? Então, se os usássemos, estaríamos correndo o risco de receber algum
valor nulo e quando operássemos sobre esse valor iríamos tomar um belo
`NullPointerException`. Portanto, usando os tipos primitivos estamos evitando isso.
No máximo teremos algum dos parâmetros com valor 0.
O segundo motivo é a questão da performance. Um Wrapper não deixa de ser uma classe
e quando criamos um, estamos, de fato, instanciando um objeto, logo estamos
reservando um espaço da memória para ele.
Pensando nisso, imagine a quantidade de objetos que teríamos para resolver essa
operação matemática, simplesmente não vale a pena, pois tudo que precisamos é
trabalhar com valores e nesse aspecto o tipo primitivo consegue suprir essa
necessidade.
Outra ponto importante é que o Java possui um cache para números baixos, então por
exemplo:
java
Esse código imprime `false` pois Ìnteger` é uma classe, logo ì1` e ì2` são
objetos dela e as suas referências estão alocadas em espaços diferentes na memória.
Quando usamos o operador `==` em objetos, ele compara as referências e não os
valores. Isto é, como os objetos não estão apontando para a mesma referência temos
como resultado `false`.
Agora, olhe este código:
java
Este, por sua vez, imprime `true`.
> Mas você acabou de falar que comparar objetos usando o operador `==` resulta em
`false`
O Java, para economizar memória, possui um cache de alguns objetos, incluindo o

Ìnteger`. Dependendo de como é feita a utilização, se os objetos do tipo Ìnteger`
tiverem o valor entre -128 até 127 o Java consegue fazer um _boxing_ dos valores e
os reutilizar.
Logo, efetuar comparações usando o operador “==” com Wrappers é arriscado, pois
além de compararmos referências ao invés dos valores podemos cair nesse caso, onde
é usado o cache e resultar em uma comparação inesperada.
Duas soluções para isso são: Usar tipos primitivos para efetuar comparação usando
“==” ou usar o método [**equals()**] que é o [**mais adequado para comparar
objetos**].
## Conclusão
Wrappers, como o Ìnteger`, são úteis quando precisamos usar nossa variável em
coleções ou queremos deixar algum atributo opcional, leia-se, com valor nulo. Já
tipos primitivos são ótimos para quando não queremos nulo e para operações
matemáticas, pois ocupam pouco espaço na memória, melhorando a performance da sua
aplicação.
É isso aí, espero que você tenha conseguido entender a diferença entre ìnt` e
Ìnteger` e quando vale a pena usar cada um. Já se enrolou alguma vez na hora de
comparar um Wrapper?
Para entender mais sobre esses detalhes da linguagem, como o cache feito pelo Java
e outras coisas relacionadas aos Wrappers, na **Alura** temos o [**Curso
Certificação Java SE 8 Programmer I: Conteúdo além da prova**], lá você encontra um
capítulo inteiro sobre classes Wrappers e várias outras peculiaridades da linguagem
e uma [**formação completa em JAVA**]
Desde que se tornou popular no cinema, a [animação 3D] vem conquistando um número
incontável de fãs e adeptos. Essa técnica trouxe inovação em diversos segmentos da
indústria digital, mas foi no cinema onde seu encanto prevaleceu e evoluiu
rapidamente.
Quem não lembra de [Toy Story], o primeiro grande sucesso em animação 3D? Ele foi
lançado em 1995 e levou a produtora [Pixar] ao conhecimento do grande público,
passando do semianonimato ao estrelato.
Na mesma época, outra grande produção em 3D disputava com Toy Story o status de
primeiro filme totalmente produzido digitalmente: [Cassiopeia], que é uma produção
brasileira! Sim, isso mesmo. O Brasil esteve na corrida pela conquista do pódio
nesse universo tão fascinante, que ganha cada vez mais espaço.
## O início de tudo
Para a surpresa de muitos, não foi com Toy Story que tudo começou. Em 1972, [Edwin
Catmull] (o então futuro fundador da Pixar) e Fred Parke criaram A [Computer
Animated Hand], um dos primeiros filmes em animação 3D.
Nesse experimento, eles desenvolveram um modelo de mão representada em três

dimensões. A imagem apresentava textura e movimento e foi feita a partir da mão do
próprio Ed Catmull, reproduzida em uma réplica de gesso. A partir disso, foi feito
um mapeamento detalhado do polígono que compunha o modelo tridimensional.
O resultado foi extremamente simples, mas um marco na história da modelagem digital

em 3D. Estava aberta a porta para a evolução da técnica e sua aplicação em muito do
que conhecemos hoje em computação gráfica.
## As carreiras possíveis
Muita gente tem deixado de lado o medo dos softwares de computação gráfica para
experimentar essa arte que, há pouco tempo, era vista como privilégio de pessoas
com [habilidades] notáveis.
Na realidade, não é necessário possuir um talento especial para abraçar as

carreiras de computação gráfica. É importante, no entanto, estar disposto a dedicar
muito tempo e disciplina para se capacitar nessa área.
Para quem tem interesse nesse segmento, um mínimo de vocação artística pode
facilitar o aprendizado. Conhecimentos em desenho ou escultura também auxiliam na
transição para o 3D, mas esse não é um requisito indispensável para ingressar na
carreira.
O que realmente importa é dedicação, paciência, disciplina, força de vontade,

trabalho duro e muito mais disso tudo. Aceitar críticas também é uma grande
virtude, já que o caminho para a excelência nesse tipo de trabalho é recheado de
erros e dúvidas.
Atualmente, esse mercado está em franca expansão e precisa de pessoal capacitado.

As carreiras relacionadas à área de animação 3D são muito promissoras e invadem
diversos setores à medida que a tecnologia avança e se torna popular. Confira a
seguir algumas alternativas e escolha a sua:
### Agências publicitárias
As agências funcionam muito bem como [ponto de partida] para profissionais que
estão se aventurando na carreira. É um nicho onde se concentra a maior demanda de
pessoas em busca de uma oportunidade para entrar no mercado.
O conteúdo dessas agências costuma ser bastante diversificado. Muitas trabalham com
comerciais, envolvendo criação de vinhetas e anúncios que exigem um trabalho mais
aprofundado de desenho, modelagem e animação 3D.
Algumas agências criam setores especialmente direcionados à produção de efeitos

especiais e animação. Os salários variam bastante de acordo com o nível de
conhecimento de cada profissional, mas podem ficar entre R$ 3 mil para iniciantes a
R$ 10 mil para gestores/diretores de arte e coordenadores de projetos 3D.
### Mercado de games
A cada geração, os jogos eletrônicos vêm conquistando mais e mais adeptos de todas
as idades e segmentos. Ganhou até um verbete: “gamificação”, partindo da ideia de
que tudo pode virar um game, de filmes a atividades escolares ou profissionais.
Os games já foram vistos como coisa de criança, mas atualmente movimentam bilhões
de dólares por ano, firmando-se como profissão séria para adultos e investimento
lucrativo para empreendedores. O mercado brasileiro de jogos eletrônicos ocupa a
13º. posição no ranking mundial, segundo estimativa realizada pela [Newzoo],
consultoria referência em pesquisas da indústria de games.
Essa é uma das mais cobiçadas alternativas para os amantes de animação 3D, afinal,
os games são um universo lúdico onde você pode ter a chance de trabalhar com
franquias amadas e criar universos totalmente interativos. Entretanto, não se
engane: é preciso muita persistência para se manter nele.
A demanda de desenvolvedores no mundo todo é extensa e o leque de opções é cada vez

maior. As ferramentas para produzir aplicativos e jogos estão tornando a criação de
games mais acessível, criando muita concorrência entre pequenos e grandes estúdios
que disputam os mesmos usuários.
Assim, o desafio para promover e distribuir jogos é grande, exigindo um crescimento

na especialização em marketing e monetização, além do alto nível da qualidade dos
jogos em produção.
Mas tudo isso faz parte de um mercado em expansão. Ao mesmo tempo em que a disputa
entre empresas cresce, os negócios complementares também acompanham esse
crescimento, estendendo as oportunidades.
No mercado de games, a média salarial para artistas gráficos e animadores flutua

entre R$ 1,8 mil e R$ 4 mil. Muitos são freelancers e prestam serviços para
diversos estúdios, então esses valores podem variar ainda mais.
De todas as áreas para atuação de artistas gráficos, esta é a que apresenta a mais
baixa remuneração, mas é a que mais avança e se renova constantemente. Para os
apaixonados por games, vale a pena o esforço.
### Produtoras de cinema
O cinema passou por uma transformação impactante desde que a computação gráfica
mudou seus contornos. As histórias fantásticas, mundos suprarreais, seres
mitológicos e super-heróis passaram a ter mais credibilidade.
Os efeitos visuais que a modelagem e animação 3D proporcionam têm sido as grandes

estrelas desse setor. Desde que Edwin Catmull e seus colaboradores produziram o
primeiro modelo 3D, [essa técnica] não parou de evoluir.
É importante deixar claro que os efeitos especiais também são aplicados para compor
cenários da vida cotidiana e que, muitas vezes, ninguém suspeita de sua presença
“em cena”. Um exemplo disso é o filme Chico Xavier (2010), de Daniel Filho, que
teve o uso desse recurso em mais de metade da produção.
Porém, é inegável que o maior chamariz para os aspirantes à carreira de animadores

3D no cinema são os desenhos totalmente digitais. Depois do marco de Toy Story, uma
avalanche de filmes colocou a produtora no ápice das bilheterias do gênero.
A Dreamworks de Steven Spielberg trilhou o mesmo caminho com super produções como
Shrek, Madagascar e Kung Fu Panda. Esses dois estúdios se mantêm no topo,
alternando sucessos de bilheteria entre si ao lado da Disney, que também produz
animações 3D independentemente da Pixar.
O mercado de animadores no cinema ao redor do mundo ainda está carente de

profissionais qualificados. A indústria cinematográfica em países como Estados
Unidos e França conta com um bom número de especialistas, enquanto no Brasil ainda
há um caminho a percorrer para alcançar o mesmo patamar.
Contudo, os salários são mais animadores que nas outras alternativas de carreira:
no Brasil costuma variar entre R$ 3 mil a R$ 15 mil para um modelador generalista.
Nos Estados Unidos, a realidade profissional é muito diferente e bem mais atraente
para quem tiver oportunidade de buscar lá uma carreira de artista gráfico.
Como se pode notar, os caminhos que o mercado da animação 3D apresenta são

particularmente interessantes dentro de um universo único, que fascina
profissionais e admiradores. Escolha o seu e mãos à obra!
O mercado de trabalho tradicional, que contrata os colaboradores no regime da CLT,

não tem dado sinais de que vai se recuperar tão cedo da recessão pelo qual o país
passa. O trabalho freelance tornou-se uma opção viável e rentável para muitos
profissionais que buscam qualidade de vida, remuneração justa e um maior controle
sobre as atividades que desenvolve.
Ele também é uma opção para [**quem está começando na carreira**].
Conseguir mais trabalhos como freelancer passou a ser a meta desses profissionais,
que aperfeiçoam suas técnicas e oferecem oportunidades com preços mais competitivos
para os clientes.
## Como conseguir trabalhos como freelancer?
Para que você consiga trabalhos como freelancer, é necessário adotar algumas boas
práticas e estratégias que te conduzam a esse objetivo. Nós listamos as principais
a seguir. Confira!
### Crie um portfólio
Como um cliente pode avaliar sua capacidade de realização se você não possui um
portfólio? O portfólio facilita a identificação do cliente com o seu trabalho, pois
ele enxerga nos exemplos apresentados o que ele deseja para o seu negócio.
**Tenha um site que reflita o quão profissional você é. Opte pela aquisição de um
domínio próprio, que transmite mais profissionalismo, e tenha um site responsivo e
fácil de navegar. Deixe seus contatos em um ponto de fácil visualização e atualize
seu portfólio com frequência.**
### Pratique o networking
Ative os seus contatos e busque, entre eles, os clientes potenciais que

estão interessados no seu trabalho. Após identificar esses prováveis clientes,
agende um encontro pessoalmente para apresentar seu portfólio e propor serviços.
Participe de eventos como palestras e eventos gratuitos, pois neles você pode
encontrar potenciais clientes. Se você trabalha como designer de e-commerce, por
exemplo, um evento com empreendedores que buscam turbinar seus negócios pode
oferecer oportunidades únicas para o seu trabalho.
### Seja ativo nas mídias sociais
As mídias sociais não servem apenas para você se relacionar com amigos e
familiares. O Facebook, por exemplo, permite a criação de _fan pages_ com
finalidade comercial. Crie a sua e comece a divulgar seu trabalho.
[**Outra rede social que pode trabalhar ao seu favor é o LinkedIn.**] Essa rede
social voltada para profissionais tem, frequentemente, recrutadores e clientes
buscando por freelancers que desenvolvam atividades específicas em curto prazo.
O YouTube também pode te ajudar a encontrar novos clientes. Além de divulgar

depoimentos de seus clientes sobre o serviço que você desenvolve, aproveite o canal
para discutir temas relacionados ao seu trabalho e propor melhorias para a área.
Fomentar a discussão sobre um tema também é uma forma de encontrar freelances.
### Envie e-mail marketing
Crie uma lista de contatos profissionais. Assim que começar a trabalhar como
freelancer, dispare um e-mail marketing para essa lista contando sobre suas
atividades. Para alimentar sua lista de e-mails, coloque em seu site algumas formas
de capturar novos contatos. Isso pode ser feito por meio de formulários e
compartilhamento de conteúdo relevante, trocando o conteúdo pelo contato.
### Apresente-se para as agências
**As agências de publicidade e de comunicação necessitam, frequentemente, de

profissionais freelancer. Elas buscam oferecer diversas soluções para os seus
clientes, porém nem sempre contam com uma equipe especializada em certos
assuntos.**
Combine uma reunião com os proprietários da agência e apresente seu portfólio.

Mostre como seu trabalho pode fazer a diferença para os clientes deles saber quais
são os trabalhos desenvolvidos pela agência é fundamental, portanto faça uma
pesquisa com antecedência para chegar com bons argumentos.
## Onde conseguir trabalhos como freelancer?
Agora que você sabe as estratégias para encontrar trabalhos como freelancer e
aumentar sua base de clientes, nós listamos os sites especializados em divulgar
vagas para profissionais como você. Confira!
### GetNinjas
O [GetNinjas] é uma plataforma virtual que serve para anunciar os mais diversos
tipos de serviços. Quem presta os serviços precisa fazer um cadastro, que permite
fazer uma página pessoal para descrever o tipo de serviço que presta, inserir fotos
e divulgar as avaliações do seu trabalho. O GetNinjas também tem um aplicativo para
smartphones que permite receber notificações quando algum cliente entra em contato
solicitando novos orçamentos.
### Nearjob
Com design simples e fácil de navegar, o [**Nearjob**] é um serviço gratuito para

freelancers que desejam conseguir mais clientes. Uma das vantagens desse site é a
intermediação do pagamento entre você e o cliente, permitindo receber o pagamento
assim que o trabalho for marcado como concluído.
### Logovia
O [**Logovia**] é voltado para freelancers que trabalham com a criação de produtos

gráficos, como cartões, folders, identidade visual e logotipos. Os clientes
preenchem uma ficha com o objetivo do trabalho e o orçamento disponível, permitindo
que mais de um freelancer realize o trabalho, em uma espécie de concorrência. O
cliente escolhe o vencedor, que, ao final, receberá o valor disponível para
orçamento. O envio dos trabalhos e o pagamento são feitos por intermédio do site.
### Prolancer
Uma das plataformas mais completas para quem busca oportunidades freelance de
trabalho, o [**Prolancer**] apresenta em sua plataforma uma série de trabalhos
disponíveis. Os clientes descrevem suas necessidades e apontam os orçamentos. Caso
você queira pegar algum dos trabalhos, basta se candidatar e enviar o seu preço,
portfólio e diferenciais.
### Freelancer.com
Ideal para quem tem fluência em mais de um idioma, pois encontra-se presente em
quase 250 países, o [**Freelancer.com**] apresenta cerca de 270 mil ofertas de
trabalho sem vínculos empregatícios. O pagamento é em moeda estrangeira, no caso, o
dólar — que está valorizado. O valor médio por trabalho é de 200 dólares,
aproximadamente R$600,00.
### 99freelas
O [99freelas] permite o seu cadastro por e-mail ou pela sua conta do Facebook.
Informe suas habilidades, experiências e demais informações. Depois de criar o
cadastro, basta pesquisar entre os trabalhos disponíveis aqueles que sejam
gratificantes para você. A plataforma também recomenda alguns freelances de acordo
com o seu perfil profissional, habilidades e interesses. O site permite que cada
usuário opte por ter um plano gratuito ou pago.
### Trampos
Nascido no Twitter como divulgador de vagas, o [Trampos] passou a ser uma

plataforma que agrega diversas oportunidades de trabalho — para freelancers ou não.
De navegação simples e intuitiva, o Trampos permite que você escolha as vagas por
meio de filtros que separam a sua área de atuação e o tipo de contratação que está
buscando. Os usuários que pagam o plano mensal do site têm direito a receber as
vagas com algumas horas de antecedência, o que aumenta a visibilidade desses
profissionais e as chances de conquistarem a oportunidade.
Para isso, o empresário deve promover sua imagem, deixando claro que o negócio
conta com sua habilidade e qualidade. Ser visto é essencial para ser lembrado,
porém ainda insuficiente para divulgar os seus serviços como superiores aos da
concorrência.
Manter a competitividade em um mercado tão exigente quanto o atual exige

criatividade e inovação. A utilização de técnicas e estratégias de marketing
pessoal para conquistar mais clientes é essencial para o desenvolvimento de
colaboradores e até mesmo companhias como um todo. Descubra como agir para divulgar
as suas competências e atrair o público!
## O marketing pessoal
O [**marketing pessoal**] consiste na realização de uma série de ações e

estratégias (sempre aplicadas de acordo com a realidade de cada pessoa) com o
objetivo de atribuir valor positivo à imagem pessoal de um sujeito.
Mais do que realizar a autopromoção da imagem de uma pessoa, o marketing pessoal

não se confunde com a publicidade: ele diz respeito apenas à criação de
possibilidades para que o público possa enxergar quem o pratica como autoridade em
um assunto. O fortalecimento da marca é apenas consequência.
### Consumidores modernos pedem soluções de marketing pessoal arrojadas
Para tanto, é preciso um planejamento estratégico que vise entregar valor para as
pessoas, já que o tradicional conceito de “ser visto para ser lembrado” não é mais
suficiente para o consumidor moderno.
O marketing de conteúdo especialmente voltado para redes sociais — é assim uma das
mais poderosas soluções para quem quer turbinar sua imagem e provocar um aumento de
sua relevância no mercado, tornando-se referência em seu segmento.
Para fortalecer a sua marca pessoal, você precisa entregar exatamente o que o
consumidor espera: conteúdos de acordo com seu perfil e que responda a dúvidas que
seu cliente geralmente tem. Toda vez que o público o enxerga como especialista em
seu assunto, você fortalece a sua imagem.
## Como fazer marketing pessoal de qualidade
O início da composição de uma boa estratégia é sempre sondar o público (ainda que
por meio de terceiros, afinal, o cliente pode não dizer tudo o que pensa na frente
do prestador de serviços) e descobrir sua real imagem perante os consumidores,
respondendo perguntas como: o que pensam de você como profissional? Eles veem você
como referência no seu setor?
A partir daí você pode traçar objetivos e ter um guia para uma ação mais adequada
para fortalecer sua imagem. Em linhas gerais, a construção de uma solução segue o
seguinte passo a passo:
### 1\. Defina um objetivo
A fim de ter sucesso na promoção da sua imagem, você deve ter certeza das metas que
deseja alcançar. É importante definir objetivos concretos e tangíveis: de nada
adianta esperar um aumento de 500% de clientes no espaço de uma semana, já que
normalmente é uma situação incompatível com o mercado brasileiro.
Aumentar a clientela, gerar maior tráfego para seu site ou blog, aumentar seu
alcance nas redes sociais, conseguir uma promoção — apenas você (ou um profissional
qualificado para guiá-lo neste caminho) poderá [**definir quais tipos de metas**]
são adequadas ao seu perfil.
### 2\. Busque autoconhecimento
Ao estruturar uma estratégia de marketing pessoal, você deve fazer uma autoanálise
e descobrir quais os recursos que você já possui, bem como os que precisarão ser
desenvolvidos ou mesmo adquiridos.
Aprender a lidar melhor com clientes, desenvolver habilidades de venda e dominar

melhor soluções de marketing são exemplos de melhorias que podem ser implantadas.
Desenvolver habilidades que estão ligadas à captação do público permitirá a entrega

de valores os quais eles talvez nem saibam que precisam, fazendo com que prestem
mais atenção naquilo que você tem a oferecer.
### 3\. Promova mudança de atitudes
Tenha sempre em mente que a sua imagem é o que pode deixar uma primeira impressão
positiva, sendo um verdadeiro cartão de visita. Uma vez realizada a observação
consciente de suas atitudes, é hora de partir para a ação e modificar aquelas que
estão insatisfatórias.
Pense em mudança de hábitos, formas de lidar com clientes e até mesmo de vestuário
— tudo que aumente sua autoconfiança e fortaleça positivamente a percepção dos
outros sobre sua imagem é válido.
Quer alcançar uma clientela mais específica? Estude seus hábitos e necessidades.
Quer se comunicar melhor com o público? Invista em cursos de oratória. Sabe lidar
com a tecnologia, mas está desatualizado? Capacite-se e busque cursos de qualidades
para saber como acompanhar os avanços da era digital.
### 4\. Meça resultados e realize ajustes
O ideal é seguir métricas e acompanhar resultados em números e porcentagens e

checar periodicamente se sua estratégia tem sido efetiva para promover ajustes.
Afinal, investir em soluções que não funcionam significa perda de tempo e dinheiro.
Vale acompanhar o tráfego de seu site, conhecer o engajamento gerado pelos seus
posts nas redes sociais (o que pode ser feito com ferramentas das próprias
plataformas) e até mesmo ver se o número de negócios fechados aumentou com a
implantação de mudanças: tudo dependerá das estratégias que você tenha adotado.
## Marketing pessoal nas redes sociais
O meio virtual é hoje uma extensão da nossa sociedade, tomando grande parte do
tempo da maioria das pessoas, que utilizam a internet diariamente para atender a
propósitos pessoais de trabalho. É pelas plataformas digitais que os cidadãos
constroem sua imagem e alimentam a curiosidade do público.
Uma boa estratégia de marketing pessoal, assim, deve ter como pilar fundamental as
redes sociais: seu alcance é bem mais rápido que o de outros canais e você pode
(cuidadosamente) escolher o que postar e fortalecer sua reputação. Algumas atitudes
são indispensáveis para quem quer investir nesse tipo de marketing. Entenda:
### Defina seu target

Toda marca pretende se comunicar com certo público e apresentar-lhes produtos ou
serviços. Não pode ser diferente do que acontece em uma marca pessoal: o valor a
ser entregue deve ser projetado para uma dada audiência.
Esteja claro de quem compõe essa audiência e mire seus esforços nesse target. Para
aumentar sua rede de contatos e fortificar o networking, procure seguir pessoas
influentes e trabalhe bastante para que elas sigam o seu perfil de volta.
### Invista em uma imagem pessoal impactante e uniforme
Ao criar uma imagem profissional, elimine apelidos: eles só serão úteis se forem
mais utilizados que seu nome real. Imagens de perfil e capa devem ser sempre
atualizadas, a fim de não cansar o público e causar maior engajamento.
O volume de postagens deve estar de acordo tanto com as [**redes sociais**]

escolhidas, quanto à sua área de atuação. Só poste ou comente conteúdos que sejam
realmente relevantes para a sua rede, sempre com autoridade e de maneira autêntica.
Não ofenda ninguém e mantenha a ética profissional.
### Aposte em frases impactantes e bons títulos
Suas declarações (inclusive constantes na descrição do seu perfil) deverão ter

apelos objetivos, atraentes e reais. Aposte em declarações fortes, que causem
impactos positivos e estejam intimamente ligadas aos seus valores. Não poste
conteúdo aleatoriamente e busque formular frases e títulos que sejam diferentes e
fácil de ser lembrados.
## Aumentando a rede de clientes de maneira eficiente
Uma boa forma de agregar valor à sua marca pessoal é fazer associações e parcerias.
Isso pode ser feito até mesmo por meio de comentários. Viu algo que gostou? Opine e
compartilhe sua opinião. Uma conversa assim pode se desenvolver e render bons
frutos no futuro.
Dê preferência a marcas [**formadoras de opinião**] já consolidadas na rede. Assim,

você atrai mais seguidores ao se utilizar de um tráfego já existente.
Meu primeiro contato com o **universo 3D** foi há 13 anos atrás. Meus amigos me
apresentaram o jogo CS 1.6 e estavam todos muito empolgados com o jogo e seu
gráfico realista, que o tornava ainda mais interessante.
imagem em novas ferramentas** que surgem na efervescência da sofisticação

tecnológica dos softwares de modelagem virtual 3D.
## **Outras áreas de atuação do profissional de 3D**
**Filmes de animação**:
![]
**Filmes** _**live action**_ - interação do 3D com pessoas reais:
![]
**Entertainment and advertising** - propagandas e comerciais:

![]
![]
![]
## **Quem faz?**
No Brasil temos grandes artistas de 3D que estão cada mais ganhando destaque no
mercado.
![]
Ver referências de grandes artistas é muito importante para nivelar a qualidade do

trabalho que você executa buscando sempre qualidade, porém, mantendo a
originalidade que faz cada modelador ser singular.
Selecionamos abaixo alguns artistas renomados que vêm fazendo a diferença no

direcionamento dos games e filmes 3D:
[Rafael Grasetti]
[Glauco Longhi]
[Alex Oliver]
[Fellipe Beckman]
[Victor Hugo Queiroz]
Pela complexidade do ofício, **há uma grande procura por profissionais qualificados
no mercado de trabalho**, o que torna-se muito interessante para quem deseja
aprender e se profissionalizar.
Aqui na [**Alura**] temos vários cursos que apoiam esta jornada:

[**Jogos mobile com Unity: Diversão com a Game Engine**]
[**Blender 3D: Modelagem inorgânica**]
[**Maya parte 1: Modelagem inorgânica**]
[**Autodesk 3Ds Max Parte 1: Modelagem inorgânica**]
[**Unreal Engine**]
**Front End** ou **Back End** developer são termos para diferenciar onde uma pessoa
que programa acaba se especializando.
Se você está entrando no mundo do desenvolvimento muito provavelmente classifica
todo mundo como programador e programadora, mas os sistemas se tornaram tão
complexos que precisamos que cada um seja responsável por partes específicas de uma
aplicação.
## O que é Front End?
Podemos classificar como a parte visual de um site, aquilo que conseguimos

interagir. Quem trabalha com Front End é responsável por desenvolver por meio de
código uma interface gráfica, normalmente com as tecnologias base da Web (**HTML**,
**CSS** e **JavaScript**). Algumas pessoas podem confundir um pouco esse trabalho
com o que um designer faz (no passado existia uma entidade chamda **Webmaster** que
fazia tudo isso e mais um pouco), mas a diferença aqui é que o designer vai
utilizar alguma ferramenta visual para **desenhar a interface**, do Photoshop ao
Sketch, e quem faz front-end estará mais próxima do código em si, que irá rodar em
um navegador Web como Chrome, Firefox ou Safari.
imagem
É importante entender como funciona a web para saber o que diferencia quem faz
front-end do back-end:
https://www.youtube.com/watch?v=kDy62zaCHZE
O mundo do Front End possui diversas tecnologias e está sempre evoluindo, se você
quiser conhecer ele desde a base [recomendo você dar uma olhada na Formação front
end aqui da Alura], e caso queira ir mais a fundo trabalhando com as ferramentas da
moda, confere essas outras formações especializadas em frameworks JavaScript:
- https://www.alura.com.br/formacao-vuejs
- https://www.alura.com.br/formacao-angular
- https://www.alura.com.br/formacao-react
## O que é Back End?
Back End, como o próprio nome sugere, vem da ideia **do que tem por trás de uma
aplicação**. Pode ficar meio abstrato em um primeiro momento, mas pense que para
conseguir usar o Facebook no dia a dia, os dados do seu perfil, amigos e
publicações precisam estar salvos em algum lugar, sendo esse lugar um banco de
dados e processados a partir de lá. Não basta apenas o front-end em HTML e CSS! O
Back End trabalha em boa partes dos casos fazendo a ponte entre os dados que vem do
navegador rumo ao banco de dados e vice-versa, sempre aplicando as devidas regras
de negócio, validações e garantias em um ambiente onde o usuário final não tenha
acesso e possa manipular algo.
imagem
É comum desenvolvedores Back End trabalharem com ferramentas de linha de comando,

sites (deixando o HTML dinâmico), análise de dados (embora isso puxe mais o que um
[Data Scientist faz]). Tudo isso pode ser feito com uma série de linguagens
diferentes como: PHP, Ruby, Java, Clojure, C# entre diversas outras que você pode
dar uma olhada no fluxo para aprender cada uma delas se baseando nas formações aqui
da alura nos links abaixo:
- https://www.alura.com.br/formacao-java
- https://www.alura.com.br/formacao-desenvolvedor-php
- https://www.alura.com.br/formacao-python-web
- https://www.alura.com.br/formacao-dotnet
- https://www.alura.com.br/formacao-node-js
## Onde se encaixa quem desenvolve aplicativos Mobile?
Existe uma discussão se quem trabalha como Front End também é desenvolvedor Mobile.
Na prática não, mas pode ser. Explicando um pouco mais as tecnologias que envolvem
os aplicativos mobile são inicialmente completamente diferentes das que citamos
para a Web sendo elas para android: Java, Kotlin; E para iOS: Swift e Objective C.
Desde o começo dos dispositivos mobile existiram alternativas para desenvolvermos
como o Phonegap ou Apache Cordova que permitem que você crie um site que seja
instalável como aplicativo (hoje temos a proposta das PWAs).
Na prática são mundos diferentes, o que pode gerar uma intersecção do Front End e
do mundo Mobile seria o React Native por utilizar tanto um framework super popular
na Web quanto a linguagem JavaScript. Mesmo com essa familiaridade toda, as
diferençås das plataformas ainda sim separam os profissionais que mexem com sites e
aplicativos em duas linhas diferentes.
## É possível ser Full Stack?
Bom, ambas as vertentes do Front e do Back End possuem uma [trilha bem longa]
dependendo do quão profundo conhecedor delas você quer ser. Uma definição comum é
que quem mexe com **Front End e Back End** é um fullstack. Com o passar dos anos
como desenvolvedor é meio natural após começar por um dos lados você ir aprendendo
como o outro funciona, eu por exemplo comecei como desenvolvedor PHP e hoje sou
focado 100% em Front End, por mais que eu não seja um especialista em Back End os
conceitos que eu sei me ajudam a conseguir resolver problemas nesse lado, não tão
bem quanto como Front End mas consigo.
O que vale se atentar aqui é que algumas empresas esperam que você tenha um
conhecimento também de [Devops] e de [SQL e Banco de dados].
Minha dica aqui é, se você está começando na carreira foque em uma área, estude ela
bastante e conforme for se sentindo confortável e quiser explorar novos temas o
conhecimento vai vindo de forma mais natural, vou até deixar um [post do Guilherme
Silveira sobre como você pode organizar seus estudos].
## Conclusão
Vimos que quem trabalha com sites é chamado de Front End, quem faz aplicativos é um
desenvolvedor Mobile e que o Back End cuida da aplicação que está por trás desses 2
tipos entre outros casos. Vimos que para ser Full Stack pode ser necessário
aprender bastante coisa, e que se você quiser um guia para estudar aqui na Alura a
gente tem diversas formações para poder ti puxar um norte nos estudos.
Estava trabalhando na busca de tópicos para o fórum da Alura. Quando a pessoa

procurar por uma palavra que existe em algum tópico, temos que mostrar esse tópico
para ela. Por exemplo, a pessoa busca por “Java“. Todo tópico que contém **Java**
em seu título deve aparecer.
Uma maneira de implementar isso é **iterar pela lista de tópicos**, isto é,

captamos o texto do usuários e caminhamos por todos os itens de uma lista de
tópicos para verificar se a palavra existe naquele tópico. Utilizando o Python como
linguagem, temos algo próximo a isso:
python
Procurando por “Java”, temos esse resultado:
python
Legal! Conseguimos pegar todas os tópicos que contém a palavra Java, mas qual o
problema do algoritmo que implementamos?
# A complexidade do algoritmo
O algoritmo passa por todos os itens da lista para fazer a busca pela palavra, ele
faz uma [**busca linear**]. Ou seja, se a lista tiver 5 elementos, ele passará
pelos 5, se tiver 20 pelos 20, se tiver um milhão, vai passar por todos os itens,
ufa… O tempo que nosso algoritmo leva para percorrer depende do número de itens na
lista. 5, 10, 15, até **N **itens.
Logo, falamos que esse algoritmo tem **complexidade O(n)**. De fato, é possível que
todos os itens na lista tenham a palavra que estamos procurando, mas o que
aconteceria se apenas o primeiro item tiver a palavra? Mesmo assim, teremos que
percorrer todos os outros itens, apesar deles não terem o que procuramos.
Pensando em performance, esse algoritmo não é tão bom. Estamos em um contexto web
no fórum da Alura. Se a busca demorar muito, afeta a experiência do usuário. Como
podemos criar um algoritmo que consiga descobrir quais itens da lista tem a palavra
que buscamos sem afetar muito a performance?
# O poder dos hashes
No caso, estamos utilizando uma **lista** para guardar nossos tópicos. Outra
estrutura que podemos utilizar são os **conjuntos, ou sets**. Quando estudamos
**estruturas de dados**, uma das primeiras coisas que sabemos sobre eles é que eles
guardam apenas uma ocorrência do item que ele guarda. Ou seja, se declararmos um
conjunto dessa forma:
python
Quantos itens aparecerão quando pedirmos para imprimí-lo?
python
Só aparecem seis itens. Essa é uma das primeiras coisas que aprendemos, mas outra
coisa muito interessante sobre conjuntos é que buscar itens fica muito mais rápido
do que buscar itens em uma lista. Mas por que isso acontece? Para armazenar os
itens, os conjuntos fazem uso de uma função especial, chamada de **função hash**.
A função hash é um algoritmo que pega o item que estamos buscando, ou inserindo no
conjunto, e gera uma representação única para ele. Por exemplo, vamos pegar os
números que usamos. A função hash do número pode ser o próprio número. Isso porque
cada número é único no universo. O número 1 é o número 1. Só o número 1 pode ser o
número 1. Se ele for outra coisa, não é mais o número 1, é outro número.
Neste caso, a função hash devolveria o próprio número que estamos buscando. No
nosso exemplo de buscarmos palavras. Uma função hash que poderíamos utilizar é
pegar a primeira letra da palavra. Por exemplo, Java retornaria J, Python P,
JavaScript J também.
A partir dessa letra, podemos ter **formas mais eficientes** de buscar as palavras
nos itens. Claro, nossos exemplos são bem simples, algoritmos de hash podem ser, e
são, mais complexos que isso. Baseados em diferentes cálculos matemáticos para
realizar o hash.
Estruturas de dados que utilizam hashes são, em geral, mais rápidas de fazer buscas
do que estruturas que não utilizam. No nosso caso, temos várias frases. Quando
alguém buscar uma palavra, temos que retornar os tópicos que contém aquela palavra.
E se utilizarmos a palavra dos tópicos como o item em uma função hash?
# Invertendo a lista
Em uma lista temos a seguinte estrutura: Falamos que na posição 0 está o item 'Como
começar a programar?'.
E se invertemos esse modelo, isto é, falamos que a palavra é a posição e o item

relacionado a essa palavra é uma lista com as posições dos tópicos na lista
original? Por exemplo, para a palavra programar temos a uma lista com o item [0].
Já para a palavra Java temos uma lista com esses itens [4, 5, 6]. Dessa forma,
podemos obter de um modo muito mais rápido os tópicos que estamos procurando, tudo
isso utilizando o poder que os hashes dão para gente. Mas teremos que implementar
essa função de hash na mão?
No Python, assim como na maioria das linguagens de programação, existem os

dicionários, também conhecidos como mapas ou arrays associativos. **Mapas são
estruturas chave e valor**. A **chave** é um item que passou por uma função de
hash, logo, só podemos ter uma única ocorrência da chave no mapa. Logo, podemos ter
um dicionário onde a chave são as palavras que existem nos tópicos, enquanto o
valor seria uma lista com os índices do tópico na lista. No Python, uma das formas
de criar o dicionários é dessa forma:
python
Os dicionários também utilizam de chaves ({ }) para serem criados, porém, diferente
desses podemos passar as chaves e valores na hora de sua criação. O próximo passo é
percorrer os tópicos na lista, como precisamos pegar o índice de cada tópico na
lista, podemos utilizar a **função enumerate()**.
Esta **função construtora** nos devolve um objeto enumerate onde o primeiro

elemento é o índice e o segundo o valor, no nosso caso o tópico:
python
Agora, basta percorrermos as palavras do tópico. Para isso, temos que quebrar o
texto nos espaços **(split())** e checar se aquela palavra já existe no dicionário,
se não existir, adicionamos nessa chave uma lista com o índice, se já existir,
apenas acrescentamos à lista o índice do novo tópico:
python
Você pode estar se perguntando, se saímos de um loop para dois, a complexidade do

algoritmo não aumentou também? De fato isso ocorreu. No nosso caso, para cada item
na lista (N) percorremos suas palavras (N).
Ou seja, temos O(N * N) de complexidade, ou **O(N^2)**. Neste caso, isso ocorreu

pois estamos montando o dicionário. Contudo, nos próximos tópicos, basta pegarmos a
posição na lista (índice) que ele foi alocado e iterar sobre suas palavras
adicionando elas no dicionário. Com o dicionário agora, podemos fazer uma busca
assim:
python
Temos apenas os índices dos tópicos que contém a palavra que buscamos. Basta
pegarmos esses índices e buscarmos nos tópicos:
python
Buscando palavras Esse método que utilizamos para buscar as palavras é chamado de
**lista invertida, ou lista de index invertido (inverted index)**. Ele é um
algoritmo muito utilizado para fazer buscas de palavras, isso porque ele é um
algoritmo muito rápido.
Operação que envolvem dicionários tem **complexidade de O(1)**. Fora isso, quando
nos é devolvido uma lista com os índices dos tópicos, sabemos que aquele tópico
contém a palavra que buscamos, não é necessário ficar checando palavra por palavra
em todos os tópicos.
Esse algoritmo é muito utilizado em **motores de busca**, como o Google, ou então

em ferramentas como o ElasticSearch. Nosso algoritmo no texto ficou bem simples. É
possível aplicar transformações nas palavras como: passar todas as palavras para
letra maiúscula ou minúscula, tirar acentos, plurais, eliminar palavras comuns,
como artigos e pronomes também conhecido como **stopwords** tudo isso a fim de
otimizar o algoritmo.
Aqui na Alura temos uma [**formação de aprendizado de máquina**] que mostra como
fazer algumas dessas transformações.
imagem
As [**práticas de Search Engine Optimization**] (SEO) são fundamentais para dar a

uma empresa a devida relevância em ambiente online. Sem elas, é bem possível que,
mesmo com um conteúdo interessante, suas páginas acabem se perdendo em meio a tanta
informação disponível na rede.
Pense bem: como se diferenciar num meio em que há espaço para todos? Uma
alternativa é considerar uma melhor qualificação nas buscas, pois é por meio delas
que as pessoas costumam chegar aos seus objetivos online.
É por isso que esse tema precisa ser mais bem compreendido. Na prática, o SEO é o
que uma empresa precisa para garantir a adequação aos mecanismos de busca, em
especial o Google. Você sabia que ele reúne [mais de 85%] da audiência entre
buscadores?
Sendo assim, entenda melhor como o SEO funciona e quais são os pontos fundamentais
em relação a essa estratégia!
## Afinal, o que é SEO?
Funciona da seguinte maneira: o Google, o Bing, o Yahoo!, O Duck Duck Go, enfim,
todos os mecanismos de busca trabalham com algoritmos, espécies de robozinhos que
ficam vasculhando a internet para atribuir notas às páginas visitadas. Essas notas
é que darão aos sites o posicionamento nas páginas de resultados das buscas.
Quais são os critérios adotados? [São vários], mas fundamentalmente, eles

consideram a relevância do conteúdo para o visitante do site. Sendo assim, tudo o
que torna a página ou o conjunto delas pertinente para quem a acessa, é considerado
na análise dos algoritmos.
**Search Engine Optimization** (em português, Otimização para Mecanismos de Busca)

é um conjunto de técnicas adotadas para melhorar o seu site em função desses
critérios utilizados pelos robozinhos. Consequentemente, são métodos que farão com
que esse endereço se torne mais relevante para as pessoas e garanta, assim, maior
qualidade para o que se publica na rede.
A prática de fazer link building ― um procedimento para incluir links internos

(próprios)e externos (de terceiros) para melhorar a reputação e a autoridade de um
site ― é tida como uma [**boa estratégia de SEO**]. Ao fazer uso desse recurso,
você contribui para fazer com que sua empresa ganhe destaque no ranqueamento desses
sites de pesquisa.
É importante lembrar que, como a internet é um meio dinâmico, as empresas estão

sempre em busca de aperfeiçoamento. É o caso do Google, que, de tempos em tempos,
apresenta atualizações de seus algoritmos.
O **Google Panda**, por exemplo, foi criado com o objetivo de tornar melhor a
avaliação a respeito da relevância das páginas. Esse recurso tem sido
constantemente atualizado para dar vida ao Panda 1.0, o Panda 3.0 e ao Panda 4.0.
Cada uma dessas atualizações resulta em alterações distintas, visando melhores

práticas na rede. Além disso, a empresa apresentou também o Quality Update e o
Mobile Update. O importante aqui não é saber exatamente como funciona cada uma
dessas atualizações, mas sim que o foco delas está no objetivo final dos mecanismos
de busca: tornar a experiência do usuário a melhor possível.
É por isso que o **Mobile Update** surgiu em função da crescente demanda do público
por páginas capazes de [**facilitar a navegação em dispositivos móveis**]. Essa é a
lógica do SEO e dos mecanismos de busca. Compreender isso é um passo importante
para desenvolver uma campanha de sucesso na rede.
## Onde o SEO pode ser utilizado
O SEO pode ser adotado como recurso para atingir diferentes tipos de metas. Algumas
situações comuns são:
- em casos de sites que contam a audiência para obter lucros com cliques em
anúncios, como portais de notícias que precisam gerar tráfego para tornar mais
visível os conteúdos publicitários disponibilizados por seus parceiros;
- quando prestadores de serviços buscam conversões para seus negócios na rede, via
formulários, e-mail, entre outros;
- em situações em que e-commerces precisam chamar a atenção para seus produtos
(fazendo um trabalho com palavras-chave mais específicas é possível obter maiores
chances de conversão);
- no branding, pois o SEO gera um melhor posicionamento da marca e cria autoridade
em um determinado assunto, fazendo com que a empresa se torne referência no que
faz.
De uma maneira geral, sempre que você precisar tornar seu conteúdo mais visível
para as pessoas, aposte no SEO. Como os algoritmos vasculham toda a rede em busca
de informações relevantes para os usuários que fazem pesquisas na internet, toda
vez que eles chegarem até sua página e identificarem sua relevância, darão a ela
notas altas que serão importantes no ranqueamento dos mecanismos de busca.
É isso o que fará sua empresa ocupar o topo das páginas e ganhar credibilidade
junto ao público.
Quando um usuário procura por uma informação específica na internet e encontra a

solução para o seu problema num determinado site, ele tende a ver esse site de
maneira positiva, podendo retornar sempre que for necessário.
Isso garante uma autoridade que a maioria das empresas ainda não tem e que costuma
se converter em vendas. Exemplos que comprovam isso não faltam. Quando você precisa
de uma solução para sua carreira e percebe que fazer um curso online é a melhor
solução, você prefere aprender com um professor conhecido e que tem alunos
garantindo a qualidade do ensino ou você aposta em um desconhecido?
Em muitos casos, até mesmo o fator financeiro fica em segundo plano diante da
autoridade de uma marca ou serviço. É essa lógica que faz com que empresas consigam
passar anos no mercado como “Top of Mind”, ou seja, aquelas que vêm à mente das
pessoas logo num primeiro momento. Bombril, Brastemp, Coca Cola, todas elas têm em
comum a autoridade no meio em que atuam.
É por isso que é importante saber usar o SEO em função de criar uma presença online
positiva para a sua empresa. No meio digital, é isso que pode diferenciar uma marca
confiável de outra qualquer.
O SEO pode e deve ser usado em meio digital para tornar sua marca visível, mas além
disso, para fazer com que tudo o que diz respeito a ela seja pertinente para as
pessoas certas.
## Importância das estratégias de SEO
Para aparecer no topo das pesquisas, sua empresa tem duas opções: a busca
patrocinada e a orgânica. A primeira acontece quando você paga para colocar links
patrocinados em posições de destaque nas buscas. A segunda acontece naturalmente,
quando o link de sua página ganha as primeiras posições por atender aos critérios
de ranqueamento dos mecanismos.
Embora seja possível obter bons resultados com a campanha de busca patrocinada, é
com a busca orgânica que as pessoas tendem a se relacionar melhor.
Um dos motivos para tanto é que, como os buscadores identificam o conteúdo que é
pago, quando o usuário visualiza na página uma fonte orgânica, ele tende a confiar
mais na credibilidade do conteúdo. Somente em casos em que não identificou soluções
na busca orgânica é que ele vai até os resultados da busca paga.
Isso torna o investimento em SEO ainda mais necessário, pois é ele quem dará à sua
empresa condições para apresentar um conteúdo qualificado para a audiência.
Quando você aperfeiçoa o site da sua empresa em função das exigências dos
mecanismos como o Google, a tendência é que tenha maiores condições para ocupar o
topo das pesquisas.
Esse benefício vai muito além de simplesmente ser o primeiro do ranking. Um bom
posicionamento no Google garante que ao menos [**33% do tráfego**] seja seu de
imediato, simplesmente por ter uma página que aparece em primeiro lugar para as
pessoas.
Isso parece lógico, não? Quantas vezes você acessou o Google para procurar por um
assunto em específico e se concentrou somente no primeiro ou nos primeiros
resultados para escolher a página para acessar? Quantas vezes continuou a pesquisa
até a 10ª, 15ª página?
O fato é que a grande maioria das pessoas instintivamente já confia na qualidade do

trabalho dos algoritmos, pois elas sabem que os primeiros endereços que aparecem no
ranking tendem a ser os mais relevantes.
Na internet, mais do que ter uma solução interessante para o consumidor, é preciso
criar meios para alcançá-lo de maneira eficaz. É nessa lógica que o SEO se
apresenta. Um posicionamento adequado nos mecanismos de busca é o que toda empresa
precisa para fazer com que os clientes apareçam e as possibilidades de vendas
aumentem.
## Benefícios e vantagens
Com o SEO, você consegue aprimorar questões relevantes para os algoritmos dos
buscadores. Entre elas, podemos citar:
### A velocidade de carregamento da página
Nenhum visitante ficará esperando por mais tempo pelo carregamento de sua página do
que ficaria pelo de uma concorrente, ainda que seu conteúdo seja bom e suas
soluções se apresentem como viáveis.
É por isso que a espera para que um site solicitado seja entregue pelo servidor de
hospedagem deve ser mínima.
O grande benefício do SEO nesse sentido é fornecer ferramentas para um bom

desempenho do site. Diante de um consumidor interessado em fechar negócio, isso é
fundamental.
### A navegação no site
O SEO garante também que a navegação seja facilitada para o usuário, o que torna
mais fácil seu processo de conversão.
Imagine um site com bons produtos, mas que peque por apresentar uma linguagem
exageradamente técnica em sua plataforma. Em muitos casos, isso ocorre sem que os
responsáveis percebam, uma vez que a internet abre espaço para diferentes tipos de
empreendedores.
Nesse caso, contar com uma estratégia de SEO permite um direcionamento mais
adequado de questões como a categorização e o uso da informação, tornando a
navegação mais orgânica e intuitiva.
### Taxa de rejeição
A taxa de rejeição é o índice que confere a quantidade de pessoas que saíram de uma
página sem interagir com ela, um problema que certamente todo empreendedor precisa
evitar.
Garantir que o visitante chegue até sua página e se mantenha nela, de preferência
assimilando a informação ali compartilhada, é o que o SEO oferece como benefício.
Dentro de qualquer estratégia de SEO, [**o conteúdo relevante dita as regras**]. De

nada adianta você investir em soluções que potencializem a visibilidade de seu site
na internet sem oferecer ao público algo que lhe interesse nas pesquisas.
É por isso que trabalhar com foco em SEO permite vantagens também na diminuição da
taxa de rejeição. Com ele, você desenvolve conteúdos mais ricos e, assim, mantém o
visitante mais tempo envolvido com seu material.
### Meta tags
As meta tags facilitam o trabalho dos algoritmos. Elas são comandos que informam
sobre a página em questão. Assim, os algoritmos têm um breve resumo sobre aspectos
como o título da página, o que será exibido como resultado das buscas e quais
páginas devem ser indexadas.
Esse tipo de recurso, dentro de uma estratégia de SEO, permite uma comunicação mais
precisa entre o webmaster e os sites de busca.
Entre as mais importantes [**meta tags**] estão:
- Title: responsável pelo título do documento HTML e é exibida no cabeçalho da

página.
- Meta Description: trata-se da descrição do conteúdo que o usuário encontrará ao
acessar a página.
- Meta Keywords: responsável por exibir palavras-chave relevantes de acordo com o
conteúdo descrito na página.
- Meta Robots: orienta os robôs de busca sobre quais informações e como as páginas
devem ou não ser indexadas e utilizadas para encontrar outras páginas.
Quer um exemplo? Sabe aquele texto que o Google utiliza logo abaixo dos resultados
da pesquisa e que serve para tornar mais claro o entendimento a respeito da página
em questão? Essas são as Meta Descriptions. Não é difícil compreender a importância
desse tipo de recurso, não é? Quando ele é bem-feito, a pessoa que faz a pesquisa
tem mais motivos para acessar o site, o que contribui para uma taxa de cliques
elevada.
As metas tags são ferramentas importantes para ajudar o usuário a encontrar com
maior rapidez o conteúdo que procura na internet.
## Mitos sobre SEO
Mas não pense que praticar o SEO é algo fácil. Esse tipo de estratégia exige o
devido entendimento de uma série de questões e ferramentas disponíveis em ambiente
online. Até mesmo por isso é comum ver erros recorrentes que têm a ver com
verdadeiros mitos criados a respeito desse tema. Saiba mais sobre eles.
### Resultados sempre aparecem no curto prazo
Na grande maioria das vezes, para que a campanha seja bem-sucedida é preciso tempo.
Quando você trabalha com palavras-chave menores, as chamadas caudas curtas, tem que
disputar espaço na rede com outras empresas que também investem em SEO. Sendo
assim, para que o seu trabalho apresente resultados, é natural que demore um certo
tempo, pois somente assim você conseguirá se mostrar mais relevante.
Isso não significa que você não conseguirá bons resultados no curto prazo. Ao
investir em palavras-chave de cauda longa, sua empresa consegue especificar o tema
e, assim, diminui a concorrência ao segmentar a mensagem.
Em termos práticos, a palavra “carro” é de cauda curta e menos específica do que

“carro popular nacional”, uma palavra-chave cauda longa que atinge um segmento
muito mais direcionado de mercado.
### Ao chegar no topo, a empresa permanecerá nele
O tópico anterior já explica o por que isso não ocorre. É preciso uma atualização
constante do conteúdo para que ele se mantenha relevante e esteja sempre ocupando
as primeiras colocações na pesquisa. Se ao chegar até o seu objetivo você
simplesmente abandonar o site, ele certamente ficará para trás em pouco tempo.
Se seus concorrentes investem em SEO, eles certamente não sossegarão enquanto não
aperfeiçoarem seu conteúdo para torná-lo mais bem ranqueado.
Esse é um benefício importante desse sistema para o usuário. Se todos os envolvidos

com determinada palavra-chave levarem a sério a busca pelas primeiras posições,
naturalmente é o público quem terá o melhor conteúdo para obter informações.
Por isso, não deixe de manter seu conteúdo atualizado, mesmo depois de chegar ao
topo.
### Palavras-chave não são tão essenciais
É um erro básico acreditar que somente o conteúdo bem desenvolvido pode atribuir à
empresa o posicionamento ideal nas pesquisas. As palavras-chave são a melhor
ferramenta que os mecanismos de busca têm para identificar determinado site como
relevante para os interesses do usuário que faz as pesquisas.
Com o Google Hummingbird, outra [**atualização dos algoritmos da empresa**], esse

processo tornou-se ainda mais sofisticado. Agora o sistema consegue associar
palavras diferentes, mas que dizem respeito ao mesmo tema. Palavras como futsal,
por exemplo, já oferecem resultados para quem busca por termos similares como
“futebol de salão”.
Toda essa sofisticação ainda depende de um direcionamento que o trabalho correto

com palavras-chave permite oferecer.
### Quanto mais links, melhor
O trabalho com **links internos e externos (link building)** é um dos critérios

utilizados por algoritmos dos sites de busca. Entretanto, é preciso garantir que
esse trabalho seja feito de maneira correta, ou seja, com qualidade.
Links que procuram explicar cada passagem do texto e direcionam para assuntos que
em nada acrescentam ao conhecimento do usuário, costumam ser punidos por esses
sites. É bom lembrar que essas ferramentas de pesquisa estão cada vez mais
sofisticadas e as empresas têm investido pesado em soluções contra tentativas de
burlar as regras.
Nesse caso, evite ser penalizado. Use links que sejam, de fato, relevantes para o
conteúdo que deseja publicar e evite exageros.
## Boas práticas de SEO
Para ter um bom trabalho de SEO é preciso estruturar sua campanha. Sem uma boa
estratégia, todo conteúdo produzido trará resultados aleatórios, sendo pouco
viáveis para o sucesso da empresa em ambiente online.
Sendo assim, o ideal é que você comece analisando sua concorrência. Considere o
trabalho com a **análise SWOT** para identificar o patamar em que sua empresa se
encontra em comparação com as demais. Identificando pontos fortes, fracos,
oportunidades e ameaças, você consegue ter um parâmetro para desenvolver sua
campanha.
Feito isso, uma boa maneira para começar a trabalhar com SEO é definindo a persona
para quem sua empresa direcionará sua comunicação. Lembre-se sempre de apresentar
sua mensagem na internet com o foco em solucionar os problemas das pessoas. A
estratégia de SEO depende da identificação do seu público ideal para, somente
então, tornar-se eficiente.
Depois dessa etapa definida, parta para a prática, otimizando seu conteúdo. Comece
com o título. É por meio dele que o seu conteúdo passa a ter maiores condições para
se destacar diante da concorrência. Ele é o primeiro contato do leitor com o seu
material, portanto, quando não está otimizado, tende a ser menos relevante.
Ter exclusividade, impacto, ser curto e [**apresentar a palavra-chave**], são

fatores essenciais para a construção de um bom título, otimizado em SEO.
Da mesma forma, é preciso facilitar a leitura de quem acessa o seu site. Trabalhe
com tópicos e subtópicos. Isso, além de tornar a experiência de quem lê o seu texto
mais agradável, também facilita a compreensão dos algoritmos a respeito do que é
mais relevante no seu conteúdo.
[**Pense também nas imagens**]. Como a lógica dos algoritmos está cada vez mais
centrada na melhor experiência possível do usuário, criar textos com conteúdos
visuais de qualidade também é uma boa prática de SEO.
Cabe, então, a dica: mostre para os robozinhos que a imagem trabalhada tem tudo a
ver com o tema. Transcreva vídeos e infográficos e use palavras-chave, tomando
cuidado para não sobrecarregar a página com um arquivo muito pesado. Evite tornar
seu site lento para também não ser penalizado por isso.
Otimize suas URL’s, inserindo sua palavra-chave nelas. Essa é uma ação que permite
deixar a URL amigável, algo determinante para um bom posicionamento nos mecanismos
de busca.
Você tem muito mais chances de receber o clique em páginas que esclareçam o
visitante a respeito de seu conteúdo do que usando nomes aleatórios. Onde você
clicaria com maior facilidade: em um link com a informação precisa sobre o site e a
página em questão (www.dicasdeseo.com.br/palavras-chave) ou num conjunto de letras
e números sem o menor sentido (www.dicasdeseo.com/2r996y356g04)?
Evite problemas como URL’s longas, concentrando-se em, no máximo, 5 palavras. Se

precisar separar algumas delas, utilize o hífen e não use letras maiúsculas ou
acentos. Pode não parecer, mas tudo isso contribui e muito para o sucesso do seu
conteúdo em ambiente online.
Enfim, com o aperfeiçoamento cada vez mais rápido de procedimentos usados no mundo
digital e o surgimento constante de inovações, é preciso ter ao seu dispor recursos
que garantam a visibilidade necessária no meio digital.
Sendo assim, é importante destacar que,se existe uma maneira racional de atuar
nesse meio e obter benefícios testados e aprovados por especialistas,essa, sem
dúvida, é pelas técnicas de SEO.
Por meio delas, você estrutura sua página de maneira relevante para os interesses
do seu público, ao mesmo tempo em que a torna mais assimilável para os sistemas que
estão o tempo todo trabalhando em busca de sinais de otimização. Na prática, são
duas coisas que se complementam.
Passe a enxergar as práticas de SEO dessa maneira e comece a obter resultados mais
significativos para sua empresa em ambiente online.
Não tem ideia de como classificar cada uma dessas categorias de desenvolvedores?
Aparentemente é algo bem abstrato e difícil de classificar, certo?
imagem
Aproveitando a dúvida do nosso aluno e considerando que essa é uma dúvida que
atinge muitas pessoas, resolvi gravar um vídeo para compartilhar o meu ponto de
vista sobre o assunto, é claro, visando também o que muitas pessoas costumam
definir o que é senioridade em suas respectivas áreas.
Ficou curioso? Então assista o vídeo abaixo:
https://www.youtube.com/watch?v=ezrojsKj4Nw
O mais legal é que é extremamente possível se tornar um desenvolvedor senior. Basta

ir atrás de conteúdo e praticar bastante. Para você que está estudando Java e quer
ir além do básico, temos uma [**formação em Java**], interessantíssimas para quem
quer se tornar senior. O mesmo vale para o desenvolvedor front-end que pode
[aprender diversos assuntos essenciais para se tornar senior].
Nos cursos presenciais da Caelum há diversos cursos avançados onde também é

possível ter o conhecimento necessário para se tornar um desenvolvedor senior. Eu
particularmente [recomendo a formação Java EE] e o [curso de AngularJS para
webapps].
O que achou sobre os pontos levantados para cada uma das categorias de
profissionais? Compartilhe com o seus amigos e veja também o que eles acham a
respeito! :)
imagem
**Você cursa Design e é um dos milhões de jovens brasileiros que estão procurando o
primeiro emprego?** Quer aprender mais sobre ferramentas que possam ajudar a
melhorar seu portfólio, a fim de ficar mais capacitado para o mercado de trabalho?
Então, bingo! Este post tem tudo a ver com você!
Se você não sabe o que é mockup, vamos explicar: em português, essa palavra
significa maquete ou modelo, e serve como molde para a aplicação de uma imagem, em
bitmap ou vetor. Assim, você pode tornar suas criações muito mais realistas. E,
claro, montar um portfólio mais profissional.
Os mockups também podem fazer a diferença na criação de inúmeros projetos, como

design de logotipos, cartazes, revistas, camisetas, bonés e tudo o que você
imaginar. Gostou? Então, confira esta incrível seleção de sites de mockup que
preparamos para você!
## Como funciona um mockup
Há alguns anos, para se testar um produto, era necessário construir um protótipo

físico, com todos os detalhes definidos no projeto. Com o surgimento dessa poderosa
ferramenta, porém, esse cenário mudou.
O mockup possibilita que o projeto seja visualizado minuciosamente, em um ambiente

virtual, em 3 dimensões, com todos os seus detalhes. Isso torna a apresentação
realista e conclusiva, viabilizando os possíveis ajustes, antes do início da
produção.
## AlienValley
O [**AlienValley**][ ]tem mockups de alta qualidade, em arquivos PSD. Além disso,

você pode baixar muitos recursos de design e gráficos para seus projetos. Para
receber os links de download, é preciso inserir seu e-mail.
Alguns conteúdos são gratuitos e outros pagos. De vez em quando, surgem pacotes com
ótimos descontos. Algumas ofertas são temporárias e outras permanentes. Se, por
qualquer motivo, você não estiver satisfeito com os produtos, pode pedir um
reembolso no prazo máximo de duas semanas após a compra.
## Canva
Esse [site] é norte-americano, mas tem versão oficial em português. Oferece uma

grande coleção de mockups e muitos outros recursos, como fontes, fotos,
ilustrações, paletas de cores e templates.
Você pode testar os serviços gratuitamente, por 30 dias, e cancelar seu período de
teste a qualquer momento, sem ser cobrado por isso. O plano custa US$ 12,95 por
mês.
## Dunnnk
O [**Dunnnk**][ ](se escreve assim mesmo, com três “Ns”) também disponibiliza

conteúdo gratuito, e é muito simples e funcional. Com poucos cliques, gera o mockup
final.
Se preferir, você pode comprar a imagem original em PSD, para modificar seu projeto
do jeito que quiser. Há uma grande variedade de mockups de relógios, smartphones,
tablets e computadores, entre outros dispositivos.
## Freepik
Além de mockups, esse [site] oferece recursos gráficos de alta qualidade, como
arquivos PSD, fotos, ícones, ilustrações exclusivas e vetores, entre muitos outros,
em uma única plataforma. Pode ser testado gratuitamente durante sete dias.
Ele tem um modelo de negócios chamado freemium, em que a maioria dos recursos
oferecidos pode ser usada de graça. Por US$ 9,99 mensais, porém, você pode se
inscrever no plano premium e ter acesso a milhares de arquivos.
## GraphicBurger
O [**GraphicBurger**] tem muitos recursos de alta qualidade. Além de mockups, você

também pode baixar arquivos em PSD, efeitos em texto, ícones e texturas, entre
muitos outros itens legais.
Quer ver como fica um logotipo aplicado em [couro]? É agora! O arquivo deve ser
editado no Photoshop e seu tamanho é de 6,7 MB.
## GraphicsFuel
Com recursos gratuitos e pagos, esse [site] oferece mais de 25 milhões de opções de
design. Além de mockups, tem arquivos PSD, efeitos de texto, fontes, fotos, fundos,
gráficos, ícones, kits UI, texturas e vetores, entre muitas outras opções.
Com um dos [**mockups**] oferecidos pelo site, por exemplo, é possível aplicar seu

logotipo sobre uma imagem realista de tecido. Assim, fica sabendo se ele funciona
em produtos com textura similar. O arquivo, editável no Photoshop, tem 55,3 MB.
## Pixeden
No [**Pixeden**], você vai encontrar mockups para cartões de visita, flyers,

folders, livros e muitos outros produtos. Além disso, tem efeitos de texto, ícones,
texturas, vetores e muito mais.
Você pode baixar vários arquivos gratuitos, nos formatos JPG e PSD, prontos para
usar. Ter acesso aos serviços premium e todo o conteúdo do site custa a partir de
US$ 6 por mês.
## Placeit
Muito fácil de usar, esse [site] oferece mockups instantâneos, de smartphones,

tablets e TVs, que dispensam o uso do Photoshop. Basta fazer o upload da sua
criação. O conteúdo gratuito oferece uma pequena quantidade de imagens.
Para usar todo o conteúdo, com uma enorme quantidade de modelos, você precisa
pagar. A assinatura básica custa US$ 29 por mês, com direito a nove imagens de alta
resolução.
## Pixelbbudha
O [**Pixelbbudha**][ ]disponibiliza gratuitamente muitos mockups para camisetas,

flyers, folders, logotipo e smartphones, entre outros produtos. Além disso, tem
efeitos de texto, fontes, fotos, fundos, ícones, kits UI, texturas e vetores.
Todos os arquivos, em PSD, podem ser usados de um jeito simples e fácil. Para usar
todo o conteúdo, com uma enorme quantidade de modelos, você precisa pagar o preço
de cada peça.
## Sketch App Sources
Esse [site] disponibiliza, gratuitamente, mockups de smartphones, tablets, TVs e

muitos outros produtos. Além disso, tem ícones, kits UI, kits wireframe, plugins,
tutoriais e muitos outros recursos de design.
Para usar todo o conteúdo, você precisa pagar o valor de cada arquivo. Eles foram
criados por usuários de todo o mundo. É uma boa maneira de, além de aprender novas
técnicas, conhecer o trabalho de outros [**designers**].
## Vectorilla
Além de mockups, no [**Vectorilla**], você vai encontrar fontes, ícones de vetores

e PNG, papéis de parede e muitos outros recursos de design. Nele, é possível
visualizar como o logotipo que você criou vai ficar em uma textura de [madeira]. O
arquivo deve ser editado no Photoshop e seu tamanho é de 12,4 MB.
É fundamental que você se [**mantenha sempre atualizado**], para se tornar mais

competitivo e desenvolver sua carreira profissional.
E aí, gostou dessas dicas sobre sites de mockup? Então, que tal compartilhar este
post com seus contatos nas redes sociais e espalhar essas informações?
Markdown é um formato de simples de **markup**, isso é, de marcação de texto. A

ideia é marcar um texto informando o que é importante, o que é um tópico, o que são
links e imagens, sem a necessidade de utilizar marcações mais complexas, como o
HTML.
É um formato bastante trivial. Por exemplo, se você escreve uma palavra entre
astericos, ela aparecerá de forma mais enfática, normalmente em negrito:
```
Nosso **primeiro exemplo** de trecho de texto em markdown.
```
Após passar por um processador de markdown, o resultado pode ser o seguinte:
> Nosso **primeiro exemplo** de trecho de texto em markdown.
Você também pode linkar para outras páginas com uma sintaxe relativamente simples:
```
> Aqui tem uma [página com os códigos mais frequentes] do Markdown
```
que fica assim:
> Aqui tem uma [página com os códigos mais frequentes] do Markdown
Apesar de criado por pessoas que trabalham com programação, o markdown hoje aparece
de inúmeras formas e em vários lugares. O [**fórum da alura**] usa Markdown para
você pode criar perguntas e estruturá-las de maneira melhor.
# Editando e visualizando um arquivo markdown
Há varias formas de você testar seu markdown, dependendo da sua necessidade:
## Usando um editor na web
Existem vários **editores** web que você pode utilizar para testaar nesse mesmo
instante o markdown, sem necessidade de instalações:
- [Dillinger]
- [Markdown Preview]
- [MEditor]
## Usando um editor de código
A maioria dos editores de código fornecem maneiras de editar um markdown e

visualizar seu conteúdo lado a lado. Recomendo o VS Code, que pode ser baixado e
instalado aqui.
Há uma (documentação)[https://code.visualstudio.com/docs/languages/markdown] sobre

o Markdown no VS Code e você pode ter uma ideia do funcionamento na animação
abaixo:
imagem
Hoje em dia você encontra muitos sites pela internet, mas você ficaria surpreso se
eu te dissesse que ainda existem empresas que não têm um. Nesse artigo irei te
mostrar se você precisa de um site ou não e o que ele tem que ter para atingir seus
objetivos.
## Mas, pra que serve um site?
Primeiro você deve esquecer que precisa de um só porque todo mundo tem, porque não
é verdade. É preciso pensar no objetivo dele e no motivo para investir no seu
desenvolvimento. Pra mim, investir no progresso do site gerando mais negócios para
empresa é o principal.
Na maior parte das empresas, a busca é pelo crescimento, venda, divulgação para
mais pessoas mais vezes e pelo valor mais alto. Se esse é o caso da sua empresa, o
investimento no desenvolvimento de um site é necessário. Mas preste atenção: **não
é qualquer site que vende não**.
A maioria não vende nada porque as empresas escolhem qualquer um pra jogar um
panfleto online, o que só trará custos e não será um investimento. O site que gera
negócio é o site com um bom investimento e que gera [**ROI**].
## Definindo seu objetivo com S.M.A.R.T.
Tem uma técnica para a definição de objetivos que é muito fácil de fazer e muito
útil, chamada S.M.A.R.T. São cinco passos/itens para delimitar um objetivo. Cada um
deles é um critério que deve ter o seu objetivo:
- **_Specific_** (específico): definir um objetivo específico para seu projeto,

como, por exemplo, “criar um novo canal online para geração de vendas”;
- **_Measurable_** (mensurável): criar um novo canal para geração de vendas não é
mensurável, por isso podemos adicionar “que gere R$100.000 em faturamento”;
- **_Attainable_** (atingível): depois de definir os dois pontos acima, é preciso
avaliar se o seu objetivo será atingível;
- **_Realistic_** (realista): assim, como o ponto anterior, seu objetivo precisa
ser realista também. Os dois pontos variam de projeto para projeto, mas você
precisa estar confiante de que eles irão dar certo;
- **_Time Bound_** (temporizável): em quanto tempo você quer atingir esse objetivo.
Também é variável para cada projeto;
Resumindo, nosso objetivo poderia ser “criar um novo canal online para geração de
vendas que alcance R$100.000 de faturamento em 6 meses com um gasto máximo de R$
10.000”. Aí chegamos em um ponto bem variável:
> Quanto se deve gastar com um site e em qual tipo de site?
O custo vai depender especialmente do nível de complexidade da tecnologia. Quando o

site for básico, tipo o próprio site da [V4 Company], ele é capaz de gerar bastante
receita para vários tipos de negócio. Nesse caso, o custo é bem baixo e dá pra
investir pouco para se concentrar no investimento de [tráfego] para gerar vendas.
## Mas quanto devo investir em meu site?
Caso você prefira investir no desenvolvimento, eu indico que seja no máximo até R$
2.000 com uma mensalidade de R$ 300 para manter suas lead pages no ar.
Caso você escolha inovar, por exemplo, inserindo uma ferramenta com função de
colorir paredes automaticamente quando o cliente insere uma imagem em um site de
tintas. Como o nível de complexidade é maior, implicará custos mais elevados.
Por isso, indicamos que, antes de tomar essa decisão, você pense se essa ferramenta
irá trazer retorno para o seu negócio. O único segmento que na maioria das vezes um
layout simples não funciona é o varejo, o qual quase sempre necessita de um e-
commerce.
Para esse tipo de site, o primeiro ponto que você precisa saber é que você precisa
ter um [ERP] para ter o controle do seu estoque centralizado em um software de
gestão que seja sincronizado ao seu e-commerce.
O erro mais clássico é criar um estoque separado para vender online quando, na
verdade, o objetivo do e-commerce é colocar o que está parado em estoque disponível
online.
## Considerações para o desenvolvimento de um e-commerce
Na hora de contratar alguém para desenvolver o seu e-commerce, escolha uma empresa
que seja focada no desenvolvimento do e-commerce e não uma que também faz e-
commerce, pois esse tipo de site é complexo e exige foco.
Nós da V4 indicamos e trabalhamos com a [Moovin] que, além de ser bastante

eficiente, tem alguns pontos fundamentais:
- **SEO**: quando a plataforma é otimizada para os mecanismos de busca orgânica.

Isso significa que ela irá facilitar que seu site ganhe relevância nos mecanismos
de busca.
- **Integração com ERP**: possibilita integrar o seu site com o sistema de gestão
que você utiliza.
- **Versão Mobile**: o seu site terá uma versão especialmente desenvolvida para
dispositivos móveis, facilitando a usabilidade do usuário e gerando mais vendas.
- **Integração com Marketplaces**: espécie de shopping online onde se vende
produtos de outras lojas e a sua pode vender também.
Os custos de tudo isso vão desde o ERP, implementação da plataforma e da

mensalidade que normalmente é um mínimo mais uma porcentagem sobre as vendas.
Normalmente esse custo é de 2 até 3% do faturamento da sua loja. Após essas
decisões, você vai se deparar com a seguinte pergunta:
> O que um site tem que ter?
Vou enfatizar algumas coisas fundamentais para qualquer projeto de desenvolvimento

de um site:
- **Tráfego**: como você levará acessos para o seu site. Há duas formas, orgânica e
paga. A orgânica é a posição que o seu site fica nos mecanismos de busca. A paga é
ao investir em mídias digitais.
- **Engajamento**: como você envolverá as pessoas com a sua empresa. Aqui você
deverá levar em conta a filosofia “não me faça pensar” na qual o usuário não pode
pensar muito para agir dentro do site.
- **Conversão**: como você irá fazer vendas. A forma mais óbvia é vendendo online
ou pela captação de Leads (oportunidade de negócio, o contato do usuário).
- **Retenção**: como você irá manter os acessos recorrentes, valorizando e
desenvolvendo estratégias para trazer o usuário novamente em outro momento.
Como mencionei as plataformas mais acima, já deixo a minha indicação: o

[WordPress]. É a plataforma de gestão de conteúdo mais utilizada no mundo. Além de
ter um custo de desenvolvimento super baixo, ele tem uma excelente estrutura que
atende todos os requisitos do Google para ficar bem posicionado no mecanismo de
busca.
**DICA**: Caso você queira saber mais sobre Wordpress e outras plataformas, indico
escutar os episódios do [**NerdTech**], que é uma parceria entre a Alura e o Jovem
Nerd, uma maneira fácil e divertida para se aprender esse assuntos complexos.
Depois de desenvolver o site, a mensuração dos resultados é importante. O Google

Analytics dará essas informações, basta instalá-lo. Com elas você saberá o fluxo de
pessoas e como elas estão, e o que é preciso ser feito para aprimorar ainda mais.
Por exemplo: se seu site tem um bom número de acessos e você não está gerando leads
interessados, concluímos que o seu acesso ou é desqualificado ou sua usabilidade
está ruim, não está levando o usuário para tomar a ação que você quer.
A conclusão que eu deixo pra você é que, depois de ler esse artigo, você saberá
tudo o que é crucial antes de fechar o investimento no desenvolvimento do site.
Sei que agora você está preparado para tomar essas decisões com mais segurança.
Caso ainda reste alguma dúvida, entre em contato pelos comentários ou com a V4
[nesta página].
Pouco após entrar na faculdade, começamos a mexer com Java nas aulas de lógica de
programação. Até então, nunca tinha tido nenhum contato com a linguagem, apenas
ouvido falar sobre. Depois de um mês vendo lógica vi que gostava da linguagem e
queria me aprofundar quero me tornar um desenvolvedor Java, mas por onde começar?
## Começando com a base
Apesar das linguagens de programação serem parecidas, todas elas têm suas
peculiaridades, Java não é diferente. Por isso, comecei estudando o [básico da
linguagem, conhecendo as estruturas condicionais e de loops].
Além disso, estudar [orientação a objetos] e aprender conceitos como [herança,

polimorfismo e composição], ajudam bastante no dia a dia. Esses são os conceitos
básicos. Mas como já foi dito, cada linguagem é única.
Logo, o próximo passo é conhecer as particularidades da linguagem. Aprender sobre

[como funcionam as String], as [funcionalidades de entrada e saída de dados], as
[coleções, como listas, mapas e conjuntos], além de [aprender sobre as novidades da
linguagem] é algo de muito valor, já que agrega muito no desenvolvimento.
Legal! Com isso temos uma forte base na linguagem Java, mas será que isso é
suficiente para entrar no mercado? Em muitos casos sim, principalmente quando
estamos procurando estágios. Porém, se estamos almejando um cargo como júnior, é
interessante conhecer mais sobre outros locais do uso da linguagem.
## Começando no mundo web
Hoje em dia, muitos serviços funcionam na internet. A web está em muitos lugares,
por isso, conhecer esse mundo é importante para quem pensa em ingressar no mercado
de trabalho. Logo, se vamos utilizar Java para a web, precisamos conhecer o que a
linguagem nos oferece para tal.
E, no Java, a [base para aplicações web é conhecida como Servlets]. Entender o

ciclo da web e como as Servlets trabalham com ele é um passo muito importante.
Praticamente tudo que funciona no mundo Java para web, roda em cima de uma Servlet.
Utilizando apenas Servlets, já conseguimos escrever sistemas que podem ser
acessados de um navegador, [criar páginas dinâmicas além de muitas outras coisas].
Além da web, é muito comum que no dia a dia salvar informações como dados de
usuários, informações de acesso, entre muitos outros. Portanto, precisamos de um
banco de dados para armazenar as informações. Mas como podemos realizar a
comunicação do banco de dados com o Java?
## Se comunicando com um banco de dados
As Servlets são uma especificação. Isto é, elas definem um contrato de como uma
aplicação que usa Java na web deve funcionar. De uma forma análoga as Servlets,
temos uma especificação que é utilizada para realizar a comunicação com bancos de
dados, a JPA.
Uma especificação é um contrato. Por isso, precisamos de alguma coisa que coloque o
que está neste contrato em prática, ou seja, o implemente.
No caso da [JPA, a implementação mais utilizadas é o Hibernate]. Logo, estudar
Hibernate como a implementação da JPA é algo muito valioso para quem quer entrar no
mercado. Essas tecnologias são, praticamente, o padrão que a indústria usa no dia a
dia quando falamos do mundo Java.
Geralmente, um dos maiores gargalos de uma aplicação é na comunicação como banco de

dados.
Logo, conhecer bem o [Hibernate e a JPA para realizar otimizações] é algo bem
valioso, principalmente, quando pensamos em performance da aplicação. Bacana! Já
conhecemos Hibernate, Servlets, sabemos muitas coisas sobre a linguagem Java.
Conseguimos escrever aplicações bem legais já com essas tecnologias, mas precisa
ser tão trabalhoso? Quando trabalhamos com Servlets puras, realmente é um pouco
trabalhoso criar e manter a aplicação.
Claro que pode acontecer de encontrarmos aplicações assim no dia a dia, as chamadas
aplicações legado. Mas, no dia a dia, não costumamos trabalhar com Servlets puras.
Utilizamos algo que se comunica com a Servlet, dessa forma, não precisamos
trabalhar diretamente com o código da Servlet, mas ainda utilizamos de seu poder.
Mas como podemos trabalhar com Servlets, sem escrever Servlets?
## Conhecendo o Spring Framework
Escrever código de Servlets é algo comum a muitas aplicações. E, como é algo

trabalhoso, foi criada ferramentas para melhorar esse processo. Uma dessas
ferramentas é o [Spring]. Um conjunto de códigos e projetos, que chamamos de
framework, que nos auxiliam no dia a dia do desenvolvimento.
O Spring é um framework muito robusto e utilizado por grandes empresas e

tecnologia, como a Netflix. Com ele, conseguimos agilizar muito no processo de
escrita e códigos Java. Vimos que para desenvolver em Java, seguimos um passo a
passo, mas quando estudamos, as vezes, sentimos falta da prática. Por isso, aqui na
Alura, [pensamos em criar as formações].
## Conhecendo a Formação Java
Uma formação nada mais é do que uma trilha de cursos onde podemos nos tornar
proficiente em uma tecnologia. No caso, criamos a **[Formação Java]**. Nela, você
começará desde o básico com Java.
Conhecendo a linguagem, conhecendo a orientação a objetos, as APIs mais comuns,

além de começar com o mundo web, passando por Servlets e Spring, e no mundo de
persistência de dados com JPA e Hibernate.
[A formação não é formada apenas por cursos, mas sim por diversos outros conteúdos,
como podcasts, posts e lives].
Cada conteúdo tem uma parte no aprendizado e eles vão se complementando e

integrando conforme avançamos na formação. Ao final da formação, você realizará um
projeto.
Isto é, irá colocar em prática tudo que aprendeu nos cursos que estudou. Esse
projeto será revisado por um instrutor ou instrutora aqui da Alura que te passará
um feedback sobre o código que escreveu.
A **retenção de colaboradores** pode ser definida como os métodos adotados pelas
empresas para manter seus colaboradores por mais tempo na corporação.
O mundo não é mais o mesmo, as relações interpessoais mudaram ao longo dos anos, e
com o mundo corporativo não seria diferente. Atualmente, **apenas oferecer um bom
salário não faz com que os funcionários queiram continuar na mesma instituição**.
Reter e manter motivadas as pessoas que trabalham nas empresas são desafios diários
Apesar de ser trabalhoso, os resultados dessa retenção são: maior engajamento e
comprometimento, o que aumenta os resultados da empresa.
Além disso, gera sentimentos como o desejo de **crescer juntamente à organização**,

pois os(as) colaboradores(as) encontram nos propósitos e objetivos da empresa algo
em comum com suas razões e motivações pessoais.
Para os funcionários e funcionárias, **atualmente, não basta apenas fazer o que foi
solicitado por seus gestores, e sim, encontrar razão naquilo, saber o porquê estão
fazendo e conhecer o processo por trás daquele projeto**.
# Como fazê-la ?
Há muitas estratégias alinhadas ao fator financeiro **que auxiliam na retenção

desses talentos**, dentre elas estão:
**Investimento em um processo seletivo mais criterioso:** a **atração de talentos é

o primeiro passo para retenção**. Quando o funcionário vive experiências marcantes
na empresa, quer permanecer nela. Para isso, quando as empresas investem em
recrutar e selecionar os melhores colaboradores, sabem exatamente o que esperar,
como agir e quais os anseios das pessoas que farão parte da corporação;
**Criação de um bom clima organizacional:** fazer com que o espaço seja

colaborativo, com possibilidade de aprendizado constante. É muito importante que o
time não esteja estagnado, mas que aprenda mais a cada dia;
**Investimento no plano de carreira:** muitas pessoas sentem-se engajadas quando

tem uma ideia clara de plano de carreira, pois sabem exatamente por quais caminhos
podem seguir dentro da empresa, seja em sua área de atuação inicial ou não;
**Feedbacks contínuos:** reconhecer os pontos positivos e ajustar pontos de atenção

é muito importante, pois traz alinhamento com expectativas e necessidades da
empresa e pessoas que trabalham nela;
**Flexibilização de horário:** muitas pessoas buscam por empresas que ofereçam

jornadas flexíveis, e sentem-se ainda mais atraídas por essa corporação. Essa
flexibilização cria um sentimento de colaboração e confiança entre o funcionário e
a empresa, melhorando os resultados. Aqui na Alura procuramos flexibilizar os
horários dos colaboradores e percebemos através de feedbacks e entregas que isso é
um diferencial atrativo para reter nossos colaboradores e colaboradoras.
# Adaptando as estratégias à realidade da sua empresa
Como vimos neste artigo, **a retenção de talentos** é muito importante para a
empresa, pois alinha valores pessoais aos corporativos e faz com que o time se
sinta ainda mais engajado, gerando melhores resultados.
Trouxemos algumas estratégias que, alinhadas, podem ajudar o time a criar um

**desejo de permanência na empresa**. Mas, é importante ressaltar que essas
estratégias devem ser alinhadas à realidade de cada corporação.
Por isso, é muito importante que, tanto os gestores quanto os colaboradores,

**conheçam a empresa**, isso ajudará na aplicação desses métodos, tornando-os cada
vez mais assertivos.
# Conheça nossos planos corporativos
Aqui na **Alura** temos [**planos corporativos**] que podem auxiliar a **traçar

estratégias para atrair cada vez mais funcionários em sua empresa**. Além disso, é
possível **extrair relatórios individuais sobre seu time** e **acompanhar seu
desenvolvimento de perto**.
Estava fazendo uma análise das notas dos alunos. Queremos ver como a abordagem de
ensino está influenciando as notas dos alunos. Portanto, vamos analisar as notas de
antes e depois da mudança.
Para fazer essa análise, vamos analisar as notas de uma turma com 21 alunos.
js
O quão bem foi a turma? Isto é, qual a média de notas da turma?
Podemos tirar uma média aritmética simples. Ou seja, somar todas as notas e dividir
pelo número de alunos. Logo teremos:
js
O resultado desse cálculo é `11.51`, aproximadamente. As notas são de `0` a `10`,
então, por que nossa média é `11`?
## Entendendo a média
A **média** é influenciada por todos os valores da amostra. Ou seja, se tivermos

valores muito discrepantes, o valor da média é alterado.
Por exemplo, na nossa amostra de notas, temos uma nota com o valor `100.0`. Por
isso a média está com um valor não tão usual. Esses valores muito discrepantes,
tanto maiores quanto menores, são conhecidos como **outliers**.
Existem muitas maneiras de tratar **_outliers_**. Uma delas é remover o _outlier_.

Em amostras com um grande número de dados isso não tem tantos problemas, já em uma
amostra com pouco dados, como a nossa, retirar um outlier pode causar muito
impacto. Então como podemos resolver esse problema?
Uma forma é checar se aquele dado da amostra está correto. Outra forma é substituir
esse valor pelo valor que mais se repete na amostra, ou então pelo valor da
mediana. Mas o que é a mediana?
## Conhecendo a mediana
A mediana é o valor que está no meio da amostra. Ou seja, ela divide a amostra em
duas partes, onde metade está acima e metade abaixo. De que forma podemos calcular
a mediana?
Uma forma de calcular a mediana é ordenando todos os nossos dados:
js
Agora que ordenamos os dados, precisamos saber qual o dado que está no meio da
nossa amostra. Isto é, no nossa caso temos `21` elementos na amostra. Como é um
número ímpar, basta somar `1` a este valor e dividir por `2`.
Logo, temos a fórmula `(numero_de_elementos + 1) / 2`. Fazendo a conta, veremos que

o valor do resultado é `11`. Portanto, o nosso elemento mediano está na posição
número `11`.
```
---------------------
|Posição | Elemento |
|-------------------|
|1 | 2.9 |
|-------------------|
|2 | 3.0 |
|-------------------|
|. | . |
|. | . |
|. | . |
|-------------------|
|11 | 7.1 |
---------------------
```
A nossa nota mediana é `7.1`. Isso significa que metade dos nossos dados estão
abaixo de `7.1` e metade dos dados estão acima.
Agora que temos a mediana, podemos substituir o _outlier_ com o seu valor. Quando
substituirmos e calcularmos a nova média, veremos que seu valor mudou para `7.09`.
E, calculando a mediana novamente, ela se mantém em `7.1`, **mas isso não é uma
regra**.
A mediana é o elemento do meio. Ela divide nossos dados em duas partes. No nosso
caso, nossa amostra contém um conjunto de dados com um valor ímpar. Mas e se
tivéssemos um valor par? Como é calculada a mediana nesse caso?
### Amostra com valores pares
Para uma amostra com um número par de valores, temos que realizar um passo
parecido, porém, ao invés de pegar o valor central, pegamos os dois valores que
estão no centro. Então nossa amostra terá duas medianas?
Com esses dois valores nós podemos calcular sua média. Essa média dos valores
centrais é a **mediana** da amostra.
Por exemplo, vamos imaginar que temos a seguinte amostra; `1, 2, 5, 7, 9, 11`.
Precisamos dos dois valores centrais. Para isso, podemos utilizar a fórmula
`numero_de_elementos / 2` e `(numero_de_elementos / 2) + 1`.
Ou seja, temos seis elementos. Logo, as fórmulas ficam `6 / 2` e `(6 / 2) + 1`. Com
isso temos como resultado `3` e `4`. Portanto, os nossos elementos centrais são o
terceiro (`5`) e quarto (`7`) elemento.
Realizando o cálculo de média entre eles, obteremos o valor de `6`. Ou seja, nessa
amostra nossa mediana vale `6`.
## Para saber mais
Além da média aritmética que realizamos, existem outras médias. Como, por exemplo,
as **médias geométrica e harmônica**.
Basicamente, a média geométrica vai medir a proporção média de um elemento em

relação ao outro. Já a média harmônica mede a razão entre os elementos.
Pelo fato da média ser muito influenciada por _outliers_, geralmente é comum
utilizar a mediana para fazer comparações entre amostras.
Além da média e da mediana, temos também a **moda**. A moda é o valor que mais se
repete na amostra. Podemos ter distribuições com um valor modal (unimodal), dois
valores (bimodal) e com muitos valores (polimodal). Há também a [média ponderada].
Média, mediana e moda são medidas estatísticas muito utilizadas quando estamos
fazendo análise de dados. Aqui na Alura temos uma [formação de data science]. Nela
você verá muitas medidas estatísticas e aprenderá a utilizá-las para analisar seus
dados.
Além disso, verá também formas de visualizar seus dados. Como usar o `R` para
realizar trabalhos estatísticos e muito mais!
imagem
Quando começamos a lidar com desenvolvimento web, mais especificamente **HTML e

CSS**, é bastante comum que fiquemos presos às ferramentas que já conhecemos e
temos familiaridade.
Porém, isso pode se tornar um problema devido ao grande crescimento da Web e, com
isso, o surgimento de novos problemas e consequentemente novas soluções. Esse é uma
situação corriqueira quando lidamos com unidades de medidas no CSS, pela grande
variedade, acabamos deixando de lado parte das existentes e não utilizamos, de
fato, todo o poder que temos na mão.
Existem algumas unidades que provavelmente você já está acostumado, como o famoso
pixel! Nesse post, abordaremos todas as unidades de medidas presentes atualmente e
como elas podem nos ajudar durante sua jornada como desenvolvedor web. Antes de
prosseguirmos, precisamos entender qual a diferença entre **medida absoluta** e
**medida relativa**.
## Medidas Absolutas
Essas são as mais comuns que vemos no dia a dia. São medidas que não estão
referenciadas a qualquer outra unidade, ou seja, não dependem de um valor de
referência. São unidades de medidas definidas pela física, como o **píxel**,
centímetro, metro, etc...
Essas medidas são fixas e não mudam de acordo com as especificações do dispositivo.
Esse tipo de medida é indicada para quando conhecemos perfeitamente as
características físicas e as configurações das mídias onde serão exibidos nossos
projetos.
> Já lançarei um spoiler aqui para você, será que no "mundo real" conheceremos
todas as informações de todos os dispositivos? Segura esse pensamento!
## Medidas Relativas
Essas são as que normalmente não estamos habituados. Essas medidas são calculadas
tendo como base uma outra unidade de medida definida, como por exemplo
**em** e o **rem** (veremos mais sobre essas duas medidas no decorrer do post). O
uso delas é mais apropriado para que possamos fazer ajustes em diferentes
dispositivos garantindo um layout consistente e fluido em diversas mídias.
Devido ao fato de que essas medidas são calculadas pelo browser baseando-se em
outra unidade, elas tendem a ser bastante flexíveis. Ou seja, podemos ter
resultados diferentes de acordo com o ambiente.
Para começarmos a caminhar pelas medidas existentes, optei por começar pelas
medidas absolutas, uma vez que estamos, normalmente, mais familiarizados com essas.
Como diria meu amigo Flávio Almeida, bem começado, metade feito!
## Medidas absolutas no CSS
### **Píxels (px)**
Provavelmente você já conhece ou ouviu falar desse rapaz chamado Píxel. Píxel nada
mais é do que os pequenos pontinhos luminosos da tela do seu monitor, celular,
televisão, etc... Logo, o píxel é o menor elemento em um dispositivo de exibição!
Essa é uma medida bastante famosa para os web designers, grande parte dos
desenvolvedores web usam o píxel como unidade principal de seus projetos.
Um detalhe que poucos conhecem é que na verdade, o píxel do CSS **NÃO** é realmente
um píxel da tela do dispositivo (hardware), e sim o que chamamos de [**píxel de
referência**] que geralmente é maior do que o píxel real. O que acaba por torná-lo
numa medida abstrata onde é necessário controlar o mapeamento desse píxel de
referência para o píxel do hardware (acontece por debaixo dos panos!).
A definição de píxel de referência no CSS é o ângulo visual(0.0213deg) de um píxel

em um dispositivo com a densidade de 96dpi a uma distancia de um braço do leitor
(28 polegadas), veja na imagem abaixo:
imagem em diversos dispositivos pode parecer atrativa (cuidado com o píxel de

referência!), mas do outro lado, temos consequências negativas quando estamos
lidando com dispositivos de baixa resolução (blurry rendering).
imagem**
A **próxima unidade é Point**. Definitivamente essa unidade é mais conhecida pelos

designers, principalmente os que estudam tipografia.
Essa medida é geralmente utilizada em propriedades relacionadas a fonte do seu

projeto. Sua abreviação se dá com a marcação de **pt** e seu uso não é tão comum,
você provavelmente verá essa unidade muito raramente.
Geralmente espera-se que essa medida seja utilizada em folhas de estilo para
**impressões**, quando se precisa ter certeza do tamanho da fonte utilizada. Não é
recomendada para a estilização em tela!
### **in (inches/polegadas)**

**Polegada ou inch** em inglês é mais uma unidade de medida que conhecemos do mundo
das medidas absolutas - geralmente vemos elas quando queremos comprar uma nova TV
ou monitor , mas essa unidade também existe no mundo Web.
Apesar de existirem, elas não costumam ser utilizadas em projetos, uma vez que não
existem um uso prático para elas (podemos atingir os mesmos resultados utilizando
outras unidades)
### **Centímetro e Milímetro (cm / mm)**
Nós brasileiros, que adotamos o sistema métrico, conhecemos bem essas duas medidas,
que são bastante utilizadas no dia a dia. Apesar de bastante comuns, tanto
centímetro e milímetro são pouco usadas no CSS. Assim como o **pt**, o uso dessas
duas é esperado para folhas de estilo para **impressões** (medidas mais precisas),
evitando que elas sejam aplicadas para exibições em tela.
### **Paica (pc)**
Também uma unidade pouco usada no mundo web, a **Paica** também vem para o CSS
sendo herdada da tipografia. Por não ser uma unidade amplamente conhecida, ela
acaba sendo fadada ao esquecimento, mas é sempre importante conhecermos todas as
ferramentas que estão à nossa disposição. A relação entre as unidades absolutas é:
> `1 in = 2,54cm = 25,4mm = 72pt = 6pc`
## Medidas Relativas no CSS
### **Ems (em)**
Nossa primeira unidade relativa é bastante famosa no mundo CSS. Dificilmente você
achará algum navegador que não tenha suporte para essa medida, que está presente
desde os primórdios. Até para o IE, nós teríamos que usar a versão abaixo da 3.0
para que tivéssemos algum problema.
Esse definitivamente é um dos pontos que fazem o **em** tão popular. O segundo
ponto, com certeza se dá a facilidade de criar layouts fluídos e responsivos.
> Mas como funciona esse tal de **em**?Essa unidade muda para os elementos filhos
de acordo com o tamanho da fonte (font-size) do elemento pai, então vamos lá.
Digamos que temos o seguinte html, me permitindo a licença poética de utilizar a
tag style:
html
Acima, temos uma div pai onde estou definindo um `font-size` de 16px, dentro dessa
div, temos uma única div filha. Como havia mencionado, o tamanho definido para a
fonte impactará no **em** dos elementos filhos.
Nesse nosso caso, para a div mais interna (id=filho), **1em será igual a 16px**,
seguindo a lógica, **2em será igual a 32px** e assim por diante. Podemos colocar
valores como 1.5 também! Nesse nosso caso, **1.5em será igual a 24px** Quando
expressamos tamanhos como margin, padding utilizando **em**, isso significa que
eles serão relativos ao tamanho da fonte do elemento pai.
Portanto, de acordo com o tamanho da fonte utilizada em determinado elemento, os

elementos filhos serão redimensionados de forma a obedecer a referência a esse
tamanho de fonte!
Uma técnica bastante utilizada consiste justamente em fazer uso desse poder do
**em** componentizando nossos elementos. A ideia é que a alteração do tamanho da
fonte do elemento pai faça com que todo o componente se modifique e redimensione
baseando-se nesse novo valor. Você pode dar uma olhada em um exemplo nesse fiddle:
<script async
src="//jsfiddle.net/r0od5zbe/2/embed/js,html,css,result/dark/"></script>
Caso não consiga visualizar o jsfiddle, o link é [**esse**]
Apesar de divertido, o motivo de utilizarmos essa técnica não é para que o usuário
tenha um slider e altere o tamanho da fonte rsrs. Mas sim para facilitar a
manutenção do componente como um todo, sem ter que sofrer alterando valores de
todas as partes do componente. Bem legal né?
O último ponto que devemos nos atentar ao usar o **em** é que quando usamos essa
medida, nós temos que considerar o `font-size` de todos os elementos pai. Por
exemplo, se tivéssemos uma terceira div mais interna no nosso exemplo anterior e
definirmos o tamanho da fonte para **2em**, nesse caso esses **2em seriam 64px**,
uma vez que o font-size do elemento pai foi definido sendo **32px**(2em)! Pegou o
pulo do gato?
Isso tende a se complicar quando estamos falando de 5, 6, 7 divs aninhadas,

provavelmente não será muito divertido calcular isso! Mas a boa notícia é que temos
uma unidade que nos ajuda a resolver esse probleminha.
### Rems (rem, "root em")
O **REM** vem como sucessor do **EM** e ambos compartilham a mesma lógica de

funcionamento (font-size), porém a forma de implementação é diferente. Enquanto o
**em** está diretamente relacionado ao tamanho da fonte do elemento pai, o **rem**
está relacionado com o tamanho da fonte do elemento root (raiz), no caso, a
**tag**.
O fato de que o **rem** se relaciona com o **elemento raiz** resolve aquele

problema que tínhamos com diversas divs (elementos) aninhados, uma vez que não
haverá essa "herança" de tamanhos, lembra?! Ou seja, não precisaremos ter dor de
cabeça tendo que realizar cálculos, uma vez que nos baseamos na tag raiz.
Exemplificando, sabemos que a tag html é a tag raiz de todo documento html. Dito
isso, se definirmos que o `font-size` desse elemento será de 18px, então **1rem =
18px**, **2rem = 36px** e assim por diante... Normalmente os browsers especificam o
tamanho default da fonte do elemento root (raiz) sendo 16px, então guarde isso no
coração! Mesmo essa unidade sendo mais tranquila de se trabalhar, ela não era muito
utilizada para design responsivo, o que de primeira pode soar um tanto quanto
estranho...
O motivo para isso é o suporte para essa medida. O chrome e o firefox suportavam
tranquilamente, assim como o Opera e o Safari, porém, antigamente grande parte dos
usuários utilizavam o IE, mais específicamente o IE 8, e esse browser não lidava
muito bem com os **rems**, isso fazia com que os desenvolvedores precisassem optar
por alguma unidade diferente, em muitos casos, o próprio **em**.
Como disse acima, o valor base é 16px, e isso pode acabar gerando dificuldades para
que encontremos alguns tamanhos padrões que costumam ser utilizados. Por exemplo,
como faríamos para atingir um tamanho de **10px** utilizando **rem**? Precisamos
calcular.
**BASE 16PX**
css
e assim por diante, realmente não são números muito "amigáveis" ou convenientes
Porém, podemos lançar mão de um pequeno truque para nos ajudar (62,5%)
css
Repare que dessa forma, o valor em píxel será sempre o valor definido em **rem**
vezes 10! Fica mais conveniente, concorda?
Apesar de parecer uma boa ideia, devemos ter cuidado com essas abordagens, uma vez
que ela forçará que você reescreva todos os font-size do seu site, então tome
cuidado!
Existe uma terceira visão sobre isso tudo. Essa solução utiliza px, em e rem de
maneira bem definida. A ideia consiste em definir o `font-size` do elemento root em
píxel, módulos utilizando rem e elementos interiores aos módulos utilizando em,
facilitando a manipulação do tamanho global que naturalmente escalará o tamanho
para os módulos (utilizando rem) e esses por sua vez escalarão os elementos
interiores (que utilizam em e referenciam ao elemento pai). Veja um exemplo dessa
abordagem. No console será mostrado o tamanho atual da fonte.
<script async
src="//jsfiddle.net/p78usjfe/9/embed/js,html,css,result/dark/"></script>
Caso não consiga visualizar o jsfiddle, o link é [esse] Perceba como a combinação
dessas medidas pode ser benéfica. O limite é só sua imaginação!
### Porcentagem (%)
Apesar de não ser uma unidade de medida, a porcentagem costuma ser bastante
utilizada quando falamos de layout responsivo e fluido, por isso, não poderia
deixá-la passar.
A porcentagem permite que criemos módulos que sempre vão se readaptar para ocupar a
quantidade especificada. Por exemplo, se definirmos um elemento tendo um tamanho de
**50%**, independente do dispositivo em questão, esse módulo sempre ocupará metade
do espaço que lhe cabe (caso esteja dentro de algum outro elemento).
Veja o exemplo abaixo
<script async src="//jsfiddle.net/2yxo7puj/10/embed/js,html,css,result/dark/"></

script>
Caso não consiga visualizar o jsfiddle, o link é [esse]
Repare que se alterarmos o tamanho da div container, o elemento interior a ela se

redimensionará de forma a sempre ocupar a porcentagem especificada no CSS!
Veja também que o slider está alterando tanto a largura quanto a altura do
elemento, mas se alterarmos cada um separadamente, também funcionará! Visto esse
exemplo, podemos dizer que a porcentagem tem um comportamento um tanto parecido ao
nosso já conhecido **em**, já que ele se relaciona diretamente com o tamanho da
propriedade do elemento pai.
Portanto, ao trabalharmos com a porcentagem, temos o mesmo problema que tinhamos

com o **em**, quanto mais elementos aninhados, mais complicado será de definirmos
exatamente o tamanho, por isso, tenha cuidado quando utilizá-la!
### Ex
Talvez você nunca tenha ouvido falar dessa unidade do CSS, mas ela existe.
Diferentemente da forma como a **EM** e a **REM** funcionavam, essa unidade não se
relaciona com o tamanho da fonte (font-size), mas com qual fonte está sendo
utilizada naquele momento (font-family), mais especificamente ao tamanho do
caractere **x** dessa fonte em questão (x-height).
Como o browser sabe esse valor? Esse valor pode vir diretamente com a fonte, o
browser pode medir o caractere em caixa baixa (lower case) e se esses dois não
funcionarem, o browser estipula um valor de **0.5em** para **1ex**.
imagem o **em** e o **rem** mudam, dessa vez, quando alteramos completamente a

fonte, o **ex** mudará. O uso dessa unidade está mais presente em ajustes
tipográficos, nos dando um controle mais preciso quando o padrão definido para
algumas tags não se adéqua corretamente ao nosso layout.
### Ch
Também uma unidade pouco conhecida, o **ch** (character unit) é definida na

documentação como sendo a "medida avançada" da largura do caractere zero ("0").
Existe uma discussão antiga onde se debateu bastante sobre essa unidade e o que
realmente seria "medida avançada", [você pode acompanhar aqui]. A ideia é que um
elemento com, por exemplo **100ch** de largura poderá comportar uma string de 100
caracteres dessa determinada fonte, caso essa fonte seja monospace (todos os
caracteres têm o mesmo tamanho).
É comum acharmos definições que dizem que a frase acima se aplica para qualquer
fonte, porém isso está errado. Como mencionei acima, a regra de **1ch = 1
caractere** se aplica apenas se a fonte usada for **monospace** (largura fixa).
Fontes com a largura variável, qualquer caractere pode ser mais largo ou menos
largo que o zero ("0"), como podemos ver na imagem abaixo:
imagem obedece a regra acima, porém as outras duas não! O que podemos tirar após
observações é que normalmente **1ch** é 20% - 30% mais largo, porém isso não é uma
verdade absoluta e deve ser observado para cada fonte que você deseja aplicar. Por
isso, tome cuidado com o uso!
### Vw (viewport width)
Essa medida faz parte das medidas mais atuais e do futuro do CSS. Viewport units.
Como escrito no título, **vw** significa viewport width, mas o que é viewport?
Viewport nada mais é que a área visível de uma página web para o seu usuário, essa
viewport pode variar de acordo com o dispositivo, sendo menor em celulares e maior
em desktops.
Antigamente, quando não existiam tablets e celulares capazes de acessar sites,

todas as web pages eram pensadas para a tela de um computador, com tamanho fixo e
design estático. Com a chegada desses dispositivos móveis, essas páginas eram
grandes demais para serem exibidas nesses aparelhos, o que tornava muito difícil a
navegação.
A primeira solução partiu dos browsers desses dispositivos, eles adotavam um

comportamento de retirar o zoom de forma que o site inteiro coubesse na tela do
aparelho,definitivamente não era o ideal, mas uma solução rápida. No HTML5, foi
introduzido uma maneira para que os desenvolvedores conseguissem alterar a viewport
através da **tag**, corrigindo esse problema de usabilidade relacionado aos
dispositivos móveis, mas isso é assunto para outra postagem!
Voltando para o nosso querido **vw**, essa unidade se relaciona diretamente com a
largura da viewport, onde **1vw** representa **1%** do tamanho da largura dessa
área visível. A diferença entre **vw** e a **%** é bem semelhante a diferença entre
**em** e **rem**, onde a **%** é relativa ao contexto local do elemento e o **vw**
é relativo ao tamanho total da largura da viewport do usuário.
### Vh (viewport height)
Essa unidade funciona da mesma forma que o **vw**, porém dessa vez, a referência
será a altura e não a largura. Existem diversos exemplos práticos e interessantes
de uso dessas duas unidades. Você pode ver alguns usos nesse [link], provavelmente
mais para frente postarei alguns exemplos bacanas. Me cobrem!
### Vmin (viewport minimun)
Essa unidade também se relaciona com as dimensões da viewport, mas com um porém.
Anteriormente quando vimos **vh** e **vw** precisávamos escolher se gostaríamos de
nos basear na altura (vh) ou na largura (vw) da viewport.
Diferentemente das anteriores, o **vmin** utilizará como base a menor dimensão da

viewport (altura x largura), vamos ao exemplo.
Imagine que estamos trabalhando com uma viewport de 1600px de altura e 900px de
largura. Nesse caso, **1vmin** terá o valor de **9px** (1% da menor dimensão!),
caso tenhamos **100vmin**, esse será igual a **900px**! Interessante né?
No caso acima, a menor dimensão foi a da largura, porém se tivéssemos 300px para
altura e 1400px para largura, nosso valor de referência seria o 300px! Sempre a
**menor** dimensão!
### Vmax (viewport maximum)
Seguindo a mesma base lógica da unidade anterior, o **vmax** terá como valor de
referência a maior dimensão da viewport. Ou seja, utilizando o mesmo exemplo, se
tivermos 1600px de altura e 900px de largura, **1vmax** será equivalente a
**16px**!
No segundo exemplo ocorrerá a mesma inversão, tendo 300px para altura e 1400px para
largura, **1vmax** será equivalente a **14px**. Dessa vez sempre será a **maior**
dimensão!
## Alerta!!
Na versão 9.0 do IE, o **vmin** foi implementado com um nome diferenciado (vm)
Algumas versões do IE ainda não oferecem suporte para o **vmax**, nas novas versões
isso foi corrigido.
Algumas plataformas como o windows tendem a ser inconsistentes na maneira de como

eles contam o tamanho da barra de scroll dos browsers. (diminui o viewport ou não)
Sempre verifique o suporte dessas medidas, tenha sempre [esse link] no cinto de
utilidades.
## Conclusão
Como podemos perceber, existem várias unidades que podemos utilizar no mundo web,
mas sempre surgem aquelas perguntas de quando tenho que utilizar? Qual a melhor?
etc...
Não existe resposta certa nem errada para essas perguntas, infelizmente não temos
uma regra de ouro para todas as situações. O uso dessas unidades depende de
diversos fatores como equipe, preferência, familiaridade e assim por diante.
Entretanto, é importante que você como web developer tenha todas essas ferramentas
no seu cinto de utilidades já que nunca sabemos quando precisaremos utilizar.
Definitivamente a inclusão das unidades da viewport foram positivas para a web

quando estamos lidando com layout flexível, cabe a você começar a colocá-las em uso
durante seu dia a dia!
No mais, espero de coração que esse post tenha agregado algum conhecimento e
facilitado sua jornada rumo ao saber.
Aqui na **Alura** você pode se aprofundar mais no universo front-end, dê uma olhada
na [**formação front-end!**]
O número de profissionais que optou por assumir a liberdade e os riscos do trabalho

como freelancer [cresceu no Brasil] e por um bom motivo: as empresas estão em busca
do serviço de autônomos criativos e qualificados.
Afinal, o mercado de trabalho brasileiro mudou muito nos últimos anos. Novas
profissões surgiram, e as antigas passaram e têm passado por várias transformações.
Empresas se adéquam às novas tecnologias e transferem suas estratégias
de [marketing] — e muitas outras atividades também — para o ambiente digital.
Profissionais de TI, designers, tradutores e produtores de conteúdo, profissionais

das áreas de marketing, manufatura, administração, finanças e direito são os mais
procurados no país, [nessa ordem]. É um leque de profissões muito mais variado do
que você imaginava, certo?
Para que você fique por dentro das vantagens e dicas para ser um freelancer
capacitado, sendo um profissional mais livre e saltando na frente da concorrência,
fizemos este texto. Leia até o fim e saiba como começar!
## Vantagens, desvantagens e o diferencial competitivo do trabalho freelancer
Converse com qualquer profissional freelancer: pessoas que procuram liberdade no

trabalho, criando sua própria rotina e ganhando por produtividade não costumam se
arrepender de terem escolhido esse jeito de trabalhar. Muitos começam essas
atividades quando estão desempregados e nunca mais voltam à rotina do escritório de
uma empresa, das oito da manhã às seis da tarde.
É claro que a renda do freelancer varia muito conforme a procura pelas suas
atividades, o que pode significar ganhar muito bem em um mês e bem menos no mês
seguinte. Isso torna um bom planejamento financeiro muito importante.
Além disso, profissionais pouco qualificados ou desorganizados não costumam durar

muito no mercado. Se a sua intenção é trabalhar como freelancer, comece a treinar
sua disciplina e organização e, principalmente, invista em capacitação e formação
técnica na área que pretende escolher.
## Os cursos profissionalizantes são uma ótima opção

É claro que a faculdade tem um grande valor no crescimento pessoal e aprendizado
profissional de todos nós. Mas você há de convir que ela oferece uma formação bem
genérica e, sozinha, não prepara um profissional devidamente para o mercado de
trabalho.
Além do mais, enfrentar trânsito, gastar com transporte e alimentação e se deslocar

todos os dias em horário de pico é um esforço muito grande para a maior parte das
pessoas. Algumas, inclusive, moram em pequenas cidades que simplesmente não têm uma
universidade.
Os cursos profissionalizantes, por outro lado, têm uma proposta de conteúdo mais
enxuta, tomam menos horas diárias do estudante e oferecem conhecimento mais
aplicável e com retorno financeiro mais imediato.
Além disso, muitos deles podem ser feitos sem sair de casa. O Ensino a Distância
(EAD) a cada dia se confirma como tendência entre profissionais das mais diversas
áreas que buscam começar uma profissão ou aprimorar seus conhecimentos.
Investir nesses cursos faz muita diferença para o currículo de um freelancer, já

que mostra não apenas que ele adquiriu formação na área em que atua, como também
que tem interesse em se aprimorar e buscar novos conhecimentos.
Esse tipo de curso é a opção preferida das [empresas para oferecer treinamento para
os seus funcionários internos], o que mostra que eles são exatamente o que elas
esperam dos seus colaboradores.
E você, como freelancer, pode ter certeza de que vai ser submetido aos mesmos
critérios de seleção que são utilizados para contratação de funcionários internos
dessas empresas.
## A importância dos cursos específicos e como aproveitá-los melhor
Ainda mais direcionados que os profissionalizantes, os cursos específicos talvez

sejam a melhor maneira de melhorar a qualidade do seu trabalho como freelancer.
Veja por quê:
### Eles ensinam por projeto
**Se forem elaborados cuidadosamente, eles vão ser práticos, ligados a áreas
específicas e moldados para resolver problemas reais do seu dia a dia como
autônomo.**
Mas fica a dica: se optar por um desses cursos, avalie se a estrutura didática dele
é feita por projeto, isto é, se ela busca te ensinar a resolver um problema te
expondo a ele já durante as aulas. Dessa forma, tudo fica muito mais prático, não é
mesmo?
### Eles são específicos e resolvem problemas reais
Um bom exemplo: vamos supor que você queira trabalhar como designer freelancer.
Você tem formação acadêmica na área ou em alguma área relacionada, mas não se sente
pronto para colocar a mão na massa e sair por aí, divulgando os seus serviços e
pegando trabalhos "freela" de banners e cartazes virtuais ou impressos.
**Bom, a primeira coisa a fazer é descobrir de onde vem essa insegurança. Você não
domina os softwares de edição de imagem a ponto de criar rapidamente utilizando-os?
Falta conhecimento sobre alguma área específica, aquela lacuna que prejudica a sua
visão de todo do trabalho de designer? Quer aprender como criar imagens para as
redes sociais, mas não sabe os padrões e formatos requeridos?**
Quando tiver a resposta para essas perguntas, basta começar a investir seu tempo em
cobrir essas lacunas: cursos de [Photoshop], [CorelDraw] ou [InDesign] (dependendo
da sua área de atuação, até mesmo os 3 softwares podem ser úteis), cursos de
[criação de imagens e anúncios para Facebook], produção de [telas para vídeos],
[modelagem 3D], entre outros. Mesmo para um pequeno exemplo como esse, as opções
são inúmeras.
### Muitos podem ser feitos online
E o melhor, com certeza, é adquirir toda essa especialização e conhecimento sem

gastar muito tempo, fazendo cursos de casa mesmo. Bom para quem já trabalha ou
pretende trabalhar como freelancer ou mora em uma pequena cidade e não tem opções
de cursos presenciais como esses.
Ou, ainda, para quem vive em uma grande cidade, mas não está disposto a perder
várias horas do dia — e um bom dinheiro do mês — com deslocamento.
Agora ponha-se no lugar do seu futuro empregador. Se ele tiver a opção de contratar
um profissional freelancer qualificado, com habilidades práticas, vários cursos na
área e compreensão teórica daquilo que faz, por que preferiria empregar um
funcionário interno e arcar com todos os custos que isso acarreta?
Invista na sua carreira freelancer e comece agora mesmo a aprimorar seus

conhecimentos, criar um [portfólio ou currículo virtual] e fidelizar seus clientes,
planejando uma carreira com liberdade de horários e rotina e a possibilidade de
ganhar pela sua produtividade. Tudo isso sem passar a maior parte do dia num
escritório ou indo e voltando dele!
imagem
Para começar a fazer vendas online, uma empresa que fabrica adesivos criou uma
página para pré cadastro de cartão de crédito que contém campos como nome, idade,
endereço, CPF entre outros.
O problema é que alguns cadastros não possuem um formato de CPF válido, isso porque
o campo não possui nenhuma validação. Ou seja, o campo está aceitando não só
números como letras e outros tipos de caractere.
O que vamos fazer é encontrar uma maneira de ajudar o usuário de forma mais clara
possível a preencher o cadastro e garantir a validação no front-end antes que os
dados sejam enviados para o back-end.
## Fazendo verificação do campo com a ajuda do pattern
Atualmente nós temos o seguinte HTML para o preenchimento do CPF:
html
Como podemos notar não temos nenhuma validação, então fica confuso se devemos ou
não colocar ponto ou traço no CPF e pode acontecer do usuário colocar outros
caracteres no campo sem querer.
Para isso evitar que isso ocorra vamos usar o atributo **pattern do HTML5** que nos
permite fazer uso das famosas [**expressões regulares**] que nada mais são que
padrões utilizados para selecionar caracteres em uma string.
Na nossa verificação vamos usar a **lista** `[0-9]`, esse padrão indica que
queremos os números de 0 até 9 e o **intervalo** `{11}`, indicando que temos que
ter um número de 11 dígitos no nosso campo.
Com a adição do `pattern` nosso campo de CPF ficou da seguinte maneira:
html
Com a ajuda do `pattern` e das èxpressões regulares` conseguimos resolver uma

parte da tarefa, agora o que precisamos fazer encontrar uma maneira de formatar o
CPF no padrão que precisamos enviar ao back-end.
## Mais um pouco de Regex
Para começar vamos criar uma função que vai ser responsável por formatar o CPF.
Dentro dessa função vamos ter as variáveis :
- elementoAlvo: responsável pelo parâmetro que vai ser passado na função

- cpfAtual: responsável por capturar os números do CPF digitados
- cpfAtualizado: responsável por receber o CPF formatado.
js
Vamos usar os seguintes recursos das èxpressões regulares` para formatar o CPF:
- O repetidor `{ n }` seu papel é repetir um item quantas vezes que forem preciso.
- O Grupo `( )` seu papel é agrupar itens.
- `\d` que representa o match com todos os números de 0 - 9.
Baseado no padrão normalmente usado para o CPF, nossa expressão ficou assim `/(\
d{3})(\d{3})(\d{3})(\d{2})/`, ou seja, três grupos que recebem três números cada e
um grupo que recebe dois números.
Como já o que já temos nossa expressão, o que vamos fazer agora é utilizar o método
[**replace**] que vai receber dois parâmetros.
O primeiro vai retornar uma nova string no padrão da nossa expressão regular e o
segundo recebe uma função que vai concatenar os pontos e o traço com os essa
string. Por fim a variável èlementoAlvo` recebe o CPF formatado.
js
Por fim adicionamos o evento [**blur**] no nosso input para quando o campo de CPF
perder o foco, a função `formataCPF` ser ativada.
html
Já temos nossa verificação e padronização, agora vamos pensar um pouco no usuário.

Seria interessante o usuário receber um aviso de erro customizado caso digite o
número errado no campo.
## Ajudando o usuário a ser mais feliz =)
A API do JavaScript nos fornece algumas propriedades para trabalhar com

[**validação**], para o nosso caso vamos usar:
- `validity`: responsável por retornar um valor verdadeiro ou falso.
- `patternMismatch`: responsável por verificar o pattern.
- `setCustomValidity`: responsável por personalizar a resposta para o usuário.
Vamos usar o [**eventListener**] para que toda vez que clicarmos no botão de enviar
aconteça uma verificação.
Caso `patterMismatch` não corresponda ao padrão que definimos no `pattern` no

ìnput`, vamos mandar uma resposta customizada para o usuário e desabilitar o botão
de envio para que ele saiba que algo de errado aconteceu, caso contrário o número é
enviado sem problemas.
js
Não vamos abordar nesse post a maneira de fazer o cálculo para saber se o CPF é
válido ou não, felizmente o próprio ministério da fazenda nos disponibiliza o
[**algoritmo**] para lidar com essa situação.
Se ficou interessado em como funciona regex, e quais os casos onde podemos utilizá-
las melhor, aqui na Alura temos um [**curso de expressões regulares**]. Nele, você
verá como expressões regulares, dentre outras muitas coisas.
Veremos nesse artigo, como compartilhar textos e imagens no iOS através da classe
ÙIActivityViewController`.
Estou desenvolvendo um app para o cadastro de alunos. Na tela principal é

apresentado uma lista com o nome e a foto do aluno.
Utilizaremos como exemplo esse app de agenda:
![]
Ao clicar no nome aluno, conseguimos visualizar suas informações:
![]
Nosso objetivo é compartilhar o nome, nota e a imagem do aluno com outros

professores.
Mas como poderíamos compartilhar essas informações rapidamente?
O caminho mais comum, seria o usuário tirar screenshot, recortar a imagem e enviar
por e-mail. Mas, repare que o usuário teria que fazer vários passos até conseguir
de fato compartilhar essa foto.
É muito importante nos atentarmos aos pequenos detalhes que facilitam a vida dos
usuários. Ele quer compartilhar os dados. Portanto, vamos criar um botão para isso.
Vamos utilizar a ÙIActivityViewController`.
Vamos começar, criando uma ação para o botão share:
swift
Esse botão vai, primeiramente, compartilhar o nome do aluno. Por isso vamos extrair
o valor do `textfieldNome`. Em seguida vamos instanciar o
ÙIActivityViewController`:
swift
Repare que ao instanciar o ActivityViewController, podemos passar um array por

parâmetro. Vamos começar passando apenas o nome.
Vamos rodar o aplicativo para testar:
![]
Ao clicar no botão share, conseguimos compartilhar um texto - o nome do aluno.

Vamos clicar na opção de e-mail:
![]
Ótimo, já conseguimos compartilhar facilmente um texto simples.
O próximo passo então é compartilharmos a nota e a imagem. Ou seja, precisamos

passar a foto e a nota para o **UIActivityViewController**:
swift
Agora, rodando o app para testar, temos o seguinte:
![]
Repare que escolhendo a opção e-mail, conseguimos compartilhar o nome, nota e a

foto do aluno.
## Compartilhando informações
Uma de nossas missões com **desenvolvimento mobile** é sempre pensar na

**usabilidade**. Ela é muito importante para reter usuários em nosso aplicativo.
Nesse post, aprendemos a utilizar a classe ÙIActivityViewController` para
compartilhar textos e imagens rapidamente com outros aplicativos.
Aqui na Alura, temos uma [**formação iOs**]. Nela você aprenderá desde o básico da
construção de aplicativos até técnicas avançadas, como sincronização com serviços
web.
Você procura capacitação para o mercado de trabalho, mas tem dúvidas sobre qual
profissão seguir? Está com medo de ir por um caminho com pouca oferta de emprego?
O ramo de tecnologia é sempre uma boa pedida. Existem muitas vagas de emprego
abertas, as empresas sempre buscam profissionais qualificados e esse setor resiste
bem às crises econômicas.
Mesmo quando o país vai mal, as empresas inovadoras de tecnologia acham um caminho
para seguir crescendo e contratando.
A ideia interessou? Que bom! Para ajudá-lo a tomar uma decisão tão importante como
essa, elencamos alguns dos profissionais de TI mais requisitados para 2017. Veja
qual se encaixa melhor no seu perfil profissional. Boa leitura!
## Especialista em UI e UX
Designer de interface de usuário (UI) e designer de experiência do usuário (UX) são
siglas semelhantes e podem até ser confundidas por muita gente, mas é importante
saber qual a diferença entre elas.
UI é aquele profissional responsável por projetar o desenho da interface pela qual

o usuário vai interagir com a empresa. Por exemplo, ele vai projetar o design de um
site ou aplicativo, prevendo quais serão as funcionalidades disponibilizadas para o
cliente.
UX é o profissional que vai além dessa função. É responsável por planejar toda a
interação da empresa com o usuário final. Ele pensa de forma mais global, mais
geral. Por exemplo, ele estuda quais são os serviços ou produtos que a empresa pode
oferecer para que o cliente viva a melhor experiência possível.
Outra função do UX designer é estruturar as formas como a empresa vai oferecer o

produto/serviço ao cliente: inbound marketing, e-mail list, site, etc.
Em linhas gerais, ele atua para aprimorar o relacionamento da empresa com o

cliente. A ideia é entender todas as necessidades dos usuários (até mesmo aquelas
que os próprios usuários ainda nem perceberam) para deixá-los satisfeitos.
Esse nicho de mercado é voltado para funcionários com formação nas áreas de
comunicação, design e arquitetura. Requer conhecimento, principalmente, em
[**ferramentas e softwares gráficos**].
## Desenvolvedor mobile
Com o crescimento acentuado na venda dos smartphones, os brasileiros estão sempre

precisando de novos aplicativos, de novas atualizações e de novas ferramentas
mobile. Dentro desse leque, entram desde apps de notícias, games, bate-papo, e-
commerce e muito mais.
Para dar conta de tanta demanda, as empresas fabricantes de aplicativos precisam

contratar desenvolvedores especializados na área. A função desses profissionais é
programar aplicativos mobile, principalmente para Android e iOS (iPhone).
Os profissionais dessa área são desenvolvedores/programadores, muitos vindos de

cursos técnicos ou de graduações, como ciência da computação e análise de sistemas.
Segundo analistas de recursos humanos, há maior procura do que oferta de
profissionais, por isso o bom profissional consegue emprego rapidamente.
## Desenvolvedor full-stack
Esse profissional é a menina dos olhos do setor de TI.
O que é um [**desenvolvedor**] full-stack, afinal? É aquele desenvolvedor que

domina bem as duas grandes áreas do desenvolvimento: back-end (atua na
infraestrutura de servidores e bancos de dados) e front-end (responsável pela
interface). De quebra, conhece também sobre banco de dados.
Essa característica completa faz do [**full-stack**] um profissional requisitado,

pois transita bem entre as duas áreas e sua visão integradora melhora a
produtividade da empresa.
Para chegar a ser um full-stack, o profissional precisa estudar e trabalhar

bastante, mas vale a pena. Os salários são altos e as vagas de emprego não faltam.
Em geral, os full-stacks vêm de faculdades como engenharia de software ou ciência
da computação.
## Chief Digital Officer (CDO)
Em bom português, **Chief Digital Officer** significa ser o chefe do escritório

digital. É uma profissão recente e que, depois de ganhar força nos Estados Unidos,
chegou ao Brasil. Nasceu para não deixar a empresa para trás no quesito tecnologia.
A missão do CDO é manter a empresa dentro do seu negócio principal e inserir novas
tecnologias que surgem ano a ano. Esse cargo surgiu quando empresas consolidadas
perceberam a dificuldade de aderir a grandes tendências, como Big Data, internet
das coisas e inteligência artificial, e temiam ser superadas pelas rivais.
No Brasil, as vagas em CDO estão aparecendo agora, mas devem crescer muito nos
próximos dois ou três anos. O perfil desse profissional é de alguém que entenda bem
de business, administração, gestão e marketing, aliando essa visão a conhecimentos
tecnológicos.
## Cientista de dados (Big Data)
Você já parou para pensar no volume de informação e dados que estão na internet? As
empresas, sim. Por isso, buscam profissionais que saibam lidar com todo esse
volume. É o cientista de dados.
Esse profissional tem como missão coletar e analisar as informações para, em

seguida, apontar insights que favoreçam a empresa. O cientista de dados, por
exemplo, comprova por números o comportamento que o mercado consumidor terá nos
próximos meses. Um conhecimento que vale ouro para as empresas, pois podem tomar
decisões muito mais assertivas e lucrativas.
O cientista de dados precisa ter formação ampla. Conhecer estatística, dominar

softwares de análise de dados (como o Excel), ser [**criativo**] e entender bem do
mercado em que a empresa atua. Profissionais que dominam linguagens de programação
como Python ou R são diferenciais. O cientista de dados atua em várias áreas, entre
elas finanças, saúde e marketing.
## Gestor de projetos
É um tipo de profissional requisitado por empresas de qualquer setor da economia.

Não é à toa. O gestor de projetos é o responsável por tirar ideias e planos do
papel e convertê-los em algo real, como um produto ou um serviço, por exemplo.
Cabe a esse profissional reunir e gerenciar a equipe, estabelecer

responsabilidades, cobrar resultados e traçar o cronograma da execução, além de
projetar e acompanhar o orçamento. Podemos dizer que o gestor de projetos é o
coração da empresa. Se ele for competente, a empresa vai conseguir colocar seus
planos em prática.
Os gestores de projetos vêm de áreas diferentes, mas em geral saem das faculdades
de administração e engenharia. Além disso, há várias certificações oferecidas pelo
mercado que proporcionam um diferencial ao profissional e abrem portas para o
mercado de trabalho.
Percebeu como há muitas carreiras em TI que você pode seguir? Todas realmente muito
promissoras e, claro, exigem bastante esforço e trabalho.
Siga nossas redes sociais para receber mais conteúdos como este: [Facebook],
[Twitter], [Linkedin], [Youtube].
O Nexmo é uma biblioteca para o Java que vai te ajudar na implementação do 2FA, a
autentição por dois fatores,
Quando um sistema possui informações muito sigilosas, manter somente uma camada de
autenticação se torna um grande risco. Mesmo que tenham sido gerados mecanismos
para criação de senhas fortes, ainda há a possibilidade do usuário cair numa
**Engenharia Social seja por meio de Phishing, Vishing, Keyloggers** ou outros
Malwares que venham a calhar.
Uma das maneiras de tornar essa prática mais difícil é fazer com que o login passe
por dois fatores, onde o primeiro é a senha comum e o segundo é algum objeto
pessoal do usuário seja um cartão magnético, uma chave física ou o próprio
celular.
Dessa forma, mesmo com a posse da senha o invasor não conseguirá entrar pois não
tem posse do tal objeto.
# Arquitetura da Solução
Marcelo trabalha numa fábrica de software voltada para telefonia chamada System of
a Call. Ele acessa a intranet para atender aos chamados mas percebe que há uma nova
atualização: Um Popup é exibido dizendo que as políticas da empresa mudaram e agora
é necessário cadastrar seu número de telefone para fazer o Login.
Ele simplesmente insere seu usuário, senha e telefone e ao clicar em login, é

exibida uma tela pedindo para digitar um código que foi enviado para o seu
aparelho. A nível de teste, ele decide inserir um valor errado, mas o sistema não
permite seu acesso.
Ao optar pelo caminho certo, insere o código que lhe foi enviado. O sistema
confirma a veracidade do código e exibe uma mensagem de que a partir desse momento
todos os logins irão precisar passar por esse processo. Marcelo clica em “OK” e
finalmente lhe é exibida a página dos chamados que ele acessa diariamente.
Nesse exemplo dado é possível visualizar como esse tipo de autenticação funciona na
visão do usuário. A nível arquitetural, chegamos no seguinte modelo abaixo:
imagem
Com a modelagem em mente podemos começar a construir a aplicação.
# Preparando ambiente
Na nossa implementação não iremos criar uma aplicação WEB com Spring, nem iremos
mapear objetos no banco com Hibernate. Para fins didáticos será feito uma aplicação
Console - dessa forma o foco fica no código e não na infraestrutura.
Para enviar uma mensagem ao dispositivo do usuário iremos utilizar uma API do
Nexmo. Será necessário um cadastro na plataforma para testarmos de forma gratuita.
Com isso feito, podemos criar um projeto Maven e incluir a seguinte dependência no
arquivo pom.xml:
xml
Após a IDE baixar a biblioteca e buildar o projeto, iremos criar nossa classe
cliente.
# Do código ao SMS
Dentro de uma classe com o método Main, a primeira coisa que precisamos escrever é
o código responsável por inicializar o nosso cliente. Nele será setado as chaves da
API - que são geradas para cada usuário e podem ser visualizadas na aba de
configuração.
java
A próxima etapa é testarmos o envio da mensagem. Para isso basta utilizar a

**classe VerifyRequest** onde o primeiro parâmetro é o número de telefone que você
usou para se cadastrar no Nexmo e o segundo parâmetro é referente ao nome da sua
empresa.
O método setLength representa o tamanho do PIN que você quer enviar para o usuário
Ele pode ser 4 ou 6:
java
Com a mensagem configurada, agora basta enviarmos a mensagem para o usuário. Para
isso executamos o método Verify, que é responsável por fazer o envio e retornar uma
resposta que será tratada posteriormente:
java
# Validação do Token
A mensagem chegou, o perigo passou? Ainda não... Nossa verificação só estará

completa quando verificarmos que o código digitado pelo usuário é o mesmo que foi
enviado para ele.
A classe VerifyClient possui um método chamado check que recebe o ID da requisição

e o código digitado. Com isso validamos o token verificando o status da resposta:
java
Ao executar o programa, uma mensagem será enviada ao celular do usuário informando

o nome da empresa e o token para validação conforme foram configurados
anteriormente.
imagem
Basta o usuário inserir o código recebido para poder ter acesso ao sistema. Caso
insira um código incorreto, será exibida uma mensagem de erro.
imagem
# Conclusão
A autenticação em dois fatores pode ser um forte aliado em sistemas de informações

críticas. Nada é 100% seguro, mas essa camada dificulta ainda mais a ação de
invasores.
A utilização do Nexmo com o Java fluiu muito bem sendo possível criar uma aplicação
diretamente do Console, o que abre horizontes tanto para a Web quanto para o
Mobile.
O código que acompanha esse artigo pode ser baixado [aqui]. Aproveite para
implementar outras features como, por exemplo, permitir o usuário digitar mais de
uma vez o código caso ele erre na primeira tentativa ou a exibição de um cronômetro
para mostrar o tempo de validação do Token. Existem diversas possibilidades.
Para saber mais sobre programação Java, dê uma olhada na [**Formação Java aqui da
Alura!**]
O que há de mais valioso em uma empresa? Se você falou que são as pessoas, acertou.
Mais especificamente, são as capacidades das pessoas que conseguem empurrar um

negócio para o crescimento: o quanto elas conseguem aprender, colocar o
conhecimento na prática e transformá-lo em um benefício para o avanço da empresa.
## Cultura de aprendizado: por que ela é importante?
Imagine um ambiente de trabalho onde as pessoas estagnam, as tarefas estão

automatizadas, e situações novas – tais como projetos ou mudanças – não são bem-
vindas, pois representam um desafio à ordem já estabelecida.
Sem dúvidas, em uma estrutura desse tipo, as equipes podem passar a se sentir
desengajadas e sem motivação para ir além das tarefas rotineiras dos seus cargos.
Assim, esse ambiente acaba fechando espaço para soluções criativas e inovação que,
em outras empresas, impulsionam os resultados comerciais e o crescimento do negócio
como um todo.
Então, **como criar uma cultura de aprendizado na sua empresa** que a ajude a andar
rumo sucesso?
## A diferença (nada sutil) entre o treinamento corporativo e a cultura de

aprendizado
Várias empresas contratam programas de capacitação para os seus funcionários

pensando no bem-estar da empresa. Os treinamentos pontuais até conseguem resolver
algumas necessidades pontuais, como treinar a equipe em uma nova linguagem de
programação para criar um novo aplicativo, por exemplo.
imagem, como também de episódios do dia a dia: um colega transmitir conhecimento

para outro, determinar um líder para o seu time ou disponibilizar quaisquer
**artigos**, **livros**, **vídeos**, **podcasts** ou **webinários**, com quais os
funcionários possam adquirir algum conhecimento.
## Cultura de aprendizado como função do negócio
Uma cultura forte de aprendizado consegue gerar resultados comerciais ao alinhar as

ações de capacitação com as metas do negócio. Por isso, criamos a [**Jornada Alura
de Educação Corporativa**],que visa apoiar os times no planejamento, na execução e
na multiplicação do aprendizado.
Seguindo os passos desta metodologia, as empresas podem **escalar o processo de

capacitação de forma previsível**. Assim, ao **obter resultados financeiros e não
financeiros** dos programas de treinamento, será possível também preparar o terreno
para a criação de uma cultura forte de aprendizado, que terá como principal tarefa
**multiplicar o conhecimento na empresa** e formar pessoas altamente capacitadas
que podem conduzir o negócio ao crescimento.
Conheça agora a Jornada Alura de Educação Corporativa [nesse post]!
![Cultura de aprendizado]
## Como montar uma cultura de aprendizado forte na sua empresa
Além de **combinar métodos formais e informais para as pessoas ganharem

conhecimento**, é preciso que elas também ganhem o hábito de estudar um pouco todos
os dias.
### Adote o Microlearning
Uma das tendências dos últimos anos para promover o conhecimento dentro do ambiente
corporativo é **deixar as equipes consumirem conhecimentos em doses pequenas e
regulares**.
Por exemplo, um funcionário pode passar uma parte da sua jornada de trabalho
estudando sobre um assunto por sua própria conta, ou até mesmo fazer um curso
online, escolhendo um horário que mais lhe for conveniente.
Desta forma, ele está aprendendo e, ao mesmo tempo, não deixa de estar presente
para exercer as tarefas do seu cargo e discutir novos projetos com a equipe.
Este tipo de aprendizagem chama-se **Microlearning**, e várias empresas estão

adotando essa prática em seus times, uma vez que ela se encaixa com a rotina deles
por sua eficiência.
Além disso, ela ainda promove a aquisição de conhecimento no dia a dia, com
informações disponibilizadas em pequenas porções, sem que seja exaustivo. Conheça
mais sobre o Microlearning [nesse post]!
### Eventos para promover conhecimento
Já os **meetups, ou workshops, organizados na empresa** têm outro papel primordial

na hora de promover a cultura de crescimento constante. Debatendo e compartilhando
ideias, as pessoas costumam absorver muito conhecimento, além de poderem expressar
opiniões e compartilhar experiências pessoais.
As palestras práticas e inspiracionais feitas por colaboradores e para

colaboradores, como a _Google Tech Talks_, são um excelente exemplo de vias
informais para propagar conhecimento, habilidades e comportamentos.
Aqui na **Caelum**, fazemos sessões quinzenais, chamadas _Almoço técnico_. Pedimos

comida juntos e, depois do almoço, assistimos a uma palestra, organizada por um ou
uma colega sobre tópicos interessantes, para então discutirmos o exposto.
### Baixe também o [Infográfico] **5 passos para montar uma cultura de aprendizado
na sua empresa**!
Os temas são diversos e associados tanto ao trabalho como ao crescimento pessoal.

Como somos uma equipe bastante diversa, é muito legal poder ouvir e compartilhar
experiências, e aprender um com o outro.
![Cultura de aprendizado]
### Sem medo de errar
Na **Facebook**, os colaboradores estão incentivados a arriscarem e a errarem. Mais

precisamente, é adotada **uma cultura do avanço**, mesmo que esta venha com um
maior risco.
Uma aprendizagem mais rápida permite também colocar o conhecimento na prática e

**criar produtos de forma mais enxuta**. Assim, ao implementar novas técnicas ou
metodologias, eventualmente, em algum momento, algo pode dar errado.
“_Isso vai acabar com a empresa? Se não, deixe-os testarem aquilo_” exclama Mark
Zuckerberg no podcast _Masters of Scale_.
Uma maior responsabilidade dada aos funcionários pode ser benéfica na hora de
transferir o conhecimento à prática, pois, às vezes, é a falta de incentivos e
apoio da parte da gerência que cria **um vão entre o aprendido e o aplicado**.
Resumindo, pôr a mão na massa sem se preocupar demais com a possível imperfeição do
resultado é algo que possibilita aos colaboradores converterem seu conhecimento em
ações produtivas para a empresa.
## Agora é com você!
**Quer montar uma cultura forte de aprendizado na sua organização**? Baixe o nosso
guia [**As práticas para montar a cultura de aprendizado**] e conheça dicas que
podem converter o ambiente na sua empresa em uma máquina corporativa de
conhecimento.
**Como fazer para atrair esses talentos para a sua empresa?**
Conheça agora alguns pontos-chave que podem agilizar o processo de atração, e

também veja como fazer com que o emprego que você está oferecendo seja a
oportunidade dos sonhos para as pessoas que procura.
## O que querem os profissionais de TI?
Como bem aponta Paulo Silveira no episódio [Seleção e contratação de Times de

tecnologia], do podcast **Hipsters.tech**, mesmo que a remuneração seja importante
– como em qualquer outro emprego –, ela não é o fator mais importante quando as
pessoas decidem se candidatar para uma vaga em TI.
Você talvez já tenha ouvido sobre os benefícios altamente competitivos que os

gigantes da tecnologia, como **Google**, **Facebook** ou **Adobe,** oferecem para
os seus funcionários, como um _shuttle_ com Wi-Fi que transporta as pessoas até o
escritório, o berçário no local de trabalho ou o buffet livre com comidas
saudáveis.
Mas, acho que podemos concordar que empresas de pequeno ou médio porte nem sempre
dispõem de orçamentos para competir com este tipo de vantagens, certo?
imagem, existem mais **vantagens atraentes não financeiras para quem se interessa
em trabalhar nelas**.
Vamos agora mostrar alguns dos fatores cruciais para que a sua empresa também
consiga atrair os melhores talentos para participar do seu processo seletivo e
também para que, depois de escolhidos, fazer parte da equipe pelo maior tempo
possível.
### Desenvolvimento profissional e pessoal
Conforme o relatório [_Global Human Capital Trends 2017_] da Deloitte, o

aprendizado e o desenvolvimento profissional fácil e rápido no trabalho fazem parte
do segundo fator mais importante para os funcionários.
A possibilidade de crescimento não só é um fator determinante na hora de optar por
se candidatar para uma vaga. O estudo [_Growth Opportunities Are Key to Employee
Retention_] ressalta que as **oportunidades de desenvolvimento dentro da empresa
jogam um papel importante na retenção dos talentos**.
É importante manter as pessoas sempre engajadas no trabalho, preparando desafios

para enfrentar e proporcionando opções de aprender algo novo.
A **GetNinjas** é um ótimo exemplo disso: as pessoas, ao se interessarem em fazer

uma mudança de área dentro da própria empresa, ganharam a oportunidade de se
capacitar com cursos online e, depois de aprenderem o necessário para o novo cargo,
fizeram a transição na carreira.
**Conheça o case de sucesso da GetNinjas com os cursos online da Alura**! Para

acessar o material, clique [aqui].
### Inovação e responsabilidade por decisões
Dentro de muitas opções que os profissionais de TI tem na hora de procurar por um

novo emprego, as vagas mais atraentes são as de empresas que trazem algo novo ou
não comum.
A Universum realizou uma pesquisa sobre as preferências no emprego, perguntando aos

estudantes de TI sobre as qualidades de um empregador em potencial. A **inovação**
ficou em primeiro lugar, citada por 65,50% dos entrevistados.
Encorajar as pessoas a tomar decisões sozinhas na hora de desenvolver coisas novas

é prioridade para o Mark Zuckerberg, CEO do Facebook. No podcast _Masters Of
Scale_, ele até brinca: “_Isso destruirá a empresa caso dê errado? Não? Então,
deixe-os testarem aquilo!_”.
![Como atrair e reter talentos em TI]
Também na **Movile**, empresa brasileira responsável pelos aplicativos de sucesso

como iFood ou Sympla, a tomada de decisões e a responsabilidade pelo próprio
trabalho são coisas incentivadas.
Os times na **iFood** são compostos por pessoas com conhecimento variado, chamados
de _squads_, que possuem certa autonomia. Alexis, programador full-stack da iFood,
explica: “_Se algo der errado no nosso trabalho, a responsabilidade é do time.
Claro, temos todo o apoio das pessoas que estão aqui há mais tempo, mas se você é
responsável pelo deploy, isso fica com você_.”
### Opções flexíveis de horário e trabalho remoto
O horário flexível e _home office_ tornaram-se uns dos benefícios não financeiros
mais desejados por pessoas cujas tarefas não requerem presença física na empresa
todos os dias.
A variedade de **ferramentas colaborativas que possibilitam as pessoas a trabalhar

em um projeto juntas sem estar efetivamente presentes** no mesmo local possibilita
repensar o ambiente corporativo.
Em cidades grandes, **a própria locomoção ao trabalho torna-se um horário não

produtivo** e, por isso, a opção de _home office_ ou horário flexível é atrativa.
Da mesma forma, essas alternativas possibilitam, por exemplo, trabalhar sem
restrições para os funcionários que cuidam de seus filhos.
![Como atrair e reter talentos em TI]

A **Elektro**, empresa ganhadora do prêmio _Great Places To Work_ na edição
brasileira, promove uma qualidade de vida com horários flexíveis e valorização da
vida familiar.
“_Clima empresarial excelente, oportunidades de crescimento, boa qualidade de vida

e horários flexíveis. Vale a pena para a carreira._”, avalia um ex-funcionário
anônimo da Love Mondays.
A nova lei trabalhista abre espaço para facilitar essa relação entre colaborador e
empregador. A disponibilização do _home office_ ocasional ou integral pode ser
considerada como uma vantagem competitiva, que destaca a sua empresa ante as firmas
que possibilitam somente o trabalho presencial e sem possíveis mudanças de horário
durante a semana.
### Diversidade de pessoas no ambiente de trabalho
Quando há diferenças de idade, credo, gênero, etnia, educação ou bagagem cultural

no ambiente de trabalho, **as pessoas ficam mais engajadas e dispostas a irem além
de suas responsabilidades formais**, como revela a [pesquisa] do **Harvard Business
Review**.
O ambiente de trabalho composto por pessoas com formações e _backgrounds_

diferentes proporciona um espaço para troca de ideias e conhecimentos, e acaba se
tornando **uma ótima ferramenta para a retenção de talentos**.
Aqui na Caelum, sempre se fala muito dos benefícios que a diversidade traz, pois
cada pessoa enriquece de forma única os projetos desenvolvidos em equipe.
## Atraindo e retendo na área de tecnologia
Ter pessoas altamente qualificadas, ou até reconhecidas pela comunidade da área,

trabalhando para a sua empresa e respirando a sua marca, é uma vantagem competitiva
que consegue **gerar uma imagem atrativa dela no mercado de trabalho,** e assim
fazer mais talentos se interessarem por fazer parte do time.
Nós, aqui da Alura e da Caelum, conhecemos a complexidade do processo, por isso

elaboramos materiais que podem ajudar a sua empresa a ter sucesso com a seleção e a
retenção do pessoal.
**Quer contratar pessoas para os seus times de tecnologia**? Acesse agora o eBook
[Como atrair e reter os talentos em TI: As lições das empresas eleitas como
preferidas pelos colaboradores] e coloque em ação pontos para fazer a jornada
dentro da empresa mais atrativa, desde a contratação até a retenção das pessoas
mais qualificadas profissionalmente – e sempre com um bom _fit_ para o seu negócio.
Além do eBook, que conta com dicas das empresas de sucesso, temos o [Guia prático
para RH], que trata sobre o processo de contratação. Não deixe de conferi-lo
também!
Eu não sei se você já parou para pensar, mas os últimos períodos da faculdade de
Design podem parecer uma véspera de vestibular outra vez. Hoje em dia, a área tem
tantas especializações diferentes que até o melhor aluno fica na dúvida sobre qual
seguir após se formar.
Para ajudá-lo, hoje vamos apresentar uma classe de profissionais muito valorizada,
que vem de uma categoria do Design cada vez mais importante no mercado: o UI
Designer, também chamado por aí de Visual Designer.
## O que faz um UI Designer?
UI é a sigla em inglês para User Interface (Interface de Usuário). Portanto, o UI

Designer é o responsável por criar e desenvolver estes elementos gráficos. No
Brasil, também é conhecido como designer de interface.
### Um pouco de história
Desde o lançamento do Apple Macintosh e do Microsoft Windows, no meio da década de

80, as interfaces gráficas se popularizaram até se tornarem parte de nossas vidas —
você tem uma tela no bolso, uma na sala e aposto que umas cinco no quarto!
Uma interface gráfica é a intermediária visual entre humano e máquina. É a tela de

carregamento pedindo para você esperar, o botão vermelho para você clicar apenas se
tiver certeza ou as informações do banco que você tem que entender sem misturar as
coisas.
Primeiro para computadores pessoais, depois para smartphones, vídeo-games e agora

para realidade virtual, a demanda por interfaces deixou de ser apenas uma
praticidade para se tornar [**indispensável no mercado**].
### Onde o UI Designer entra
Imagine um botão de aceitar na cor vermelha ou um ícone de X para fazer login.

Esses são desastres prontos para acontecer!
A principal tarefa de um UI Designer é desenhar uma interface de forma que ela seja
clara, objetiva e principalmente intuitiva para o usuário.
O papel dele é conhecer padrões de uso da sociedade e costumes subjetivos para

tornar o uso de um aparelho eletrônico tão natural que o usuário nem precise
pensar.
Familiaridade: essa é a palavra-chave para um UI Designer. Pense em como o iOS e o

[**Android**] têm padrões de interface muito parecidos. Apple e Google não fazem
isso por quererem se copiar, mas porque esse padrão se mostrou o mais familiar e
natural para usuários no mundo inteiro.
## Qual a diferença entre UI Designer e UX Designer?
Você já deve ter ouvido os dois termos, mas pode ter dúvidas sobre a diferença
entre Interface de Usuário e Experiência de Usuário. Não se preocupe: é realmente
confuso, até mesmo porque uma área geralmente não funciona sem a outra.
O profissional de UX deve se preocupar com a experiência de uso de uma interface —

a forma como ela guia o usuário, como ele se sente utilizando aquele sistema. Já o
UI Designer é responsável pela forma como a interface é apresentada.
Ele deve se preocupar com as informações para que o usuário não se perca, a
disposição dos elementos, cores e tudo que for necessário para que o usuário saiba
exatamente onde clicar para continuar seu fluxo de experiência.
Sendo um pouco mais romântico com o design, o profissional de UX propõe o

sentimento que ele quer passar em uma poesia, enquanto o UI Designer cria a língua
para que ela seja lida. Interessante, não?
## Qual é a função do UI Designer dentro de uma empresa?
Certo, você entendeu o que é o Design de Interfaces e já está pronto para subir
nesse barco. Mas o que você vai [**encontrar no mercado**]? Como vai ser seu
trabalho no dia a dia? É hora de responder a essas perguntas:
### O papel que você vai desempenhar
O UI Designer pode trabalhar em várias áreas no mercado. A mais tradicional delas,

claro, é fazer parte de estúdios e equipes de design que prestam serviços de
elaboração e produção de interfaces para outras empresas.
Hoje, existem estúdios de design especializados em interfaces para web ou mobile

que estão sempre em busca de profissionais capacitados e criativos.
A grande vantagem de trabalhar nesses lugares é a quantidade de projetos diferentes

com os quais você terá contato, além de participar de um ambiente focado em
inovação.
Mas também é possível ser UI Designer em setores de TI de empresas maiores, com

grande demanda para seus sites, softwares internos e produtos para o público.
Fazer parte do time de empresas desse porte é um grande desafio, mas é também
recompensador pelo aprendizado que o profissional tem em várias áreas além do
design.
### Os softwares que você vai usar
Bom, você já deve estar usando a maioria deles. Photoshop, Illustrator ou Sketch
são todos programas que você já está acostumado e deve continuar usando para criar
interfaces.
Mas para o desenvolvimento da UI, além da parte gráfica existe a organização da

informação, importantíssima para não frustrar seu usuário. Se você já está
cogitando ser um UI Designer, temos duas sugestões a mais para você:
#### Balsamiq
O [Balsamiq] é um software simples para criação de mockups. Ele conta com diversos
elementos de interface prontos que você arrasta e adiciona no seu projeto. É
perfeito para organizar toda a UI rapidamente e testar posições e tamanhos sem
desperdiçar tempo na produção.
#### Adobe XD
O [Adobe Experience Design], apesar de o nome indicar uma vocação mais para UX, é
bastante útil para o UI Designer. O programa ainda está em versão beta, mas já
conta com várias ferramentas simples para não só criar os elementos visuais como
testá-los em forma de protótipo.
## Como está o mercado para o UI Designer?
Tudo bem, captamos seu interesse, mas vamos falar de valores agora? Hoje, o salário
de um UI Designer varia entre 2500 e 4000 reais, mas você pode ser muito mais
valorizado dependendo da sua capacidade. Algumas vagas pedem como diferencial
conhecimentos básicos de front-end para conseguir conversar tecnicamente com o
time, por exemplo.
Como as interfaces se tornaram dominantes, ela se torna cada vez mais um fator de
venda. Hoje elas estão nos carros, nos displays, nos supermercados, e, com o avanço
da [Internet das Coisas], a procura por designers de interface só tende a aumentar.
Portanto, pense na importância que essa profissão terá no futuro. O UI Designer é

essencial hoje e será ainda mais valorizado nos próximos anos. Escolher esta
especialização significa trabalhar em projetos instigantes, desafiadores e
inovadores — uma ligação direta entre tecnologia e humanidade.
imagem
Trabalhar no exterior é um sonho de muitos desenvolvedores. Além de bons salários e

oportunidades de crescimento na carreira, muitos buscam isso pela possibilidade de
conhecer conhecer novas culturas, aprender outro idioma e toda a bagagem que vem
junto com uma experiência internacional.
Felipe, um de nossos ex-alunos, saiu do Brasil para trabalhar na Bélgica. Curioso?

Vamos lá :)
**Nome completo?**
> Felipe Alencar Magalhães.
imagem.
**O processo foi dificil?**
> Foi certamente o processo mais difícil pelo qual já passei. Tive que preencher um
currículo no padrão que o cliente exige, depois realizei conversas por telefone,
exames online, entrevistas pessoalmente no escritório do cliente onde estou alocado
e, durante esta entrevista, tive de responder um questionário técnico, praticamente
um pequeno exame.
imagem. É possível ver pessoas andando sozinhas à noite, mesmo em ruas menos
movimentadas, sem medo de serem assaltadas. O transporte público atende bem e por
um preço muito justo, os preços dos produtos em geral também são bem baratos se
compararmos com o poder aquisitivo no Brasil. De "contras" eu destaco que a cidade
não é das mais limpas da Europa (digo na área Central) e também existe uma certa
quantidade de mendicância aqui, devido ao país ter uma política relativamente
tranqüila para receber imigrantes.
**E o processo de adaptação, foi tranquilo também?**
> A adaptação aqui tem sido muito tranqüila, visto que trabalho em um escritório
que tem funcionários de muitos países. A cidade, no geral, também tem muita gente
de fora, então as pessoas compreendem bem o que é estar num país novo e se mostram
- em sua grande maioria - receptivas e prestativas. Outra coisa à qual tenho
tentado me adaptar são o clima e a variação na duração dos dias e noites também,
aqui venta muito, nos piores dias de inverno, neva, e nos dias mais quentes do
verão a temperatura atinge 30 graus.
> No período mais alto do inverno o dia começa a clarear por volta de 8:30 e
escurece por volta das 17:00, já no verão o sol aparece por volta das 6:00 da manhã
e só se põe cerca de 22:00. A diferença de horário para o Brasil varia: quando
ambos países não estão no horário de verão, a diferença fica em 4 horas; ao iniciar
o horário de verão do Brasil, a diferença diminui em 1 hora; e quando o DST
(Daylight Saving Time) começa aqui, a diferença aumenta em 1 hora. Então o contato
com os amigos e família no Brasil é um pouco diferente: pela manhã o pessoal todo
está dormindo e na hora em que você estiver indo dormir, as pessoas provavelmente
estarão saindo do trabalho. Fatalmente você vai acordar com várias mensagens não
lidas no celular.
**E o salário, é compatível com os daqui?**
> A área de TI possui uma faixa salarial que permite uma vida tranqüila, até porque
o custo de vida é baixo se compararmos ao Brasil (para servir de base comparativa,
antes eu morava no Rio de Janeiro, certamente uma das cidades mais caras do
Brasil). Não espere salários exorbitantes aqui pela Bélgica (e em grande parte da
Europa de um modo geral), aqui a diferença salarial entre profissões que exijam uma
menor formação e a área de TI não é tão alta como no Brasil (o que reflete numa
menor diferença social entre classes).
**E pra arranjar moradia, como foi?**

> Levei menos tempo para encontrar um apartamento aqui do que quando me mudei para
o Rio de Janeiro. Em 1 mês eu já estava de casa nova. A burocracia é um pouco maior
do que no Brasil, pois você tem que contratar um seguro contra incêndio (e furto,
caso queira) e registrar o contrato de aluguel na prefeitura da região onde você
mora. Eu havia iniciado as buscas por apartamentos no Brasil, através de sites de
aluguel de imóveis, mas ao chegar aqui descobri que no cliente onde trabalho havia
uma espécie de "Classificados" interno, onde acabei encontrando o local onde moro
atualmente. Ainda tive sorte de encontrar um apartamento bem novo e em um prédio
com portaria e elevador. A grande maioria dos prédios em Bruxelas não são altos,
têm no máximo 4 andares, sem portaria e elevador.
**O ambiente de trabalho é legal?**
> O ambiente no trabalho é muito bom. A receptividade dos companheiros de

escritório é muito boa, os chefes compreendem as necessidades de se ausentar para
regularizar a sua situação no país (pegar identidade, abrir conta em banco,
requisitar o plano de saúde, procurar móveis, contratar uma nova operadora de
telefonia...).
_Há um diálogo freqüente para manter o feedback entre as camadas do setor de

desenvolvimento, as dificuldades que surgem no meio do caminho são compreendidas
sem problemas e os profissionais são muito abertos a ouvirem opiniões._
![img2]
**Algum curso na Alura que te ajudou diretamente a conseguir essa vaga?**
> Para quem pretende fazer cursos na Alura, eu digo: não percam a oportunidade.
Recrutadores miram muito no que você oferece de conhecimento em seu LinkedIn e ter
uma boa gama de cursos pode ser fundamental para que você seja encontrado e receba
ofertas interessantes.
**E aí, gostou? Se quiser ainda mais dicas de trabalho no exterior, [ouça o podcast
que gravamos junto com o Jovem Nerd]**
**O [Thalles], então aluno do [terceiro curso de C] que explora recursos mais
avançados dessa linguagem, fez uma pergunta interessante no fórum com relação à
parte que tratamos da limpeza da memória no momento da alocação.**
É bem comum que, ao procurarmos informação a respeito de **limpeza da memória**
encontremos posts que indicam três funções diferentes: `memset`, `fflush` e
`setbuf`. Veja aqui como elas são diferentes e para quê usar cada uma delas!
### memset
A razão pela qual usamos o `memset` nesse curso é apenas para termos certeza de que
o pedaço de memória que vamos usar esteja sem "lixo" -- isto é, para que saibamos
que tudo o que tem nessa posição de memória são, no exemplo do curso, zeros:
`memset(&variavel, 0, sizeof(SUA_STRUCT));`
Isso é importante porque se esquecermos de colocar informação nessa variável,

poderíamos, sem querer, usar o lixo que já estava naquela posição de memória e, com
ele, ter resultados bem estranhos.
Pense, por exemplo, em um programa que guardasse a query que você faria para o
banco de dados em uma variável. Você vai precisar criar essa variável e colocar
nela a string da _query_. Aí, por um acaso, aquele pedaço de memória que você
alocou tem um lixo onde vemos os caracteres `kjs83khas; drop database;` bem no
trecho que seria usado como a query. Aí, por um novo acaso, o desenvolvedor esquece
de preencher a memória com a _query_ correta e esse trecho de lixo é rodado.
Sem querer, por uma grande coincidência e azar, poderíamos apagar todas as tabelas
do banco de dados que acessamos! Para garantir que não vamos ter lixo perigoso em
variáveis, usamos o `memset`.
### fflush
A função `fflush` é usada para forçar seu programa a escrever **agora** tudo o que
está no buffer que você passar como parâmetro - por exemplo o da saída de dados
padrão.
As linguagens usualmente criam buffers para atividades que envolvam entrada e saída
de dado (_IO operations_) porque essas são particularmente demoradas e
frequentemente bloqueiam a execução normal do programa, enquanto estão escrevendo
ou lendo.
`fflush(stdout);`
Se você chamar esse código, tudo o que está sendo acumulado para ser escrito quando
o buffer encher será escrito agora. Isso serve, por exemplo, para garantir que toda
a saída do programa será impressa antes do programa terminar!
Lembrando que ele também serve para arquivos ou qualquer tipo de buffer que você
estiver usando.
### setbuf
A função `setbuf`, por sua vez, simplesmente transforma esse buffer que mencionamos
acima para um buffer que determinarmos no segundo parâmetro. Então, quando as
pessoas querem jogar fora tudo o que está em um buffer, elas podem fazer:
`setbuf(stdout, 0);`
Após essa linha, tudo o que estava no buffer foi jogado fora e, assim, o que não
tinha sido impresso não o será mais. A mesma ideia vale para a leitura:
`setbuf(stdin, 0);`
Esse código faria tudo o que está no buffer de leitura da entrada padrão e ainda
**não** foi consumido, ser jogado fora. Agora, seu buffer está limpo para receber
uma nova entrada de dados.
* * *
**Como vimos, faz sentido que sejam três funções diferentes, apesar de todas elas,
de alguma forma, limparem um trecho de memória! Mas, como qualquer dúvida de
especificação, não se preocupe em decorar o que cada uma faz: é mais importante
sabermos que esses três pontos podem ser limpos do que lembrar exatamente qual
função usar!**
Há pouco mais de um ano atrás a Microsoft anunciou o .NET Core, uma reimplementação
do .NET Framework open source e multiplataforma. Com ele, já é possível executar o
ASP.NET no Linux e no Mac.
https://www.youtube.com/watch?v=LrZuJPHdI6Q
Quando falamos em desenvolvimento de software é comum ter diversos ambientes, por

exemplo:
- _Desenvolvimento_
- _Teste_
- _Homologação_
- _Produção_
E outra coisa comum no mundo de desenvolvimento é ter divergências entre estes

ambientes.
Quem nunca ouviu a frase:
> "Na minha máquina funciona!"?
Nesse post vamos abordar o [**Docker**] como uma alternativa para minimizar essa
divergência.
## Mas o que é o Docker?
O Docker é um sistema de virtualização não convencional. Mas o que isso quer dizer?
Em virtualizações convencionais temos um software instalado na máquina _Host_ que
irá gerenciar as máquinas virtuais (ex.: VirtualBox, VMWare, Parallels e etc...).
Para cada máquina virtual temos uma instalação completa do S.O. que queremos
virtualizar, além de ter o próprio hardware virtualizado.
Se por exemplo eu precisar de uma biblioteca comum para todas as máquinas virtuais,
preciso instalar em cada uma delas.
O Docker usa uma abordagem diferente, ele utiliza o conceito de container. Como
assim [**container**])?
## Compreendendo o conceito de containers
Se pensarmos em transporte de cargas, container foi uma revolução nessa área. Pois
antes deles o tempo de carregar e descarregar um navio era gigantesco e o trabalho
era feito manualmente. Sem contar perdas (devido a quebras ou deterioração), desvio
e outros problemas.
Com a chegada dos containers foi possível transportar mercadorias de uma forma
segura, de fácil manipulação e com pouco, ou nenhum, trabalho braçal no
carregamento ou descarregamento. E é justamente isso que o Docker tenta fazer com
nossos softwares.
## Ganhos ao usar containers do Docker
Imagine nosso software como uma mercadoria a ser transportar como por exemplo, do
ambiente de _Desenvolvimento_ para _Produção_.
Para fazer isso precisamos garantir que nosso ambiente de _Produção_ tenha todos os
pré-requisitos instalados, de preferência uma versão do S.O. parecida com a do
ambiente de _Desenvolvimento_ entre outros cuidados que devem ser tomados
(relacionados a permissionamento, serviços dependentes e etc...).
Com o Docker temos um container com nosso software. Esse container é levado inteiro
para o outro ambiente.
Com isso não precisamos nos preocupar com pré-requisitos instalados no outro
ambiente, versão do S.O., permissionamento e se quisermos podemos ter containers
para os serviços dependentes também. Dessa forma minimizamos muito a divergência
entre os ambientes.
## Mas como o Docker faz isso?
Essa ideia de container já é bem antiga e a princípio o Docker usava internamente

um projeto chamado [**LXC**] (Linux Container).
O projeto LXC usa por baixo dos panos diversas funcionalidades presentes no Kernel
do Linux. Abaixo vou listar algumas dessas funcionalidades:
- **chroot** - Reponsavel por mapear os diretórios do S.O. e criar o ponto de

montagem (/, /etc, /dev, /proc entre outros).
- **cgroup** - Reponsável por controlar os recursos por processo. Com ele podemos
por exemplo limitar o uso de memória e/ou processador para um processo específico.
- **kernel namespace** - Com ele podemos isolar processos, ponto de montagem entre
outras coisas. Com esse isolamento, conseguimos a sensação de estar usando uma
máquina diferente da máquina host. Pois enxergamos somente o ponto de montagem
especifico e processos especificos, inclusive nossos processos começam com PID
baixo.
- **kernel capabilities** - Entre outras coisas, conseguimos rodar alguns comandos
de forma privilegiada.
## Mão na massa
Agora que temos uma noção do que é e para que serve o Docker, vamos fazer o
download da ferramenta e começar nesse mundo de containers.
### Instalando o Docker
Atualmente Docker está disponível em duas versões [Docker Community Edition(CE)] e

[Docker Enterprise Edition(EE)].
Em ambas as versões temos acesso a toda a API, basicamente a diferença entre as

duas versões é o perfil desejado de aplicações. No EE temos um ambiente homologado
pela Docker com toda infraestrutura certificada, segura pensada para o mundo
enterprise. Já na versão CE podemos chegar ao mesmo nível que EE porém de uma forma
manual.
Nesse [link] você pode encontrar as distribuições para downloads em cada sistema
operacional disponível e os passos para instalação.
Feito a instalação, execute esse comando no terminal `docker --version`. Se a

instalação ocorreu com sucesso deve ser impresso algo semelhante a isso `Docker
version 17.03.1-ce, build c6d412e`.
### Imagens
O Docker trabalha com o conceito de images, ou seja, para colocar um container em

funcionamento o Docker precisa ter a imagem no host.
Essas imagens podem ser baixadas de um repositório (a nomenclatura para esse

repositório é _registry_) ou criadas localmentes e compiladas. Esse é o [link] para
o registry do Docker.
Nesse registry podemos ter imagens oficiais e não oficiais. Além de podermos criar
nossas próprias imagens, também é possível fazer upload dela em um registry.
#### Baixando Imagens
Para baixar uma imagem podemos usar o comando `docker pull` e o nome da imagem que
queremos baixar. Vamos baixar a imagem do _Ubuntu_, para isso execute o seguinte
comando no terminal: `docker pull ubuntu`.
\[caption id="attachment_7091" align="aligncenter" width="750"\]imagem.
### Executando Containers
A partir da imagem podemos iniciar quantos containers quisermos através do comando

`docker run`.
Para acessarmos um terminal do _Ubuntu_ podemos usar o comando `docker run -i -t

ubuntu` ou `docker run -it ubuntu`. O parâmetro `-i` indica que queremos um
container interativo, o `-t` indica que queremos anexar o terminal virtual `tty` do
container ao nosso host.
### Listando containers em execução
Para ver os containers em execução podemos usar o comando `docker ps` (em outro
terminal ou aba), e ele exibirá um retorno parecido com esse:
imagem.
### Removendo containers
Para remover o container podemos usar o comando `docker rm` e informar o id do

container ou o nome dele. Para nosso caso poderíamos executar o comando `docker rm
43aac92b4c99` ou `docker rm dreamy_bassi` para remover o container por completo.
Caso tenhamos a necessidade de remover todos os container (em execução ou

encerrados) podemos usar o comando `docker rm $(docker ps -qa)`. A opção `-q` do
comando `docker ps` tem como saída somente os ids dos containers, essa lista de ids
é passado para o `docker rm` e com isso será removido todos os containers.
Só será possível remover um container caso o mesmo não esteja em execução, do

contrário temos que encerrar o container para removê-lo.
### Como são feitas as imagens?
Nesse momento podemos pensar que o Docker é meio mágico (e **é**...kkk). Dado uma
imagem ele pode rodar um ou mais containers com pouco esforço, mas como são feitas
as images?
Uma imagem pode ser criada a partir de um arquivo de definição chamado de

`Dockerfile`, nesse arquivo usamos algumas diretivas para declarar o que teremos na
nossa imagem. Por exemplo se olharmos a definição da imagem do _Ubuntu_ podemos ver
algo semelhante a isso:
shell
Para ver o Dockerfile completo consulte [aqui].
Com um arquivo `Dockerfile` podemos compilá-lo com o comando `docker build`. Ao

compilar um arquivo `Dockerfile` temos uma imagem. Mas isso é um assunto para um
próximo post.
Não deixe de conferir nosso curso de [docker] na **Alura**.
Nesse artigo vou mostrar como funciona o operador de igualdade no **Python** e como
alteramos seu comportamento, controlando mais nosso código.
imagem
Tenho um sistema em Python que armazena os filmes que eu tenho em uma **lista**,
para organização, com uma função que pega todos os filmes e retorna uma lista com
eles:
python
Vamos ver como ficou:
python
Ok, temos nossa lista de filmes!
Depois de um tempo, queria descobrir se eu tinha um filme. Como podemos fazer isso?
## Comparando objetos com o operador ==
Para descobrir se eu já tenho um filme, criei uma função que verifica se o filme
que eu quero saber está na nossa lista de filmes:
python
Rodamos nosso código e esse foi o resultado:

python
Ué! A gente já viu que o filme A Teoria de Tudo está na nossa lista, então o que
está dando errado?
Sabemos que o operador `==` funciona bem para **números e strings**:
python
O resultado:
python
Mas então por que ele não funciona como queremos com nossa classe `Filme`?
## Como o Python compara objetos?
A questão é que o Python não sabe como deve comparar os objetos de tipo `Filme`
quando utilizamos o operador `==`. Que valor deve ser comparado? O titulo? O
diretor? E de que forma? O Python não sabe!
Com essa dúvida, o Python opta por não verificar valor nenhum, mas sim a
**identidade** dos objetos. Isto é, ele checa se as variáveis em comparação apontam
para o mesmo objeto na memória. Podemos verificar a identidade de um objeto através
da função **id()**:
python
O resultado será parecido com esse:
python
Repare que, de fato, os dois valores de identidade são diferentes! Se indicássemos

que a variável `b` aponta para o objeto da variável à`, o resultado seria
diferente:
python
Dessa vez:
python
Isso ocorre porque, nesse caso, as duas variáveis apontam para o mesmo objeto, ou
seja, possuem a mesma identidade:
python
O resultado:
python
Vamos ver como isso funciona com os números inteiros e as strings que testamos lá
atrás:
python
E o resultado:
python
Bem, os números têm identidades diferentes, enquanto as strings apresentaram
identidades iguais. Isso significa que a comparação `==` com strings compara o
ìd`, e com números inteiros não? Não exatamente…
## Como o Python compara tipos primitivos?
De fato, os ids eram os mesmos com as strings, mas, mesmo assim, não era isso que
estava sendo comparado. **Os tipos primitivos no Python já têm implementado
nativamente suas próprias maneiras de se comparar**. No caso do int e da string, o
que se compara são seus valores.
Como podemos mudar esse comportamento padrão do `==`, então? Afinal, comparar o id
dos objetos não é o que queremos! Precisamos, de alguma forma, basear nossa
comparação em algum atributo do `Filme`.
Quem vem de outras linguagens de programação, como Java, já deve conhecer métodos
como o **[equals()]**, que pode ser sobrescrito para ter o comportamento alterado.
Como isso funciona no Python?
## Conhecendo a rich comparison
No Python temos como implementar algo similar ao èquals()`, mas ainda mais
poderoso - a comparação rica, ou, como é tecnicamente conhecida, **rich
comparison** . Com ela, podemos definir os seguintes métodos de comparação em uma
classe:
- `__eq__()`, chamado pelo operador `==`

- `__ne__()`, chamado pelo operador `!=`
- `__gt__()`, chamado pelo operador `>`
- `__lt__()`, chamado pelo operador `<`
- `__ge__()`, chamado pelo operador `>=`
- `__le__()`, chamado pelo operador `<=`
No nosso caso, como estamos tratando de **comparações de igualdade**, focaremos no

método `__eq__()` (mas é importante notar a possibilidade de implementação de todos
os tipos básicos de comparação!).
Precisamos, primeiro, saber o que queremos que seja comparado. Como precisamos que
a comparação foque em algo único de cada filme, usaremos o próprio título. Então
vamos implementar:
python
Agora que aplicamos isso ao nosso código, vamos tentar procurar um filme em nosso
acervo novamente:
python
Dessa vez:
python
Certo!
## Simplificando nossa verificação com o operador ìn`
Podemos, ainda, simplificar o código em nossa função `tenho_o_filme()` utilizando o

operador **in** para verificar se o filme já está na lista, já que este operador
também se baseia no retorno de `==`:
python
## Peculiaridades da rich comparison
Há alguns aspectos interessantes de nosso código que valem a pena destacar. Em

primeiro lugar, repare que não implementamos o método **__ne__()**, relativo ao
operador **!=**. Mas o que acontece, então, se tentarmos usar esse operador?
A partir do Python 3, o operador `!=` retorna automaticamente o inverso do retorno

do método `__eq__()`, se o método `__ne__()` não tiver sido implementado.
Apesar disso, **se sua classe herdar de outra em que o método `__ne__()` é definido
(como é nos tipos primitivos), o comportamento do `!=` se baseará no que é
especificado nesse método, não no inverso do `__eq__()`!**
Por conta disso, **é recomendável sempre declarar o método `__ne__()` quando
quisermos implementar o `__eq__()`**, tanto pela compatibilidade com o Python 2
(que sem esse método vai comparar os ids), quanto para evitar possíveis problemas
em nosso código.
Outro aspecto interessante de nosso código é que **optamos** por retornar um valor
boolean. Sim, optamos!
A rich comparison te permite um retorno de qualquer tipo. Isso significa que uma
comparação do tipo à > b` não precisa, necessariamente, nos devolver um boolean,
mas **pode devolver** **qualquer coisa que o desenvolvedor implementar.**
Em geral, optamos por retornar um boolean, mas há grandes e importantes projetos

que alteram esse comportamento, como o **[SQLAlchemy]**, que [usa essa feature para
facilitar a criação de queries SQL], e até a biblioteca **[numpy]**, [inspiração
para a criação da rich comparison].
## Conclusão
Nesse post, aprendemos a implementar métodos de comparação para nossas classes no

Python utilizando a técnica de comparação rica. Agora entendemos como funcionam os
operadores `==`, `!=`, `>`, `<`, `>=`, `<=`.
E aí? Agora não teremos problemas com comparações entre objetos que nós mesmos
implementamos no Python! Se quiser se aprofundar mais na linguagem e conhecer
outras features dela, dê uma olhada na nossa [**formação de Python para Web**]!
Para buscar um arquivo utilizando o terminal, basta pedir para ele procurar
(**find**), em todo meu sistema(**/**), algo que contenha o nome (**-name**) que
queremos.
Preciso desses arquivos rápido e tenho apenas o terminal em mãos…
## Usando o find para achar arquivos
Eu sei que o nome dos arquivos contém `pagamentos` então é só acrescentá-lo ao

comando.
`find / -name pagamentos`

imagem, sem se importar com o maiúsculas e minúsculas (`-iname`), o arquivo que
comece com `pagamento*` seguido de qualquer coisa".
O asterisco indica que o nome pode ser seguido de qualquer coisa, sejam espaços em
branco, outras palavras, letras, números …
imagem um arquivo com o nome que queremos. Por exemplo: `pagamentos`
`locate pagamentos`
imagem e nos mostra os resultados. Ao contrário do `find` que faz uma varredura em
todo o sistema buscando o arquivo.
Repararam que utilizando o `locate` apareceram outros resultados que continham

`pagamentos` no nome? Isso acontece, pois por padrão o `locate` já usa asteriscos
no começo e no fim da string de busca, procurando em todos os lugares onde a
palavra se encontra.
Esse comando equivale a `find / -name *pagamentos*`:
imagem se as letras estão em caixa alta ou baixa.
`locate -i pagamentos`
![]
E novamente ele nos retornou a localização de nosso arquivo, não apenas de um, mas
de todos que continham a string de busca no nome.
Agora, que tal fazer um teste? Vamos criar um arquivo de texto comum em qualquer
lugar chamado `teste.txt`. Depois usar o `locate` para tentar localizá-lo.
`locate teste`
![]
Hum… o resultado que esperávamos não está aparecendo. Por quê?
### Entendendo o banco de dados do locate
Vimos que o locate faz uso de um **banco de dados** para realizar suas pesquisas,
porém quando criamos um arquivo ele não é automaticamente inserido no banco de
dados sendo necessário atualizá-lo.
Para que o banco de dados seja atualizado temos que utilizar o comando ùpdatedb`.
Para isso devemos estar logados como root, ou utilizar `sudo` na frente do comando
Assim, se fizermos novamente a busca ela já retornará o nosso arquivo:
![]
Com isso nosso banco foi atualizado e obtivemos o resultado esperado.
## Conclusão
Queria localizar um arquivo no servidor que não tinha modo gráfico. Vimos como
podemos procurar nossos arquivos no terminal, utilizando o nome do arquivo, ou
parte do nome, em uma pasta ou em todo o sistema.
Para isso, existem alguns programas, como o `find` e o `locate`. Vimos como
utilizar cada um, seu funcionamento e suas diferenças.
Gosta de Linux? Aqui na Alura temos uma [**formação completa**] sobre ele. Nela
você aprenderá sobre o sistema, como utilizar o terminal para fazer suas tarefas,
sobre a filosofia Open Source, além de muito mais coisas para você dominar esse
sistema operacional.
Está começando agora a sua carreira como programador? Ou então nem começou mas
precisa de um "empurrãozinho" para dar o ponto de partida? Então da uma olhada
nessas dicas que farão toda a diferença para você trilhar a sua jornada!
## 1 - Escolha uma linguagem de programação.
Em diversos grupos, redes sociais ou em qualquer tipo de comunidade de

estudantes/programadores uma das maiores dúvidas de qualquer pessoa que está
começando é:
> **_"Qual linguagem de programação devo começar?"_**.
Para esse tipo de pergunta, é bem comum obtermos diversas respostas, como por
exemplo, C, Java, C#, C++, Ruby, Python, PHP, JavaScript entre diversas linguagens
que temos atualmente.
Entretanto, quando estamos começando, a linguagem em si não importa, pois a

**lógica é a mesma para todas as linguagens!**
Nesse exato momento, você pode estar se perguntando:
> **_"Se a lógica é a mesma para todas, pouco importa qual linguagem eu devo
utilizar?"_**.
Teoricamente sim, porém, na prática, recomendo fortemente que escolha uma linguagem
que tenha **menos barreiras na curva de aprendizagem.**
Em outras palavras, linguagens como por exemplo o JavaScript, que pode ser escrito
em qualquer editor de texto e executado em qualquer navegador (até mesmo o IE em
versões não tão antigas), é uma ótima escolha, pelos seguintes motivos:
- Não precisa instalar uma ferramenta específica para codificar.

- É uma linguagem de fácil aprendizagem.
Não à toa [**o nosso curso de lógica de programação**], que foi totalmente
regravado e melhorado esse mês, utiliza JavaScript.
## 2 - Práticar gera mais resultados do que teoria
Além da linguagem, um dos pontos principais quando estamos aprendendo é justamente

a prática. Mas como assim a prática?
Até hoje não conheci nenhum programador que só aprendeu na teoria!
É isso mesmo, colocar a mão na massa, tentativa e erro, **praticar diversas vezes
até compreender um conceito ou algo novo que viu**, faz parte do dia-a-dia de
qualquer programador.
Portanto, tudo que você escutar, ler ou assistir, coloque em prática! Pois quanto
mais praticamos, mais compreendemos.
Por exemplo, já tiveram diversas vezes que eu só fui entender o que realmente o meu
código estava fazendo na quinta vez que o implementei!
E confesso que foi a partir dessa sensação de "domínio do que estava fazendo" que
eu comecei a me apaixonar por programação.
## 3 - A lógica de programação em primeiro lugar
Uma das dicas mais importantes (se brincar a mais importante de todas) para
qualquer iniciante é procurar aprender, antes de tudo, a **lógica de programação**.
Mas por que a lógica de programação? Por que não Orientação a Objetos, ou
programação funcional, ou estrutura de dados ou qualquer outro tópico da
programação?
É justamente porque todos os outros tópicos que envolve programação são baseados na
lógica de programação!
Em outras palavras, a lógica de programação são os ingredientes do bolo, ou seja,

**programar sem lógica de programação é a mesma coisa que tentar fazer um bolo sem
ingredientes**.
Com toda certeza esse bolo não vai sair como o esperado! ;)
## 4 - Procure um amigo para estudar
Além dos passos mencionados, uma das melhores escolhas que você vai fazer na sua
vida é procurar um amigo para estudar junto com você! Então você pode pensar:
> **_"Mas eu não consigo aprender sozinho?"_**
Sim, você consegue, porém, ter uma pessoa próxima para que você consiga exibir suas
ideias, discutir implementações ou até mesmo compartilhar o que aprendeu em um novo
curso, faz toda a diferença!
Em diversas vezes eu tive mais vontade de aprender uma nova tecnologia, conceito ou
realizar um novo curso a partir de um feedback de amigo.
Portanto, um amigo ali do seu "lado" para que você possa compartilhar suas
experiências e ele as dele, fará com que, tanto você quanto ele, compreendam com
mais facilidade tudo que estudaram.
## 5 - Crie um projeto seu e compartilhe com todos
Uma das melhores sensações para qualquer programador é justamente terminar um

projeto e compartilhá-lo com algum familiar, amigos ou até mesmo com a comunidade.
Portanto, durante o seu aprendizado, coloque tudo em prática em um projeto seu e o
compartilhe!
Lembrando que não precisa ser um projeto mega complexo e com diversas
funcionalidades, é a partir de projetos como calculadoras básicas, contas bancárias
ou cadastro de vendas que damos os nossos primeiros passos.
Além disso, uma das práticas comum é compartilhamos nossos projetos com a
comunidade a partir de um [github], por exemplo. Dessa forma podemos pegar um
feedback de programadores mais experientes.
Você também pode aprender a programar com a nossa [**formacao de iniciante em

programação**], com uma sequência de cursos focada em quem está começando. Outra
possibilidade são os [**cursos presenciais da Caelum**] que conta com diversas
turmas abertas para quem quer iniciar com programação.
O **Composer** é uma das ferramentas principais do **PHP** moderno.
# Autoloading com o Composer
Imagine que você precisa enviar um e-mail, e para isso vai ser necessário o uso de
três classes Email.php, Mensagem.php e Servidor.php. Quando vamos utilizar elas em
um arquivo,temos que fazer uso da função de **require**.
php
Legal, isso funciona, mas imagine que precisássemos utilizar mais de vinte classes,
esse código iria ficar gigante né? para contornar isso, podemos utilizar a função
de autoload do Composer.
O Composer faz o **autoload das classes** do seu projeto, do mesmo jeito que ele
faz o autoload de bibliotecas externas. Para isso, existe uma propriedade chamada
autoload que pode ser adicionada no `composer.json`:
php
Neste código, estamos fazendo uso do autoload seguindo a convenção PSR-4. A PSR-4 é
uma das **PHP Standards Recommendations**, que foi criada pelo PHP-FIG (PHP
Framework Interop Group) que define normas para se criar o autoload de arquivos
PHP. No caso, estamos atribuindo o namespace “MeuNamespace” para o diretório src na
raiz do programa.
Com isso todo o nosso código estará acessível através desse namespace, a única
configuração que devemos fazer é incluir na nossa aplicação o arquivo de autoload
do Composer! ele pode ser incluído com o seguinte código:
php
O Composer mantém um cache próprio em relação aos arquivos de autoload, então

precisamos utilizar o seguinte comando toda vez que fizermos uma alteração no
autoload, pois ele vai atualizar o cache.
```
composer dump-autoload
```
# Acessando arquivos executáveis pelo Composer.
Em uma aplicação real, é muito comum precisarmos desenvolver testes para que a
nossa aplicação não sofra com regressão de funcionalidade ou bugs que podem ser
criados conforme vamos desenvolvendo. Uma biblioteca que auxilia com isso no PHP é
o **PHPUnit**, e podemos instalar no nosso projeto utilizando o Composer.
php
Observe o **–dev** utilizado logo depois do require, isso é desejável nessa
situação pois o **PHPUnit** é uma dependência que só faz sentido enquanto estamos
no ambiente de desenvolvimento e ela não deve ser instalada no ambiente de
produção. No ambiente de produção, o comando a ser digitado para instalar as
dependências é:
php
O que instalará somente as dependências que podem ser instaladas em um ambiente de

produção, excluindo as dependências de desenvolvimento e deixando o ambiente de
produção mais enxuto.
Depois de instalarmos dependências que possuem arquivos executáveis instaladas pelo

Composer, elas ficam acessíveis no diretório vendor dentro da pasta bin. Para
executarmos o PHPUnit, faremos o seguinte:
php
![]
# Scripts customizados com o Composer
Quando executamos testes na nossa aplicação, precisamos de toda a performance

possível para que os testes executem logo. Uma otimização que pode ser feita é
desligar o debugger quando executamos a bateria de testes, isso pode ser feito com
o seguinte comando:
php
Grande, não é? para facilitar, podemos criar um comando customizado do Composer,

basta adicionar a seguinte propriedade no arquivo composer.json:
json
Legal! agora quando executarmos o comando composer test, vamos executar de uma
maneira mais curta o mesmo comando que digitamos antes.
![]
Você pode descobrir mais sobre o Composer olhando a documentação oficial e se você
quiser conhecer mais sobre desenvolvimento de PHP moderno, acesse a [**formação PHP
da Alura**].
imagem
Matheus Henrique, 21 anos, mora em Mogi-Guaçu - SP Desenvolvedor web Hobbies: por

incrivel que pareça estudar, jogar sinuca e futebol.
**Depoimento:**
Estudar nunca foi o hobby de muitas pessoas, com o tempo passou a ser o meu e
acredite: o único beneficiado será você! Durante o início de carreira o aprendizado
é um dos grandes desafios de todo programador. E sempre acabamos nos perguntando:
- Como aprender a programar?

- Como aprender uma linguagem de programação?
- Como se dar bem em ser um desenvolvedor?
Acredito que a resposta para as três perguntas seria muito estudo e prática. Uma
técnica que aprendi com o Guilherme Silveira que me ajudou: passei a assistir as
aulas do Alura com velocidade em “2x” e comecei estudar e aprender o dobro sem
precisar me dedicar horas e horas a mais. Outra coisa que ele me ensinou é a
estudar um pouco todos os dias. Sempre separo no mínimo uma hora para os estudos
todos os dias...seja estudando no Alura ou um livro da Casa do Código.
Mais importante do que estudar horas a fio, o importante é ter um contato com a
linguagem que quer aprender todos os dias. Por menor que seja o tempo: pode alguns
minutos do seu almoço ou antes de dormir.
Outra técnica que passei a adotar foi não copiar códigos ou utilizar recursos
prontos. Muitas pessoas utilizam frameworks para poupar o esforço e economizar
tempo, mas acredito ser um preço muito caro a se pagar para nós que estamos
começando. Você terá o resultado que deseja, mas sem saber o que está acontecendo
por de baixo dos panos!
Passei então a criar meus próprios códigos para que eu possa aprender e
principalmente entender como os frameworks trabalham. Depois de ter aprendido mais
a fundo sobre determinada funcionalidade, não vejo mais problemas em copiar ou
utilizar frameworks porque você já saberá o que está acontecendo por baixo dos
panos.
**Nunca** seja pessimista ao ponto de pensar “não sou capaz”, “não sei fazer” ou “é
muito difícil”! Com um pouco de dedicação, estudo e vontade tudo é possível :)
Não queira aprender tudo ao mesmo tempo! Dedique-se em uma linguagem/tecnologia de

cada vez. Qualquer que seja sua área, existem caminhos a serem seguidos e tentar
cortar caminho geralmente não dá muito certo.
Quer aprender desenvolvimento front-end? Aprenda HTML, CSS e Javascript. Deixe para
partir para SASS ou jQuery depois, pois eles precisam de uma base de CSS e
Javascript para que as coisas façam sentido para você.
Quer trabalhar com Java para a Web? Aprenda **bem** o básico da linguagem. Depois,
foque nos recursos avançados e só em seguida vá para a parte Web pois, para
aprender um framework web como VRaptor ou Spring você precisa ter uma ótima base da
linguagem.
Essas são algumas das técnicas e métodos de estudo que eu tenho adotado e vem me
trazendo muitos benefícios! Estou conseguindo evoluir e melhorar cada dia mais.
Espero que sirva para você também que não sabe como começar ou ainda tem dúvidas
sobre a longa caminhada que nós desenvolvedores temos de enfrentar :)
* * *
**É Aluno da Alura também e tem uma história bacana pra nos contar? Conta que
publicamos seu depoimento aqui! Envie um email para
gabriel.ferreira@caelum.com.br :)**
**Design thinking** é uma série de métodos para abordar problemas da mesma forma
como um designer costuma fazer seu trabalho.
É um ciclo de identificar algo que pode ser melhorado ou adaptado a partir de um

problema, entender seu contexto, **experimentar ideias** e gerar uma solução que
resolva o obstáculo, seja ele qual for.
Esse tipo de abordagem pode ser usado em qualquer momento da sua vida: no seu
trabalho, claro, mas também nos estudos, no controle financeiro ou no planejamento
de uma viagem.
**O fluxo do design thinking é composto dos seguintes passos:**
- Descoberta
- Interpretação
- Ideação
- Experimentação
- Evolução
São com esses passos que criamos nosso curso de [**design thinking**] e detalhamos
aqui:
# 1. Descoberta
O primeiro passo para inovar com design thinking é descobrir mais sobre um problema
que você identificou anteriormente, seja por observação ou por ter sentido na pele.
- Falta [**tempo para estudar**]?

- Eu preciso de uma forma melhor para gerir meu material de estudo?
A maioria das ideias inovadoras surge de necessidades rotineiras de pessoas atentas

e criativas.
# 2. Interpretação
Depois de entendido melhor e identificado todos os aspectos que circundam e motivam

o problema, é preciso interpretar e compreender esses dados. Aqui, é importante a
empatia, conseguir se colocar no lugar de outras pessoas.
- Muita gente enfrenta esse problema?

- Alguém já o abordou de alguma forma?
- Solucioná-lo vai realmente melhorar a minha vida e a de outras pessoas?
Colocar a questão em um contexto local e global ajuda a pensar em formas de

resolvê-la.
# 3. Ideação
É hora de ter ideias. Aqui, vale tudo, o que vier à cabeça, desde que de forma
ordenada e sempre com um foco na solução do problema (inclusive essa falta de
objetivo claro é um problema que muitas empresas têm ao lidar com o começo do
processo de design thinking).
O **brainstorming** é uma ferramenta poderosa porque te faz encontrar e associar

ideias que a princípio não parecem ter relação, e é exatamente por isso que são
inovadoras.
# 4. Experimentação
**Do brainstorming, surgem as ideias mais promissoras** É hora de agrupar as

similares, combinar e confrontar ideias, para finalmente selecionar apenas as que
atendam ao problema de fato e sejam viáveis diante seu tempo e recurso.
Selecionadas as mais promissoras, todas elas devem passar para a fase de
experimentação e ser testadas no mundo real. É a hora de descobrir se alguma delas
vai funcionar.
# 5. Evolução
Se você chegou a este passo ao inovar, parabéns! Você identificou um problema,

interpretou, teve ideias, experimentou e chegou a uma solução mais apropriada!
Ou talvez não. Talvez a solução não seja possível no momento, mas ao passar por
esse processo você está um degrau acima do que estava antes para alcançar uma
inovação.
Outra característica importante do design thinking é nunca parar. A criatividade é

motor que não pode esfriar, e nenhuma solução é perfeita. É hora de voltar ao
problema e ver como evoluir a ideia. Mãos à obra!
# Processo de criação e invenção
Em algum momento da história, entre a Renascença e a Revolução Industrial, criou-se

uma imagem supervalorizada do "inventor", uma pessoa especial que tinha o dom raro
de criar coisas novas.
Você conhece o estereótipo: cabelos desgrenhados, fala sozinho, grita “Eureca!”. O

que aconteceu foi que o rótulo de pessoa especial acabou desincentivando muitas
outras que achavam não ter o que era preciso para ser criativas.
Essa visão estigmatizada finalmente está perdendo força. Qualquer pessoa pode ser
criativa. E deve ser! O design thinking é uma consequência disso, de pessoas
buscando incorporar inovação e criatividade em suas vidas.
Independentemente da forma como você faça isso, esta é a dica: viver criando e
criar vivendo.
Para ser criativa, uma pessoa não precisa de talento divino ou uma certa
personalidade, mas saber identificar problemas e encontrar soluções em qualquer
lugar, a qualquer hora.
# Práticas no Design Thinking
## Misture as referências
Podemos dizer que aqui está a base da inovação. A criatividade vem da habilidade
de pegar referências distintas e combiná-las de um jeito que ninguém pensou ainda,
mas que resolve o problema em questão.
Então, não tenha medo de misturar as coisas. Deixe os preceitos e os preconceitos

de lado e treine seu cérebro para fazer associações livres de tudo o que encontra
pela frente.
## Abrace todas as ideias
Sim, é para abraçar mesmo! Proteja as suas ideias e não desista delas facilmente.
No momento certo, você vai saber se ela é viável ou não, mas, no começo, apenas
deixe que ela amadureça em sua cabeça.
Quantas ideias boas não foram perdidas por serem abandonadas antes da hora? É
melhor nem pensar nessa conta.
## Mapeie as ideias
É por isso que, não importa a ideia, trabalhe nela. Inovação e criatividade vêm da
persistência.
Se alguma se mostrou promissora, mapeie o que é preciso para experimentá-la, como

ela vai funcionar, pontos positivos e negativos. Por menor que seja o problema que
você quer resolver, é importante encontrar a solução mais adequada e eficiente.
## Teste todas as ideias
Não tenha medo de errar! Se a solução é viável ou não, você só vai saber testando.
Ponha as melhores ideias em prática, repita os testes e tente de outras formas.
Boa parte do processo criativo e do design thinking tem a ver com evolução.
Experimentar é a melhor forma de encontrar os pontos fracos da sua ideia e
consertá-los.
A era dos grandes inventores já passou há muito tempo. A humanidade vem evoluindo
de forma tão rápida porque cada pessoa pode ser uma fonte de inovação e
criatividade.
**Por: [Carolina Penedo]**
## Mais uma fase, mais um termo da moda
Eu me lembro quando entrei na faculdade em 2007 e a minha turma era a primeira a

levar o título de “Graduação em Design Gráfico”, antes era uma “salada”, contendo
moda, industrial, gráfico. Tudo junto e misturado. Depois vieram outras modalidades
para incrementar ainda mais esse currículo, como design de games, web design,
design editorial e por aí vai.
A gente sai da faculdade com todas essas opções para seguir, sem nenhuma
experiência e sem nem mesmo saber o que nos espera no mercado de trabalho. E foi
exatamente assim quando concluí o meu curso, procurando o meu lugar nesse universo
quase infinito de possibilidades, em busca de **“qual designer sou?”**.
## Primeira etapa: Direção de Arte
O que poderia ser mais glamuroso, divertido e disruptivo do que ter a carteira de
trabalho assinada como **Diretora de Arte**?
Eu mineira, recém formada em Santa Catarina, juntei minhas malas novamente e parti
para essa oportunidade, que me esperava no Rio de Janeiro.
Dois anos se passaram nesta função, e a empolgação já não era mais a mesma. Percebi
que não nasci para ter ideias que vão mudar o mundo e ganhar um “leão de ouro”.
Então veio a onda do digital, a pressão de me manter atualizada, não existia mais
criação “on” e “off”. Nesse momento, enxerguei um novo horizonte e vamos à segunda
etapa.
## Segunda etapa: Design de Interface

Aqui voltei a estaca zero, fui para uma agência com foco em digital, a “parada”
agora era o mundo online!
Um ano fazendo social media - posts para redes sociais, é que a galera de UX tem
mania de complicar - logo vieram os primeiros sites e um desafio absurdo!
Afinal se antes eu desenhava um anúncio, agora, em um site havia várias páginas com
vários conteúdos e um milhão de possibilidades.
Encontrei um trabalho em equipe, muito mais dinâmico, com arquiteto da informação,

devs front, back, java, bootstrap, uma sopa de letrinhas, e lá se foram uns 3 anos
para me familiarizar. E eu sempre focada em fazer a coisa ficar bonita.
## Terceira etapa: Design de Usabilidade - como surgiu essa ideia
Em uma pequena agência que trabalhei, me perguntaram seu eu “fazia UX”, pensei,
aquele Power Point que o arquiteto faz, acho que consigo fazer. Wireframe já faço
no dia a dia mesmo, acho que posso fazer isso! Como podem imaginar, na prática não
é bem assim e meu primeiro projeto como **UX** foi uma tragédia.
Comecei a pesquisar para colocar mais esse carimbo no meu portfólio e encontrei
outra sopa de letrinhas de desanimar qualquer um.
Fui lendo alguns artigos, conheci alguns podcasts como o Movimento UX que foi
fundamental para entender como funcionava o mercado, o que faziam de fato os
profissionais da área.
Em seguida fiz alguns cursos online, na Alura, onde conheci a parte teórica e
alguns softwares essenciais para o dia a dia. Li alguns livros de indicação de
amigos e por aí vai.
Um ano se passou, e eu estava completamente imersa naquele conteúdo, de repente

tudo fazia sentido, de repente cada pixel tinha um motivo para estar ali e um novo
mundo se abriu.
## Por que UX?
De repente, vi uma oportunidade de me libertar de sentar atrás do computador com um

fone de ouvido, e sair por aí explorando temas, colocando minha curiosidade em
prática, lidando com pessoas. Se você não gosta de pessoas, não seja um
profissional de UX, #ficadica.
Malas feitas de novo, agora em São Paulo, para o meu primeiro emprego como UX
designer, já posso afirmar que a minha trajetória até aqui foi fluida e
encantadora.
Seja para agregar ao trabalho de um UI, ou como uma nova profissão ele deve ser
levado a sério.
Não é nada simples mudar o mindset de alguém como eu que foi treinado a criar
layouts lindos, a colocar a experiência do usuário como prioridade, além de ter que
pensar nas necessidades do negócio e como o produto que você está desenvolvendo vai
impactar a vida de quem está recebendo.
A quantidade de termos, metodologias, livros, softwares e informações do universo

UX assusta, eu sei. Mas um dia de cada vez, aprendendo na prática, com
profissionais mais experientes, vamos nos formando. Se você também está neste
caminho, não desista e seja bem-vindo.
Espero que minha história sirva de motivação para a sua história!
![]
**Carolina Penedo**
Se você gostou da história da Carolina e deseja acompanhar seus trabalhos, você

pode [**seguir ela no Twitter**], se [**conectar com ela no LinkedIn**] e [**seguir
seu trabalho em seu site**].
Para diminuir ao máximo a possibilidade de acontecer algum erro quando algum

usuário for utilizar essa nova funcionalidade, vamos criar um plano para garantir
uma boa cobertura de teste antes que ela vá para produção.
# Criando um plano de teste
Podemos pensar em três pontos importante para iniciarmos no plano:
**Escopo de teste**
**Cenário de teste**
**Caso de teste**
## **O escopo de teste é o que vamos testar**.
Podemos pegar todos as funcionalidades e serviços que a empresa possui, analisar o

que a nova funcionalidade pode impactar e definir o que testar ou não. É importante
que o analista de teste tenha um bom conhecimento do negócio para que seja capaz de
classificar o que será impactado com o novo serviço.
Com isso em mente [Desenvolvemos uma planilha] para auxiliar na criação do plano de
teste.
Para um escopo mais completo iremos classificar não só o que vamos testar mas
também os seguintes tópicos:
**O que ficou fora do escopo** : tudo que não iremos testar.
**O que foi realizado poucos testes**: funcionalidade que iremos realizar poucos
testes porque a nova funcionalidade não tem impacto direto.
**É importante testar mas não foi possível**: funcionalidade que ficou fora do
escopo por algum impedimento mas deveria ser testado.
**O que ficou dentro do escopo**: funcionalidades que iremos testar porque a nova
funcionalidade deve impacto direto.
imagem
As funcionalidades que iremos testar são as **telas de login, cadastro e perfil** e

podemos colocar uma pequena descrição que ajudará a entender o porque a
funcionalidade está sendo afetada.
# Cenário de teste
O Cenário de teste é **onde testar e em quais condições**. Para isso iremos

utilizar a segunda aba da planilha para definir os cenários:
imagem
A frases destacadas em vermelho definem onde iremos testar e em quais condições,

como no seguinte exemplo:
> **USUÁRIO QUE UTILIZA DISPOSITIVO MOBILE COM NAVEGADOR FIREFOX**
Sendo o dispositivo mobile o cenário (onde testar) e utilizando o navegador firefox

como condição.
Nessa tabela também temos outras informações como revisor, tipo de teste que pode
ser manual ou automatizado e os casos de teste do cenário que será feito na próxima
etapa.
# Caso de Teste
Por fim, temos o caso de teste que é **como testar**. É importante que você tenha
as etapas anteriores bem definidas antes de começar a criar os casos de teste,
porque boa parte do que foi feito será reaproveitado.
Agora vamos analisar o seguinte caso de teste apresentado na nossa planilha.
> “CT-001 Verificar se o campo de e-mail está sendo apresentado na tela de cadastro
quando utilizado um aparelho celular com o navegador firefox”
imagem
Veja que no trecho “apresentado na tela de cadastro” e “utilizado um aparelho

celular com o navegador firefox” são o escopo e cenário de teste respectivamente
que criamos anteriormente e a validação que será feita é “Verificar se o campo de
e-mail está sendo apresentado”.
Informações como notas, executor, passo a passo, data da execução, resultado

esperado, status podem ser colocadas também. Quando mais informação constar no caso
teste melhor, pois essa é a aba que o analista de qualidade seguirá para executar
os testes.
Abaixo temos um modelo mais completo:
imagem
Ao concluir essa etapa, podemos atualizar a aba de cenário para vincular os casos
de teste:
imagem
Feito isso teremos nosso plano de teste pronto para ser executado, garantindo uma
maior cobertura de teste na funcionalidade que foi desenvolvida e garantir menos
bugs em produção.
imagem
Saiba como eu utilizei o fetch para consumir dados de outros sistemas via Rest e
preencher automaticamente a seguinte lista:
imagem vamos pegar a resposta com as informações do CEP:
javascript
Com o retorno da data (dados) vamos atribuir ele para os campos e fazer uma função
pegar o id do campos e atribuir os valores para eles:
javascript
E dentro do evento de click do **btnPesquisarCEP** iremos atribuir a função:
javascript
Mas como sabemos, o CEP pode ser digitado de maneira errada, então vamos fazer uma
exceção que mostre para a pessoa que foi um CEP incorreto ou inexistente.
Para isso criamos um àlert` dentro do then para mostrar que o CEP está inválido.
javascript
## Conclusão
Neste post, aprendemos como fazer uma requisição web com Javascript vendo como são
úteis e como elas facilita a vida de quem desenvolve. E normalmente no dia a dia,
os sistemas se comunicarem com outros por requições.
Se gostou do conteúdo, que tal dar uma olhada na nossa [**formação front-end na
Alura**] ou em nossos livros na [**Casa do Código**].
imagem
Neste episódio do Alura Live, conversei com a Giovana Delfino, uma da

desenvolvedoras do time da Alura pra conversar sobre algoritmos, sua importância e
dicas para quem quer começar a estudá-los.
https://www.youtube.com/watch?
v=1GOwmog0Cvc&lc=z23ezhtzzsvufbbjc04t1aokge5kc4uo3sqldxxynhpzrk0h00410
Gostou deste vídeo? Então não deixe de se [inscrever em nosso canal no Youtube!] O
Alura Live vai ao ar todas as quintas lá em nossa [página no Facebook]. Confira
quais os assuntos dos próximos episódios [aqui].
Gostou deste vídeo? Assista o [episódio completo] aqui!
Confira os cursos de Algoritmos na Alura, que estão divididos em [parte 1] e [parte

2].
Veja outros cursos e carreiras na [Alura]!

Siga a gente no Twitter: Não deixe de seguir [eu] e a [Alura] no Twitter! :)
Existem algumas extensões do Chrome que são bem interessantes para sermos mais
produtivos em nosso cotidiano tanto profissional quanto pessoal. Se você é
designer, recomendo inclusive meu post no [Dicas UX] sobre extensões do Chrome para
designers.
# 1 – **GetPocket**
Quantas abas estão abertas agora no seu navegador? Muitas pessoas costumam deixar
diversas abas sem uso abertas, o que pode atrapalhar o desempenho nas atividades do
dia a dia que precisam de atenção.
Com o GetPocket você pode salvar tudo isso para ler mais tarde no seu computador ou
mesmo no celular. Além disso, a extensão permite adicionarmos tags nos links e o
aplicativo funciona offline.
Você pode deixar o layout dele em modo noturno também.
imagem
# 2 – **LastPass**
Decorar mil senhas é complicado. Para resolver isso, muitas pessoas acabam usando a
mesma senha em mais de um serviço ou mesmo senhas muito fracas.
Para gerenciar seus acessos e ajudar sua memória, existe o gerenciador de senhas
LastPass. A ideia dele é ser um cofre digital com suas senhas, além de facilitar a
vida na hora de criação de senhas com **muitos** caracteres também.
Pode parecer estranho no primeiro momento, mas serviços como esse possuem várias
travas de segurança para evitar que algo de ruim aconteça.
imagem
# 3 – **Video speed controller**

Tempo é dinheiro e eu não quero perder o meu. Imagino que você também não queira
perder o seu, não é? Por isso gosto bastante da funcionalidade do Youtube em deixar
a velocidade de reprodução do vídeo em 2x.
O problema é que não são todos os serviços de vídeo que fornecem essa opção, e
mesmo no Youtube são alguns cliques até conseguir mudar a velocidade. Eis que surge
o Video speed controller.
Essa ferramenta te ajuda a aumentar a velocidade de vídeos em diversos sites que
existem por aí. E sim, funciona na Netflix e na [**Alura!**]
imagem
# 4 – **Buffer**
Quando vemos aquele post bacana (tipo esse 😊) e queremos compartilhar com o maior
número possível de pessoas, o que fazemos? Abrimos cada rede social e vamos colando
o link em todas… Mas é meio chato, não?
O Buffer é um serviço/extensão que me faz ganhar bastante tempo quando passo por
isso. Eles possuem planos pagos, mas para usos mais tranquilos a versão free é bem
aceitável.
Essas ferramentas facilitam a vida de estudantes e profissionais de diversas áreas!

e desejar conhecer métodos para melhorar a sua produtividade, temos o [**curso de
Produtividade:** estratégias para o dia a dia aqui na Alura!]
Para fazer o livro das turmas formandas de uma faculdade, o designer recebeu as
seguintes orientações:
**_"Todos as fotos dos alunos deverão ter um filtro azul, juntamente com seu nome.
São um total de 100 alunos."_**
> _Então, para fazer as edições, só precisamos ir aplicando o filtro em todas as

fotos, repetidas vezes, incluir o nome de cada aluno, salvar e pronto, certo?_
imagem.
Mas, antes de utilizar este recurso, precisamos entender como criar a ação que
queremos repetir.
### Pré-determinando ações
Para criar uma ação, temos uma janela no Photoshop chamada **Actions** (ou ações),
que será responsável por gravar as orientações de ação que queremos.
imagem.
Para registrar o processo de adição do filtro azul, vá até a janela Actions e

**crie uma nova ação**, nomeie e clique em **Ok**.
imagem, tingimos a camada com a cor azul.
Depois, diminuímos a opacidade em 50% para criar um efeito de filtro azul e, por
último, retiramos toda a saturação da foto (deixar em tons de cinza), indo em Image
> Adjustments > Desaturate. Chegamos a este resultado:
imagem com opacidade em 90%. Algo como:
imagem. No caso, é uma boa prática definir termos de acordo com o que representam,
como "foto", para as fotos de alunos, e “nome”, para os nomes.
**Agora chegamos à parte mais importante! Precisaremos definir as variáveis dos

campos que sofrerão alterações.** Isto é, as variáveis serão as identificações que
utilizaremos para indicar os dados a serem alterados.
Para isto, seguiremos este caminho: Image > Variables > Define.
Na janela que abre, primeiro escolhemos o nome da camada que sofrerá alteração.
Veja o exemplo:
imagem em uma mesma pasta, para que, ao executar a função, os arquivos

referenciados sejam encontrados.
imagem** ou seja, um arquivo **.csv**, também dentro da pasta de arquivos do

projeto. Assim criamos o conhecido **Data Set.**
## De volta ao Photoshop…
Com a planilha de nomes pronta, voltamos ao Photoshop e seguimos o caminho File >
Import > Variable Data Set.
Na janela que abre em seguida, escolhemos o arquivo da planilha criada e deixamos

os dois campos selecionados, como indicado abaixo:
imagem
Do nada o meu produto que custava R$ 30,40 agora parece que custa R$ 30,399999.
Pior ainda, a soma das notas fiscais não bate com a soma dos produtos! Olha meu SQL
piradão:
sql
Que doideira é essa? Até eu não erro essa conta!
Mas eu preciso armazenar os números direito e o tipo double é uma aproximação!

Aproximou,perdeu precisão.
Usei double pois o Mysql suporta ele, mas diversos bancos tem seu próprio tipo
numérico aproximado. Por exemplo o SQL Server tem os tipos real e float, [o Oracle
tem seu mundo a parte que apresentamos em seu curso].
A solução? Dizer quantas casas desejamos para representar o valor e quantas casas
decimais, então vamos usar o tipo DECIMAL. Dica bonus: deixe uma casa decimal de
margem para arredondamentos:
sql
Vai representar ponto flutuante?
Diga a escala e a precisão e siga o padrão SQL com o DECIMAL.
**Essa dica é baseada no nosso curso básico de banco de dados relacionais, onde
vemos [outras situações onde a tipagem é fundamental] para criar restrições no dia
a dia como o uso de enumerações.**
Estudando! Rá!
Mas bom, no dia a dia tenho 3 práticas que me ajudam muito:
## 1\. Estudar um pouco todos os dias é cientificamente comprovado como eficaz.
Faço isso todos os dias da minha vida. Se você, como eu, acorda e olha o email, em
um minuto você aprende algo. Imagina aprender todo dia sem "perder" tempo?
Por exemplo, junte-se ao expert Sérgio Lopes a lista diária de um minuto sobre
[boas práticas de Javascript], onde [em menos de um minuto me toquei que Javascript
já faz muita coisa que antes precisávamos do JQuery].
Ou a lista diário de um minuto de [**boas práticas de SQL**], onde, por exemplo,

ensino em menos de um minuto [**como nunca mais apagar coisas que não devia com
DELETE**]. Encontre sua fonte diária de dicas e boas práticas. Quer se inscrever
nele?
## 2\. Faça cursos.

Começou com o estudo curto e rápido diário e agora está pronto para dedicar meia
hora por dia? Uma hora a cada três dias? Não deixe de fazer cursos.
Eu já criei mais de 40 cursos no Alura, e já assisti literalmente todos [**os

melhores cursos do Alura**], foram mais de 150 que já assisti fazendo revisão :)
Haja estudo!
Mas eu devo ter 100 horas em um dia? Não!
30 minutos por dia é uma meta animal! Se conseguir, [me avisa]!
## 3\. Discuta as práticas com seus amigos.
Questionar e ser questionado faz parte do aprendizado. Manda o link de um post aqui
do blog para um amigo agora. Isso agora. Fala "javascript tá animal". Ou "se lembra
aquele delete que eu fiz ano passado?". Puxa o assunto! Me conta o que aconteceu?
E aí, mandou? Eu compartilho esse tipo de coisa informação e insights a rodo, é

assim que pego informação nova, de todo lugar e de todos!
Abraço!
Guilherme
imagem
Perguntamos ao host **Paulo Silveira**, co-hosts e fãs quais são os seus episódios
de **Hipsters.tech** preferidos!
Confira a seleção, escute os que ainda não conhece e comente sobre outros que você
gosta!
## Tecnologias no Nubank – Hipsters #01
Esse é o piloto do podcast e por isso inesquecível episódio. É aí onde tudo

começou!
Mesmo lançado há mais de dois anos, em julho 2016, esse ep segue sendo um dos mais
queridos de quem acompanha o Hipsters Ponto Tech.
E os convidados são logo da maior startup financeiro do Brasil! Escute para

descobrir o que há por trás do cartão roxo que naquela época virou febre e quais
são os desafios do time de tecnologia.
<iframe src="https://open.spotify.com/embed-podcast/episode/0CEqymEIXegTThgucywPXy"
O episódio predileto da co-host **Roberta Arcoverde** e do maior dos hipsters do

time Caelum,o **Gabs Ferreira**. Sem convidados, os 3 hosts do podcast se reuniram
para falar sobre os livros que mais influenciaram a carreira deles. Será que são os
mesmos que você já leu e que te ajudaram?
Escute o ep para ver quais títulos o pessoal achou secos e entediantes demais para
sequer concluir a leitura e por quais se apaixonaram e nunca irão largá-los.
<iframe src="https://open.spotify.com/embed-podcast/episode/39emOB3lVBo80RDOs6BZVG"
## Produtividade e mais produtividade
São dois episódios que abordam o mesmo tema, um trazendo mais informações úteis que
o outro para a sua vida pessoal e profissional. Recomendação do guru de
produtividade daqui da casa, o grande Guilherme Silveira! Ele provavelmente já leu
mais livros este mês do que a gente escutou de podcast o ano passado...
Quando crescer, quer ser como ele? Então aprenda com pessoal que entende do assunto
sobre como priorizar tarefas, como lidar com procrastinação e como traçar metas
para ter uma carreira (e vida) de sucesso.
<iframe src="https://open.spotify.com/embed-podcast/episode/2t6wgbrhaUhh7yW5lx0b1F"
<iframe src="https://open.spotify.com/embed-podcast/episode/3rg3fwydxGECapljIp9DNC"
## Programar sem enxergar – Hipsters #82
Um dos episódios mais extraordinários, onde o Paulo bateu papo com dois devs e uma
deva, todos eles com alguma deficiência visual.
O pessoal comenta sobre os desafios de escrever código de forma diferente, sobre

como é trabalhar com engenharia de software em empresas ou trabalhar remotamente.
E, no final do ep, rola um live coding sensacional! Bateu curiosidade? Bora ouvir!
<iframe src="https://open.spotify.com/embed-podcast/episode/0n7huBx5Z7xZ4tUHMfr9P5"
## Mitos de UX – Hipsters #93
Um episódio divertidíssimo e que esclarece muita coisa para quem está iniciando no
mundo de User Experience ou quer aprender sobre para não cometer os mesmos erros e
clichês no seu próprio produto. Entre os convidados, a simpática e fera, Carla de
Bona.
<iframe src="https://open.spotify.com/embed-podcast/episode/07TR5hOosalS0RobfaK17X"
## Bônus: Melhores episódios de Hipsters.tech segundo o Paulo Silveira
Imagina alguém que está gerindo uma empresa um grupo de empresas, criando duas
filhas, fazendo crossfit e ainda encontra um tempinho para gravar um podcast com as
pessoas mais incríveis do mundo de tecnologia (ou não) brasileira (ou não).
Pois é, ele é uma máquina de conteúdo sem igual que junto ao seu irmão Guilherme
inspirou muita gente a aprender Java e a entrar na área de programação. Sem mais
delongas: quais são os episódios preferidos do host do podcast?
## Tecnologias e Transformação Digital no Magazine Luiza – Hipsters #107
Como começou a grande virada de uma loja de varejo para um dos e-commerces mais
importantes do país? Entenda de tecnologia, logística e “calor humano” integrados
nessa marca gigante que só cresce!
<iframe src="https://open.spotify.com/embed-podcast/episode/0esppR0fad6TgDcJTMXKCM"
### Mainframe e desenvolvimento raiz – Hipsters #118
Cobol, PL/1 ou Adabas...existem mesmo essas tecnologias ou são lendas? Onde vivem e
o que comem? Nesse episódio, o Paulo conversa com o pessoal que trabalha com
algumas (e que por coincidência são seus amigos da infância) e não faltam também os
co-hosts “raíz” Maurício Linhares e Roberta Arcoverde.
Ah, e nos comentários do episódio nos emocionamos com a quantidade de gente que
trabalha com COBOL e agradece pelo episódio, além do dev que se chama Buga! Já
imaginou a zoeira? 😂
<iframe src="https://open.spotify.com/embed-podcast/episode/6ulFn9u7QdHRZVfKn2jS0H"
### Carros Elétricos e Programação – Hipsters #135
O episódio saiu esta semana e já ganhou o coração do Paulo! Os convidados discutem

o quanto os veículos sem motorista são longe ou perto da realidade, e quais as
tecnologias relacionadas.
Diretamente da Suíça, um dos convidados que bateu papo sobre o futuro (ou presente)
foi o Henrique Bierwagen, coordenador de testes na National Electric Vehicle
Sweden. Vale a pena conferir!
<iframe src="https://open.spotify.com/embed-podcast/episode/2hswmBLMLeQaYOUJWLZE0i"
## ♥ Mais um bônus!
### Por trás do Hipsters: Caelum, Alura e Casa do Código – Hipsters #100
Um episódio que nos leva aos bastidores do Grupo Caelum e conta a história das
empresas pelas lentes dos fundadores.
Essa vez, o Paulo Silveira brinca de convidado e o Maurício Linhares estreia como
host. Junto a eles, o Sérgio Lopes, que foi o primeiro estagiário da Caelum e até
trancou a faculdade por causa da empresa.
É óbvio que não pode faltar também o Gui Silveira, que conta porque o treinamento
de instrutores e instrutoras de cursos de tecnologia é mais pesado que os treinos
de crossfit.
<iframe src="https://open.spotify.com/embed-podcast/episode/2U6y2etKfB73kcaBC3I4gG"
E aí, já ouviu todos esses? Você pode achar todos os episódios no site [Hipsters
Ponto Tech] ou no [Spotify]. Também, divulgamos sempre os novos conteúdos nas redes
sociais.
Aproveite para seguir a gente no [Twitter], [Instagram] e [Facebook]!
Independentemente da área em que atuam, é importante ter alguns cuidados e estar

atento para detalhes essenciais durante esse processo.
Manter-se atualizado, cultivar o ciclo de relacionamentos, apostar em uma

comunicação eficiente e ficar atento às demandas do mercado são algumas estratégias
que fazem toda a diferença para quem deseja atuar como freelancer.
Além disso, alguns quesitos comportamentais também são importantes! É preciso ter
disciplina e muito foco. Confira algumas dicas e saiba como vender os seus serviços
de freelancer corretamente.
## Invista em cursos e certificações
Quando o profissional está começando a sua carreira e ainda não tem muita
experiência atuando no mercado ou um grande portfólio, é muito importante apostar
em certificações técnicas.
Cada área tem suas especificidades, mas é preciso ficar atento para aquelas que são
mais exigidas pelas empresas ou clientes. Na área de redação, pode-se ter
certificação relacionada à produção de conteúdo ou [**mídias sociais**], por
exemplo.
Para os designers, as certificações no pacote Adobe também oferecem certa

segurança, pois elas demonstram que você está apto a usar as principais ferramentas
exigidas pelo mercado.
Já na área de TI, uma certificação em linguagem SQL pode te ajudar a conseguir

muitos jobs interessantes. Ela é conhecida como Oracle Certified Professional
Advanced PL/SQL Developer Certification.
## Seja um autodidata
Você nem sempre terá a chance ou o investimento necessários para realizar todos os
cursos que deseja.
As certificações formais, oferecidas por institutos renomados são muito

importantes, mas quando não for possível realizá-las, use os recursos disponíveis e
seja um autodidata. Explore livros, tutoriais, vídeos, manuais online e use a
[**sua criatividade**].
A disposição para aprender sozinho é importante para quem não tem o tempo
necessário para se capacitar. Um cliente pode pedir uma demanda com prazo muito
apertado e, por mais que você não domine alguma técnica, provavelmente vai querer
aceitar o serviço.
Por isso, é importante não perder as oportunidades e aproveitar para desenvolver

novas habilidades por conta própria, sempre que possível.
## Venda o seu peixe

Ninguém saberá que você é um profissional freelancer, a menos que você fale. Nesse
caso, a propaganda é sempre a alma do negócio. Por isso, aproveite todas as chances
de vender o seu peixe.
Para [**conseguir trabalhos**] é fundamental ter um bom portfólio, manter os

contatos ativos e usar a tecnologia a seu favor para divulgar aquilo que você faz
de melhor.
O seu perfil do Linkedin deve estar atualizado e, de preferência, com recomendações

sobre os trabalhos já desenvolvidos. O link para o seu portfólio deve estar em
todos os perfis de mídias sociais, mas lembre-se de atualizá-los sempre com
conteúdo relevante e de qualidade.
Não dá para ser um designer e publicar uma imagem com baixa resolução na web ou ter
um cartão de visitas mal feito, não é mesmo? Em casa de ferreiro, o espeto não pode
ser de pau!
## Frequente eventos da sua área
Para vender seus serviços de freelancer, é importante estar atento às tendências do

mercado. A melhor forma de manter-se atualizado é por meio das feiras e congressos
da sua área.
Lá, você pode ter contato com especialistas diversos, fornecedores e potenciais
clientes. Aproveite também para focar no conteúdo das apresentações e usar isso a
seu favor.
Quando você inclui a participação em grandes eventos em seu currículo, os clientes

percebem que você é uma pessoa que valoriza a troca de conhecimentos e está atento
ao que acontece na sua área.
Outra grande vantagem dessas ocasiões é o networking. Estar em contato com colegas
e outros profissionais do seu ramo pode te render conhecimento, indicações para
trabalhos e até mesmo boas amizades.
## Controle suas finanças
É essencial saber vender os seus serviços de freelancer, mas também é igualmente

importante saber cobrar por eles e monitorar esse valor depois de recebido.
Aprenda quanto vale o seu trabalho e não deixe que as outras pessoas definam o seu
valor. Todo esforço deve ter um preço justo e com base na média do mercado.
Um trabalho nunca vai ser, por exemplo, um “simples post para facebook”, e sim uma
produção de conteúdo que faz parte de uma estratégia de marketing muito maior. Por
isso, cobre pela sua especialidade sem medo.
Se você já sabe o valor do seu ofício, também precisa controlar muito bem suas
receitas e despesas. Caso trabalhe em casa, diferencie os gastos profissionais dos
pessoais.
Evite despesas desnecessárias e sempre pesquise antes de comprar algum software,

equipamento ou material de escritório. Para viver de freelas, é importante ter
muito controle e rigor com as finanças.
## Tenha foco e disciplina
**O controle e o rigor que o freelancer tem que ter na vida financeira também são
necessários em todos os outros aspectos da vida profissional. Se você não tem que
“bater o ponto” no seu trabalho, deve ter um horário muito determinado para começar
e terminar suas tarefas.**
Acorde cedo, se alimente, troque de roupa e vá para o escritório ou local que você
desenvolve sua tarefa. Nada de trabalhar de pijama! É preciso ter disciplina para
cumprir seu cronograma e entregar os trabalhos propostos.
Com essa rotina, você vai começar a controlar melhor quanto tempo leva para fazer
cada atividade. Assim, vai aceitar os trabalhos de acordo com a sua disponibilidade
para atendê-los e manterá um controle rigoroso sobre isso.
Quem é freelancer precisa ter muito foco para não se dispersar, já que a
pontualidade e o profissionalismo nas entregas dos trabalhos vão determinar a
quantidade de serviços que você será capaz de vender e sua consolidação no mercado.
Oferecer serviços de freelancer tem seus prós e contras, como qualquer atividade
profissional. Você tem flexibilidade de horários, mas não tem vale-refeição; não
tem custos com transporte, mas precisa planejar o próprio 13º salário!
**O importante é saber lidar com questões muito próprias dessa atividade e estar
disposto a se surpreender com o seu trabalho a cada dia. Descubra novas formas de
fazer aquilo que você gosta e insista em fazer disso a sua profissão!**
Se você acha que este post pode ser útil para algum amigo que também trabalha como
freelancer, compartilhe-o nas redes sociais e faça a informação circular!
imagem
A gente é bem bitolado em [performance aqui na Alura] e na Caelum há bastante

tempo. Já seguimos muitas boas práticas na hora de desenvolver e até ensinamos
várias delas nos [cursos de performance front-end].
**Mas a vida acontece**
Mais especificamente, as coisas evoluem. Mudam organicamente. Uma funcionalidade

nova aqui, outra ali. Muita gente mexe no código. Até os browsers mudam. E aí sem a
gente nem perceber, a **performance pode ir pro ralo**.
Recentemente passamos por diversos pequenos casos na [plataforma de aula da Alura]

onde a performance estava sofrendo por besteiras pequenas ou por _débito técnico_
que estava acumulando. E isso me fez lembrar como **precisamos sempre estar de
olho** na performance do site. Não é algo que se faz e se larga. É preciso
monitorar.
**O HTTP/2 que sumiu**
Usamos HTTP/2 na Alura há bastante tempo. [Somos mega fãs]. Poucos meses atrás um
[update do Chrome] passou a exigir um protocolo mais moderno de negociação do
HTTP/2 (o ALPN). Mas ele só funciona se o servidor tiver OpenSSL mais moderno. E a
gente usava o Ubuntu LTS aqui que tava com OpenSSL antigo.
Conclusão: ficamos algumas semanas sem HTTP/2 no site até migrar toda a infra para
um Ubuntu + OpenSSL recente. Mas como ficar sabendo disso? Afinal usávamos HTTP/2
aqui sem problemas por muito tempo. Só ficando de olho mesmo, monitorando.
**O GZIP que não era**
Nessa migração, atualizamos nossas configurações no servidor, onde usamos o

**nginx**. E, claro, _beabá_ de performance, temos GZIP habilitado por lá. Mas
comecei a reparar que nosso jQuery tava com mais de 90KB de transferência - e eu
sabia que devia ser menos de 30KB. Um erro no arquivo do nginx e estávamos fazendo
GZIP apenas de HTML e CSS. Tanto JS quando SVG, que se beneficiam bastante de GZIP,
estavam de fora. Um fix de 1min que economizou uns 100KB pra todos os pageviews de
alunos da Alura.
**O JS que sobrou**
E por falar em **pequenas ações com grandes ganhos**, outra que economizou mais uns
200KB pros usuários foi tirar um JS esquecido lá na página que era usado em uma
funcionalidade que nem existia mais. Era um Google Charts que usamos uma época e
nunca mais. Mas o JavaScript ainda estava lá. Pior: por descuido, era um [script
blocante] no head. Ouch. 200KB inúteis de um request crossdomain travando a
renderização. _Pra envergonhar qualquer especialista em performance._
Todas essas melhorias (e mais algumas) já estão no ar para todos os alunos. Mas o
ponto é perceber como é fácil escorregar em algo e perder a mão com a performance
do site. Coisas mudam, projetos crescem e, se não ficamos de olho, podemos estar
perdendo oportunidades como essas - pequenas correções no projeto com grandes
impactos na performance final sentida pelo usuário.
Se você se interessa por performance de Front-end, não deixe de conferir os 2

cursos na Alura **completíssimos** e com **notas altíssimas** dos alunos que
fizeram. Sem querer nos gabar mas já nos gabando, com certeza são material
referência na área no Brasil hoje; não há nada nem parecido por aí.
- [Curso online de Performance Web I: otimizando o front-end]

- [Curso online de Performance Web II: Critical Path, HTTP/2 e Resource Hints]
imagem
Estou fazendo a manutenção de um ecommerce desenvolvido em C#, nele é feito o

cadastro de pessoas onde é inserido o nome e o e-mail. Todos os dados são salvos em
um arquivo CSV.
imagem com as promoções do mês para todos os e-mails cadastrados no ecommerce.
Quando tentamos enviar os e-mails, porém, acabamos tendo erro de envio porque o
nome dos usuários veio junto com o e-mail:
Para mandar uma newsletter preciso pegar apenas o e-mail, então temos que fazer a
separação dessas duas informações. Como podemos fazer isso?
## Fazendo a separação com Substring.
Temos algumas alternativas para pegar apenas uma parte de texto dentro de uma
string. Porém, quando eu penso em fazer separações, logo penso em utilizar
[SubString] pois este método faz a separação da string em uma subparte.
Para isso tenho que passar a posição inicial e final que quero separar.
Por exemplo tenho a seguinte string:
csharp
Para fazer a extração apenas do e-mail. Tenho que passar a posição inicial do e-
mail e a posição final. Neste caso a posição inicial é a 6 que é o começo do e-mail
e a posição final é a 15 que é quando acaba o e-mail.
csharp
Perceba que fazendo a utilização do Substring tenho um ponto ruim, pois, cada vez
que eu tenho uma string de `pessoaRecebida` diferente, eu tenho que mudar os
valores- das posições.
Vou tentar fazer a separação do e-mail da Leticia.
csharp
E vamos ter essa saída:
![]
Não era este tipo de saída que eu gostaria de obter, pois aqui eu tenho uma parte
do nome e não tenho o e-mail completo.
Como a função SubString não conseguiu fazer a separação de modo correto, vou ter
que buscar mais funções na documentação.
Eu preciso de algo que faça o corte entre o nome e o e-mail e então separe eles em
dois. Mas será que existe alguma outra forma de fazer isso?
Ao rever a documentação achei a função Split que faz a separação também. Vamos
entender um pouco mais das características dessa função e ver se encaixa melhor.
## Fazendo a separação com Split
Já que não conseguimos fazer a separação utilizando o SubString. Vamos fazer a

separação usando o [**Split**] . Ele faz a separação dos valores conforme o
parâmetro que indicamos ser o divisor da informação.
No nosso caso seria o `;` para fazer a divisão da string, pois esse é o elemento
que divide o nome do e-mail na listagem do csv.
csharp
O Split vai nos devolver um array de string com duas posições, onde a primeira
posição vai ser o nome e a segunda posição vai ser o e-mail. Aqui estamos pegando
apenas o array de string por isto vai ser retornado o **System.String\[\]**, mas
queremos pegar apenas o e-mail.
Como é um array eu posso selecionar apenas um dado, no nosso o dado do e-mail, que
está na segunda posição do array.
csharp
Com isto toda a pessoa que recebermos iremos conseguir extrair o e-mail do CSV.
## Conclusão
Nós começamos com um CSV com vários tipos de dados, onde não podia ser feita a
verificação do que era e-mail e o nome, pois, teríamos que pegar a separação do e-
mail a mão.
Então teríamos que fazer a separação do dado que nós vamos receber. Optamos por
utilizar o método SubString que faz a separação da string que passarmos em
subpartes. Porém como o tamanho da string pode mudar, não seria uma boa utilização.
Com tudo isto, procuramos na documentação outro método para nos ajudar e achamos o
Split.
Ele faz a separação conforme o valor que vamos passar como parâmetro, então
independente do tamanho que nossa string tenha nós vamos conseguir fazer a
separação dos valores.
E aí, o que achou do post? Fica até mais fácil trabalhar com datas no c# agora, não
acha?Se quiser continuar estudando sobre o assunto, dê uma olhada em nossos cursos
na Alura de [**C#**] continue aprendendo!
imagem
Uma empresa de hospedagem está enfrentando um problema: o número de endereços IPs

disponíveis está acabando. Sem endereços IPs, a empresa não pode ter novos
clientes.
Essa empresa possui cerca de 5000 servidores dedicados para os clientes. Cada
servidor tem um IP público, por isso ela tem uma faixa de IPs para comportá-los.
Por exemplo, uma faixa de `250.127.1.x` a `250.127.20.x` endereços disponíveis.
Bem, se estamos sem endereços, podemos comprar mais. Porém descobrimos que
[**acabaram os endereços IPv4 disponíveis**] para a América Latina. E agora, o que
podemos fazer para ter novos endereços?
Já era esperado que os endereços **IPv4** fossem acabar. Por isso foi criado a nova
versão do protocolo, o **IPv6**.
## Entendendo o IPv6
IPv6 nada mais é do que a nova versão dos endereços IP. Ele veio resolver alguns
problemas que o IPv4 apresentava, como, por exemplo, o esgotamento de endereços
IPv4 disponíveis.
Como o aumento do número de dispositivos conectados a internet, os endereços

disponíveis foram chegando ao fim. Algumas técnicas como o [**NAT**] atrasaram um
pouco a mudança, porém com o crescimento acelerado de dispositivos conectados, os
endereços disponíveis foram acabando.
O computador entende bits. Ou seja, tudo que passamos para o computador é traduzido
para zeros e um. Com os endereços IPs acontece o mesmo.
No endereço IPv4, por exemplo, `192.168.0.1`, temos quatro grupos, ou octetos, nos
quais podemos utilizar números para escrever o endereço. Cada octeto é um conjunto
de **oito bits**. Logo, temos **32 bits** disponíveis para escrever um endereço.
Ou, aproximadamente, **4,2 bilhões de endereços**.
Já com o IPv6, temos oito grupos, porém esses grupos não são divididos em oito bits
cada, mas em **16 bits**, separados por dois pontos (`:`). Portanto, temos **128
bits** disponíveis para escrever nosso endereço. Logo, temos, aproximadamente,
**340 undecilhões de endereços**. Ou, **3,4 x 10^38** endereços.
Isso significa que temos endereços praticamente inesgotáveis. Por ser um valor
muito grande, em vez de utilizar valores decimais, nós representamos os endereços
IPv6 com valores hexadecimais. Ou seja, números de 0 a 9 e letras de A a F.
Cada grupo de 16 bits, também chamado de decahexateto, ou duocteto, possui quatro

símbolos hexadecimais. Portanto, percebemos que cada símbolo hexadecimal representa
4 bits.
Sabendo disso, podemos escrever um endereço IPv6 dessa forma:

`2001:0BAA:0000:0000:0000:24D2:12AB:98BC`. Oito grupos, com quatro símbolos
hexadecimais separados por dois pontos (`:`).
> _"Esse endereço é muito maior que um endereço IPv4, não é complicado lê-lo?"_
De fato, os endereços IPv6 são maiores que os endereços IPv4, por isso foram
criadas algumas regras de abreviação.
### Abreviando o IPv6
Nós podemos omitir os zeros a esquerda quando estamos escrevendo o endereço. Dessa
forma, escrevendo novamente o endereço, teremos este resultado
`2001:BAA:0:0:0:24D2:12AB:98BC`
Já fica um pouco menor, porém conseguimos encurtar mais o endereço. Quando temos
uma sequência de blocos com valor zero, conseguimos abreviá-las digitando duas
vezes dois pontos (`::`). Aplicando essa regra, nosso endereço fica assim:
`2001:BAA::24D2:12AB:98BC`
Contudo, devemos prestar atenção, pois essa regra só pode ser usada uma única vez.
Isso porque se tivermos duas vezes essa abreviação, os equipamentos de rede não
conseguirão saber a posição precisa de cada grupo.
Por exemplo, vamos imaginar o seguinte endereço:
`2001:AB14::1205::35FE`
Qual a posição do grupo `1205`? Esse endereço pode ficar tanto assim:
`2001:AB14:0000:0000:1205:0000:0000:35FE` quanto assim:
`2001:AB14:0000:0000:0000:1205:0000:35FE`. Por isso só podemos utilizar essa
abreviação uma única vez.
Outra coisa que muda em relação ao IPv4 é a máscara de rede. No IPv6 utilizamos a
[**notação CIDR**] para dizer qual parte do endereço pertence a rede e qual parte
pertence ao host. Essa notação diz qual parte do endereço pertence a rede e qual
pertence ao host.
Dessa forma, deixa de existir máscaras de sub-rede. Já que a identificação da rede

está no próprio endereço.
Legal, já sabemos como funciona o endereço IPv6, mas como eu posso configurá-lo?
A configuração do IPv6 é parecida com a do IPv4. Vamos ver sua configuração em um

roteador Cisco.
## Atribuindo o endereço no roteador
Nos roteadores Cisco, temos que entrar no modo de usuário privilegiado para começar
a configurá-lo. Para isso, digitamos ènable` no terminal:
imagem pelo terminal (`terminal`):
imagem que receberá o IP, que, no meu caso, é a interface `gigabitEthernet 0/0`.
imagem. Ao invés disso, ele realiza o [**multicast**]. Por isso, alguns protocolos
baseados em broadcast, como o [**ARP**], não existem na nova versão.
Alguns protocolos, como o [**ICMP**] e o [**DHCP**], receberam novas versões no

IPv6, o ICMPv6 e o DHCPv6.
Além dessas, outras mudanças foram feitas. O cabeçalho do protocolo IPv6 tem menos
campos que o do IPv4, bem como a segurança do IPv6 foi aumentada.
Contudo, mesmo com essas mudanças, o IPv6 foi feito para ter compatibilidade com
todos os protocolos das camadas superiores do [**modelo OSI**].
As tecnologias estão em constante desenvolvimento. Por isso temos sempre que ficar
nos atualizando para continuar no mercado.
Aqui na Alura, temos uma formação em [**infraestrutura de redes**]. Nela você

aprenderá sobre os protocolos de comunicação, equipamentos de redes, como realizar
a configuração dos equipamentos, além de ver questões de segurança e aprender a se
proteger de possíveis ataques.
imagem
Nós sabemos que esse início costuma ser um pouco difícil, pois você ainda está
desenvolvendo suas habilidades e adquirindo experiência.
Se você usa o **software da Adobe** para produzir suas imagens, já deve saber que
existem vários plugins e complementos com funcionalidades extras — tanto gratuitos
quanto pagos. Talvez você já tenha experimentado um ou outro, mas ainda não sabe
quais são os mais importantes.
Escolher os **melhores plugins para Illustrator** pode poupar boa parte do seu
tempo de trabalho. Algumas funcionalidades são basicamente cerca de 10 coisas que
já estavam no programa. Só que, em vez de selecionar uma ferramenta de cada vez, o
plugin faz tudo em apenas um comando. Enquanto isso, outros plugins
adicionam ferramentas inéditas à sua lista de recursos. Conveniente, não?
E para te ajudar a não se perder nesse mar de opções, trouxemos aqui alguns plugins
básicos para Illustrator que podem te poupar horas de trabalho e melhorar a
qualidade dos seus produtos. Confira:
## 1\. Metaball (Arc)
Volta e meia você vai precisar criar algumas formas mais suaves e curvas que são
quase impossíveis de fazer direito à mão. Mas não importa o quanto você seja bom,
nunca vai criar estas formas perfeitas manualmente. Felizmente, existe um plugin
chamado **Metaball (Arc)** que serve justamente pra isso.
O trabalho desse complemento é, basicamente, ligar várias formas diferentes em uma

única figura. É como criar aquelas linhas guias de formas geométricas e depois usá-
las para criar o desenho final. Algo simples, mas que te poupa bastante tempo.
Normalmente, você teria que criar essas formas e depois preencher os espaços
manualmente, terminando tudo ao apagar as linhas guias. Mas isso consome muito
tempo e você tem que entregar esse serviço logo! Com esse plugin, você poupa o
esforço e fecha mais um trabalho antes do fim de semana.
## 2\. Dup at Selected Anchor
Em alguns trabalhos, cada ponto de ancoragem de uma forma precisa ser preenchido
com outra forma. Por exemplo, todas as patas e juntas de uma aranha precisam ter
uma bolinha vermelha. Mais uma vez, você tem que pegar a forma que precisa, copiá-
la várias vezes, arrastar, colocar no ponto certo etc. Ou você pode só usar o
**plugin Dup at Selected Anchor.**
Pode não parecer um dos melhores plugins para [**Illustrator**], mas ele também vai
te poupar uma ou duas horas de trabalho a cada projeto. Com ele, você pode
selecionar a forma que deseja repetir e o objeto onde pretende inserir essas
formas. Após a seleção, o plugin vai automaticamente colocar uma cópia em cada
ponto de ancoragem da imagem desejada. Se você estiver lidando com um polígono com
muitos pontos de ancoragem, esse recurso vai, no mínimo, poupar a dor dos seus
tendões.
## 3\. MultiExporter
Em alguns momentos, você pode querer usar as várias camadas da imagem produzida
separadamente, como o plano de fundo, os objetos principais etc. Talvez precise
delas para outras edições ou só queira dar uma olhada com calma depois. Com o
MultiExporter, você pode fazer isso tranquilamente.
O trabalho desse plugin é resolver exatamente o problema que descrevemos. Ele

separa cada camada presente na edição e a salva em um arquivo PNG ou PDF único.
Mais uma vez, pode não parecer relevante, mas se você tem uma figura com 100
camadas e só quer mostrar uma delas, vai ter que abrir todas e ficar sentado
esperando. Então, abra só uma.
Todos esses plugins até agora são gratuitos. Mas, se você pretende ter
credibilidade profissional, vai ter que pagar por outras funcionalidades mais
polidas. Estes abaixo são os plugins pagos que mais podem te ajudar.
## 4\. VectorScribe V3
Em muitos projetos, o seu cliente pode precisar de uma imagem em vários tamanhos,
ou mesmo uma definição grande demais para ser exportada no computador. Como você já
deve saber, a solução aqui é usar imagens vetorizadas. **E o VectorScribe (volume
3)** é um plugin excelente para melhorar o resultado das suas figuras criadas em
vetores.
Ele possui várias funcionalidades que aceleram a produção da imagem, como maior
controle de pontos. Isso facilita o processo de edição e reduz o tamanho do arquivo
final, o que reduz o tempo que você tem que esperar para enviar uma prévia, por
exemplo.
## 5\. Gold Rush

Já notou como vários [**trabalhos de design**] usam tons metálicos variados e
realistas para realçar as formas? Seria interessante se houvesse algum plugin que
oferecesse esses efeitos, não é? Espera, existe sim! O **Gold Rush**.
Dentro desse pacote, você vai encontrar centenas de efeitos e cores metalizados e
de glitter. O suficiente para praticamente qualquer projeto. Vários tipos de ouro,
prata e bronze, além de muitos outros metais. E você certamente já sabe como uma
imagem brilhante pode atrair a atenção do público.
## 6\. ColliderScribe V2
Alinhar diferentes formas para que se toquem delicadamente não é uma tarefa
impossível. Mas haja paciência para dar zoom e alinhar tudo perfeitamente! Uma
paciência que seus clientes nem sempre possuem. Para isso serve o
**ColliderScribe**: facilitar as colisões entre as figuras.
Uma nova funcionalidade da versão 2 é a possibilidade de “rotacionar” uma forma ao

redor de outra. Ao colidir dois círculos, por exemplo, você pode arrastar um deles
pela superfície do outro. Assim, até os ajustes de posicionamento ficam mais
fáceis.
## 7\. ArtBlue Gold 2.5
Agora, se você pretende investir pesado no [**trabalho de designer**], vai precisar

de plugins mais robustos. Esse é o **ArtBlue Gold 2.5.**
Com ele você adquire muito mais opções de criação de formas, com muito mais
precisão e detalhes. Você também pode usar o mesmo plugin para converter uma imagem
simples em uma escultura complexa, ou integrá-la em uma estrutura 3D. O preço é
mais salgado que a média, mas o retorno está à altura.
Agora que você conhece mais alguns plugins para Illustrator, é hora de fazer alguns
downloads e melhorar seus produtos. Acha que mais pessoas podem aproveitar essa
dica? Então compartilhe este artigo em suas redes sociais e mostre como é possível
adicionar mais qualidade ao seu trabalho de designer.
Que tal utilizar esses conhecimentos no Illustrator e aprender a criar a identidade

visual de um produto?
Aqui na Alura temos um curso onde você pode colocar na prática todo esse
conhecimento com o Illustrator e [**aprender o processo de criação da identidade
visual de uma marca**], desde de coletar informações a partir de um briefing, a
escolha da tipografia, até a validação.
imagem
Muitas pessoas utilizam seus celulares para realizar tarefas rotineiras, como
ligações, envio de mensagens, postagens em redes sociais, escutar músicas, jogos e
etc… Não é uma novidade a capacidade que temos com um celular, principalmente [o
Android que desde 2017 possui mais de 2 bilhões de dispositivos ativos]!
Considerando o potencial desta plataforma, não à toa, muitas empresas investem

pesado para fornecer aplicativos Android para seus clientes, seja um App simples ou
complexo… E você? Também interessado em colocar em prática a sua ideia para o mundo
Android? Então confira abaixo como você pode criar o seu primeiro App em Android!
## Android Studio: ferramenta de desenvolvimento
Assim como muitas linguagens de programação ou frameworks, no Android temos o

Android Studio como IDE oficial para desenvolver Apps Android, a partir dele, somos
capazes de criar os nosso Apps. Portanto, como primeiro passo faça [download] e
[instale o Android Studio conforme o seu sistema operacional].
> Uma observação interessante é que o Android Studio é baseado no [**Intellij

IDEA**] da Jetbrains que oferece o [**Toolbox**], um instalador de IDEs capaz de
instalar as ferramentas da Jetbrains, inclusive, o Android Studio! É uma ótima
alternativa para evitar passos manuais, comuns em sistemas Linux.
Após instalar o Android Studio e executar os passos iniciais de _wizard_ (famosos

**_next_**s), chegamos na launcher (tela inicial) do Android Studio:
imagem, Wears (smartwatches), TVs, automóveis e IoT. Já as Activities, são

entidades responsáveis em executar o App e apresentar a interface gráfica para o
usuário.
Portanto, podemos escolher, por exemplo, o modelo **Empty Activity** que cria toda
estrutura da Activity, porém com um visual vazio pronto para ser editado. Após
selecionar a opção, basta clicar em **Next**:
### Configurações do projeto
imagem
A escolha de linguagem vamos manter o Java, considerando que ele é a opção padrão
durante a configuração.
> A partir desta opção, somos capazes de configurar a famosa [linguagem Kotlin]
para Android.
### Definindo API mínima
Na API mínima, indicamos qual a versão mínima do Android vamos dar suporte, no
exemplo está marcando a opção 4.4 que representa a API 19 do Android SDK. Você pode
escolher a API que deseja, a única observação é quanto mais recente for a API
mínima, menos usuários seu App vai atender.
> Para um auxílio na escolha, você pode clicar em **Help me choose** que apresenta
uma nova janela indicando a porcentagem de dispositivos ativos com base na versão
desejada.
Por fim, temos os _checkbox_ para configurar o [**instant App**] e [**AndroidX**].

Considerando que estamos nos primeiros passos, podemos ignorar esses campos que
podem ser vistos em um segundo momento. Então clicamos em **Finish**:
imagem` que representa o estado de criação da Activity:
> "Como assim o estado de criação?"
## Estado criação da Activity
Se explorarmos o pacote **br.com.alura.tarefas**, a única classe existente é a

`MainActivity` e, mesmo sem um método `main()`, o projeto consegue ser executado!
Isso acontece pelo fato de que o Android como sistema operacional, gerencia a
criação das Activities e permite a adição de comportamentos a partir da sobrescrita
dos seus estados.
Portanto, qualquer instrução dentro do ònCreate()` será executada durante a

criação da Activity!
Inclusive, perceba que temos o método `setContentView()`, responsável em configurar

o visual da Activity, com o argumento `R.layout.activity_main`. Este argumento
representa o layout gerado a partir do modelo **Blank Activity**.
## Editando o layout da Activity
Para editar o layout, podemos acessar o arquivo dentro de **res** > **layout** >
**activity_main.xml**:
![]
Ao abrir o arquivo, temos acesso ao editor visual do layout! A partir dele, podemos
modificar o conteúdo do texto apresentado na tela que é representado pelo
componente TextView.
Ao clicar no TextView temos acesso aos seus atributos, dentre eles, o **text** que
está mantendo o texto **Hello World!**, portanto, ao modificar esse atributo:
![]
Somos capazes de adicionar a nossa tarefa! Nesse caso a **Estudar Android**. Com
essa modificação temos o seguinte resultado ao executar o App novamente:
![]
A nossa tarefa aparece conforme o esperado!
## Conclusão
Com certeza não estamos limitados apenas a editar um layout e apresentar uma
mensagem, somos capazes de implementar outros comportamentos, como uma lista ou
formulário.
Interessado em aprender como é possível evoluir nesta área de desenvolvimento de

software? Então confira a [**formação Android da Alura**] que, além de explicar
passo a passo do que foi feito por debaixo dos panos durante a criação do projeto,
também ensina como criamos layouts, implementamos listas e formulários comuns em
qualquer App.
imagem
Como o próprio nome diz, esse é um evento mundial que acontece anualmente, sempre
próximo do dia 25 de janeiro. Depois de dez edições, a Global Game Jam já faz parte
do calendário de muitos desenvolvedores de jogos, profissionais ou amadores, pelo
mundo inteiro.
Apesar do evento não ser a única Game Jam no mundo, ela é a maior. Em 2018,
participaram 42,800 "jammers" e foram feitos 8,606 jogos, em 108 países diferentes
- doze países a mais que no ano passado.
Para conseguir organizar um evento desse tamanho, os criadores da GGJ pedem ajuda
para a organização de sedes regionais, ao redor do mundo inteiro. Essa sedes servem
de local de encontro para os participantes e quem tem interesse em participar, pode
ir até uma, ou criar sua própria sede.
Esse ano, o Brasil teve 48 sedes oficiais da GGJ, sendo que a maior delas, a sede
localizada na PUC Paraná, teve 474 participantes e foi a [quarta maior sede] do
mundo. Além da sede de Curitiba, o Brasil teve sedes em São Paulo, Rio de Janeiro,
Recife, Brasília, Florianópolis, etc… A lista completa você encontra no próprio
site da [GGJ].
Quem participou do evento nesse ano, chegou na sede escolhida por volta da 17:00PM
da sexta-feira ( 26\\01 ) e assistiu ao vídeo de abertura da Jam:
https://www.youtube.com/watch?v=3Roxls_2W2M
Desta vez, o tema escolhido foi "Transmissão". Para anunciar o tema, o vídeo
mostrava ondas de rádio, engrenagens, cabos de fibra ótica, etc… A proposta do tema
é ser realmente abrangente, já que 40 mil pessoas vão utilizar esse único tema para
criarem seus jogos.
Outra estratégia dos organizadores da Jam é colocar pequenos desafios opcionais

para os desenvolvedores. Esses "[diversificadores]", como são chamados, podem ser
aplicados nas diversas áreas que envolvem a criação de um jogo - Programação, Arte,
Música, Design, Narrativa, etc...
Falando em diversas áreas do conhecimento, a criação de um jogo é, por essência,

multidisciplinar, e por isso, a variedade de profissionais que se reúnem em eventos
como esse é gigante. Participam da GGJ programadores, artistas, modeladores 3D,
músicos….
Além da diversidade de habilidades, encontramos pessoas com diferentes níveis de

experiência dentro de cada área. Desde novatos\\estudantes até profissionais com
anos de experiência desenvolvendo jogos.
A diversidade possibilita a troca de experiências entre todos os participantes de

uma Jam que têm o desafio de criar um jogo do zero, isso cria um clima muito
agradável para o evento, fazendo com que ele cresça a cada ano.
**_Mas, então, como é participar de uma Jam?_**
Participar de uma Jam, qualquer que seja, é muito divertido. Criar um jogo não é
uma tarefa fácil e por isso mesmo o desafio, de criar um em 48 horas, é grande.
Depois que o tema é liberado, no final da tarde da sexta-feira, cada equipe se

junta para discutir o que aquele tema traz de familiar, novo, inusitado e as
possibilidades que cada um vê para a criação de um jogo.
A discussão sobre, o quão grande é o jogo que a equipe vai tentar fazer,
habilidades individuais de cada membro e organização do grupo, acontece nesse
momento inicial do evento. Aqui, todos estão com ideias na cabeça e tensos,
pensando que em dois dias um jogo deve estar pronto.
Eu e minha equipe, seguimos o mesmo caminho. Nos juntamos para discutir as ideias
que tinham surgido durante a apresentação do tema e começamos a pensar em vários
jogos diferentes.
Passamos por jogos de espionagem, _party games_ simulando um pega-pega em que o
pegador espalhava uma doença para os outros, jogos de _puzzle_, um personagem
viajando nas ondas de rádio… A quantidade de ideias possíveis com um único tema é
enorme, ainda mais sendo um tema tão abrangente.
Depois que o grupo decidiu qual jogo faríamos, começamos a pensar na organização da
equipe. Inicialmente, éramos em 3 e cada um teria suas responsabilidades na criação
do nosso jogo.
Quando terminamos de definir o escopo do jogo e qual seria nosso cronograma,

começamos a produção de fato. Eu segui fazendo a programação, utilizando apenas
cubos enquanto esperava os modelos 3D que íamos implementar mais tarde.
A produção da sexta-feira foi até as duas horas da manhã, quando decidimos que
estava tarde demais para continuar e que a equipe como um todo, precisava
descansar. Apesar das poucas horas que trabalhamos no jogo, começávamos a ver algo
palpável que mais pra frente iria se tornar um jogo.
Sábado de manhã, retomamos a produção do jogo, e por volta do meio da tarde,

tínhamos nosso primeiro protótipo jogável. Ainda não tínhamos todos os modelos 3D,
mas já conseguimos ter uma noção de como o jogo ficaria.
Como falei, inicialmente éramos em 3 pessoas mas, surgiram ideias novas durante a
produção do jogo e com isso pedimos ajuda para um outro amigo gravar algumas falas
para um personagem do nosso jogo.
Com o resto do tempo, acabamos refinando o protótipo base do jogo, adicionamos as

falas que foram gravadas e no final do domingo mais um amigo veio ajudar com a
interface gráfica e o logo do jogo. Depois de todo trabalho que tivemos, nos
juntamos com o resto dos participantes da GGJ da nossa sede - Fatec São Caetano do
Sul - para a apresentação dos jogos que foram feitos.
Afinal, depois de trabalhar durante 48 horas no seu jogo, você vai querer mostrar
ele para alguém. No final do domingo, todas as equipe são convidadas a apresentar
seus jogos para os outros participantes daquela sede. Além disso, os jogo ficam
disponíveis no [site oficial da Global Game Jam].
A apresentação dos jogos foi até a noite, por causa da grande quantidade de jogos
que foram feitos nessa sede. Todas equipes estavam cansadas mas, a satisfação de
ter ao menos um protótipo de jogo feito em 48 horas é tanta que o clima era de
festa.
![]
**_Gostou da proposta da Global Game Jam?_**
Se você já desenvolve jogos, essa é uma ótima opção para conhecer outros
desenvolvedores e criar um portfólio. Se você não sabe como desenvolver um jogo,
mas tem interesse em aprender, temos cursos aqui na Alura para você aprender a
desenvolver em [**Unity**] e em [**Cocos Creator**], duas engines muito legais para
quem está começando.
**_Não quer esperar até o ano que vem para ver o que foi feito na Global Game Jam
2018?_**
No dia 20 de fevereiro teremos um encontro de desenvolvedores com a proposta de

mostrarmos nossos jogos feitos durante a Global Game Jam. Se você participou, ou só
quer ver os jogos que foram feitos, participe do [14° Encontro Game Developers
Brazil] às 19 horas, na rua Vergueiro 3185 - 2° Andar - proximo ao metro Vila
Mariana.
Quando trabalhamos com sequências de dados que representam pontos no tempo (time
series) é muito comum entender o crescimento de um valor em função do tempo. Por
exemplo, o preço de um produto ou uma ação que antes era 100 e agora 110 cresceu
`110/100 - 1 = 10%`, e depois se caiu para 105, caiu `105/110 - 1 = -4%`.
Portanto a fórmula geral é `valor / valor_anterior - 1`. Em python podemos gerar

alguns dados aleatórios:
python
![]
Como o valor da linha n+1 vai ser dividido pelo valor da linha n temos algo como:
python
![]
Mas, claro, como toda boa análise básica de time series, o pandas já fornece uma
função do gênero para trabalharmos:
python
![]
[**Você pode encontrar o notebook com o código aqui**]. [**E para saber mais sobre
numpy, pandas e muito mais em nossos cursos de data science na Alura**].
A pergunta do aluno Henrique Lopes é útil para todos nós que queremos ganhar
experiência ao mesmo tempo que estudamos:
https://www.youtube.com/watch?v=uqp5-F2_-lU
Adorei a pergunta, Henrique! Nós temos a impressão de que estudar não é ganhar
experiência, não é praticar. Isso depende de sua fonte de estudo. O que tentamos
fazer aqui no Alura é que em tudo curso damos um projeto para você executar, para
que o estudo tenha uma prática junto com ele.
Conversando com os professores, e os alunos percebem também, percebi que esse guia
é bom para mostrar o que o aluno deve ou não aprender naquele instante praticando
tudo isso e passando por problemas do mundo real. Não é à toa que os professores
sofrem junto com os alunos.
Dia 1º de Março a gente [**lançou o novo site da Alura**]. Além do fantástico novo
visual, muita gente reparou nos diversos outros detalhes: subdomínio separado da
plataforma de aulas, a performance fenomenal do site novo, o design responsivo etc.
Neste post quero discutir um pouco da Arquitetura do novo site e como chegamos
nesses resultados.
imagem
## A decisão de separar o site da plataforma
Historicamente, a Alura todo era um grande monolito escrito em [**Java**]. Isso

inclui o site de vendas, páginas de marketing, a plataforma de cursos, o sistema de
pagamentos e até códigos do [**MusicDot**]. É ruim porque temos muita gente
mexendo no código, porque o deploy é demorado, a disponibilidade é uma só (se cair,
cai tudo de uma vez).
Na nova reformulação, resolvemos quebrar um pouco. O site externo agora é **um

projeto separado da plataforma de cursos**. Em [www.alura.com.br] fica o site
externo, com foco em apresentar e vender a Alura, em SEO, em marketing. E no
[cursos.alura.com.br] fica a plataforma de cursos, focado em apresentar as aulas,
exercícios, fóruns etc.
imagem.
[**Há 7 anos que usamos o Google App Engine na Caelum**]. E com **muito** sucesso.
Na minha opinião, é o **único PaaS de verdade** no mercado. Escalabilidade barata e
100% transparente. Zero trabalho de manutenção de infra. Deploy instantâneo com
escalabilidade infinita. Resolvemos ir para o GAE no novo site da Alura.
imagem. Com isso tira-se o foco de otimizações básicas como simples concatenações.
E entram em cena recursos ultra bacanas como [**Server Push**]. Isso tudo merece um
post a parte para mostrar o impacto de se usar HTTP/2.
## Integração entre sistemas
Um último ponto que vale a pena destacar é que o site da Alura não possui banco de
dados,um admin ou back-end complexo. Todo o cadastro de dados, como as informações
dos cursos, continua na plataforma de cursos. O site externo consome esses dados
através de uma nova API REST que a plataforma expõe.
Por exemplo, para saber os valores atuais dos planos de assinatura,

chamamos [https://cursos.alura.com.br/api/planos].
No lado do site da Alura, fazemos um GET para essas URLs de tempos em tempos usando
[Cron jobs] e [Task queues] do App Engine. Os dados são então salvos no [Google
Cloud Storage] e cacheados no [Memcache] do GAE para acesso rápido.
## Mais sobre o projeto
O projeto do novo site da Alura começou a sair do papel no final de 2015 com a
[criação e design]. Muitas pessoas participaram da implementação. Na equipe de
front-end estavam [Fernando Stefanini], Jana Paradiso e Yuri Padilha. No back-end e
APIs, [Philippe Ehlert], Rodrigo Turini, Felipe Oliveira e [Caio Incau]. Além de
[Caio Souza] na reorganização do conteúdo e dos designers [Thiago Vilaça]
e [Fabio Gushiken].
Muitas outras coisas bacanas aconteceram no projeto. Fizemos uma implementação

**responsiva** **mobile-first**, usando **flexbox** no CSS, sistema de ícones em
**SVG. **Fizemos várias otimizações para ficar com [**excelente performance**]. Nos
próximos dias vamos contar mais detalhes sobre o site.
O mais bacana ainda é que tudo o que ensinamos nos nossos cursos foram usados
extensivamente na prática. Pegamos esse conhecimento prático e trouxemos para os
nossos [**cursos de Frontend da Alura**] e [**presenciais da Caelum**], onde você
vai poder aprender todos esses conceitos e aplicar nos seus projetos.
E você, o que achou do site? E das nossas decisões arquiteturais? Vem aprender tudo
isso com a gente.
De tempos em tempos surgem novas maneiras de como pegarmos feedback e permitirmos

que os alunos contribuam com o crescimento da plataforma, do conteúdo e da
comunidade. Recentemente lançamos uma funcionalidade de sugestão de correção de
textos, já temos a de sugestão de cursos, e no fim do ano passado resolvemos
pesquisar a escolha dos alunos: o que eles mais gostaram no ano de 2015!
O feedback de vocês é importantíssimo para nos servir de guia de como criar um

melhor ensino para que possam crescer através das ferramentas que disponibilizamos.
É com orgulho que compartilho com vocês, primeiramente, as escolhas de vocês!
## Melhor Instrutor
Vocês escolheram o melhor instrutor geral e... ops, ganhei! Fica o desafio para
meus colegas: \*quero\* que me passem em 2016!
1\. Guilherme Silveira 2. Mauricio Aniche 3. Flavio Almeida
## Melhor Instrutor Estreante
1\. Eduardo Guerra - [cursos de Thread e Reflection em Java] 2. Viviane Martins e

Renan Saggio - [3 cursos de Excel], e [diversos cursos de PHP] 3. Rodrigo Gunisalvo
- [curso de Arduíno]
## Melhores cursos/trilhas
1\. [AngularJS] - Um curso que, sozinho, ganhou de duas trilhas! 2. [Trilha Java] -
A trilha que dá a base de Java para todas as especializações do mercado. 3. [Trilha
Certificação Java] - A trilha que fornece o treinamento necessário para um
desenvolvedor que entender a linguagem por trás e, de quebra, treina para a
certificação da Oracle.
## Melhores momentos de erro e risada
Vira e mexe tem um errinho que passa despercebido. Qual foi o ganhador?
1\. "Não encontrei nenhum erro" - Uhu! Para nossa felicidade, mais de 90% respondeu
que não encontrou erros 2. "A cara do Guilherme Silveira quando errava alguma fala
no curso de jQuery" - Parece que eu faço muitas caretas no curso de jQuery, será?
Outros pequenos erros ou momentos engraçados foram citados mas isoladamente (uma
única vez cada um). Pelo jeito somente minhas caretas que deixam marcas na memória
dos alunos.
## Projeto mais interessante
1\. [AngularJS] - Parece que o Flávio acertou em cheio com o curso. Novamente o
curso estreante ganhou disparado! 2. [Bootstrap] - Front-end mostrando sua força,
com um projeto bem rico e real. 3. [Photoshop para a web] - Agora é Design
mostrando suas garras, com um outro projeto real.
## Exercícios mais interessantes
1. [Angular] - A equipe de criação do Rio está de parabéns, seus exercícios são

criados em grupo por uma equipe grande, por um processo que faz inveja a nós
professores da equipe de criação de São Paulo. Parabéns, novamente ganhando de duas
trilhas inteiras!
2. [Trilha Java] - A formação Java fornece a base, mas já do começo tentamos

colocar exercícios que recriam problemas reais. A didática da Caelum, a plataforma
do Alura!
3. [Formação Front End] - A trilha que permite novos alunos aprenderem a base e
irem bastante além: do HTML ao AngularJS, há muito o que aprender com os exercícios
práticos e reais dessa trilha.
Queria também compartilhar um pouco da minha experiência coordenando em 2015 junto

com o Mauricio Aniche em São Paulo e o Nico Steppat no Rio de Janeiro as duas
equipes de criação de conteúdo. Mas este post é de vocês, minha experiência e
sugestões fica para a próxima!
Conhecer as funções pré definidas do SQL nos ajuda a ter mais produtividade no dia
a dia,nesse artigo vou mostrar como utilizar funções de agregação com **GROUP BY**.
Eu criei uma tabela `livros` e inseri todas as compras que realizei:
sql
sql
Ótimo! Os livros que eu comprei estão bem organizados. Posso até fazer **queries**
para verificar, por exemplo, quais foram os livros que eu paguei mais de R$ 30,00:
sql
sql
sql
Porém, agora eu queria saber quanto gastei com todos os livros que paguei acima de
R$ 30,00. Ou seja, quero fazer uma soma! Como podemos fazer isso no SQL? É muito
simples: já existem funções pré-definidas pelos bancos de dados realizar cálculos.
Podemos, por exemplo, usar a **função SUM** para somar:
sql
sql
Essas funções são chamadas de [**funções de agregação**]. Elas agrupam todas as
linhas encontradas e retornam apenas uma única linha com o resultado da operação
solicitada. Nesse caso, uma soma :)
Consegui verificar o quanto gastei com livros acima de R$ 30,00, mas agora eu
preciso saber o quanto gastei por mês! Na minha tabela as datas são completas, ou
seja: tem dia, mês e ano. Mas, nesse caso, preciso apenas do mês...como podemos
retornar apenas o mesmo de uma data? Simples! Da mesma forma que o banco de dados
forneceu uma função para somar, ele também fornece uma função para devolver o mês
de uma data! Utilizamos o **MONTH() que extrai o mês de uma determinada data**:
sql
sql
Então, agora que sabemos como somar e como pegar o mês, basta juntar as duas
funções! Vamos fazer nossa nova query:
sql
sql
Ué, apenas mês 12? E R$ 202,40 apenas no mês 12? Eu tenho quase certeza que não foi
tudo isso. Vamos filtrar essa query para retornar apenas os livros comprados no mês
12:
sql
sql
O que será que está acontecendo? Será que não podemos exibir mais de uma linha com
uma função de agregação? Muito estranho isso. Como vimos, as funções de agregação a
princípio retornam **apenas uma única linha**. O que precisamos fazer é informar
que queremos **agrupar** as linhas por mês **soma-las**! Para isso, utilizaremos a
instrução `GROUP BY` informando qual coluna queremos que seja agrupada:
sql
sql
Excelente, veja que agora conseguimos verificar quanto foi gasto por mês!
Vimos que quando utilizamos funções de agregação(como `SUM()`) por padrão o branco
nos retorna apenas **uma única linha** com o resultado de todas as linhas que foram
encontradas. Mas, se quisermos que a função agrupe por diferente de uma outra
coluna(como o mês), precisamos informar que essa coluna será **agrupada**
utilizando a instrução `GROUP BY`.
E aí, gostou da função `SUM()` e o `GROUP BY`? Está pronto para utilizá-la em seu
banco de dados? O que acha aprender mais funções de agregação para criar queries
mais robustas e inteligentes? Temos [**vários cursos de SQL**] na **Alura** para
que você aprenda desde queries mais básicas até as mais complexas!
Muitas vezes quero me comunicar com os clientes ou estudantes de tecnologia do

Brasil e, para isso, uso o e-mail, claro. O _[Mailchimp]_ é uma das ferramentas que
permite o envio de e-mails para um grupo grande, mas um dos problemas é que
à medida que o número de pessoas que querem nos escutar aumenta, maior a chance dos
servidores de e-mail acharem que elas não nos deram permissão para esse envio.
Isto é, mesmo que o assinante de uma lista de _newsletter_, ou de uma automação,

queira o nosso e-mail e tenha confirmado, existe ainda uma boa chance de um
servidor como o _Gmail_ considerá-lo_ spam_.
Existem dois passos simplíssimos que uso para evitar que os servidores
classifiquem meu e-mail (que o assinante pediu!) como _spam_... e eles estão
ligados a conhecer melhor quem está recebendo o e-mail. Se você conhece o nome de
quem o está recebendo, o _Gmail_ e outros servidores sabem que a chance é menor de
você estar espameando aleatoriamente... então vamos pedir o nome dos assinantes...
e usá-los!
## Passo 1. Pedir o nome de nossos assinantes
Em meus formulários de cadastro, eu peço o e-mail e o nome da pessoa, como neste

**[aqui]**, onde cadastramos pessoas interessadas em aprender boas práticas de
Javascript. Para fazer isso, basta usar o editor de formulário de uma lista do
_Mailchimp_, escolha sua lista e clique em _Settings > Singup Forms > General Forms
edit_:
imagem que foi usado. Pelo padrão do _Mailchimp_ é FNAME:
![Customizando o TO]
A partir de agora, todas as suas campanhas saem com o nome bonitinho do assinante.
Se ele não preencheu e o campo era opcional, ele sai como antes, para o e-mail
puro, seco.
Pronto! Dois passos super simples que ajudam a diminuir a taxa de marcação de

_spam_ automático pelos servidores e, consequentemente, permitem aumentar a taxa de
abertura dos e-mails que o assinante queria receber. Afinal, se ele pediu, temos
que nos esforçar para entregar o que ele quer!
Lembre-se, claro, de sempre usar ferramentas de e-mail marketing para aquilo que
o assinante tem vontade de receber, se não, é natural que ele marque como _spam_.
Essas são duas das dezenas de técnicas que peguei no dia a dia estudando e

praticando _inbound marketing_. Se você quiser aprender diversas outras, dê uma
olhada no meu [**curso de boas práticas em mail marketing**].
imagem
O portfólio, para o designer, é tão determinante quanto a apresentação de um

currículo. Confira dicas para criá-lo.
Imagine que uma proposta de freelance, ou mesmo de emprego, surge e você precisa
entregar seu portfólio para avaliação. Quando o cliente abre o portfólio, encontra
algo mais ou menos assim:
imagem para que outras pessoas encontrem seu trabalho também.
Mas a maior dúvida é: Como criar um bom portfólio? Neste post vamos entender alguns
passos essenciais para chegar a isso! ;)
## Planeje o que irá exibir
Devemos primeiro ter em mente que nosso portfólio é nossa vitrine, portanto, assim
como lojas usam estratégias para expor seus produtos de maneira atrativa para os
consumidores,precisamos planejar o que queremos valorizar e o que podemos excluir
da nossa apresentação.
### Os melhores projetos
Comece selecionando os projetos mais relevantes até então em sua carreira, ou os

que você mais valoriza (seja por algum apego afetivo, complexidade, etc). Considere
apresentar entre 10 ou 15 projetos, mais ou menos.
Depois disso, alinhe as características que tornam esse projeto tão bom para ser
adicionado em sua "vitrine".
## Definindo as principais características
**_O que você gostaria de contar sobre seu projeto?_**
Para ter uma definição mais precisa do que quer apresentar, faça um breve
levantamento de tópicos relevantes a serem apresentados sobre o projeto escolhido,
como:
- Por que escolhi estas cores para a identidade visual da empresa?
- Qual a motivação para este formato de logo?
- Quais os pontos altos do projeto? As peças gráficas? A estratégia utilizada?
- Que ferramentas utilizei, Photoshop, Illustrator, After Effects?
Este é o momento de adicionar e retirar ideias, até encontrar um roteiro enxuto e

objetivo, que apresente seu produto de forma clara e eficiente, conceituando o que
foi feito.
Podemos então começar a destrinchar o que foi levantado em etapas mais concretas,
como: Definição conceitual, processo criativo, características, protótipos
navegáveis, etc.
**Cada projeto demanda de etapas diferentes a serem apresentadas, mas pode ser uma
boa ideia utilizar no máximo 4 ou 5 divisões, para não deixar a apresentação muito
longa também.**
Porém, existem algumas etapas que poderão ser muito relevantes na maior parte dos
projetos.
### Contexto da produção
Pode ser interessante, logo no começo, fazer uma breve contextualização do que foi
feito para chegar ao resultado final. A inspiração, conceitos trabalhados, ideia
inicial, entre outras motivações que auxiliem na compreensão do projeto como um
todo.
### Processo criativo
Uma boa tática é mostrar, sucintamente, o processo que te levou àquele resultado.
Temos bons exemplos como os da [Andrea Avedissian] e do [Vinicius Sampaio],
respectivamente, por exemplo:
![]
![]
Note que as intenções aqui ficam mais claras. Para o cliente que ainda não conhece
sua forma de trabalho, entender a maneira como você organiza suas ideias pode ser
uma boa ideia na hora de demonstrar seu estilo de trabalho.
### Mockups
A percepção que temos de um arquivo apresentado de forma como o enviamos para uma
gráfica, por exemplo, passa uma sensação muito mais abstrata do que quando aplicada
à um [**mockup**], ou seja, simulações do produto aplicado a um contexto. Veja este
exemplo:
**ARQUIVOS PERSONALIZADOS PARA ÁLBUM**
![]
**MOCKUP DO ÁLBUM**
![]
Pode parecer algo trivial, mas note como esta simulação dá uma noção muito mais
concreta da peça final.
E não precisamos nos limitar a imagens estáticas! Pode ser um recurso legal tentar
alguns mockups interativos como gifs ou outras opções que deixem a apresentação
mais interessante e convidativa.
![]
O mais legal é que essa tática serve para projetos reais e também para trabalhos
"fictícios" - como redesign de grandes marcas - ou mesmo projetos acadêmicos.
Outra alternativa é, se tiver acesso à sua peça final, expor fotografias e vídeos
do produto, desde que bem produzidos, reforçando a ideia de profissionalismo com o
trabalho concluído.
## Outras considerações importantes
É importante deixar a apresentação dos seus projetos bem equilibrada, mas também é
igualmente importante considerar pontos como a elaboração de um "Sobre mim" que
resuma de forma clara e objetiva seus interesses e área de trabalho.
Neste ponto, quem define a linguagem a ser utilizada é você mesmo, mas as mesmas
considerações que costumamos fazer em currículos como evitar erros gramaticais ou
muitas gírias, por exemplo, cuide de sua descrição focando em passar uma imagem
honesta e positiva de si mesmo.
Além disso, antes de publicar seus trabalhos, pense em questões como direitos
autorais, categorias dos projetos, pessoas envolvidas, informações confidenciais,
entre outros pontos que possam comprometer seus projetos futuramente.
## Mas, onde criar meu portfolio?
Se fizermos uma pesquisa rápida no Google encontraremos [**uma série de

plataformas**] muito boas para a produção de um portfolio de qualidade.
Mas, obviamente, cada plataforma terá diferentes características e limitações,

portanto, é importante estudar um pouco as opções, antes de sair montando seu
portfolio na primeira plataforma que aparecer pela frente.
Considere questões como:
- Quero uma plataforma que também ofereça vagas de emprego relacionadas com a minha
área?
- Seria ideal ter uma página que posso personalizar o layout?
- Estou disposto a gastar quanto?

Enfim, são muitos os pontos a se refletir antes de criar um portfolio, mas,
independente da escolha, tenha em mente que a apresentação dos materiais criados
será sempre um fator importante.
Para deixar seus projetos ainda mais atrativos e demonstrar suas diversas
habilidades, apresente materiais feitos com diferentes ferramentas! Na Alura temos
diversos cursos de Design sobre como trabalhar com ferramentas voltadas para
[**materiais impressos**], [**audiovisual**] ou mesmo de [**design para web**].
# Programação orientada a objetos e programação estruturada
Como a maioria das atividades que fazemos no dia a dia, programar também possui
modos diferentes de se fazer. Esses modos são chamados de **paradigmas de
programação** e, entre eles, estão a **programação orientada a objetos** (POO) e a
programação estruturada. Quando começamos a utilizar linguagens como Java, C#,
Python e outras que possibilitam o paradigma orientado a objetos, é comum errarmos
e aplicarmos a programação estruturada achando que estamos usando recursos da
orientação a objetos.
Na programação estruturada, um programa é composto por três tipos básicos de

estruturas:
- sequências: são os comandos a serem executados

- condições: sequências que só devem ser executadas se uma condição for satisfeita
(exemplos: ìf-else`, `switch` e comandos parecidos)
- repetições: sequências que devem ser executadas repetidamente até uma condição
for satisfeita (`for`, `while`, `do-while` etc)
Essas estruturas são usadas para processar a entrada do programa, alterando os

dados até que a saída esperada seja gerada. Até aí, nada que a programação
orientada a objetos não faça, também, certo?
A diferença principal é que na programação estruturada, um programa é tipicamente

escrito em uma única rotina (ou função) podendo, é claro, ser quebrado em
subrotinas. Mas o fluxo do programa continua o mesmo, como se pudéssemos copiar e
colar o código das subrotinas diretamente nas rotinas que as chamam, de tal forma
que, no final, só haja uma grande rotina que execute todo o programa.
<p align="center"><img alt='Fluxograma de um programa estruturado. Depois de

começar, o programa lê dois números A e B, verifica se A é divisível por B e, se
for, imprime "A é divisvel por B", senão imprime "A no é divisível por B".'
src="assets/poo-programacao-orientada-a-objetos/fluxograma.png"/></p>
Além disso, o acesso às variáveis não possuem muitas restrições na programação

estruturada. Em linguagens fortemente baseadas nesse paradigma, restringir o acesso
à uma variável se limita a dizer se ela é visível ou não dentro de uma função (ou
módulo, como no uso da palavra-chave `static`, na linguagem C), mas não se consegue
dizer de forma nativa que uma variável pode ser acessada por apenas algumas rotinas
do programa. O contorno para situações como essas envolve práticas de programação
danosas ao desenvolvimento do sistema, como o uso excessivo de variáveis globais.
Vale lembrar que variáveis globais são usadas tipicamente para manter estados no
programa, marcando em qual parte dele a execução se encontra.
A **programação orientada a objetos** surgiu como uma alternativa a essas

características da programação estruturada. O intuito da sua criação também foi o
de aproximar o manuseio das estruturas de um programa ao manuseio das coisas do
mundo real, daí o nome "objeto" como uma algo genérico, que pode representar
qualquer coisa tangível.
Esse novo paradigma se baseia principalmente em dois conceitos chave: **classes** e

**objetos**. Todos os outros conceitos, igualmente importantes, são construídos em
cima desses dois.
# O que são classes e objetos?
Imagine que você comprou um carro recentemente e decide modelar esse carro usando
programação orientada a objetos. O seu carro tem as características que você estava
procurando: um motor 2.0 híbrido, azul escuro, quatro portas, câmbio automático
etc. Ele também possui comportamentos que, provavelmente, foram o motivo de sua
compra, como acelerar, desacelerar, acender os faróis, buzinar e tocar música.
Podemos dizer que o carro novo é um *objeto*, onde suas características são seus
*atributos* (dados atrelados ao objeto) e seus comportamentos são ações ou
*métodos*.
Seu carro é um objeto seu mas na loja onde você o comprou existiam vários outros,
muito similares, com quatro rodas, volante, câmbio, retrovisores, faróis, dentre
outras partes. Observe que, apesar do seu carro ser único (por exemplo, possui um
registro único no Departamento de Trânsito), podem existir outros com exatamente os
mesmos atributos, ou parecidos, ou mesmo totalmente diferentes, mas que ainda são
considerados *carros*. Podemos dizer então que seu objeto pode ser classificado
(isto é, seu *objeto pertence à uma classe*) como um carro, e que seu carro nada
mais é que uma *instância* dessa *classe* chamada "carro".
<p align="center"><img alt='Imagem com dois retângulos lado a lado. O primeiro

representa uma classe, apenas contorno do desenho de um carro; o segundo representa
um objeto, com três carros desenhados.' src="assets/poo-programacao-orientada-a-
objetos/class-analogy.png"/></p>
Assim, abstraindo um pouco a analogia, uma classe é um conjunto de características

e comportamentos que definem o conjunto de objetos pertencentes à essa classe.
Repare que a classe em si é um conceito abstrato, como um molde, que se torna
concreto e palpável através da criação de um objeto. Chamamos essa criação de
*instanciação da classe*, como se estivéssemos usando esse molde (classe) para
criar um objeto.
## Exemplo em Java
```
public class Carro {
Double velocidade;
String modelo;
public Carro(String modelo) {

this.modelo = modelo;
this.velocidade = 0;
}
public void acelerar() {

/* código do carro para acelerar */
}
public void frear() {

/* código do carro para frear */
}
public void acenderFarol() {
/* código do carro para acender o farol */
}
}
```
## Exemplo em Python
```
class Carro:
def __init__(self, modelo):
self.modelo = modelo;
self.velocidade = 0
def acelerar(self):
# Codigo para acelerar o carro
def frear(self):
# Codigo para frear o carro
def acenderFarol(self):
# Codigo para acender o farol do carro
```
# Encapsulamento, herança e polimorfismo: as principais características da POO
As duas bases da POO são os conceitos de classe e objeto. Desses conceitos, derivam
alguns outros conceitos extremamente importantes ao paradigma, que não só o definem
como são as soluções de alguns problemas da programação estruturada. Os conceitos
em questão são o *encapsulamento*, a *herança*, as *interfaces* e o *polimorfismo*.
## Encapsulamento
Ainda usando a analogia do carro, sabemos que ele possui atributos e métodos, ou
seja, características e comportamentos. Os métodos do carro, como acelerar, podem
usar atributos e outros métodos do carro como o tanque de gasolina e o mecanismo de
injeção de combustível, respectivamente, uma vez que acelerar gasta combustível.
<p align="center"><img alt='Desenho de um carro, representando a classe "carro",

com os métodos e atributos da classe escritos dentro do desenho' src="assets/poo-
programacao-orientada-a-objetos/oop-car-methods-and-attributes.png" align="center"
width="250px" height="200px"/></p>
No entanto, se alguns desses atributos ou métodos forem facilmente visíveis e

modificáveis, como o mecanismo de aceleração do carro, isso pode dar liberdade para
que alterações sejam feitas, resultando em efeitos colaterais imprevisíveis. Nessa
analogia, uma pessoa pode não estar satisfeita com a aceleração do carro e modifica
a forma como ela ocorre, criando efeitos colaterais que podem fazer o carro nem
andar, por exemplo.
Dizemos, nesse caso, que o método de aceleração do seu carro não é visível por fora
do próprio carro. Na POO, um atributo ou método que não é visível de fora do
próprio objeto é chamado de "privado" e quando é visível, é chamado de "público".
<p align="center"><img alt='Desenho de um diagrama de Venn, representando um

círculo mais interno com os métodos e atributos privados, contido em outro círculo
maior com os métodos e atributos públicos. O círculo mais interno é inacessível de
fora e acessível aos componentes públicos do objeto, enquanto estes são acessíveis
de dentro e de fora. Imagem encontrada no Google Imagens.' src="assets/poo-
programacao-orientada-a-objetos/encapsulation.png"/></p>
Mas então, como sabemos como o nosso carro acelera? É simples: não sabemos. Nós só
sabemos que para acelerar, devemos pisar no acelerador e de resto o objeto sabe
como executar essa ação sem expor como o faz. Dizemos que a aceleração do carro
está *encapsulada*, pois sabemos o que ele vai fazer ao executarmos esse método,
mas não sabemos como - e na verdade, não importa para o programa como o objeto o
faz, só que ele o faça.
O mesmo vale para atributos. Por exemplo: não sabemos como o carro sabe qual
velocidade mostrar no velocímetro ou como ele calcula sua velocidade, mas não
precisamos saber como isso é feito. Só precisamos saber que ele vai nos dar a
velocidade certa. Ler ou alterar um atributo encapsulado pode ser feito a partir de
*getters e setters* (colocar referência).
Esse *encapsulamento* de atributos e métodos impede o chamado *vazamento de

escopo*, onde um atributo ou método é visível por alguém que não deveria vê-lo,
como outro objeto ou classe. Isso evita a confusão do uso de variáveis globais no
programa, deixando mais fácil de identificar em qual estado cada variável vai estar
a cada momento do programa, já que a restrição de acesso nos permite identificar
quem consegue modificá-la.
### Exemplo em Java
```
public class Carro {
private Double velocidade;
private String modelo;
private MecanismoAceleracao mecanismoAceleracao;
private String cor;
/* Repare que o mecanismo de aceleração é inserido no carro ao ser construído,

e
não o vemos nem podemos modificá-lo, isto é, não tem getter nem setter.
Já o "modelo" pode ser visto, mas não alterado. */
public Carro(String modelo, MecanismoAceleracao mecanismoAceleracao) {
this.modelo = modelo;
this.mecanismoAceleracao = mecanismoAceleracao;
this.velocidade = 0;
}

this.mecanismoAceleracao.acelerar();
}

}

}
public Double getVelocidade() {

return this.velocidade
}
private void setVelocidade() {

/* código para alterar a velocidade do carro */
/* Como só o próprio carro deve calcular a velocidade,
esse método não pode ser chamado de fora, por isso é "private" */
}
public String getModelo() {

return this.modelo;
}
public String getCor() {

return this.cor;
}
/* podemos mudar a cor do carro quando quisermos */

public void setCor(String cor) {
this.cor = cor;
}
}
```
### Exemplo em Python

```
# Exemplo da classe Carro em Python
class Carro:
def __init__(self, modelo, mecanismoAceleracao):
self.__modelo = modelo;
self.__velocidade = 0
self.__mecanismoAceleracao = mecanismoAceleracao
def acelerar(self):
mecanismoAceleracao.acelerar()
def frear(self):
def getVelocidade(self):
return self.velocidade
def __setVelocidade(self):
# Codigo para alterar a velocidade por dentro do objeto
def getModelo(self):
return self.modelo
def getCor(self):
return self.cor
def setCor(self, cor):

self.cor = cor
```
## Herança
No nosso exemplo, você acabou de comprar um carro com os atributos que procurava.
Apesar de ser único, existem carros com exatamente os mesmos atributos ou formas
modificadas. Digamos que você tenha comprado o modelo Fit, da Honda. Esse modelo
possui uma outra versão, chamada WR-V (ou "Honda Fit Cross Style"), que possui
muitos dos atributos da versão clássica, mas com algumas diferenças bem grandes
para transitar em estradas de terra: o motor é híbrido (aceita álcool e gasolina),
possui um sistema de suspensão diferente, e vamos supor que além disso ele tenha um
sistema de tração diferente (tração nas quatro rodas, por exemplo). Vemos então que
não só alguns atributos como tambm alguns mecanismos (ou métodos, traduzindo para
POO) mudam, mas essa versão "cross" ainda é do modelo Honda Fit, ou melhor, *é um
tipo* do modelo.
<p align="center"><img alt='Imagem representando a taxonomia de animais. Nele, uma

hierarquia com a classe "Animal", que é o primeiro nível da hierarquia, com as
classes "Mamífero" e "Ave" que herdam de "Animal" e, no último nível, as classes
"Cachorro" e "Homem" herdando de "Mamífero" e "Beija-flor" herdando de "Ave".
Imagem encontrada no Google Imagens.' src="assets/poo-programacao-orientada-a-
objetos/inheritance.png"/></p>
Quando dizemos que uma classe A *é um tipo de* classe B, dizemos que a classe A
*herda* as características da classe B e que a classe B é *mãe* da classe A,
estabelecendo então uma relação de **herança** entre elas. No caso do carro,
dizemos então que um Honda Fit "Cross" *é um tipo de* Honda Fit, e o que muda são
alguns atributos (paralama reforçado, altura da suspensão etc), e um dos métodos da
classe (acelerar, pois agora há tração nas quatro rodas), mas todo o resto
permanece o mesmo, e o novo modelo recebe os mesmos atributos e métodos do modelo
clássico.
### Exemplo em Java
```
// "extends" estabelece a relação de herança dom a classe Carro
public class HondaFit extends Carro {
public HondaFit(MecanismoAceleracao mecanismoAceleracao) {

String modelo = "Honda Fit";
// chama o construtor da classe mãe, ou seja, da classe "Carro"
super(modelo, mecanismoAceleracao);
}
}
```
```
# As classes dentro do parênteses são as classes mãe da classe sendo definida
class HondaFit(Carro):
def __init__(self, mecanismoAceleracao):

modelo = "Honda Fit"
# chama o construtor da classe mãe, ou seja, da classe "Carro"
super().__init__(self, modelo, mecanismoAceleracao)
```
## Interface
Muitos dos métodos dos carros são comuns em vários automóveis. Tanto um carro
quanto uma motocicleta são classes cujos objetos podem acelerar, parar, acender o
farol etc, pois são coisas comuns a automóveis. Podemos dizer, então, que ambas as
classes "carro" e "motocicleta" *são* "automóveis".
Quando duas (ou mais) classes possuem comportamentos comuns que podem ser separados
em uma outra classe, dizemos que a "classe comum" é uma *interface*, que pode ser
"herdada" pelas outras classes. Note que colocamos a interface como "classe comum",
que pode ser "herdada" (com aspas), porque uma interface não é exatamente um
classe, mas sim um conjunto de métodos que todas as classes que herdarem dela devem
possuir (implementar) - portanto, uma interface não é "herdada" por uma classe, mas
sim *implementada*. No mundo do desenvolvimento de software, dizemos que uma
interface é um "contrato": uma classe que implementa uma interface deve fornecer
uma implementação a **todos** os métodos que a interface define, e em compensação,
a classe implementadora pode dizer que ela é do tipo da interface. No nosso
exemplo, "carro" e "motocicleta" são classes que implementam os métodos da
interface "automóvel", logo podemos dizer que qualquer objeto dessas duas primeiras
classes, como um Honda Fit ou uma motocicleta da Yamaha, são automóveis.
Um pequeno detalhe: uma interface não pode ser herdada por uma classe, mas sim
implementada. No entanto, uma interface pode herdar de outra interface, criando uma
hierarquia de interfaces. Usando um exemplo completo com carros, dizemos que a
classe "Honda Fit Cross" herda da classe "Honda Fit", que por sua vez herda da
classe "Carro". A classe "Carro" implementa a interface "Automóvel" que, por sua
vez, pode herdar (por exemplo) uma interface chamada "MeioDeTransporte", uma vez
que tanto um "automóvel" quanto uma "carroça" *são* meios de transporte, ainda que
uma carroça *não seja* um automóvel.
### Exemplo em Java
```
public interface Automovel {
void acelerar();
void frear();
void acenderFarol();
}
public class Carro implements Automovel {
/* ... */
@Override
this.mecanismoAceleracao.acelerar();
}
@Override
}
@Override
}
/* ... */
}
public class Moto implements Automovel {
/* ... */
@Override
/* código específico da moto para acelerar */
}
@Override
/* código específico da moto para frear */
}
@Override
/* código específico da moto para acender o farol */
}
/* ... */
}
```
```
class Automovel():
def acelerar(self):
raise NotImplementedError()
def frear(self):
class Carro(Automovel):
# ...
def acelerar(self):
# Codigo para acelerar o carro
def frear(self):
# ...
class Moto(Automovel):
# ...
def acelerar(self):
# Codigo para acelerar a moto
def frear(self):
# Codigo para frear a moto
# Codigo para acender a moto
# ...
```
Nota: criar um erro do tipo `NotImplementedError` é apenas uma conveção para que,
caso uma classe filha tente executar um método da classe mãe sem tê-la
implementado, ocorra o erro. Em Python, as interfaces são criadas como classes
normais que são herdadas pelas classes filhas. Existem formas de forçar a
implementação por parte das classes filhas, mas para nosso exemplo essa abordagem é
suficiente.
## Polimorfismo
Vamos dizer que um dos motivos de você ter comprado um carro foi a qualidade do
sistema de som dele. Mas, no seu caso, digamos que a reprodução só pode ser feita
via rádio ou *bluetooth*, enquanto que no seu antigo carro, podia ser feita apenas
via cartão SD e *pendrive*. Em ambos os carros está presente o método "tocar
música" mas, como o sistema de som deles é diferente, a forma como o carro toca as
músicas é diferente. Dizemos que o método "tocar música" é uma forma de
**polimorfismo**, pois dois objetos, de duas classes diferentes, têm um mesmo
método que é implementado de formas diferentes, ou seja, um método possui *várias
formas*, várias implementações diferentes em classes diferentes, mas que possuem o
mesmo efeito ("polimorfismo" vem do grego *poli* = muitas, *morphos* = forma).
### Exemplo em Java

```
public class Main {
public static void main(String[] args) {
Automovel moto = new Moto("Yamaha XPTO-100", new
MecanismoDeAceleracaoDeMotos())
Automovel carro = new Carro("Honda Fit", new
MecanismoDeAceleracaoDeCarros())
List<Automovel> listaAutomoveis = Arrays.asList(moto, carro);
for (Automovel automovel : listaAutomoveis) {
automovel.acelerar();
automovel.acenderFarol();
}
}
}
```

```
def main():
moto = Moto("Yahama XPTO-100", MecanismoDeAceleracaoDeMotos())
carro = Carro("Honda Fit", MecanismoDeAceleracaoDeCarros())
listaAutomoveis = [moto, carro]
for automovel in listaAutomoveis:
automovel.acelerar()
automovel.acenderFarol()
```
Repare que apesar de serem objetos diferentes, `moto` e `carro` possuem os mesmos
métodos àcelerar` e àcenderFarol`, que são chamados da mesma forma, apesar de
serem implementados de maneira diferente.
# Design Patterns
Alguns problemas aparecem com tanta frequência em **POO** que suas soluções se
tornaram padrões de design de sistemas e modelagem de código orientado a objeto, a
fim de resolvê-los. Esses **padrões de projeto**, (ou **design patterns**) nada
mais são do que formas padronizadas de resolver problemas comuns em linguagens
orientadas a objetos. O livro "Design Patterns", conhecido como **Gof:Gang of
Four**, é a principal referência nesse assunto, contendo os principais padrões
usados em grandes projetos. A Alura também oferece cursos de *Design Patterns* em
linguagens de programação como [Java], [Python] e [C#].
# Clean code e SOLID
Em projetos desenvolvidos com POO, assim como em qualquer outro, o cdigo pode se
tornar desorganizado e dificil de manter a médio e longo prazo. Em vista dessa
situação, alguns princípios de boas práticas de programação e código limpo foram
desenvolvidos como, por exemplo:
- KISS (*Keep It Simple, Stupid*, "Mantenha as coisas simples"): Sempre que um

código for escrito, ele deve ser escrito da forma mais simples possível, para
manter o código mais legível. Códigos complexos demais são mais difíceis de se
manter, j que é mais difícil entender o que ele faz e como ele faz.
- DRY (*Don't Repeat Yourself*, "Não se repita"): Todo código escrito para resolver
um problema deve ser escrito apenas uma vez, a fim de evitar repetição de código. É
quase uma variação do KISS, dado que a repetição de código o torna mais confuso e
difícil de manter e corrigir, se necessário.
Além dos **design patterns** e dos princípios de código limpo existe um conjunto de
técnicas, mais generalizadas que os design patterns, que ajudam a criar código
orientado a objeto de forma a deixá-lo mais maleável, possibilitando uma manutenção
e expansão mais suave e descomplicada do código ao longo do tempo.
Alguns cursos da Alura abordam esses assuntos, como o curso de [SOLID com Java],
[SOLID com PHP], e também nosso [artigo sobre o que é Clean Code].
O **ES6** introduziu o conhecido **Template String ou Template Literals**, onde

conseguimos criar cadeias de caracteres, utilizando outra forma de interpolação que
não fosse o sinal de +.
Como faríamos uma interpolação da maneira antiga?
javascript
As coisas tendem a ficar mais complexas quando envolvemos mais variáveis e

expressões no nosso código, como podemos fazer atualmente ?
# Usando Template Literal
Para utilizarmos uma Template Literal, é necessário utilizarmos o backtick (acento

grave da língua portuguesa), para realizar a **interpolação**, utilizamos a notação
de `${}`
javascript
O que poucas pessoas conhecem é a possibilidade de utilizarmos esse Template junto

de uma função criada para trabalhar no contexto desse Template.
# Definição
Uma Tagged Template é uma chamada de função onde os argumentos são derivados de uma
Template Literal. Os valores desses argumentos incluem um **Template Object** (que
nada mais é do que o objeto representativo das Template Literals) e os valores
produzidos após avaliação das expressões embutidos em uma Template Literals (`${}`)
Essa possibilidade acaba sendo ignorada pela maioria dos desenvolvedores.
Mas o que é essa **Tag** que é mencionada no nome? O que essa definição acima quer
dizer?
Vamos por partes…
# Tag
A tag nada mais é do que a própria função que será chamada através da utilização da
Template Literals. Vamos ao exemplo para ficar mais claro.
Estamos mais acostumados a ver chamadas de funções dessa forma:
javascript
Porém, utilizando Tagged Template Literals, nossa chamada para a função seria
executada da seguinte maneira:
javascript
Naturalmente pensamos que as duas chamadas são equivalentes, porém isso NÃO é
verdade.
O que ocorre é que quando utilizamos Template Literals para realizar a chamada de
uma função, o parâmetro pode ser passado de duas formas.
Quando nossa Template Literals é composta apenas de uma string, sem a necessidade
de se avaliar valores de variáveis interpoladas, nosso parâmetro é um **array**,
veja abaixo:
javascript
Repare que recebemos o parâmetro sendo um array, de fato, isso não é algo trivial,
mas calma!
Tem explicação!
Lembra lá em cima no começo do texto quando relembramos Template Literals (Template

Strings)?
Uma dos poderes desse Template Literals é a capacidade de **interpolar** os valores

de variáveis e é justamente por isso que recebemos um array como parâmetro.
Vamos ao exemplo, reescrevendo nossa função:
javascript
Quando utilizamos a notação `${}` no meio de uma sentença, nossa string é quebrada
ao meio, vamos ver como seria uma função semelhante utilizando a notação que
conhecemos.
javascript
Veja agora que na verdade, temos um Array de cadeias de caracteres e essas cadeias
são determinadas pelo posicionamento da nossa interpolação!
Analogamente, todos os valores interpolados são passados um a um após o Array,
respeitando a ordem em que aparecem na Template Literals, veja o exemplo abaixo:
javascript
Pegou a ideia?
Mas agora vem a pergunta que não quer calar…
Onde posso utilizar Template Literals? Vamos ver alguns usos bacanas!
# Colocando a mão na massa
Vamos criar um método que irá destacar uma frase em negrito (tag strong) tudo que
for passado através de `${}`
javascript
Nosso método utiliza **spread operator** para receber um número variável de valores
interpolados e uma lógica utilizando reduce, onde acumulador é o valor retornado no
último **callback**, string é o valor atual e i é o índice do elemento que está
sendo processado.
No nosso caso, o reduce retornará uma **string** com os valores que foram
interpolados, envolvidos pela tag strong do HTML. Repare que o retorno do nosso
método é justamente os valores interpolados envolvidos por uma tag strong!
Sensacional!
Esse foi apenas um pequeno exemplo do que podemos fazer com Tagged Template
Literals.
No mundo **React**, vemos bastante Tagged Template Literals quando utilizamos

styled-components em nosso projeto.
# Conclusão
Apesar de não ser amplamente utilizado entre os desenvolvedores, é importante
termos grande parte das ferramentas da linguagem em nosso cinto de utilidades, já
que nunca sabemos quando poderemos precisar.
Definir se Tagged Literals será algo popular cabe a nós desenvolvedores, portanto,
deve partir de cada um optar por usar ou não essa funcionalidade.
Se ficou interessado em como o **Javascript** funciona e como você pode utilizá-lo

melhor, aqui na **Alura** temos uma [**formação engenheiro front-end**]. Nela, você
verá como programar em Javascript, e conhecer algumas novidades do ES6.
Grid basicamente consiste em dividir uma proporção da tela do usuário em partes

iguais com espaçamento entre elas.
Os smartphones já são praticamente parte de mão de todo mundo que possui um, o
tempo todo acessamos apps de todo tipo (até lembrar de tomar água) e em alguns
momentos até esquecemos que por trás de vários desses existe uma versão web que
funciona tão bem quanto.
imagem: Estrutura que divide espaços dentro de um container (pode ser feito com
combinações de float e width, flexbox ou mesmo em cima do [Grid Layout do CSS])
- Gutter: é o nome do espaçamento que se dá entre as colunas de um grid, no modelo
que fizemos definimos ele com padding nas colunas
- Row: No exemplo eu não coloquei em todos os casos, mas poderiamos criar esse
elemento que serviria como um dividor horizontal dentro dos grids e que reseta o
padding aplicado no container deixando as colunas com o máximo possível de tamanho
dentro do mesmo.
Os nomes das classes do CSS aqui acabam considerando como se cada pedaço do grid
fosse algo único, mas nada impede de você [organizar o CSS da forma que achar
melhor com algo como o BEM CSS], desde que fique fácil para seu time usar e manter
ao longo do projeto.
> Mas e como isso funciona no responsivo?
### Trabalhando com Media queries e Grids
Para deixarmos esse grid responsivo basta adicionarmos [media queries] que alterem
o tamanho do nosso container:
<iframe height="265" style="width: 100%;" scrolling="no" title="Grid: Colunas +

Responsivo" src="https://codepen.io/omariosouto/embed/RwwJOLj?height=265&theme-
id=default&default-tab=css,result" frameborder="no" allowtransparency="true"
allowfullscreen="true"></iframe>
Na prática os grids que fazemos hoje tomam como base algumas convenções como que a
menor tela de celular é do iPhone 4 que possui 320px de pixels reais, a tela média
de um tablet possui 480px a tela média de um desktop possui 1120px e assim por
diante (esses valores podem variar de acordo com cada projeto e as telas do
momento). Em cima dessa base o designer do projeto imagina como o conteúdo pode ser
distribuido dividindo a área máxima possível de mostrar conteúdo, também chamada de
container em muitos casos, e em colunas.
## Como funciona o grid do Bootstrap 4 com Flexbox?
O bootstrap 3 possuia o estilo anterior de grid com float que vimos e em sua nova
versão utilizando flexbox algumas coisinhas mudaram:
<iframe height="265" style="width: 100%;" scrolling="no" title="Grid: Flexbox

baseado no do Bootstrap " src="https://codepen.io/omariosouto/embed/NWWzmem?
height=265&theme-id=default&default-tab=css,result" frameborder="no"
allowtransparency="true" allowfullscreen="true"></iframe>
- Container: a ideia aqui continua a mesma

- Row: Agora a row tem o papel de aplicar o flexbox nos elementos filhos
- Col: Um col sozinho tem o comportamento de ocupar o máximo de área disponível e
com mais de um isso vai sendo ajustado automaticamente
- Cada col ainda continua possuindo um gutter pré definido de espaçamento
horizontal
- Col-X: X é o numero de colunas que um elemento irá ocupar, isso é feito com um
mix de flex-basis e max-width
Existem outras variações de como utilizar o grid novo do bootstrap, se quiser se se

aprofundar mais, da uma olhada na [documentação deles] e imagino que agora vai
ficar mais fácil de conseguir usar :)
## Grids com Grid Layout
Seguindo a ideia de resolver alguns problemas do CSS, [como centralizar coisas], a

spec do Grid Layout surgiu como uma forma de ter algo da própria plataforma web
para lidar com grids.
Embora o nome de uma ideia de que ele seria a bala de prata quando falamos nesse
tema, vale lembrar que a simplicidade do código é algo importante e em vários casos
o uso dessa spec nova pode deixar o código mais complexo/confuso, então use com
parcimonia e [se quiser saber mais sobre indico esse post aqui da alura].
E tem também [esse joguinho super bacana] que vai ti guiar pelas diversas
propriedades da spec.
## Dicas extras
## Como simular diferentes tipos de tela no dia a dia de forma fácil?
![Botão que habilita e desabilita o simulador de resoluções no Chrome]
Para simular diferentes resoluções no dia a dia, não se esqueça de que no devtools
da maioria dos navegadores, hoje nós temos um ícone que habilita um modo onde fica
fácil trocar de resolução.
![Site da alura alternando em resoluções de tela]
### Design systems
Se você está interessado em grid, deixo a dica para você aprender sobre design
systems também. Muitas pessoas descobrem esse tópico olhando como alguma marca
organiza seus componentes por meio de alguma ferramenta como o [Storybook], hoje
formas de documentar e organizar componentes são o hype do momento no mundo do
Front End e pegar referências pode ti ajudar bastante a chegar em algo mais sólido
nas interfaces de onde você trabalha. [Esse repositório no github é uma central de
links e posts sobre o tema].
### Site com grid responsivo ou site com versão mobile?
Essa pergunta é comum para quem está chegando na web e o que posso dizer é que
depende e muito. Como primeira opção até pensando principalmente em manutenção é
melhor ter somente um website, um código só com uma codebase só ajuda a evitar bugs
e ficar em muitos casos replicando código ou criando estratégias para compartilhar.
Aplicações gigantes como o facebook tem sua versão específica para sites mobile
pelo fato da interface ser tão complexa que a solução mais rápida acabou sendo
criar um novo site, mas pense bem sobre e antes de me despedir por aqui vou deixar
esse [excelente post do Sérgio Lopes sobre design responsivo]
## Conclusão
Hoje nós aprendemos que a base dos grids giram em torno de entender o que são os
Containers, Rows e Cols. Seja com float, flexbox ou grid layout o importante é
conseguir deixar de um jeito fácil qualquer site que você vá desenvolver
responsivo.
Caso você queira mais dicas sobre o mundo do Front End, da uma olhada na minha
série aqui na alura [Fronteiras do Front End]
Por hoje é isso,espero que tenha gostado, em breve trarei mais dicas sobre diversos
outros tópicos relacionados a Front End, não deixe de me seguir nas [minhas redes
sociais] e acompanhar meus outros artigos em meu site pessoal
[https://mariosouto.com].
Nesse artigo, trabalharemos com um aplicativo que lista filmes:
Fomos contratados para desenvolver um aplicativo que contém um catálogo de filmes.

Quando o usuário acessa o aplicativo, uma lista com os filmes é apresentada:
imagem do ViewController:
swift
Agora temos a lista de filmes:
imagem` espalhado pelo código.
O problema é o print que temos no caso de erro, onde simplesmente estamos

imprimindo o erro do servidor no console.
Vamos dar uma olhada na mensagem de erro:
imagem vamos implementá-la:
swift
Vamos testar novamente:
![]
Ótimo, agora estamos apresentando um alerta para o usuário indicando qual foi o
problema.
## Requisições e avisos
Fazer requisições para buscar informações é uma tarefa comum no desenvolvimento.

Seja em aplicações mobile, web, e até mesmo em algumas aplicações desktops.
Porém, algumas vezes não existe a conexão com a internet. Então como fazemos? Uma
forma, é mostrar uma mensagem para o usuário falando que a conexão com a internet é
requerida.
Além dessa forma, existem diversas outras que podemos utilizar para tratar esse
tipo de erro. Como, por exemplo, fazendo um cache da última requisição e utilizar
esses dados para compor a tela que desejamos.
Aqui na Alura, temos uma [**formação IOS**]. Nela você aprenderá técnicas de
construção de layouts que ajudem na experiência do usuário, formatar dados como
CPF, CNPJ, e até comunicação com web services.
imagem
Ser designer permite a atuação em variadas áreas, e uma delas é a fotografia. Ela
pode estar presente dentro do curso de design como disciplina das graduações de
design gráfico, industrial, moda e produto... Mas, além disso, é capaz de ser
estudada fora do ambiente acadêmico em diversos outros contextos e possibilidades.
Você está conhecendo esse mundo agora? Então, é importante saber por que design e
fotografia podem se complementar e entender a importância que um curso de
fotografia em sua qualificação profissional!
## Afinal, qual a relação entre design e fotografia?
Desde o início dos tempos os homens procuraram se comunicar e expressar as suas

ideias, usando sons, imagens, signos, evoluindo as técnicas de comunicação com o
passar dos anos.
Assim, em dado momento a busca passou a ser pela melhor forma de conservar um
conteúdo. Chegamos à impressão a partir do papel, que, além de útil, tinha um preço
acessível e estava ao alcance de todos.
Dessa maneira, o uso da fotografia para expressar ideias fez-se necessário,

contribuindo para o nascimento do [**design**] e da própria fotografia.
## Qual a importância de se ter um curso de fotografia no currículo?
Como em qualquer outra área, um profissional de design quer ser bem-sucedido e,

para isso, é importante vender seus projetos
Um designer deve ter em mente que precisa sanar uma necessidade: a vontade do
cliente. Logo, precisa trabalhar bem em seu produto, na imagem geral dele e em como
causar boas reações. Quando um trabalho consegue atingir essas características, com
certeza significa que foi bem-feito.
Logo, a importância de se produzir e compartilhar imagens ou fotos com ótima

qualidade dos seus produtos se reflete na própria divulgação dela, como também na
personalidade do seu tipo de trabalho e nos créditos que seu negócio tem.
Dessa forma, projetos visuais que se encontram em baixas resoluções e sem nenhuma
criatividade, mensagem ou contexto, serão totalmente ignorados por possíveis
clientes, e não é isso que você quer, certo? Então, um [curso] pode melhorar e
muito essa perspectiva.
Sem se qualificar, você corre o risco de tirar fotos, mesmo com uma câmera de nível
profissional, sem nenhum conceito, objetivo e linha de raciocínio sobre o que se
deseja produzir.
Se o seu objetivo com esse trabalho é vender, divulgar, atrair, mostrar sua marca,
se promover ou adquirir simpatia do público, é preciso bem mais que somente tirar
algumas fotos e sair postando por aí.
É fundamental fazer um [**curso de fotografia**] se você, como designer, deseja que

seu trabalho possua uma identidade e que os seus projetos ou serviços sejam
exibidos de uma maneira interessante e atraiam seu público-alvo.
A importância que a fotografia tem nas peças de publicidade, como ilustrações de

marketing, obras artísticas e outros, está aí para comprovar essa importância da
qual estamos falando. O trabalho de encantamento que a fotografia possui no mercado
é consequência da imagem criativa e de boa qualidade que se é feita a partir dela.
Para exibir e vender produtos pelos meios da internet, por exemplo, a importância
da fotografia se torna ainda maior, pois, por mais que o cliente não possa tocar
nos itens, as fotos são os meios de suprir a experiência que ele teria com o
produto real.
Detalhando ainda mais o assunto, você saberia responder qual seria a importância de
um [**curso fotográfico**] para algumas das principais áreas de design? É o que
vamos conferir a seguir:
### Design de moda
Não é somente o ato de tirar fotos da vitrine ou de modelos que vai mostrar, de
fato, o produto. É preciso imaginar como as outras pessoas estão vendo aquela peça!
É essencial preparar o ambiente pensando em como é possível chamar a atenção do

cliente e em como ele enxergará o produto. Você deve saber evidenciar os pontos
mais fortes de cada peça de roupa à venda e saber compartilhar essas fotos com a
estratégia e edição certas. Partindo dessa ideia, a melhor forma de se preparar é
tendo especialização e domínio sobre o modo fotográfico.
### Marketing digital
Por fazer uso de tecnologias móveis, como celular, computadores, tablets, entre
outros, é preciso saber bem como usar a [imagem] no marketing digital. Não adianta
somente ter o preço e a descrição do produto vendido.
Sabemos que as pessoas adquirem produtos pela internet somente não só com a visão
que elas têm do produto, mas o primeiro impacto certamente será o da imagem da
mercadoria.
Para isso, é essencial pensar em como você vai apresentar os produtos; nos fundos,
nos detalhes, na posição, nas cores que serão utilizadas e, principalmente, na
qualidade. Por ter feito um curso de fotografia, todas essas ideias estarão muito
mais frescas na sua memória. Além disso, terão um embasamento teórico.
### Design gráfico
Em geral, o uso fotográfico para o design é como uma ferramenta de ajuda para o
profissional; contudo, no campo de design gráfico, ela também tem outro caráter
importante: é uma forma linguagem para a comunicação visual — o que representa um
ponto crucial para o campo gráfico.
O profissional usa a fotografia para atingir seus objetivos e, se bem usada, ela
pode se tornar uma solução para os seus projetos. E por que isso ocorre? Pois a
fotografia tem o potencial de transmitir mensagens, despertar sentimentos e
retratar ideias.
Ao ter concluído um curso, todas essas características estarão ao favor do

designer. A fotografia serve de apoio para o decorrer do projeto, como dos
[**esboços gráficos**], podendo ser aplicada na produção ou na criação, ficando ao
desejo do profissional.
Portanto, o conhecimento em fotografia para um designer pode agregar e muito para a

sua qualificação profissional e amostragem dos seus produtos ou projetos.
Entendendo como funciona a relação dessas duas áreas e os benefícios que um curso
de fotografia traria para a sua carreira, você pode conseguir melhorar sua posição
no mercado de trabalho. E essa é uma grande vantagem competitiva, não é mesmo?
Então, gostou do nosso post? Então, não perca tempo e assine a nossa newsletter.
Receba em seu e-mail conteúdos relevantes sobre a sua futura área de trabalho!
Se você é um designer ainda na faculdade ou está começando sua carreira como

[**freelancer**], é bem difícil ter acesso às ferramentas de design mais usadas no
mercado. Os softwares são caros, sua remuneração ainda é baixa e você precisa
conciliar muitos outros gastos.
Por isso é tão comum que designers iniciantes recorram à pirataria. Mas você
precisa mesmo dela para o seu trabalho?
## Por que piratear não vale a pena
A pirataria é uma solução fácil para o maior problema de um designer iniciante: a

falta de dinheiro para investir na carreira.
Sites de torrents e downloads ilegais deixam qualquer software a um clique de

distância. Mas o que parece simples pode ter implicações sérias que muitas vezes
passam desapercebidas por quem precisa destas ferramentas para seu trabalho.
### Piratear é crime
Este é o motivo mais óbvio, mas ignorado por quem precisa de qualquer forma usar um
software caro. Baixar e usar qualquer programa sem uma licença legítima do
desenvolvedor é crime previsto em lei.
Apesar de haver uma noção geral de que este é um crime sem punição, novos sistemas
e empresas de segurança vêm se tornando cada vez mais eficientes na busca de quem
pirateia softwares.
### Coloque-se no lugar do desenvolvedor
Além de ser crime, você deve pensar também na ética na hora de piratear ferramentas
de design. Designers deveriam entender esta parte mais do que a maioria dos
profissionais de outras áreas: quantas vezes um cliente já quis um serviço de graça
ou pagando menos do que vale o seu trabalho?
E se você gastar meses para terminar uma arte, um tema para sites ou uma peça de
design e outra pessoa utilizar sem pagar ou sem sua autorização?
Os softwares mais usados no mercado são tão bons porque muita gente trabalhou para
que ele se tornasse o que é. Coloque-se no lugar dessas pessoas e imagine como você
ia se sentir se roubassem o seu trabalho.
### Malwares e o risco de invasão
**Softwares piratas não são apenas ilegais como também perigosos.**
Para burlar a segurança de qualquer programa, é necessário usar _cracks_ que

modificam seu código original. Esta é a brecha que uma pessoa mal-intencionada
precisa para inserir programas espiões e comandos maliciosos.
Malwares são pequenos softwares camuflados que, quando instalados em seu

computador, podem roubar informações sigilosas ou até permitir que outra pessoa
assuma o controle do seu PC. Por isso, tenha muita atenção ao instalar um programa
pirata!
## Ferramentas de design gratuitas ou mais acessíveis
O principal ensinamento para um designer que está [**iniciando a sua carreira**] ou

ainda cursa a faculdade é que os softwares são apenas ferramentas. Um bom designer
trabalha bem nem que seja apenas com um papel, um lápis, tesoura e cola.
Mesmo que você já tenha se acostumado com ferramentas mais estabelecidas no mercado
como Photoshop e Illustrator, é importante que você conheça outras ferramentas, não
só para evitar a pirataria como para não depender de uma única solução.
### GIMP
O [GIMP] é a alternativa ao Photoshop mais usada no mundo, por oferecer um ambiente

de trabalho muito similar ao software da Adobe. Ele é grátis, bastante customizável
e possui uma enorme quantidade de tutoriais e documentação para te ajudar a
começar.
### Inkscape
O [Inkscape] segue o mesmo caminho do GIMP como uma alternativa ao Adobe

Illustrator e ao CorelDRAW. Da mesma forma que o primeiro, ele é grátis e tem uma
grande comunidade para te dar suporte.
### Affinity
Se você quer um software mais sofisticado sem pagar tanto, o [Affinity Photo] e o
[Affinity Designer] são boas alternativas ao Photoshop e ao Illustrator por menos
de R$ 200 cada.
A desvantagem é que você vai precisar pagar em dólar, mas as duas ferramentas estão
disponíveis em uma versão beta gratuita para quem quiser experimentar.
### Opções online
Existem também várias ferramentas de design online e gratuitas, como o [Gravit] e o

[Pixlr]. Embora sejam um pouco mais limitadas, podem ser úteis para desenvolver
pequenos trabalhos.
## O que as empresas têm feito em relação à pirataria
Nos últimos anos, a maioria das desenvolvedores de softwares percebeu que a melhor
forma de combater a pirataria é oferecendo serviços melhores e vantagens para quem
trabalha legalmente. Por esse motivo, várias medidas que estas empresas estão
tomando só facilitam o trabalho do designer.
### Sistema de assinatura
Empresas grandes como a Adobe e a Microsoft estão mudando a forma como oferecem
suas ferramentas e estão trocando a venda de produtos pela assinatura de serviços.
O [Creative Cloud], por exemplo, é muito mais do que apenas ter o Photoshop no seu
computador. O assinante do serviço da Adobe tem acesso a bancos de imagens e fontes
para te ajudar a criar, armazenamento na nuvem para o seu trabalho e uma plataforma
para expor seu portfólio.
Todas essas vantagens são essenciais para um designer iniciante que quer mostrar o
seu trabalho e conseguir novos clientes, mas nenhuma delas está disponível quando o
software é pirata.
### Preços melhores para estudantes
Se você [**está na faculdade**], é ainda mais fácil ter acesso às ferramentas de

design mais utilizadas pelos profissionais. Quase todas as empresas, como a própria
Adobe, têm descontos especiais para quem ainda é estudante.
Se você conseguir fazer um esforço e ter serviços como o Creative Cloud durante a
faculdade, pode ser o suficiente para já sair dela com a carreira estabelecida e
nunca mais precisar piratear um software!
Alguns designers, no início de seus estudos e atividades, por falta de grana acabam
recorrendo à pirataria, mas o esforço em buscar softwares originais pode te
recompensar e até alavancar a sua carreira.
Seja com alternativas mais em conta ou se esforçando para ter sempre as grandes
ferramentas de design, lembre-se de que o mais importante é que você esteja
capacitado. [**Faça cursos**], aprimore sempre sua técnica, e naturalmente os
softwares piratas ficarão para trás.
Gostou da discussão? Você concorda ou tem uma opinião diferente? Compartilhe este
post nas redes sociais e veja as opiniões dos seus colegas de profissão!
Umas semanas atrás eu estava na copa da Alura jogando um Fifa com a galera e,
depois de perder vergonhosamente, fui tomar um café. Sentado em uma das mesas
estava o [Artur Diniz], instrutor da Caelum e responsável por 50% do consumo de
café e Red Bull do Brasil.
-E aí Artur, beleza? Tá fazendo o que de bom aí?

-Estudando CSS mágico que não existe.
-Oi?
-Dá uma olhada aqui.
O que eu vi foi isso: ![]
Não entendi muita coisa.
Convidei ele então pra gravação de um episódio do Alura Live pra conversarmos sobre
isso e ele me explicar o que seria esse tal CSS mágico.
Confira os melhores momentos da nossa conversa:
https://www.youtube.com/watch?v=WtTH6pd8SW8
Alguns links que citamos: [Repositório que contém as discussões do grupo de

trabalho do CSS] [Post da Lea Verou sobre gradientes cônicos] [Discussões sobre o
CSS Houdini] [Exemplos e demos das APIs do Houdini]
Alura Live vai ao ar todas as quintas, 14h, lá em nossa [página no Facebook].
Confira quais os assuntos dos próximos episódios [aqui].
Promover-se não é uma tarefa simples. Ter um bom destaque profissional dentro da
sua área requer um planejamento prévio e alguma criatividade — não se resume,
somente, a manter-se em evidência.
Você sabe do que se trata o [**marketing pessoal**]? Entende qual a importância de

estruturar um briefing de marketing? Independentemente da sua área de atuação, vale
a pena apostar no marketing pessoal para obter mais sucesso profissional e destaque
no mercado em que atua.
O artigo de hoje busca solucionar algumas dúvidas em relação a esses assuntos. Você
vai ficar por dentro de informações acerca dos benefícios de uma boa estratégia de
marketing e verá dicas incríveis de como organizar um [**briefing**] completo.
O que está esperando para estruturar um bom briefing de marketing pessoal? Mãos à
obra!
## O que é um briefing?
O briefing é uma espécie de relatório, um resumo de informações e instruções que

devem ser entendidas a fim de realizar um serviço ou atividade. Quanto mais
organizado e recheado de informações relevantes, melhor será aquela reunião de
subsídios.
Um briefing básico abrange o histórico da empresa, seu público-alvo, a lista dos

concorrentes, seus objetivos detalhados, a verba para projetos e as possibilidades
de comunicação (site, mídias sociais, relações públicas, publicidade, entre
outros).
## E o que é marketing pessoal?
**Marketing pessoal (ou personal branding)** é uma técnica estratégica e planejada

para agregar valor à imagem pessoal de alguém. Trata-se de um marketing específico
para valorização da sua imagem, de modo que os outros vejam você da forma mais
positiva possível.
O objetivo é sempre o fortalecimento de uma marca (que, nesse caso, é sua imagem),
diferente de ser apenas uma autopromoção.
É formado por um conjunto de variáveis: são diversas as maneiras de se mostrar como

uma referência em algum sentido. Porém, tudo deve ser pensado dentro de um
contexto. Aí é onde entra o briefing.
## Como compor um briefing ideal?
Um bom briefing de marketing pessoal deve conter informações sobre você:
- a delimitação de sua atuação e de seu público-alvo de interesse;

- as percepções de seu mercado;
- informações estratégicas sobre seus concorrentes e suas boas práticas;
- um detalhamento de seus canais de comunicação e relacionamento;
- os objetivos que você quer alcançar com sua iniciativa.
Responder algumas perguntas pode orientá-lo melhor na hora de estruturar o seu

material. São elas:
- O quê?
- Para quem?
- Onde?
- Quando?
- Como?
Essa é a estrutura básica de questões, mas você pode desenvolvê-las e aprofundar

mais, a fim de montar um briefing ideal. Por exemplo, pergunte-se sobre o que você
deseja vender. Para quem? Qual a sua localização? Qual período de tempo e de
prazos? Como você deseja fazer isso?
Para ajudá-lo de forma mais prática, [veja alguns exemplos]. Na hora de contestar a
questão "O quê?", você pode reunir suas formações e habilidades, bem como o que
diferencia você no mercado e tudo o que você faz de melhor no segmento de design.
A pergunta "Para quem?" vai auxiliar a compor o seu público-alvo desejado, ou seja,
definir para quem exatamente você quer vender seus serviços de comunicação visual
ou projetos.
Ao responder o tópico "Onde?", será mais capaz de delimitar a extensão para

divulgar e se relacionar com parceiros e clientes sua atuação será sustentada
somente na sua cidade, ou passará para todo o país? Isso também ajudará a definir
as plataformas e ferramentas de divulgação, de redes sociais a material de
papelaria e impressos.
Ter a certeza de que no seu briefing estarão contidas as respostas para aquelas
perguntas é fundamental para ter um material bem mais completo e incrível.
## Como estruturar um briefing de marketing pessoal?
No caso do briefing de marketing pessoal, alguns detalhes mais específicos podem e

devem ser abordados. Acompanhe as dicas abaixo:
### Faça uma honesta autoavaliação
Uma avaliação pessoal é sempre importante. Considere quem você é e tudo o que você
gosta e proporciona à sua felicidade. Busque inspirações externas, como
personalidades ou cases de sucesso.
Boa parte do que você será no futuro está relacionada à imagem que está sendo
construída hoje.
### Prepare um histórico recheado
Não se mantenha apenas naquele histórico básico. Procure abordar sua filosofia, sua
missão e adicione personalidade ao texto. Fale um pouco acerca do que você pode
oferecer.
Uma boa descrição inicial pode ser fundamental para prender a atenção até o fim do
briefing.
### Mostre o seu diferencial competitivo
Não é ético expor os concorrentes para se autopromover. É imprescindível mostrar o

que você faz de diferente de seus rivais de mercado e o que pode ser ainda melhor
no seu ramo de atuação.
Foque continuamente nos seus pontos e características positivas.
### Detalhe os seus objetivos
Procure responder a estas perguntas em um texto corrido: que atividade você está
buscando? Por que você se interessa por esse ramo? Quais objetivos você almeja
alcançar ao exercê-la? Para quem você deseja falar? Como o seu serviço pode ser
efetivo?
Explique, de forma coerente, as razões pelas quais você acredita que precisam dos
seus serviços ou produtos. Descreva um pouco do seu mercado nesse tópico. Demonstre
seu conhecimento sobre o que faz — e onde pisa.
### Tenha cuidado com a linguagem utilizada

É importante pensar em como tudo será descrito. Na linguagem, evite a
imperatividade. Utilize uma linguagem simples e fácil de ser compreendida, mas
evite também o uso de jargões e gírias. Isso pode dar uma ideia de pouco
profissionalismo.
## Quais os benefícios de ter um bom briefing de marketing pessoal?
Todo conteúdo organizado por meio de estratégias de marketing pessoal podem

[**destacar você entre os demais**]. A imagem construída sobre você é o seu cartão
de visitas.
Um dos principais benefícios de se estruturar um bom briefing de marketing pessoal

é a menor chance de cometer erros diante das boas oportunidades. Afinal, você já
terá uma boa orientação sobre o que fazer e como fazer suas táticas de mercado.
Já outro ponto positivo é antever com clareza como será a sua divulgação e a
manutenção do relacionamento com clientes e parceiros, já que é fundamental
promover o próprio trabalho e os seus melhores feitos. Não adianta muito ter uma
larga competência e ninguém saber sobre isso, certo?
O maior desafio do marketing pessoal, no entanto, é fazer com que as suas

capacidades sejam notadas de forma não invasiva. A construção de um briefing de
marketing pessoal possibilita essa dosagem, fazendo com que ela seja feita de uma
maneira mais segura. Por isso, como já dissemos, planejamento e uma boa
autoavaliação são fundamentais.
Neste artigo, iremos examinar um cenário inicial de uma solução de comércio

eletrônico em **.NET**, propondo uma nova arquitetura de **microsserviços** e
avaliando os desafios inerentes a esse tipo de abordagem.
Vamos considerar possíveis **padrões de arquitetura**, tecnologias e ferramentas

necessárias para realizar a **comunicação entre os serviços**, e ao final iremos
demonstrar uma solução de exemplo, que pode ser baixada e executada, e na qual
foram aplicados os conceitos que abordamos aqui.
O assunto “microsserviços” é extremamente vasto, portanto vamos nos focar aqui

apenas na **comunicação** entre serviços.
# Por que microsserviços?

Depois de uma estratégia de marketing bem-sucedida, as vendas em nosso website
disparam. Temos uma multidão de clientes acessando simultaneamente e o desempenho
do nosso servidor cai consideravelmente.
Os clientes, até então fiéis à plataforma, começam a reclamar nas redes sociais e
criar memes sobre a lentidão e os erros constantes do website.
Então a empresa começa a contratar profissionais de desenvolvimento e de suporte,

porém a estrutura da aplicação, **monolítica**, torna difícil para vários
profissionais trabalharem ao mesmo tempo no mesmo projeto e mesma base de código.
Para dar conta do grande volume de usuários, a equipe hospeda a **aplicação na

nuvem**, acrescentando novos servidores ou mais memória conforme necessário. Porém,
a aplicação monolítica não é **modular**, e tanto o processo de “escalar para cima”
(**acrescentar memória RAM aos servidores**) como “escalar para fora”
(**instanciando novos servidores**) aumentam muito o custo da hospedagem em nuvem.
Os desenvolvedores reclamam do tempo excessivo que a aplicação leva para carregar e

iniciar em suas máquinas. Com isso, os bugs e novas funcionalidades se acumulam e o
**“lead time” (tempo entre um chamado do cliente e a implantação)** se torna cada
vez maior.
Desenvolvedores começam a criar muitos **hot-fixes** com pouca padronização e sem

os testes de unidade adequados, introduzindo novos erros potenciais. Implantar
novas tecnologias se torna muito complexo, pois frameworks afetam o aplicativo
inteiro aumentando o custo de suporte.
Também fica difícil de entender o impacto de cada mudanças, o que exige um

cansativo teste manual. Bugs em qualquer módulo, como **vazamento de memória**,
podem derrubar a aplicação inteira e levar o website a ficar indisponível. O
resultado: clientes insatisfeitos e vendas caindo.
# Arquitetura de Comunicação de Microsserviços

Criar uma arquitetura que suporta aplicativos baseados em **microsserviços** traz
benefícios para a gestão do ciclo de vida do projeto:
> ela promove as práticas de integração e entrega contínua, graças à **modularidade

e alta granularidade dos serviços**.
Também podemos contar com menor custo de manutenção e maior agilidade na entrega de
novas funcionalidades, já que as melhorias e correções de bugs em um dado serviço
não afetarão os demais. Porém, há o outro lado da moeda: quebrar uma aplicação
monolítica em múltiplas aplicações e processos traz diversos desafios técnicos e
operacionais.
Aqui, vamos considerar apenas alguns padrões de arquitetura de comunicação que

podem ser usados em uma solução com microsserviços.
Um dos padrões mais comumente encontrados é o **Bounded Context (Contexto

Delimitado)**, que normalmente é associado ao conjunto de padrões conhecido como
**DDD (Domain Driven Design)**. Com o contexto delimitado, cada serviço tem seu
próprio modelo de dados, que é independente do modelo de outros serviços.
Com isso, o modelo de um serviço pode ser refinado continuamente, sem afetar outros
serviços. Os dados do modelo de cada serviço podem ser persistidos em uma base de
dados diferente.
Por exemplo, um serviço pode gravar registros em tabelas de **banco de dados

relacional**, enquanto outros serviços da mesma solução salvam informações em
**bancos de dados não relacional**.
As **requisições** realizadas entre microsserviços são diferentes das chamadas

entre componentes dentro de uma aplicação monolítica, pois cada serviço é executado
em seu próprio processo.
Por isso, novos desafios surgem quando a comunicação é feita entre aplicações
distribuídas: **o que acontece quando é feita uma requisição a um serviço está
indisponível, ou que leva muito tempo para responder?**
Para atender essas necessidades, as aplicações se comunicam com outros processos

através de protocolos adequados para aplicações distribuídas:
> Com **HTTP resiliente**, os componentes podem realizar requisições a **serviços

REST** com possibilidade de retentativas, caso a chamada tenha falhado na primeira
vez.
Para sistemas orientados a mensagem, **o protocolo AMQP** possibilita **pub-sub

(publicação/assinatura)** e enfileiramento de mensagens assíncronas. Quando a
comunicação entre serviços precisa ser bidirecional e feita em tempo real, os
**WebSockets** são a melhor opção.
# Conhecendo a aplicação
Vamos falar um pouco sobre nossa pequena solução de e-Commerce de exemplo que
utiliza o **ASP.NET Core** para implementar microsserviços.Ela [pode ser baixada do
GitHub] e executada em sua máquina, seguindo as instruções que estão descritas na
página do projeto.
imagem do DDD (Domain-Driven Design). Isso garante que o modelo de um serviço

possam ser modificado sem introduzir erros em outros serviços.
Como os serviços rodam em aplicações e processos separados, a comunicação entre

eles é feita de forma assíncrona e desacoplada:
> Em vez de dependências e chamadas diretas, a comunicação é feita através de

mensagens. Isso permite que uma aplicação possa delegar uma tarefa a outro serviço,
sem ter que esperar pelo término da sua execução.
## Como os serviços se comunicam, exatamente?
Quando a página inicial de produtos é carregada, a WebApp MVC conta com a

biblioteca [**Polly**] para fazer uma requisição HTTP resiliente do serviço de
`CasaDoCodigo.Catalogo`, solicitando a lista de produtos.
Nesse caso, resiliente significa que a requisição se torna tolerante a falhas:
> caso o serviço de catálogo esteja indisponível no momento em que a requisição é

feita, a aplicação MVC não produzirá uma exceção imediatamente.
Em vez disso, o middleware Polly entra em ação e realiza novas tentativas de

requisição até que o serviço responda ou até que o **número máximo de tentativas
(chamado de Circuit Breaker)** seja alcançado. Esses parâmetros são definidos por
configuração.
imagem e as publica numa fila [**RabbitMQ**], que implementa o protocolo [AMQP] e

transporta as mensagens entre os serviços através do [**Rebus**](event bus, ou
barramento de eventos).
imagem OrdemDeCompra e IdentityServer, que irão tratar de gravar os dados do novo

pedido e da alteração de cadastro do usuário, respectivamente.
Quando o serviço OrdemDeCompra lê a mensagem de novo pedido, o componente que

recebe a mensagem (**handler**) do evento não é o mesmo que grava o pedido no banco
de dados: esse papel é representado por outra classe, o **repositório de pedidos**.
Porém, em vez de invocar um método na classe de repositório diretamente, o

manipulador do evento envia um comando, que é tratado por um componente
intermediário o **mediator** implementado pela biblioteca [**MediatR**]
![]
Esse manipulador cria uma instância do repositório e invoca o método de criação de

novo pedido. Esse processo é feito para permitir o **desacoplamento** entre o
manipulador de evento do event bus e a classe de repositório de pedidos.
Podemos pensar nesses comandos como um tipo de mensagem síncrona, que é processada
dentro de um mesmo serviço. A biblioteca MediatR implementa dois padrões de
projeto: **Command e Mediator**.
No final, quando o pedido é gravado no banco de dados, o serviço OrdemDeCompra

publica uma mensagem em tempo real, feita através de [WebSockets ] com o
[SignalR.NET], notificando o cliente **JavaScript** da aplicação MVC, indicando que
o novo pedido foi gerado.
![]
Essa indicação de “novo pedido” aparece num contador de notificações na parte

superior da página do website, como é comum em diversos aplicativos hoje em dia:
![]
# Conclusão
A arquitetura de microsserviços não deve ser usada indiscriminadamente e nem deve
ser vista como panaceia para todos os males da tecnologia. Dito isto,
microsserviços é um conjunto de técnicas bastante vasto e riquíssimo para o
exercício de boas práticas e padrões de arquitetura de serviços, programação de
componentes e operações na nuvem.
Felizmente, a plataforma **.NET** está pronta para oferecer as tecnologias

necessárias para vencermos os obstáculos no desenvolvimento de soluções nessa
arquitetura. Neste artigo, vimos como usar aplicar esses padrões de arquitetura com
a ajuda de algumas tecnologias de comunicação entre serviços.
Agora, que tal você mesmo praticar um pouco a comunicação entre serviços usando
ASP.NET Core? Baixe [**o código-fonte da aplicação de exemplo**] de e-commerce
**.NET** que acompanha este artigo, e veja como funciona o código para comunicação
entre os serviços!
Para saber mais sobre aplicações web e serviços com .NET e ASP.NET Core, dê uma
olhada na nossa [**Formação .NET aqui da Alura**]! Tem também o curso de
[microservices] com Java e Spring.
Vamos imaginar o seguinte cenário: **você precisa treinar o Thiago, futuro líder de
design na sua empresa**, em Scrum e Usabilidade. Ele também deveria se aprimorar em
design com _Sketch_.
Então, você acaba escolhendo três treinamentos, todos **com duração de 7 horas** e
online, para otimizar o tempo. Ficou combinado que o Thiago fará os três cursos em
três dias, sempre nas segundas-feiras.
## O problema dos treinamentos extensos
Durante o período da capacitação, ele dedica o seu horário de trabalho

exclusivamente a ela, sem contribuir com o desenvolvimento do trabalho do seu
cargo. Ele não está disponível para a sua equipe ou para resolver situações
urgentes. Assim, é possível notar que na terça-feira, **ele chega cansado e tem
muito trabalho acumulado para fazer**.
Quando você pergunta como vão os cursos, Thiago diz que está tudo bem, mas que não
deu tempo de praticar alguns assuntos das aulas e que queria ainda pesquisar e
aprender mais sobre o tema para poder implementar as técnicas aprendidas no
trabalho de seu time.
imagem com vias mais informais, como webinars, hangouts com especialistas no
assunto, vídeos curtos no YouTube ou cursos online. Assim, os colaboradores
adquirem conhecimento e novas habilidades de diversas formas.
![Microlearning em treinamentos corporativos]
Também recomendamos que você incentive os colaboradores a consumirem conteúdos **de

forma intercalada**. Desta forma, eles podem evitar o cansaço de aprender muito
sobre um assunto de uma vez só.
Vamos voltar ao exemplo do nosso futuro líder de design, o Thiago. Em vez dele
fazer um curso extenso e depois começar outro, ele pode adotar o microlearning da
seguinte maneira: na segunda-feira, ele assiste um curso de Scrum; na terça, lê um
pouco de um livro sobre liderança; na quarta, participa de uma palestra sobre
Usabilidade; na quinta, aprimora-se praticando no Sketch; e na sexta, continua com
o curso de Scrum.
### Explore o blended learning
A combinação de recursos online e treinamentos presenciais, também chamada de

_blended learning_, pode entrar em pauta na hora de criar uma estratégia de
desenvolvimento de talentos na sua empresa.
Por exemplo, você pode **usar cursos presenciais em áreas em que é necessário
experimentar as habilidades e “pôr a mão na massa”**, enquanto os cursos online,
artigos ou webinars podem servir perfeitamente na preparação para a prática,
especializações, atualizações ou em assuntos que não requerem explicação do
instrutor em tempo real – onde o colaborador consegue aprender seguindo instruções
do curso, vídeo ou artigo.
O _blended learning_ também pode ser de grande ajuda na hora de repensar o

orçamento. Os cursos presenciais exigem investimento de tempo e recursos
financeiros além do próprio treinamento, como o deslocamento dos participantes ou
do instrutor. Assim, mesclar a capacitação presencial com cursos online auxilia
**otimizar o investimento**.
### Maximize o tempo produtivo com o mobile learning
Recomendamos também o uso do _[mobile learning]._ Essa modalidade de ensino permite

as pessoas da sua empresa a aprenderem em horários e locais mais convenientes,
possibilitando uma maior flexibilidade na hora de participar de um treinamento.
Com um **aplicativo de cursos online** em que seja possível baixar os conteúdos

para consumi-los também offline, um funcionário pode aprender até em horários que
normalmente são improdutivos, tais como o trajeto ao trabalho.
### Potencialize a cultura de aprendizado
Inclua na sua estratégia de aprendizagem pesquisa e leitura de artigos ou livros, e

incentive os colaboradores a tomarem um pequeno período do seu horário de trabalho
exclusivamente para o estudo.
![Microlearning em treinamentos corporativos]
Se os seus funcionários se interessam por **palestras** ou outros eventos que podem

acrescentar na vida profissional, isso pode ser mais um uso criativo de
microlearning. **O****s membros da equipe podem compartilhar o conhecimento com os
colegas**, assim contribuindo com uma cultura forte de aprendizado na empresa.
## Microlearning: uma aprendizagem de alto impacto
O ponto forte do microlearning é o impacto que ele pode ter nas pessoas dentro da
sua empresa, independente do tempo consumido com a aprendizagem.
Em outras palavras, **um curso online com duração de 5 horas de vídeos e exercícios
pode fazer uma diferença muito grande para um colaborador**. Este pode adquirir o
mesmo conhecimento como se estivesse participando de um treinamento mais extenso,
que interferisse no trabalho em equipe ou talvez tivesse um custo elevado para a
empresa.
Combinar as formas mais tradicionais de aprendizado corporativo com vias informais

– uso de artigos, vídeos curtos ou webinars – é um caminho que leva à eficiência e
à flexibilidade. Com o microlearning, a sua equipe consegue aprender e, ao mesmo
tempo, ser produtiva.
**E como é a sua empresa?** A sua equipe já aprende com conteúdos curtos no dia a
dia? Ou você pensa em incluir o microlearning em sua estratégia de desenvolvimento?
Para ter um time atualizado e preparado para futuros desafios do mundo corporativo,
conheça mais tendências emergentes no whitepaper **6 tendências da educação
corporativa para 2018**! [Baixe o material agora] e aplique novas metodologias e
tecnologias da forma mais proveitosa para a sua empresa.
Eu recebi uma lista de alunos em um arquivo CSV e preciso cadastrá-los no meu

sistema:
```
Alex Felipe;21
Cléber Nascimento;16
Felipe de Souza;25
João da Silva;18
Juliana Guimarães;18
Maria Cristina;23
Pâmela Aguiar;17
```
java
Preciso digitar as informações deles no meu sistema. Usarei a classe `Scanner` do

pacote java.util para receber os dados do teclado:
java
Pegando o primeiro resultado:
```
Digite o nome do aluno: Alex Felipe
Informe a data de nascimento do aluno: 21
aluno: Alex Felipe
idade: 21
```
O método `nextLine()` permite a leitura de `String` e o método `nextInt()` permite

a leitura de ìnt`. Enviando os dados para o aluno:
java
Verificando a impressão:
```
nome: Alex Felipe idade: 21
```
Ótimo, consegui cadastrar um aluno! Agora vamos cadastrar o restante dos alunos:
```
Digite o nome do aluno: Cleber Nascimento Informe a idade do aluno: 16 nome:
Cleber Nascimento idade: 16 Digite o nome do aluno: Felipe de Souza Informe a idade
do aluno: 25 nome: Felipe de Souza idade: 25 Digite o nome do aluno: João da Silva
Informe a idade do aluno: 18 nome: João da Silva idade: 18
...
```
Espera aí! Isso já está ficando cansativo! Será que eu vou ter que cadastrar todos
esses alunos na unha? Se apenas com 7 está sendo esse sofrimento imagine com mais
30! Vai tirar a paciência de qualquer um!
Além de permitir a leitura de dados por meio do teclado, a classe `Scanner`

**possibilita a leitura de arquivos**! Basta informar no construtor que ao invés de
ler pelo teclado(System.in), queremos ler um arquivo específico instanciando a
classe File do pacote java.io:
java
Pronto! Agora precisaremos ler linha por linha fazendo iterações com um while por
meio do método `hasNext()` que informa se ainda existe linhas para ler:
java
Para pegar o próximo elemento do arquivo usamos o método `next()`:
java
Se testarmos nosso código:
```
Alex Felipe;21
Cleber Nascimento;16
Felipe de Souza;25 ...
```
Ops! Dessa maneira eu não vou conseguir separar os dados do aluno... Além de fazer
a leitura do arquivo, o `Scanner` tem o método ùseDelimiter()` que **delimita a
leitura do elemento**, ou seja, determina até que ponto precisa pegar o elemento,
por exemplo, eu quero que ele pegue o elemento até aparecer um ";":
java
Executando o código mais uma vez:
```
Alex Felipe 21
Cleber Nascimento 16
Felipe de Souza 25
...
```
Ótimo! Separei as informações, agora irei instanciar os meus alunos:
java
Testando o nosso código:
```
Exception in thread "main"
java.lang.NumberFormatException: For input string: "21 Cleber Nascimento"
```
Que estranho... Problema na conversão? Que String grotesca é essa? Parecia que as
informações de nome e idade estavam separadas corretamente... O que aconteceu nesse
caso é que o nosso delimitador está separando as informações até o momento em que
ele acha um ";" entre a idade e o próximo nome do aluno não existe um ";" tem
apenas uma quebra de linha, ou seja, precisamos informar ao `Scanner` que **ao
mesmo tempo que delimitamos pelo ";" queremos que ele delimita por quebra de linha
também**:
java
O pipe(|) indica que queremos que delimite por ";" ou "\\n" que significa quebra de
linha. Testando novamente:
```
Exception in thread "main"
java.lang.NumberFormatException: For input string: "21 "
```
Outra Exception? Que doideira! Como podemos ver ele já separou a idade do nome do
outro aluno, porém ele ainda deixou uma quebra de linha e por isso não foi possível
fazer a conversão para ìnt`. Nesse caso podemos usar o método `trim()` da própria
classe `String` que ajusta o conteúdo contido na `String` **eliminando quebras de
linhas ou espaços em branco**:
java
Conferindo o resultado:
```
nome: Alex Felipe idade: 21
nome: Cleber Nascimento idade:
16 nome: Felipe de Souza idade: 25
...
```
Excelente! Agora o meu sistema é capaz de ler o arquivo CSV e cadastrar os alunos
pra mim!
Vimos que para receber dados de meios externos em java nós podemos utilizar a
classe `Scanner` que tem a capacidade de receber dados por meio do teclado ou
arquivos, porém nem sempre quando lemos as informações de um arquivo o resultado é
esperado, então precisamos sempre verificar as seguintes informações:
- Se existir algum carácter que separa cada elemento use um delimitador

- Se for necessário utilizar mais de um delimitador utilize o pipe (|)
- Se sempre estiver pegando o próximo elemento ao invés da linha inteira, sempre
use o delimitador '\\n'
Gostou da classe Scanner? Quer conhecer outras alternativas para a classe `Scanner`
e outras bibliotecas da linguagem Java? Conheça a [**Formação Java**].
Neste episódio do Alura Live, recebi o Eduardo Matos, desenvolvedor na GetNinjas,

pra falar sobre esse assunto da moda, confira:
https://www.youtube.com/watch?v=qSzFIQjS1jg
Alura Live vai ao ar todas as quintas lá em nossa [página no Facebook]. Confira
quais os assuntos dos próximos episódios [aqui].
Quer saber mais? Assista a o [episódio completo] (começa em 6:10). Não deixe de
seguir [eu], a [Alura] e o [Eduardo] no Twitter! :)
Confira também [o curso de Progressive Web Apps da Alura] e as carreiras

relacionadas: [**Formação Front End**]
Para outros cursos e carreiras, acesse a [Alura]!
Hoje muito se fala sobre UX Design. Vemos o termo sendo aplicado de diversas
formas, sendo abordado de pontos de vista diferentes, gerando polêmica em alguns
artigos e mostrando que o assunto deve ser profundamente estudado, principalmente
para os aspirantes da área, de forma que compreendam com clareza o que ele
significa.
Muitas das vezes, para que se possa entender com maior facilidade o que faz parte
de um escopo, ou o que queremos, é necessário pensar no que **não** queremos e no
que **não** faz parte do escopo também.
Partindo deste princípio, vamos abordar 6 "nãos" que todo UX Designer, ou todo
aspirante à UX Designer, deve ter em mente.
## 1 - UX Design NÃO é só Design
Quando ouvimos este nome pela primeira vez acabamos gerando essa interpretação e
associamos o Design como o trabalho de um UX Designer.
Porém, ao contrário disso, a rotina desse profissional envolve pouquíssimas vezes

softwares gráficos e muito mais planilhas, dados, pesquisas, reuniões e outros
métodos que fazem o cotidiano da área ser, em sua grande parte, longe do
computador.
Quando falamos sobre Design, estamos falando com maior precisão da área de UI
Design que é responsável pelo desenho das interfaces. O UI é apenas uma das áreas
que a Experiência do Usuário engloba.
O trabalho de um profissional de UX pede que ele esteja presente e envolvido desde

o início do projeto até depois do lançamento, de forma que ele analise, acompanhe,
monitore e até melhore continuamente o produto lançado.
As decisões sobre o Design fazem parte do processo, porém, existe um trabalho árduo
antes de chegarmos a criação das telas. Deve-se compreender que wireframe,
sitemaps, protótipos, fazem parte do conjunto mas não é só isso.
A complexidade da área envolve não só a análise dos elementos de interação com o

produto, como duplo-clique, duplo toque, slide para abertura de tela,
posicionamento dos botões e etc.
Mas também, reflexões em torno de qual necessidade o usuário possui para que meu
produto possa agregar valor para ele e se ele voltará a utilizá-lo outras vezes.
## 2 - UX NÃO tem respostas certas
A primeira parte de um trabalho em UX requer a busca por perguntas e não por

respostas. Tendo feito uma interpretação clara do problema, será muito mais fácil
encontrar a solução adequada.
Além de facilitar todo o processo no geral, saber as perguntas certas também

auxilia na apresentação da solução criada, de forma que ela seja comunicada com
clareza para o restante da equipe.
Afinal, por melhor que seja a solução, se o restante do time não a compreende, o
valor se perde.
Quanto mais questionarmos, quanto mais perguntarmos "como" e “porquê” para cada
funcionalidade, interação, ideias e etc, mais próximos estaremos de experiências
mais assertivas, que vão de encontro com a satisfação do usuário.
Muitas das vezes nesta área, a busca por perguntas certas parte de hipóteses, mas
nada em UX deve ter como base um simples "eu acho".
Em outras palavras, cada hipótese deve ser validada sempre que necessário e para
isso utilizam-se de testes, entrevistas, protótipos, novas reuniões, analytics e
tudo o que for preciso para projetar a solução mais correta possível.
## 3 - Usuários NÃO são todos iguais e você NÃO é usuário
Vale muito a pena compreender que o UX Designer, tem como papel representar o
usuário e defendê-lo em cada uma das etapas do projeto.
Ele precisa saber quem é esse usuário, qual a necessidade, de onde ele vem, e
muitas outras informações que vão auxiliar na hora de equilibrar os objetivos do
projeto com a satisfação desse usuário ao utilizá-lo.
**Existem muitos produtos parecidos no mercado, muitos serviços idênticos, cujo

diferencial é uma ótima experiência, projetada com cautela, que permite ao usuário
querer usar ou ter aquele produto específico mesmo diante dos concorrentes, gerando
o que chamamos de preferência e fidelidade.**
Devemos compreender não só sexo, lugar onde mora ou faixa etária e sim pesquisar
aspectos emocionais, necessidades, objetivos, o cenário da vida desse usuário, suas
reações, e assim criar algo sob medida para este perfil encontrado.
Ouve-se muito falar sobre **[Personas]** e na forma como elas nos ajudam a criar
usuários ficcionais que poderão ser utilizados como referência para criação,
validação e informação para o projeto.
Quando criamos proto-personas, criamos em cima de hipóteses, mas é através de

técnicas como enquetes, testes, entrevistas, pesquisas quantitativas e outras, que
conseguimos validar essas hipóteses.
Por isso é essencial sair da frente do computador e ir de encontro aos seus

usuários, conversar e identificar:
- Comportamentos
- Padrões
- Tipo de personalidades
- Necessidades
- Objetivos
- Dores e etc.
Lembre-se sempre que você não é usuário. Não se deve validar hipóteses com você
mesmo, pois ainda que você tenha perfil parecido com o tipo de público que o
projeto deseja atingir, você não é território neutro!
Sendo assim, Prepare as anotações e vá ao encontro de seus usuários.
## 4- UX NÃO é só para produtos digitais
Todos os processos que fazem parte da área podem ser considerados uma fusão de
outras áreas como Psicologia, Engenharia, Design, Tecnologia, usando conceitos de
Ergonomia e Design Centrado no Usuário que já existem há anos.
**Dessa forma, ainda que muito se ouça sobre a aplicação em produtos digitais,
também é possível encontrar a área de Experiência do Usuário na criação de
serviços, objetos e até ambientes, tudo feito a partir da identificação das
interações que o usuário terá com estes produtos.**
## 5- UX NÃO é função de uma pessoa só.
Como já dito anteriormente, a área de UX requer muitas reuniões, muita conversa e

muito debate. Desde as pesquisas iniciais até o código: Todo o esforço deve ser
feito por uma equipe multidisciplinar.
Um projeto deve ser feito por um time que engloba diferentes áreas, com diferentes
visões, onde em sessões colaborativas, reuniões ou bate-papos ocorre a mediação
destes diferentes pensamentos de forma a estruturar o projeto e levá-lo com maior
facilidade ao objetivo desejado.
## 6 - UX Designer tem que saber dizer NÃO!
**Um estrategista de UX precisa saber dizer "não". Nem tudo é ideal para um
projeto!**
Seguir tendências nem sempre é o melhor caminho, por exemplo, nem todos os usuários
saberão encontrar um menu hambúrguer ou terão uma boa experiência ao utilizar uma
rolagem infinita.
Deve-se compreender que as tendências se tornam tendências porque estão dando

certo, porém, será que o meu perfil de usuário combina realmente com o que está na
moda atualmente?
O Design não é mais importante do que usabilidade, fazer algo diferente nem sempre
trará benefícios.
Ainda existem Designers que desejam fugir do padrão, como por exemplo, retirando o
menu de navegação do topo, no entanto, já existe um comportamento padrão em nossos
usuários: para navegar eles vão procurar o menu no topo.
**Sendo assim, fugir do padrão pode gerar rejeição em alguns casos.**
Cada projeto é um projeto! Cada público tem suas características e nem sempre, por
mais que você queira, seguir determinado caminho será bom para ele. E para não ter
dúvidas de qual caminho seguir, todos os pontos citados neste artigo serão de
grande ajuda.
Obviamente, por ser uma área tão vasta, que engloba tantas características, esses
são apenas alguns pontos e que podem (e devem!) ser aprofundados e gerar novas
reflexões através de muita pesquisa, estudo e claro, "mão na massa".
O [**mercado de programação**] foi se modificando muito ao longo dos anos, trazendo

diferentes desafios e novas oportunidades.
Para discutir um pouco dessa realidade, tivemos um Alura Live com Paulo e Guilherme
Silveira falando um pouco do mercado de trabalho nessa área, respondendo dúvidas e
levantando pontos importantes para esse profissional nos dias de hoje.
Confira o que rolou na live:
https://youtu.be/wUX-tRMynHE
Na Alura nós temos diversas [**formações na área de programação**]! Prepare um

plano de estudos com um [**calendários que faça sentido para você e sua
rotina**] !!!
[**Escolha agora mesmo o seu plano**] e garanta um ano cheio de novas

oportunidades!
Dependendo do tipo do cabo, temos conexões mais rápidas, ou seja, temos uma maior
taxa de transmissão.
E da mesma forma que o [**Wi-Fi tem seus padrões**], os cabos de rede também segue
algumas especificações.
> "Mas como eu escolho um cabo de rede?"
Tudo depende da placa de rede que seu computador possui, também chamada de **NIC
(Network Interface Card)**, e do tanto de dados que sua rede trafega.
## Conhecendo os tipos de cabos
Existem basicamente dois tipos de cabos de rede, o **cabo coaxial** e o **cabo de

par trançado**.
### O cabo coaxial
O **cabo coaxial** consegue transmitir dados em até **10 Megabits por segundo**
(Mbps). Geralmente ele é usado pelos provedores de internet para conectar a rede
local da casa com a internet. É aquele cabo que liga no seu roteador.
Esse foi um dos primeiros cabos utilizados em redes locais. Como ele permite
frequências muito elevadas, este cabo também é muito usado para transmissão de
imagens para a televisão.
Apesar de conseguir alcançar grandes distâncias sem a necessidade de replicar o

sinal, quando utilizamos esse tipo de cabo para montar redes locais, temos alguns
problemas.
Quando utilizamos o cabo coaxial, nossa rede fica em uma topologia chamada de
[**Barramento**]. Essa topologia funciona, basicamente, assim:
Todos os computadores da rede são conectados a um cabo principal. Quando um

computador da rede se comunica, todos os outros esperam para poder falar. Caso dois
computadores se comuniquem ao mesmo tempo, ocorre uma colisão e os pacotes precisam
ser retransmitidos.
Logo, em redes com muitos computadores, isso se torna um problema, pois um

computador sempre precisa esperar o outro para poder se comunicar, o que provoca
atrasos no envio de pacotes.
### Já o cabo de par trançado
Este cabo é muito utilizado em redes locais, recebe este nome, pois é composto por
quatro pares de cabos que são entrelaçados entre si. Isso faz com que esse cabo
sofra menos interferências eletromagnéticas.
Esse cabo, ao contrário do coaxial, pode ser usado em topologias onde todas as
máquinas se comuniquem ao mesmo tempo. E também conseguem ser utilizados para ligar
equipamentos de redes, como [**hubs e switches**].
> "Mas como o cabo sabe qual máquina está se comunicando?"
Todo cabo de rede utiliza um conector. O cabo coaxial, por exemplo, utiliza um
conector chamado de **BNC**, já os cabos de par trançado utilizam um conector
chamado de **RJ-45**:
imagem. Está é deve ser a categoria de cabos mais utilizada.
A categoria **6** foi feita para transmitir grandes quantidades de dados. Ela
transmite de 1Gbps à 10Gbps. Esta categoria está aos poucos substituindo a
anterior.
Além dessas, existem outras categorias de cabos de par trançado, como a categoria
**5** que já está em desuso, ou a categoria **6a** que transmite dados a partir de
10 Gbps.
## Para saber mais
A escolha de cabos de rede são muito importantes, pois são eles quem de fato
transmitem os dados. Dependendo da escolha, eles podem causar um gargalo na rede
que, por consequência, ficará lenta.
Cabos metálicos, como o **cabo coaxial** e o de par trançado, podem sofrer

**interferências eletromagnéticas** de outros cabos, o que prejudica na transmissão
dos dados. Por isso, alguns cabos são "blindados" para evitar essas interferências.
A blindagem nada mais é do que uma malha de metal que cobre o cabo. Quando um cabo
de par trançado é blindado, dizemos que ele é um **cabo STP (Shielded Twisted
Pair)**.
Além desses cabos metálicos, existem outros que transmitem dados, não pela
eletricidade, mas por pulsos de luz, como é o caso da fibra ótica.
Como a fibra ótica utiliza a luz para transmitir os dados, ela não sofre
interferências de outros cabos. E, da mesma forma que os cabos metálicos, possui
categorias. Existem fibras óticas monomodo e multimodo.
A principal diferença entre esses dois tipos de fibra é que na **monomodo** a luz
não reflete dentro da fibra, enquanto na **multimodo** é refletida.
Como na monomodo a luz consegue ir direto ao destino, sem refletir, os dados

conseguem ser transmitidos com mais rapidamente chegando a terabits por segundo.
Aqui na Alura temos uma [**formação redes**], nela você verá sobre cabos de
conexão, protocolos e equipamentos de rede, além de segurança da informação.
Tenho um banco de dados com informações sobre vendas de jogos. Gostaria de saber
como estão as vendas por produtora, então agrupo como de costume:
sql
Mas repara que tem uma dezena de resultados "menores" que não estou tão
interessado. Só queremos quem vendeu mais de 500?
sql
O banco de dados não aceita resultados de funções de agregação na cláusula "where",

pois ela é usada para selecionar os registros...antes de agregar!
Subconsulta neles!
sql
Resolvido? Sim, mas com uma "volta ao mundo".
Será que o SQL já não foi espertinho pra permitir "queriar" o resultado de uma
agregação? Queria dizer que dentre os grupos que formei, aqueles que **tem** mais
de 500, em inglês: **having**.
sql
E se quer se aprofundar em SQL e banco de dados, vale conhecer nossos [**cursos de

Oracle**](/formacao-certificacao-oracle-12c) e [**cursos de SQL**] da **Alura**.
imagem
O engajamento profissional pode ser definido como a relação entre o(a) profissional
e o ambiente em que ele(a) trabalha. Mas, afinal, porque investir em estratégias de
engajamento corporativo?
# Criando um time engajado
Precisamos entender que satisfação e engajamento, embora parecidos, têm

significados diferentes. A satisfação está muito mais ligada ao que a empresa
oferece ao colaborador e ao que ele espera receber.
Porém, quando engajados, profissionais tendem a desempenhar um trabalho excelente,

pois estão alinhados aos propósitos da empresa, e não se limitam apenas a entregar
o básico.
Este alinhamento de propósitos não se resume somente ao profissional, mas ao

pessoal. Isso acontece porque os propósitos da empresa estão diretamente ligados
aos propósitos individuais dos colaboradores que encontram que encontram razão em
fazer o que foi proposto.
[**Estudos e análises**] apontam que a possibilidade de aprender e vivenciar novos

desafios é o maior benefício não-financeiro que uma empresa pode oferecer aos
colaboradores e colaboradoras.
Com isso, cria-se um ambiente corporativo saudável, que engaja e motiva os

funcionários. Todos possuem autonomia e responsabilidade para apresentar suas
ideias originais, sem medo de como elas serão recebidas pela gestão e colegas
estimulando assim uma cultura de aprendizado entre os(as) funcionários(as).
# Cultura de aprendizado
É possível criar uma nova cultura na empresa através do compartilhamento de

conhecimento, sendo a corporação grande ou pequena.
Além disso, há aprendizado contínuo, onde, além de não ficarem parados, os(as)
funcionários(as) podem sugerir novas estratégias, evoluindo a cada dia mais.
Quais outros benefícios o **engajamento corporativo** é capaz de nos oferecer?
# Vantagens do engajamento corporativo

Além da cultura de aprendizado, existem outros benefícios não-financeiros
relevantes relevantes para criar e manter o engajamento de uma equipe, são eles:
**Conhecimento individual e coletivo**: é imprescindível que a/o líder da equipe a

conheça, tanto no coletivo como individualmente, justamente para criar relações de
confiança e trabalhar as dificuldades de cada um;
**Feedbacks**: são extremamente relevantes pois norteiam a jornada profissional dos

colaboradores. Os feedbacks reconhecem os pontos positivos e ajudam a melhorar os
pontos de atenção;
**Alinhar a cultura pessoal à corporativa**: muitos funcionários sentem-se

motivados quando encontram razão nas tarefas designadas, não somente para cumpri-
la, mas pela satisfação envolvida na confecção;
**Encarar erros como algo positivo**: os erros, quando analisados e reconhecidos,

são construtivos. É possível entender como ele aconteceu, e trabalhar para diminuir
sua ocorrência;
**Aumento de resultados**, assim como foi dito anteriormente, uma equipe engajada
se esforça para entregar um trabalho excelente. Assim, é possível melhorar os
resultados da equipe e da empresa como um todo.
Citamos alguns exemplos, mas há diversas ações que, combinadas, melhoram o dia a
dia da corporação. Funcionários engajados formam equipes engajadas, que formam uma
corporação engajada e com propósitos similares, aumentando a qualidade e quantidade
de entregas.
Aqui na **Alura** temos [**planos corporativos**] que podem ajudar a **aumentar o

engajamento de seu time** por meio de nossas funcionalidades.
imagem
## O que é Gestalt?
**A psicologia da Gestalt** é uma escola de pensamento que analisa a mente e os

comportamentos humanos como um todo.
Ao tentar entender o que nos rodeia, o que a Gestalt sugere é que não nos
concentremos em cada componente pequeno, mas sim em como eles interagem uns com os
outros, em sistemas complexos.
O princípio de Gestalt desempenha, por isso, um papel importante no desenvolvimento

moderno do estudo da sensação e da percepção humana, no design e na publicidade.
## Quais são as origens da Gestalt?
Você já notou como um conjunto de luzes de Natal piscando geralmente parece se

mover? De acordo com o princípio de Gestalt, esse aparente movimento acontece
porque nossas mentes são capazes de preencher as informações faltantes.
Originando-se no trabalho de **Max Wertheimer**, o princípio orientador por trás da
Gestalt é de que o todo é maior do que a soma das suas partes. Ou seja, considera-
se que um conjunto de informações é mais relevante do que um trecho.
A crença de que o todo é maior do que a soma de suas partes levou esses teóricos à
descoberta de vários outros fenômenos da percepção. E o princípio de Gestalt ajudou
a criar a ideia de que a percepção humana não é só ver o que está contido no mundo
ao nosso redor. É também ser influenciado por uma série de motivações e de
expectativas.
## Por que o princípio de Gestalt é importante?
Hoje, optamos cada vez mais por realizar tarefas em um mundo digital, graças aos
computadores.
Se no passado a única maneira de transferir dinheiro para uma conta bancária era
visitar uma agência bancária, entrar e realizar a transação com auxílio de outro
ser humano, hoje um aplicativo faz tudo isso para nós com alguns cliques.
O desenvolvimento da [**era digital**] nos forneceu conveniência e serviços

rápidos, mas abandonar o ambiente 3D só é possível porque possuímos um sofisticado
sistema de percepção que organiza os estímulos visuais a nosso favor.
Nosso cérebro possui a tendência de organizar o mundo ao nosso redor, o que pode
nos ajudar a entender melhor o que acontece à nossa volta, e o princípio de Gestalt
é uma forma de descrever essas tendências para que designers e outros profissionais
de artes visuais consigam fazer o melhor trabalho possível.
Entendendo o princípio de Gestalt, o seu trabalho como designer será mais bem-feito
e terá melhores resultados. Os usuários ficarão mais satisfeitos e você obterá
resultados mais harmoniosos.
## Quais são as leis da Gestalt?
Existem muitas leis que compõem o princípio de Gestalt e que um designer pode
utilizar na sua rotina de trabalho. A seguir, você vai conhecer as principais:
### Similaridade
Usuários percebem objetos que parecem semelhantes como tendo usos semelhantes. Essa
é uma estratégia simples que você pode usar em seus designs como meio para
comunicar a função de um determinado objeto rapidamente, [**aumentando a
usabilidade**].
Ao criar ícones ou estruturas similares, por exemplo, você economiza muito tempo
explicando para o usuário qual é a sua função.
### Proximidade
Objetos que estão próximos uns aos outros são percebidos, segundo o princípio da
proximidade, como mais relacionados do que objetos mais separados. A proximidade
diz que quando elementos são posicionados um perto do outro eles são vistos como
parte de um grupo, e não individualmente. **Eles não precisam sequer ser parecidos,
o mero fato de dividirem o mesmo espaço é o suficiente para a proximidade
funcionar.**
### Agrupamento
Seguindo o raciocínio da similaridade, o agrupamento repete os seus efeitos em

objetos agrupados mesmo quando eles parecem diferentes. Existem, portanto, 2
maneiras de usá-lo:
- adicionar uma barreira visível para incluir elementos, como um círculo ou uma
caixa, o que pode ser visto no menu de websites;
- aproximar elementos para que eles se comportem como um conjunto, o que pode ser
visto ao [**diagramar**] as notas de rodapé de um livro.
### Fechamento
O fechamento, por sua vez, aplica as propriedades mencionadas pelo princípio de

Gestalt e faz com que usuários completem objetos na sua mente caso eles estejam
parcialmente obscurecidos.
O minimalismo e o uso de elementos parciais emprega o fechamento para economizar

espaço e para se comunicar com eficiência.
### Paralelismo
**Elementos paralelos** uns aos outros são vistos como mais relacionados do que
elementos não paralelos. Linhas que apontam, ou se movem, na mesma direção, são
vistas como similares mesmo que sejam bastante diferentes.
### Continuidade
Por mais estranho que isso pareça à 1ª vista, o olhar do usuário cria um tipo de
impulso à medida que ele se move de objeto para objeto em um layout, e a isso
chamamos de continuidade.
Linhas, em geral, aumentam esse efeito. Tanto que é possível perceber curvas e
retas onde elas não existem, apenas pela disposição dos elementos que compõem uma
imagem.
O poder da continuidade se sobrepõe ao poder da cor. Vemos isso aplicado todos os

dias nas barras de navegação verticais e horizontais.
### Simetria e ordem
Simetria é o que nos dá um sentimento de ordem, que tendemos a procurar nos objetos
e layouts ao nosso redor. É, segundo a Gestalt, parte de nossa natureza impor essa
ordem ao caos. Esse princípio nos leva a buscar [**equilíbrio nas composições**],
mesmo que esse equilíbrio não seja perfeito.
Uma vez que nossos olhos encontram simetria e ordem, esses princípios são usados
para comunicar informações rapidamente. Como quando identificamos aberturas e
fechamentos de colchetes numa imagem como sendo parte de um todo, ainda que elas
desrespeitem o princípio da proximidade.
### Conexão uniforme
A Gestalt diz que elementos que estão visualmente conectados são percebidos como
mais relacionados do que elementos sem conexão. Isso significa que 2 figuras
idênticas em um layout, quando desconectadas, são vistas diferentemente do que as
suas figuras disformes ligadas por uma linha.
De todos os princípios que sugerem que os objetos estão relacionados, a conexão

uniforme tende a ser o mais forte.
Depois de ver todas essas leis não é de se admirar que o princípio de Gestalt tenha
efeito sobre o trabalho de um designer, concorda? Aqui, citamos só alguns exemplos
para que você se familiarize com o conceito. **Caso queira aprender um pouco mais
sobre Gestalt,recomendamos o livro Gestalt do Objeto Sistema de Leitura Virtual da
Forma, de João Gomes Filho.**
Agora que você já sabe bastante sobre o princípio de Gestalt, que tal dividir esse
conhecimento com os seus amigos? Compartilhe este post nas suas redes sociais!
Quer aprender mais sobre Gestalt? Aqui na **Alura** temos um [**curso de Gestalt
onde você colocará na prática seus conceitos e princípios**] reformulando o layout
de um site.
Victoria foi desafiada por sua amiga Maya para demonstrar suas habilidades
adquiridas no curso de [**JavaScript Avançado da Alura**].
Maya disponibilizou para Victoria o seguinte HTML que exibe uma tabela com os nomes
e as idades de três pessoas.
html
O código anterior apresenta o seguinte resultado:

java
A tarefa de Victoria será somar todos os valores da coluna Ìdade`, exceto as

idades que forem menores que 18 anos. O resultado deve ser inserido na `td` com a
classe `total`. Considerando tudo que a Victoria tem que fazer, quais são os passos
que ela precisa realizar?
## Utilizando o querySelectorAll
Seu primeiro passo foi selecionar todos os elementos `td` com a classe ìdade`. Ela
utilizou [**document.querySelectorAll**] pois essa API do DOM aceita receber
seletores CSS para buscar elementos e seu retorno será sempre um `NodeList`.
javascript
Victoria explicou para Maya que um `NodeList` parece com um array e que ela poderia
tratá-lo da mesma forma. Maya ficou ressabiada, pois reconhecia que arrays em
JavaScript são poderosos.
## Transformando um array com map
Sabendo que `querySelectorAll` retornava elementos do DOM que continham um texto

com o valor das idades, ela lançou mão da função [**map**] para criar uma nova
lista, contendo apenas os textos convertidos para números:
javascript
Contudo, para a alegria de Maya, o seguinte erro ocorreu:
js
Victoria lembrou que apesar de um [**NodeList**] ser parecido com um array ele não
é, e por isso não possui a função `map`.
## Uma ajudinha do spread operator

Ela precisava muito que o `map` funcionasse, porque fazia parte da sua estratégia.
Então,ela lembrou do [**spread operator**] e fez o seguinte:
javascript
Os `...` passaram para dentro do `[]` cada elemento individualmente e agora ela era
capaz de usar a função `map`.
Maya olhou com certa desconfiança, mas reconheceu a validade do código e disse:
> "Muito engenhosa essa sua solução para converter um NodeList para um Array".
## Separando o que interessa com filter
Victoria já tinha uma lista de números, então ela só precisava filtrar essa lista
considerando apenas as idades iguais ou maiores que 18 anos. Ela lançou mão da
função [**filter**] que todo array possui:
javascript
Excelente! Agora, ela tinha certeza que no array filtrado só havia as idades 19 e
22. Maya gritou:
> "Ainda falta totalizar!".
## Totalizando com reduce
Sem pestanejar, Victoria usou a função [**reduce**] para reduzir os elementos de um

array a um único valor:
javascript
Agora, de posse do total, ela só precisava inserí-lo na `td` correta. Contudo, Maya
comentou:
> "Por que você usou const?"
Victoria pacientemente explicou que o único local do seu programa que faz sentido a
variável `total` receber uma atribuição de valor é neste ponto. Não faz sentido
mais tarde alguém atribuir um novo valor para total, pois o valor que ele já guarda
foi devidamente calculado com base nas idades lidas das páginas.
Sem deixar que Victoria acabasse de explicar, ela tomou as rédeas da conversa e
disse:
> "Eu sei, eu sei, acabei de lembrar. Variáveis declaradas com `const` não podem
receber uma nova atribuição com o operador `=`."
Depois de fazer questão de mostrar para sua amiga que lembrava das razões do uso de
`const` ela engatou um novo comentário:
> "Aliás, você adora arrow function, usou com map, filter e reduce!".
Sobre o comentário da [**arrow function**] Victoria respondeu:
> "É uma maneira mais sucinta de escrevermos funções, além de outras
características que não são importantes para o problema que estou resolvendo, como
o escopo léxico".
## querySelectorAll vs querySelector
Em vez dela usar `querySelectorAll`, ela usou `querySelector`, pois este sempre
retorna um elemento e não um array:
javascript
## Escrevendo ainda menos
Victoria, não se contentando, decidiu remover a variável `total` deixando seu

código ainda mais enxuto:
javascript
## Uma homenagem ao jQuery
Ao ver o código, Maya disse:
> "Incrível, você fez tudo isso sem declarar uma variável! Só ficou meio grandinho
ter que escrever document.querySelector e document.querySelectorAll".
Victoria, com astúcia respondeu:
> "Não tinha me preocupado com isso, mas posso enxugar o código desta forma, mas
vou precisar de uma variável, aliás, farei uma homenagem ao jQuery usando a
variável $".
javascript
Maya ficou com um olhar perplexo ao ver a solução. Sem que ela dissesse alguma
coisa, Victoria explicou:
> "Eu criei um atalho para document.querySelectorAll guardando-a na variável $. Mas

fazer simplesmente isso não funcionaria, porque $ perderia document como seu
contexto, algo fundamental para que ela funcione. Daí, usei a função [**bind**]
para criar uma nova função que mantivesse document como contexto. Aprendi isso
estudando na Alura".
Maya sorriu.
## Conclusão
No final da conversa, Maya elogiou o código de Victoria por ela ter combinado seus
conhecimentos de manipulação de DOM, spread operator, conversão de tipos, map,
filter e reduce de uma só vez para resolver o problema que lhe foi dado.
Sorrindo, Victoria disse:
> "Só estava seguindo o caminho de uma cangaceira em JavaScript!".
Por fim, Maya pediu a Victoria que elaborasse um desafio para ela, nada mais justo
depois de ter colocado a amiga à prova. Sabem qual desafio foi? Vocês só saberão no
[próximo artigo]!
No meu sistema de cadastro de produtos para um mercado, recebi uma lista com alguns
produtos:
python
Cada produto é um objeto do tipo `Produto`, que é representado pela seguinte

classe:
python
Note que a lista contém produtos em uma ordem aleatória. Porém, preciso ordená-los,
isto é, saber quais são os produtos mais caros ou mais baratos, ou então, ordenar
pelo nome para facilitar a visualização dos produtos. Então como podemos fazer
isso?
## Ordenando lista de números
No Python, quando precisamos ordenar listas, podemos utilizar a função [sorted],

por exemplo, para uma lista de números:
python
Temos o seguinte resultado:
python
## Ordenando lista de strings
Funciona perfeitamente! Mas será que para textos também funciona? Vejamos:
python
Então temos o seguinte o resultado:
python
## Ordenando lista de objetos
Aparentemente, funciona para tudo! Então podemos utilizá-lo para objetos também:
python
python
### Critério de ordenação de objetos
Ué, não deveria ordenar? Deveria, mas precisamos primeiro pensar nas seguintes
questões:
- Como ordenamos um objeto do tipo `Produto`?

- Pelo atributo `nome`? Ou pelo `valor`?
Observe que inicialmente não sabemos, pois em determinados momentos, podemos querer
ordenar por `nome` ou por `valor`. Em outras palavras, o `sorted`, inicialmente,
também não sabe como ordenar o nosso objeto!
Suponhamos que queremos ordenar por `nome`, como o `sorted` saberia disso? Não
informamos em nenhum momento!
Portanto, quando **queremos ordenar um objeto** do tipo `Produto`, **precisamos

informar por qual atributo ele será ordenado!**
### Definindo critério de ordenação do objeto
Para informar ao `sorted` por qual atributo desejamos que ele ordene, precisamos
enviar o parâmetro `key` com o valor do atributo da classe desejada. Vamos tentar
pelo atributo `valor`:
python
Observe que nesse caso, estamos utilizando o `get_valor` justamente por estarmos
escondendo o atributo. Vejamos agora o resultado:
python
Veja que agora os nossos objetos foram ordenados pelo valor! Em outras palavras,
agora estão ordenados dos mais baratos para os mais caros :D
Vamos tentar pelo `nome` também? Bora alterar e verificar se dá certo:
python
Então temos o seguinte resultado:
python
## Realizando ordenação reversa
Maravilha! Funcionou como o esperado! Entretanto, e se eu quiser da ordem inversa?

Ou seja, do mais caro para o mais barato, ou então, da letra "z" para "a", como
faremos isso?
Simples! basta adicionar o parâmetro `reverse` com o valor `True`. Vejamos o

resultado ordenando pelo `valor`:
python
python
Agora com o `nome`:
python
Testando o código novamente:
python
Funciona perfeitamente! Um recurso bem fácil que não exige inúmeras implementações
para funcionar :)
Vimos nesse post que quando queremos ordenar listas no Python, podemos utilizar a
função `sorted`. Vimos, também, que ela funciona perfeitamente para strings ou
números, entretanto, quando queremos ordenar objetos, precisamos informar como ela
deve ordenar o objeto, ou seja, enviando um atributo do objeto por meio do
parâmetro `key`.
O que achou da ordenação de listas no Python? Fácil né? Que tal aprender mais sobre
o Python e seus diversos recursos? Então dê uma olha nos nossos [**cursos online de
Python**] aqui na Alura!
O Leonardo é uma daquelas pessoas que não se acomodam e correm atrás dos seus
sonhos :)
imagem, fiz dois sistemas por conta própria para mostrar meu conhecimento.
Agora, depois de três meses de muito estresse procurando um emprego, estou há três
meses empregado como desenvolvedor back e front-end! Estou desenvolvendo um sistema
do começo ao fim, prestando atenção sempre na qualidade do meu código.
Eu gostaria de agradecer muito à todos os meus professores, Maurício Aniche,

Guilherme Silveira, Renan Saggio, Sergio Lopes, Leonardo Wolter, Luiz Fernando
Oliveira e Flavio Almeida (tecladinho do mau rsrsrs). Atualmente estou estudando
mais front, meu ponto fraco, para fazer esse projeto decolar, sei que tenho muito
caminho pela frente, mas graças à vocês eu sei que estou no caminho certo.
Minhas dicas para quem está começando a programar é: não se desespere com novas
informações, conhecimento é sempre bom, nunca deixe seu código ficar bagunçado ou
com gambiarras, principalmente por preguiça e talvez o mais importante, estude e
busque novos conhecimentos, programação não é pra quem tem preguiça de estudar.
Estou fazendo um projeto que calcula o preço de um imóvel dado o valor de seu IPTU.
Para isso, juntei informações sobre vários imóveis:
```
-----------------------------------------
| Valor do IPTU (R$) | Preço do Imóvel (R$)
-----------------------------------------
1.000,00 | 500.000,00
-----------------------------------------
250,00 | 125.000,00
-----------------------------------------
30,00 | 80.000,00
-----------------------------------------
2.596,00 |1.236.598,00
-----------------------------------------
```
A ideia é conseguir saber o preço do imóvel a partir de seu valor de IPTU. Mas como
podemos fazer isso?
## Visualizando os dados
Já temos os dados dos IPTUs e o valor dos imóveis. E se utilizarmos esses dados
para descobrirmos os valores dos imóveis no futuro? Isto é, com um valor de IPTU,
descobrirmos o valor do imóvel.
Estou utilizando a [**linguagem R**] para fazer a análise dos dados. Para facilitar
o trabalho, podemos criar um gráfico para ver como os dados estão dispostos.
Para isso, vamos criar duas variáveis, uma com os valores dos IPTUs e outra com os
valores dos imóveis.
E pedir para o R **plotar (plot) o gráfico**:
[imagem` para descobrir nossa função. Para isso, basta passar a variável
`valores_imoveis` pelos (`~`) `valores_iptu`:
Esse comando nos retornou algumas informações. Uma delas é a fórmula que passamos
para o comando.
Outras duas informações são: o valor **Intercept**, que é 5369.2, e o

`valores_iptu`,que vale 601.4. Mas o que eles significam?
O comando `lm()` retorna para a gente uma **função afim**, ou uma **função do
primeiro grau**,isto é, uma função que tem a forma: `f(x) = ax + b`. Os valores que
o comando `lm` retorna são justamente os valores de à` e `b`. No caso, nossa
função ficaria:
Esse procedimento que utilizamos para descobrir a função é chamada de **regressão

linear**. A **regressão linear é muito utilizado em estatística, análise de dados e
machine learning**.
Podemos ver a reta da equação atribuindo o valor do retorno da função `lm()` a uma
variável e passá-la na função àbline()`:
[![]]
Vemos a linha no gráfico gerada pela nossa função. Apesar de não passar por todos
os valores, ela tem uma boa aproximação com os valores da amostra.
## Para saber mais
A regressão linear é muito utilizada na estatística, análise de dados e em machine

learning. Existem várias aplicações que podemos utilizá-la. Neste caso, utilizamos
a regressão com apenas uma variável, o IPTU, mas podemos ter outras variáveis. Em
casos assim, falamos que temos uma regressão linear múltipla.
Aqui na Alura, temos vários cursos que mostram casos de uso com a regressão linear.
Um deles, é o [**curso de estatística com R**], nele você verá os conceitos
estatísticos e como aplicá-los com o R.
Também temos o curso de [**aprendizado supervisionado de máquinas**]. Nele

mostramos os conceitos e algoritmos sobre aprendizado supervisionado, tudo isso
utilizando Python.
Além desses, temos o [**curso de análise de dados com R**]. Aqui, vemos como
utilizar o R para analisar os dados da nossa empresa, criando gráficos e modelos
para isso.
imagem
E é aí que entram os programas e técnicas de edição de imagem. Mais do que ajustes

estéticos, a fase de edição, tratamentos e correções é essencial para adequar as
peças às necessidades das campanhas publicitárias. Confira agora as razões pela
qual toda imagem publicitária precisa de edição!
## Adequar a imagem ao conceito da campanha
Toda campanha publicitária, assim como qualquer projeto, começa pelo planejamento.
E é nessa fase que são decididos os objetivos, a linguagem e a “cara” da peça.
Com relação à fotografia, é possível seguir por dois caminhos: a utilização de

fotos de bancos de imagem ou a criação da foto exclusivamente para a campanha.
Caso seja utilizada uma imagem já pronta, é preciso adequá-la à linguagem da

campanha, mas o custo é consideravelmente menor. Nesse caso, é preciso saber editá-
la com bastante atenção. Cores, formas e objetos presentes na imagem podem
atrapalhar muito o objetivo da peça publicitária.
Já se a opção for pela criação da fotografia, é possível pensar em toda a estética

antes de executar os cliques. Mas, em compensação, o custo pode ser alto, uma vez
que envolverá, no mínimo, um fotógrafo, um modelo e a locação.
## Corrigir sem exagerar
Apesar da sua grande utilidade para profissionais de diversos setores, ferramentas

de edição como o **Adobe Photoshop** já foram utilizadas, muitas vezes, de maneira
equivocada, mesmo em campanhas publicitárias de grande alcance.
Não é difícil encontrar em pesquisas na internet galerias com centenas de imagens

desse tipo. Braços sem conexão com alguém, umbigos faltando, pessoas com corpos
desproporcionais... A lista é grande e inclui vários erros bizarros!
Fato é que, quando bem utilizada, a edição de imagens consegue remover imperfeições
que tenham passado despercebidas durante a criação da fotografia, trazendo o foco
para o que realmente importa. E isso mudará de acordo com a necessidade. É mais
comum vermos edições mais aparentes em campanhas que utilizam fotografias de
pessoas, uma vez que o número de retoques é, naturalmente, maior no corpo humano do
que em objetos.
Já as peças publicitárias de produtos, por exemplo, precisam de imagens que

[**correspondam à realidade das mercadorias**]. Nesse caso, a edição é feita para
aparar e retirar algum defeito que possa ter passado, sem alterar drasticamente a
realidade do objeto fotografado.
## Criar quando necessário
Nem sempre o [**briefing**] realizado para a campanha na fase de planejamento tem

relação com uma imagem mais próxima da realidade. Dependendo da característica da
campanha, é possível que seja necessária uma edição mais elaborada, voltada para a
combinação de elementos que fujam da realidade, ou seja, uma manipulação da imagem.
Nesse sentido, os softwares de edição não apenas são um auxílio, mas sim a
principal ferramenta que faz com que seja possível obter o resultado desejado. E a
etapa da edição se torna o principal momento de criação das campanhas.
Muitas peças são compostas, visualmente, pelas tão faladas montagens. Elas nada
mais são do que o resultado da manipulação de vários elementos combinados para
formar uma imagem final.
Para tanto, é preciso preparar cada um dos objetos antes de montá-los na peça. Isso
significa que o trabalho de pré-produção, como remoção de imperfeições e recorte
das imagens é também muito importante, facilitando a tarefa do criador.
Com as imagens em mãos, é hora de criar a peça publicitária. Combinando os diversos

elementos com fundos, [**textos**] e outros materiais gráficos, o designer,
profissional responsável por esse tipo de trabalho, seguirá o que foi determinado
no planejamento para dar vida à campanha.
## Valorizar produtos
Como falamos no tópico anterior, nem todo tipo de publicidade demanda uma
manipulação mais agressiva. Mesmo assim, é preciso entender que tanto no mercado da
fotografia de produtos quanto aquela voltada para pessoas, o objetivo é enaltecer e
valorizar o assunto fotografado.
Em um mercado inundado de imagens, é preciso se destacar para fazer uma campanha de

sucesso se traduzir em mais vendas para a empresa. E é por isso que a fase de
criação e, especialmente, a fase de edição de imagem se torna tão crucial no
processo de desenvolvimento das peças publicitárias.
Agências de publicidade grandes possuem um setor de direção de arte muito forte,

responsável pela elaboração e supervisão do projeto. Gerenciando o desenvolvimento
da ideia, a execução e finalização do projeto, o diretor de arte guia a equipe de
edição para que ela não fuja das diretrizes planejadas.
E é por isso que, hoje em dia, é mais difícil ver erros de edição e manipulação em
peças de grande circulação. Além de um maior cuidado, o poder de ferramentas como o
Photoshop é utilizado para ações essenciais, sem as quais não seria possível
atingir o resultado desejado.
Levando em consideração o poder da imagem nos meios publicitários nos dias de hoje,
é preciso ser minucioso e atentar aos mínimos detalhes na análise a execução das
ações de edição e correções. Uma edição de imagem bem-feita é o diferencial na
criação de campanhas de sucesso, o que pode ser crucial para o aumento das vendas
do cliente.
Sem dúvida alguma, a etapa de edição de imagem na criação de campanhas

publicitárias se tornou um passo fundamental no desenvolvimento desses produtos.
Realizar ajustes e correções pontuais sempre foi um passo necessário, mas é preciso
ter muito cuidado para não exagerar e acabar criando mais um exemplo de erros
bizarros de Photoshop.
Gostou do nosso artigo? Tem muito mais no nosso blog! Para continuar acompanhando
nossas dicas e novidades, não se esqueça de seguir a gente no [Facebook], [Twitter]
e [YouTube]! Além de vídeos e aulas sobre as inovações do mercado de tecnologia,
você ainda fica por dentro das principais novidades e lançamentos!
**Design System** é uma coleção de componentes reutilizáveis, padronizados para
determinado produto, site ou sistema web. Diferente de um **style guide** (guia de
estilos), um design system vai além: o design system unifica a linguagem de um
determinado produto.
Encare o design system não como um projeto, mas como um produto interno da empresa,
que precisa de pessoas que o atualizem enquanto desenvolvem soluções novas, novos
componentes, novos guias de estilo. De botões arredondados e snippets de códigos a
concepções de aplicação de marca, tom de voz de texto e o **microcopy**.
# Exemplos de Design Systems
Como a definição de design system ainda é viva, o ideal é enxergar exemplos

conhecidos na comunidade, que possuem seu sistema publicado:
## Stack Overflow
O Stack Overflow possui um Design System com padrões que vão de classes CSS, uso de
marca e até mesmo e-mail marketing. Muito completo e é um exemplo bastante
conhecido na comunidade de UX e design:
https://stackoverflow.design/
imagem
## Adobe Spectrum
Na seção sobre cores do Design System da Adobe ela se preocupa com o modo noturno
da aplicação.
https://spectrum.adobe.com/
imagem
## Claro Mondrian
Exemplo brasileiro, a Claro também fez seu próprio Design System, inclusive com
bibliotecas em React de componentes específicos que eles criaram e usam:
https://mondrian.claro.com.br
imagem
# Podcast Design System
E para saber mais, gravamos um podcast focado no assunto que pode te ajudar nos
primeiros passos:
spotify:4gSyKdBWXsTHM4Hz6Xh7nU
# Referências Design System
- [Dicas UX - Design System]

- [Diferença entre um style guide e um Design System]
- [O que é, e porque criar um Design System?]
Quando estamos desenvolvendo nosso código **PHP**, ninguém nos define regras de
como desenvolver. Podemos fazer como quisermos e é bom que a gente tenha essa
liberdade.
Mas, na medida que nosso sistema cresce e começamos a implementá-lo em varios

lugares, surge, inevitavelmente, a necessidade de seguir algum padrão para que quem
vá implementar ou dar manutenção consiga entender o que está acontecendo.
Ao desenvolver um método para validar os dados de um usuário, nada nos impede de

escrever algo como:
php
Perfeito, nosso método funciona. Mas, como funciona esse método? Quais validações
ele faz? Onde começa o **if** e onde termina? Se alguém fosse, futuramente, dar
manutenção nesse método, seria extremamente difícil!
É por isso que surgiram as PSRs ([**PHP Standard Recommendations**]). Para que haja
maior interoperabilidade entre os desenvolvedores e projetos.
Uma das **PSRs é a PSR 2**, ou **Guia de estilo de codificação** ([**Coding Style
Guide**]), que aborda como deve ser feita a formatação do nosso código para
facilitar a leitura por outros desenvolvedores. Algumas das indicações desse guia
são:
- Devemos usar 4 espaços para identação, não tabs.

- Não devemos fixar um numero de caracteres por linha, mas é bom que uma linha
tenha menos de 80 caracteres.
- A abertura de colchetes de classes e métodos devem vir na proxima linha.
- A abertura de colchetes de estruturas de controle devem vir na mesma linha com um
espaço em branco.
Se seguirmos a PSR 2 com nosso método, teriamos:
php
Nosso código está muito mais legível! Conseguimos entender perfeitamente que a
validação do usuario depende de 3 outros métodos `validaNome`, `validaEmail` e
`validaSenha` e retorna um `boolean`. Ou seja, com PSRs conseguimos nos comunicar
de forma transparente como desenvolvedores.
Mas, PSRs não servem apenas para identação de código. Quando trabalhamos com
**frameworks MVC** é muito comum precisarmos importar arquivos. Algo como:
php
Porém conforme o sistema cresce, precisamos importar mais arquivos:
php
E a quantidade de includes tende a crescer. Esse é um dos motivos pelo qual

utilizamos a funcionalidade de àutoload`! Existem diversas formas de se realizar
àutoload` em php, uma delas é a [**PSR-4**] que define uma forma padronizada de
escrever nossos `namespace` para que possamos importar nossos arquivos da mesma
forma em nossos sistemas, aumentando, também, a interoperabilidade entre projetos!
Para isso, declaramos nossos namepsace com a estrutura:
php
Agora para importar nossos arquivos, a partir da versão 7 do PHP, basta utilizarmos
o agrupamento do ùse`:
php
Alguns frameworks MVC estão implementando este padrão para realizar o àutoload`.
Um exemplo é o **Laravel**, a partir da versão 5.
Atualmente existem 14 PSRs criadas pela **PHP-FIG** ([**Framework Interoperability

Group**]) sendo que sete estão em desenvolvimento e cinco já foram aceitas. As PSRs
aceitas, além da Coding Style Guide, são:
- [**Basic Coding Standard**] (Padrão de código básico) – Aborda o que devemos

considerar para garantir um código de alta interoperabilidade técnica com PHP.
- [**Logger Interface**] (Interface de Logger) – Descreve uma interface comum para
bibliotecas de Log.
- [**Autoloading Standard**] (Padrão de auto-carregamento) – Descreve uma
especificação para auto-carregamento de classes pelo diretório do arquivo. Também
diz onde colocar arquivos que serão auto-carregados de acordo com a especificação.
- [**Caching Interface**] (Interface de Cache) – Descreve uma interace padrão para
desenvolver sistemas de Cache.
- [**HTTP Message Interface**] (Interface de Mensagem HTTP) – Descreve uma
interface padrão para desenvolvimento de mensagens HTTP .
Uma definição mais aprofundada de cada PSR, além das PSRs em desenvolvimento, está
disponível no [**site da php-fig**]
Com PSRs evitamos a necessidade de nos preocupar com certas peculiaridades de cada
sistema! Se um sistema segue uma PSR, ou todas, já saberemos como manipulá-lo da
forma correta.
E a mesma coisa serve para os sistemas que nós desenvolvemos. Se seguirmos as PSRs,
quem for implementar saberá exatamente como fazê-lo da forma correta, reservando a
documentação para coisas mais específicas do sistema.
Claro que ninguém é obrigado a seguir as PSRs, ou qualquer outra especificação, ao

desenvolver em PHP. É uma escolha livre do desenvolvedor, mas é necessário que,
pelo menos, conheçamos bem. Afinal, a tendência é que cada vez mais
projetos/frameworks sigam e, por consequência, o mercado também.
Aqui na **Alura** [**temos uma formação PHP**] onde vemos boas práticas, além de
conhecer os frameworks mais utilizados no mercado.
imagem
Seu objetivo é trabalhar em startup, mas será que você está fazendo tudo que
poderia para alcançá-lo? Neste post, você vai aprender boas práticas para buscar um
cargo na sua área e, ainda por cima, na startup dos seus sonhos.
Quer apostar que as boas oportunidades estão a apenas alguns passos de distância?
Veja a seguir as atitudes que destacamos para auxiliá-lo a se alinhar ao seu
objetivo.
## Compreender o que é uma startup
Startups ficaram muito conhecidas nos últimos tempos devido ao seu rápido
crescimento e à sua tendência à inovação, que chamam a atenção de muitos
profissionais e empreendedores.
Esses novos modelos de negócios são formados por pessoas que arriscam em uma ideia
irreverente que, quando bem-sucedida, pode cobrir uma demanda de mercado que muitos
ainda não identificaram.
Por meio da tecnologia e de recursos digitais, na maioria das vezes essas novas
empresas entram no mercado sendo escaláveis e replicáveis, além de conseguirem
crescer em um curto período de tempo.
Se você ainda não tinha esses conceitos claros na sua mente e esse é o seu objetivo
profissional, a primeira atitude a ser tomada é [**estudar mais**] sobre essa
modalidade de empresa. Afinal, não adianta querer entrar em um jogo sem saber quais
são as regras básicas, certo? Feito isso, veja os próximos passos.
## Ter um bom currículo e portfólio
Startups são ambientes compostos por jovens como você, mas assim como essas
empresas se diferenciam do mercado, os profissionais que conseguiram fazer parte
delas também souberam se destacar.
Saber apresentar seu perfil profissional de maneira atrativa é, sem dúvidas, pré-
requisito para conseguir um emprego em qualquer tipo de empresa. Entretanto, no
caso das startups, bons currículos e portfólios podem significar coisas diferentes
em relação ao mercado tradicional.
A razão disso? Essas pessoas souberam apresentar suas habilidades, experiências e,

principalmente, seu objetivo.
**Seu currículo**, antes de mais nada, merece uma boa curadoria das suas
experiências e habilidades. Busque destacar informações básicas e essenciais que
mostrem de maneira intuitiva o caminho que você trilhou e aonde você quer chegar.
Não deixe que o material fique muito extenso — o ideal é que não passe de duas
páginas.
Toda informação colocada no seu currículo deve ser verdadeira, desde a grafia
correta do nome das empresas em que você trabalhou ou estagiou até os resultados
que alcançou ao atuar nelas. Não tente apontar nada que não esteja de acordo com a
realidade, afinal, você quer estabelecer uma imagem confiável desde o princípio.
É claro que você não vai se candidatar a apenas uma vaga. Em meio a [**suas
pesquisas**], certamente haverá oportunidades diversas e nem sempre a descrição de
uma vaga é igual à de outra.
Você vai querer que seu currículo esteja adequado a cada vaga a qual você vai se
candidatar, por isso, sempre adapte o seu currículo de acordo com o cargo e
empresa. Não fazer isso pode levar você a enviar informações incompletas que podem
fazê-lo perder a chance de participar de um processo seletivo.
Para muitas vagas em startups é necessário que você apresente também um portfólio
de produções autorais, e ele precisa ser feito da maneira ideal. Coloque no seu
portfólio a nata das suas produções, sempre seguindo a mesma premissa de que vagas
diferentes podem buscar perfis profissionais diferentes.
## Entender o que é valorizado pelas startups
### Independência
Busque cursos gratuitos online, workshops, certificações. Ponha seus conhecimentos

em prática e faça de seus resultados reais um [**diferencial a ser apontado numa
entrevista**].
Pesquise diariamente e conheça o básico sobre todas as etapas que envolvem a área
de atuação na qual você pretende trabalhar. Isso fará de você um profissional que,
mesmo atuando em uma empresa em crescimento com número ainda reduzido de
funcionários, é capaz de superar pequenos obstáculos sem precisar da ajuda de
terceiros, otimizando os processos da empresa.
### Inovação
Mantenha-se atualizado e exercite sua criatividade em cima dos conhecimentos

adquiridos em seus estudos autônomos. Leve sempre em conta o contexto em que a
empresa está inserida e em qual etapa de desenvolvimento de startup ela se
encontra, para que, caso você consiga a vaga, seja um colaborador ativo e com
diferencial.
Ao propor novas soluções para um problema, tenha em mente que nem todos vão
acreditar no sucesso da sua proposta, mas é isso que a tornará inovadora.
### Capacidade comunicativa
Não hesite em compartilhar ideias, conhecimento e dicas com colegas. Busque

interagir com eles também. Muitas startups promovem workshops internos dados por
seus próprios funcionários. Quem sabe você não se destaca por um conhecimento ou
habilidade e possa até mesmo começar a construir uma imagem em cima disso?
### Postura prática
A todo momento surgirão problemas a serem resolvidos. Isso será parte do seu dia a
dia e resolvê-los se tornará a sua rotina. Para isso, você precisará ter em mente
que muitas vezes fazer algo funcionar não significará fazê-lo da maneira ideal, e
para uma startup isso é essencial.
## Saber o que esperar desse tipo de trabalho
### Ambiente
Já deu para perceber que, numa startup, tudo é rápido. Não se preocupe: esse ritmo,
muito semelhante ao ritmo de jovens como você, facilita sua adaptação. Esse tipo de
empresa costuma ter um ambiente jovem, com um clima ideal para quem está buscando
aprendizado e crescimento individual e coletivo ao mesmo tempo.
### Comportamento dos profissionais
Nesse tipo de ambiente, não deve existir egoísmo e competição entre os

funcionários. Eles são uma equipe que, unida, visa ao aprimoramento de seu setor e
da proposta da empresa como um todo. Tudo é feito por meio da colaboração
constante.
### Intensidade de trabalho

Assim como em qualquer empresa, você terá metas a serem cumpridas, mas elas não são
suas inimigas. Em startups, os indicadores por meio dos quais você é medido são
oportunidades para que você cresça. Procure saber quais empresas são mais voltadas
para essas métricas em relação a outras e analise em qual delas você poderia se
sair melhor em momentos de maior pressão.
Você precisará ser bastante produtivo e até mesmo desenvolver técnicas para
garantir isso, se necessário. Realizar tarefas múltiplas de maneira organizada
enquanto lida com interrupções será seu desafio inicial e sua futura rotina.
### Carreira
As startups são muito dinâmicas e precisam de profissionais que se encaixem nesse

perfil. Numa empresa tradicional, você teria que esperar por muitos anos para
construir sua carreira. Já as startups promovem oportunidades para que você mostre
o seu valor e aprimore seus conhecimentos de maneira muito mais rápida.
Além disso, seu caminho dentro da empresa não precisa, de maneira alguma, ser
linear. Se você se destacar, é possível até mesmo se tornar o head de um novo
departamento ao longo do crescimento da empresa.
Agora que você já aprendeu as melhores práticas para alcançar o seu objetivo de
trabalhar em startup, que tal aprofundar seus conhecimentos [**criando sua startup
enxuta com base nos conceitos de Lean**]? ;)
imagem
Recentemente comecei a fazer o curso [**Javascript: programando na linguagem da

web**] e resolvi me organizar com relação às anotações que estou criando.
Normalmente eu mantenho as anotações em cadernos, que cá entre nós, não é muito

eficiente quando preciso procurar algum texto específico, além de que com o passar
do tempo eles acabam sendo esquecidos dentro do armário.
Para resolver esse problema eu optei por utilizar o **github** que além de manter a
organização, podemos fazer uso da linguagem de marcação **Markdown**, que vai
converter o nosso texto para um HTML válido.
A primeira aula do curso de Javascript se chama **Introdução**, agora que o

repositório está pronto, podemos partir para as anotações.
## Criando anotações
Para criar um arquivo basta clicarmos em **Create new files** e teremos acesso ao
editor de texto dentro do github. Não podemos nos esquecer de salvar o nome do
arquivo com a extensão **.md**, já que queremos escrever em markdown.
imagem colocar o nome da linguagem e fechar com três backticks **(\`\`\`**).
imagem
O markdown nos oferece uma maneira bem fácil de criar citações, basta utilizar **\
>** antes do texto e como resultado teremos:
imagem
imagem
E teremos o seguinte resultado:
imagem
E para finalizar vamos colocar uma barra de progresso para indicar o quanto falta
finalizar o curso utilizando a seguinte formatação:
![]
![]
Clicando em Preview Changes temos:
![]
A barra de progresso aparece logo abaixo do título, bem legal!

melhor, aqui na Alura temos uma [**formação engenheiro front-end**]. Nela, você
verá como programar em Javascript, enquanto usa minhas dicas para criar anotações.
imagem
Recentemente me fizeram uma pergunta muito interessante:
> _"Eu sou da área de Design Gráfico, mas gostaria de migrar para UX. Você acha que
vale a pena? Faz sentido?"_
Mas o que mais me chamou atenção nessa pergunta é: Por que não valeria a pena?
Bom, eu também trilhei esse mesmo caminho. Quer dizer, ainda estou muito envolvida
com a produção de design digital, mas o enfoque agora é muito maior para as
questões de UX Design, então acreditei que poderia deixar minha contribuição
falando um pouco desses dois processos.
Uma das possibilidades é o fato de muitas pessoas confundirem [**o que de fato
significa UX**] por acreditarem que UX é uma das ramificações da área de Design,
quando, na verdade, engloba processos de diversas naturezas e times
interdisciplinares.
Então, antes de mais nada, precisamos entender do que se trata cada uma dessas
áreas, certo?
## A área de Design
Quando falamos em design, podemos estar nos referindo a diversas coisas, afinal, a
área de design é muito abrangente.
Existem os designers especializados em produções impressas, por exemplo. Esse

profissional será responsável principalmente pela [**criação de materiais gráficos
editoriais**], isto é, os materiais físicos, impressos.
Por outro lado, existem também aqueles especialistas na parte online, de criação de
peças digitais, desde anúncios até [**layouts para a web**].
Indo um pouco mais longe, tem também aqueles designers que, além de produzirem
essas peças digitais, também complementa seus conhecimentos na parte digital,
estudando alguns conceitos de front-end, como [**HTML e CSS**], por exemplo.
E, sabe aqueles vídeos animados em comerciais? Os efeitos especiais em filmes?

Então, quem elabora esse tipo de material também entra na categoria design, mais
especificamente na parte de audiovisual. Toda a parte de [**edição de vídeos**] e
[**animações**] é feita por esses profissionais.
Além disso, se você manda bem desenhando, ainda tem a possibilidade de ser um
ilustrador e [**criar o personagem publicitário**] de alguma marca.
## Falando em UX Design
A primeira coisa a se fazer quando falamos em UX é entender [**o que de fato é a

experiência do usuário**] que tanto falam.
Depois, outra coisa importante é lembrar que em UX nós temos times

interdisciplinares, ou seja, não só de designers é feito o time de UX. Nele temos
sim designers, mas temos também a galera do back-end, do front-end e todas as
demais especialidades necessárias para planejar o produto a ser desenvolvido.
> _"Então quem é o UX Designer?"_
O UX Designer pode ser qualquer uma dessas pessoas. Quando falamos em UX Design nos
referimos ao desenho de toda a experiência que queremos criar, então o UX Designer
é basicamente aquele que terá uma visão geral de todas as áreas para guiar o
planejamento todo até o lançamento do produto ao final.
Entendendo isso, podemos começar a destrinchar os processos de UX Design, isso

porque, mesmo dentro de UX, temos profissionais com especificidades para cada
processo também.
Existem, por exemplo, aqueles que se encaixam melhor na [**parte de pesquisa**] ou

então aqueles que farão todo o [**monitoramento do produto**], ou ainda, o que será
responsável pela [**prototipação**].
Podemos ir por diversos caminhos dentro dessa área, afunilando nossos interesses e
habilidades para construir times que complementam o processo em diversas áreas.
E se você quiser entender um pouco mais da rotina no desenvolvimento de um produto,

existem algumas metodologias interessantes de investigar, como Design Sprint, por
exemplo, que baseia-se em conceitos de [**Design Thinking**] e [**Metodologias
ágeis**].
Agora, retomando a pergunta… Sim! Com certeza vale a pena. :)
Migrar de uma área para outra pode soar um pouco assustador, principalmente quando
já estamos há algum tempo no mercado. Mas nunca é tarde para recomeçar os estudos e
bolar novos planos. Seja lá qual for sua escolha, invista tempo e dedicação e vai
valer muito à pena! ;)
Aqui na **Alura** temos uma [**Formação em UX**] !!

Hoje em dia, o design é mais do que uma disciplina: com o avanço de conceitos como
UX/UI (experiência e interface de usuário para dispositivos móveis), Internet das
Coisas e dispositivos cada vez menores, mais potentes e portáteis, os designers
estão sendo requisitados para trabalhar com os avanços tecnológicos mais recentes.
## 1\. Jonathan Ive
Nascido no Reino Unido, **Ive** começou os estudos inspirado pelo pai, artesão que
tinha especial cuidado pelo trabalho e pelo acabamento bem feito em suas criações.
Formou-se na Politécnica de Newcastle, onde teve contato com designers de
diferentes disciplinas.
Foi ali também que Jonathan conheceu seu primeiro Mac, que na época era o primeiro
a permitir desenhos artísticos com o mouse.
Depois de formado, com vários prêmios da Real Sociedade de Artes, ajudou a fundar a
Tangerine, empresa de design que primeiro prestou consultoria e depois foi
integrada ao departamento de design da Apple. Era o início de uma parceria
duradoura.
Embora o início tenha sido desanimador (a Apple passava por períodos difíceis no
meio da década de 90), o retorno de Steve Jobs à empresa deu o estímulo do qual Ive
precisava para continuar o trabalho.
A parceria dos dois começou a dar frutos logo em 1998, com o iMac G3, computador de
mesa com o icônico gabinete curvo e colorido. Seguindo uma filosofia de design que
opta pelo simples e minimalista, o designer foi desenvolvendo produtos cada vez
mais finos e inovadores, como os iPods, iPhones e iMacs.
Atualmente, depois da morte de Jobs, Jonathan assumiu também o posto de vice-

presidente sênior da Apple, além de ter começado projetos externos, como uma edição
de luxo limitada de câmeras fotográficas para a marca Leica.
## 2\. Jakob Nielsen
Nascido em Copenhague, na Dinamarca, **Nielsen** é um consultor de usabilidade web

mundialmente conhecido, com PhD em interação homem-máquina pela Universidade
Técnica de Copenhague.
Por quatro anos, trabalhou como Engenheiro de destaque na Sun Microsystems,

fabricante da plataforma Java. Ali, desenvolveu estudos focados na melhoria da
usabilidade das nascentes aplicações para a internet.
Nielsen é conhecido por definir os cinco componentes para alcançar as [metas de

usabilidade]: adaptabilidade, eficiência, facilidade de reconhecimento, baixo
número de erros e satisfação do usuário. Ele também é autor de [10 regras que visam
melhorar a usabilidade].
Embora tenham sido fortemente criticadas por designers gráficos, por deixar itens
como tipografia e [hierarquias visuais] de lado, estas metas continuam sendo o
padrão seguido pelos desenvolvedores.
É também de sua autoria a [Lei de Nielsen], que afirma que as conexões de rede de
alto desempenho terão sua velocidade dobrada a cada 21 meses. Atualmente, Nielsen é
autor de uma newsletter sobre web design e constantemente listado entre os
designers mais influentes do mundo.
## 3\. Steve Jobs
Não é possível falar sobre designers envolvidos com tecnologia sem falar em Steve
Jobs. Nascido em São Francisco, na Califórnia, **Jobs** começou a cursar a Reed
College, em Portland, mas abandonou o curso devido a restrições financeiras.
No entanto, continuou a frequentar o ambiente da faculdade, matriculando-se em

vários cursos livres, entre eles o de caligrafia, que seria de enorme valor anos
depois.
Mais tarde, começou a trabalhar em parceria com o amigo de longa data Steve
Wozniak. Com uma versão do [jogo _Pong_] desenvolvida pelo amigo em mãos, Jobs
conseguiu um emprego como técnico na Atari, então líder em jogos de videogame.
Em 1976, juntamente com Wozniak e o amigo Ronald Wayne, fundou a Apple Computer, na
garagem de sua casa, desenvolvendo o primeiro produto da empresa: o computador
pessoal Apple I.
No ano seguinte, foi lançado o primeiro computador comercial da Apple, o Apple II,
um sucesso de vendas, devido a suas inovações computacionais e seu design
diferenciado.
Com o passar dos anos, a empresa foi crescendo, assim como a fortuna pessoal de
Steve, avaliada em 100 milhões de dólares no início da década de 80. No entanto,
desavenças internas e conflitos sobre os rumos da Apple levaram Jobs a ser demitido
da empresa que ele mesmo criou, em 1985.
Saindo da Apple, criou a NeXT no mesmo ano, desenvolvendo hardwares inovadores,

porém sem muito sucesso, depois mudando o foco de produção para softwares e
frameworks.
O triunfo de seu novo empreendimento e os tempos difíceis da Apple levaram a

empresa a comprar a NeXT, em 1997, trazendo Jobs de volta à chefia.
Em seu retorno, aliado a designers de ponta como Jonathan Ive, Jobs começou a
revolucionar a indústria de tecnologia. Foi ele o maior responsável pelo surgimento
dos iMacs, iPods, iPhones e iPad, invenções que quebraram barreiras e renovaram
indústrias inteiras.
Com Jobs, a Apple deixou de ser uma empresa cambaleante para assumir o posto de
vanguardista tecnológica.
Além de sua importância vital na Apple, Steve Jobs também é responsável por fundar
a Pixar, empresa de [**animação**] criadora de clássicos como _Toy Story_, _WALL-
E_ e _Ratatouille_, vencedores do Oscar.
## 4\. Elon Musk
Grande destaque nas manchetes mais recentes sobre inovação, o designer de produtos
e engenheiro (mais engenheiro do que designer :)) sul-africano **Elon Musk**
define-se como um visionário disposto a criar tecnologias para salvar a espécie
humana do risco de extinção.
Com PhD em física aplicada e ciência de materiais na Universidade de Stanford,

começou a carreira fundando empresas como a Zip2 e a X.com, que seria depois
fundida com a Confinity, dando origem ao serviço de pagamentos PayPal.
As empresas mais famosas de Elon são a SolarCity, que visa fornecer energia solar a
preços competitivos para residências, a Tesla Motors, que já tem uma grande linha
de carros totalmente elétricos (com alguns projetos de carros sem motorista em
desenvolvimento), e a SpaceX, um dos primeiros empreendimentos privados de
exploração espacial.
Foi a SpaceX, inclusive, que deu a Musk a maior parte de sua fama: seu objetivo de
pousar uma nave não tripulada em Marte até 2018 e criar uma colônia experimental
ainda neste século tem atraído atenção e investimentos de grandes empresários.
Neste texto, vimos um pouco da vida e da [**carreira**] de designers famosos que

fizeram avanços indispensáveis no mundo tecnológico.
Cada um deles deixou uma marca que não pode ser apagada na sociedade, garantindo
melhores produtos e melhor qualidade de vida para seus usuários. Muito além de
designers,são fonte inesgotável de inspiração!
Comecei a estudar Java no primeiro ano da faculdade de computação. Como nunca tinha
mexido com a linguagem antes fiquei curioso para testá-la em casa e tentar escrever
meus primeiros programas, mas como começar a escrever em Java?
## Baixando o kit de desenvolvimento Java
Antes de tudo, temos que baixar o [**kit de desenvolvimento Java**]. Esse kit é um
conjunto de ferramentas que podemos utilizar para escrever e rodar um código Java.
Após instalá-lo, podemos abrir o terminal e ver qual a versão do Java estamos
utilizando.
Para isso, basta digitar `java` no terminal seguido de `-version`. No caso, estamos
na versão 11 da linguagem:
imagem após a declaração de uma classe:
java
Essa é a classe principal do nosso programa. Vamos usar ela para rodar um código
que imprime uma mensagem. Ou seja, nossa classe terá um comportamento: Imprimir uma
mensagem no terminal. A esse comportamento, nós chamamos de métodos.
O método pertence a classe, isto é, ele faz parte do corpo da classe. Por isso,
vamos começar a escrever o método dentro das chaves, dentro do corpo da classe.
Esse é o nosso método principal (`main`). No Java, existe um padrão para escrever
esse método. Primeiro, dizemos que ele é um método público (`public`), ou seja,
todos têm acesso a ele. Precisamos falar que esse método pertence a classe, por
isso, falamos que ele é um método estático (`static`).
Esse método é não devolve nada, isto é, ele é executado e não retorna nenhum valor
após sua execução, indicamos isso com a palavra `void`. Da mesma forma que as
classes, o método precisa de chaves (`{ }`) para indicar seu corpo e além disso,
todo método precisa terminar com parênteses (`( )`).
Por ser da especificação do método principal, dentro dos parênteses, temos que
colocar o conteúdo `String[] args` (na verdade, pode ser outro nome além de àrgs`,
porém esse é o padrão seguido pela maioria das pessoas):
java
> O corpo do método foi definido, mas como podemos fazer o Java imprimir uma
mensagem para a gente?
## Mostrando uma mensagem
Queremos que o sistema (`System`) imprima para gente uma mensagem (`print`). Essa
ação de escrita é uma saída do sistema, ou seja, é um output (òut`). Logo,
queremos que o sistema, realize uma saída do programa (òut`) que é imprimir alguma
coisa:
java
O `print` também é um método, ou seja, também deve terminar com parênteses e, por
convenção da linguagem, toda instrução é terminada com um ponto e vírgula (`;`):
java
No mundo da computação, existe uma tradição que o primeiro programa seja uma
mensagem: "Olá, mundo". Portando, vamos colocar essa mensagem dentro dos parênteses
do `print`. Como ela é um texto, passamos entre áspas:
java
> \*"Mas e aí? Como podemos rodar esse código?"\*
## Rodando o código
O Java é uma linguagem híbrida, isto é, ela não é totalmente compilada, como C e C+
+, nem totalmente interpretada como JavaScript e Lua.
Quando escrevemos um código em Java, precisamos transformar esse código em algo que
a máquina virtual do Java (JVM) consiga entender e executar o código. O código que
roda na JVM é o **bytecode java**. Este é obtido após compilar o código Java, o
bytecode é interpretado pelo JVM.
Ou seja, para rodar o código Java, temos que compilá-lo para bytecodes antes, logo,
podemos ir até o terminal e rodar o comando `javac MeuPrimeiroPrograma.java`.
> Importante atentar que o nome do arquivo é igual ao nome da classe
![]
Código compilado, agora basta falar para o Java executar essa classe:
![]
Nossa mensagem foi impressa, mas o que significa esse `%` no final? Isso é algo que
meu terminal coloca para indicar que ele colocou uma quebra de linha naquele
espaço. Podemos falar para o Java colocar essa quebra de linha. Basta trocar o
método `print` por `println`. O `ln` no final do método indica que queremos quebrar
a linha:
java
Agora basta compilar e pedir para o Java rodar novamente o programa:
![]
Bacana, conseguimos imprimir nossa mensagem.
## Para saber mais
Esse `String[] args` que passamos no método `main` é na verdade uma lista de
parâmetros que podemos passar quando falamos para o Java rodar a classe.
O Java é uma linguagem muito utilizada pelo mercado. Podemos utilizá-las em

diversos pontos no mundo da computação. Criando desde sistemas desktops, até
sistemas complexos que se comunicam ao redor do mundo.
Essa é apenas uma pequena introdução sobre a linguagem. A plataforma Java é muito
extensa e consegue ser encaixada em muitos projetos.
Aqui na Alura, temos uma [**formação que começa desde o básico com a linguagem e
com orientação a objetos, até sistemas web com conexão no banco de dados**]. Ao
final da formação você fará um projeto onde será que será avaliado por um de nossos
instrutores. Nesse projeto, será colocado em prática todos os conceitos vistos na
formação.
imagem
O processo de enviar uma requisição para um servidor é parecido com o de enviar um

pacote pelos correios, isto é, os pacotes enviados pelo computador passam por
algumas etapas até chegar ao destino final. Esses passos são o que chamamos de
**modelo OSI**.
Quando fazemos uma **requisição** para um servidor web, essa percorre um longo
caminho da sua máquina até o servidor.
Essa requisição que saí do seu computador por um cabo de rede, ou pelo ar, caso use
um Wi-Fi. Passa pelo seu provedor de internet e por diversos outros servidores até
chegar no destino. Quando o servidor manda uma resposta, esse caminho se repete.
Mas como a requisição sabe qual caminho seguir? Como ela sai do meu computador e
chega ao servidor?
## Conhecendo o modelo OSI
O modelo OSI é um padrão para os [**protocolos de rede**]). Protocolos nada mais

são do que regras de comunicação usadas para conectar dois ou mais computadores. O
que o modelo OSI faz é agrupar esses protocolos em grupos específicos, ou camadas.
## Camada 1 - Física
A primeira camada do modelo OSI é a camada física. Voltando para o exemplo dos
correios, a camada física seriam as estradas, ou seja, o caminho que os pacotes
percorrem para chegar ao destino.
Nesta camada são especificados os [**dispositivos, como hubs**] e os meios de

transmissão, como os cabos de rede. Os dados são transmitidos por esses meios e
processados na próxima camada.
## Camada 2 - Enlace ou Ligação

Fazendo um paralelo com os correios, essa camada funciona como um fiscal. Ele
observa se o pacote tem algum defeito em sua formatação e controla o fluxo com que
os pacotes são enviados.
Nesta camada, os dados recebidos do meio físico são verificados para ver se possuem
algum erro e,se possuírem, esse erro pode ser corrigido. Dessa forma, as camadas
superiores podem assumir uma transmissão praticamente sem erros. Esta camada também
controla o fluxo que os dados são transmitidos.
Nesta camadas que são definidas as [**tecnologias como as VLans**], ou topologias

como a Token ring, ou a ponto-a-ponto. Também é nesta camada que [**dispositivos
como os switches**] funcionam.
Esta camada é dividida em duas subcamadas: **A camada MAC e a camada LLC.**
### A subcamada MAC
É nesta camada que possibilita a conexão de diversos computadores em uma rede. Cada
máquina conectada na rede tem um endereço físico, conhecido como [**endereço
MAC**]. É esse endereço que a camada utiliza para identificar e enviar os pacotes.
Essa camada atua como uma interface entre a camada física e a subcamada LLC.
### Já a subcamada LLC
É nesta camada que temos o controle de fluxo dos dados na rede. É por conta dessa
camada que conseguimos ter vários protocolos da próxima camada convivendo dentro de
uma mesma rede.
## Camada 3 - Rede
Quando estamos enviando uma carta, os correios verificam quem é destinatário e quem
é o remetente da mensagem. Se existirem muitas mensagens para serem enviadas, eles
podem priorizar quais serão enviadas primeiro e qual é o melhor caminho para enviar
essa carta.
Isso é justamente o que a camada 3 faz, ela atua como uma central dos correios.
Esta é talvez a camada mais atuante nas redes, principalmente na internet.
É nesta camada que temos o endereçamento IP de origem e de destino, ela também pode
priorizar alguns pacotes e decidir qual caminho seguir para enviar seus dados.
Essa camada basicamente controla o roteamento entre a origem e destino do pacote.
> "Mas por que utilizar o endereço IP se já temos o endereço MAC?”
**O endereço MAC** é o endereço físico de quem envia o pacote. Ou seja, se

enviarmos um pacote e esse pacote passar por cinco dispositivos diferentes
(roteadores, switches, ou servidores, por exemplo) o endereço MAC é alterado no
processo. Já o endereço IP não sofre essa alteração.
**O endereço IP** é a identificação da sua máquina na rede. É aquele endereço como
192.168.0.1.
É nessa camada que temos protocolos como o [**IP**] ou o [**ICMP**].
Bem, as cartas chegaram a central dos correios, agora elas precisam ser
transportadas.
## Camada 4 - Transporte
Se na camada um temos as estradas e os caminhos que os dados percorrem, na camada

quatro temos os caminhões e os carteiros.
É esta camada que garante o envio e o recebimento dos pacotes vindos da camada 3.
Ela gerencia o transporte dos pacotes para garantir o sucesso no envio e no
recebimento de dados.
Esta camada lida muito com a qualidade do serviço para que os dados sejam entregues
com consistência, isto é, sem erros ou duplicações. Porém nem todos os protocolos
desta camada garantem a entrega da mensagem.
Protocolos muito comuns dessa camada são os protocolos [**TCP**] em [**UDP**]. O

primeiro garante a entrega da mensagem, diferente do segundo. Por não garantir a
entrega da mensagem, o protocolo UDP é um pouco mais rápido que o TCP.
Bem, mas para ocorrer o transporte de um pacote entre os computadores, é necessário

que as máquinas consigam se comunicar. Isso é função da próxima camada.
## Camada 5 - Sessão
Está camada é responsável por estabelecer e encerrar a conexão entre hosts. É ela
quem inicia e sincroniza os hosts.
Além de realizar o estabelecimento das sessões, esta camada também provém algum
suporte a elas, como registros de log e realizando tarefas de segurança.
Recebemos os pacotes, vamos checá-los para ver que dados tem dentro?
Ainda não podemos. Os dados ainda precisam ser tratados para serem usados. Como a
camada de sessão só é responsável por estabelecer a conexão entre os hosts, o
tratamento dos dados é de responsabilidade da próxima camada.
## Camada 6 - Apresentação
Está é a camada responsável por fazer a tradução dos dados para que a próxima
camada os use. Nesta camada temos a conversão de códigos para caracteres, a
conversão e compactação dos dados, além da criptografia desses dados, caso
necessite.
Depois de tratados, esses dados estão prontos para serem usados na próxima camada.
## Camada 7 - Aplicação
**A última camada do modelo OSI é a camada para consumir os dados**. Nesta camada
temos os programas que garantem a interação humano-máquina. Nela conseguimos enviar
e-mails, transferir arquivos, acessar websites, [**conectar remotamente em outras
máquinas**], entre outras coisas.
É nesta camada que temos os protocolos mais conhecidos como o **HTTP, FTP, além de
serviços como o DNS.**
## Para saber mais
Quando falamos das camadas do **modelo OSI**, costumamos falar na ordem inversa,
isto é, a camada mais alta é a camada 7, enquanto que a camada 1 é a camada mais
baixa:
![]
Além do modelo OSI, outro modelo utilizado em redes é o [**TCP/IP**]. Esse modelo,
que leva o nome de dois protocolos, busca agrupar os protocolos da mesma forma que
o modelo OSI, porém com menos camadas.
Conhecer os protocolos é uma das skills de quem trabalha com infra. Não é
necessário saber todos, mas conhecer alguns pode ajudar na hora de resolver alguns
problemas na rede.
Se quiser aprender um pouco mais sobre esses protocolos, temos aqui na Alura uma
[**formação em redes**].
Nela você aprenderá sobre os protocolos, como criar e configurar uma rede local,
sobre VLans, além de segurança.
Se você é um desenvolvedor web, conhecer os protocolos por trás de seus projetos

podem ajudar a otimizar o código e melhorar os serviços.
Na web o principal protocolo é o HTTP e aqui na Alura temos um [**curso sobre este
protocolo**]. Nele você aprenderá como utilizar tudo que o protocolo HTTP tem para
oferecer.
imagem
Digamos que você tem um array de números em JavaScript:
javascript
E queremos ordená-lo. O que fazer? Usar a função `sort()` claro!
javascript
Repare no resultado: não está na ordem esperada. Essa questão foi trazida ao [fórum
da Alura] pelo Jean Cesar Batista.
A grande questão é que a função `sort()` usa por padrão a ordenação alfabética
baseada na tabela Unicode. Apesar de inesperado isso está [documentado]. A solução
é **usar a nossa própria função de comparação**.
## Implementando função de comparação
O `sort` recebe opcionalmente uma função de comparação que, dados dois valores,
deve devolver um número inteiro:
- Se for `0` indica que são iguais

- Se for `-1` indica que o primeiro valor é menor
- Se for `1`, o segundo é menor.
Podemos criar essa função:
javascript
E chamamos o `sort` passando a função:

javascript
Funciona!
## Simplicando a implementação
E, claro, podemos **simplificar bastante** esse código.
É possível trocar a função nomeada pra ser anônima. E trocar os três IFs por uma
conta simples: à - b`.
Repare que o resultado dessa conta é sempre `0` se forem iguais, `-1` se à` é
menor e `1` se `b` é menor. Exatamente o que precisamos.
Juntanto tudo isso com a sintaxe de _arrow functions_ do ES6 pra escrever menos,
podemos simplesmente fazer:
javascript
O que achou? Bem enxuto, concorda? Aproveite e deixe o seu comentário sobre o que
achou da ordenação de array no JavaScript.
Como encontrar a forma certa de se inserir no mercado de trabalho, competir pelas

melhores oportunidades e crescer profissionalmente são preocupações para qualquer
pessoa que dá os primeiros passos em sua carreira. Ter a preparação correta e saber
como se capacitar são fundamentais para um designer na área de tecnologia encontrar
essas respostas.
Essa missão pode parecer complexa, mas apresenta boas alternativas para quem sonha
em trilhar um caminho como designer.
Enquanto profissionais de outros setores sofrem com a escassez de oportunidades, os

designers enxergam um mercado em que as chances não diminuem mesmo em períodos de
instabilidade econômica. Mesmo que não encontre um emprego fixo, é possível
recorrer a trabalhos como freelancer, que proporcionam mais liberdade e autonomia
sobre a própria rotina.
Entretanto, é necessário ter disciplina, [**dominar as ferramentas da área**],

investir em cursos de capacitação e estar atento às tendências da área de
tecnologia. Se as oportunidades são muitas nesse mercado, uma das principais razões
é sua evolução constante e a grande capacidade de inovação. Dessa forma, é preciso
se manter atualizado.
Você está interessado em ser um designer na área de tecnologia? Confira a seguir

alguns dos motivos que justificam investir nessa carreira.
## 1\. Saiba por que investir em uma carreira na área de tecnologia
Lidar com computadores, códigos e redes faz parte da rotina de muitos jovens
atualmente. Assim, a escolha por atuar na área de tecnologia é algo natural para
quem sonha em aproveitar essas habilidades e construir uma carreira profissional.
A área de tecnologia apresenta um cenário positivo para quem pretende seguir esse
caminho. A relação entre ofertas de trabalho e profissionais qualificados é
positiva [**para quem procura uma oportunidade**]. Como não há grande volume de
pessoas com as competências necessárias para essas atividades, são muitas as vagas
disponíveis e que oferecem grande remuneração.
Mesmo quando há crise, as ofertas em tecnologia não sofrem redução como em outras
áreas. Pelo contrário, se mantêm como alternativas de crescimento profissional e
com salários atrativos para quem ainda dá os primeiros passos na carreira.
Todavia, para estar apto a corresponder às demandas do mercado, é necessário se

manter atualizado e preparado para mudanças. Novos softwares e ferramentas são
desenvolvidos constantemente, o que obriga que a preparação e a busca por novos
conhecimentos seja incessante.
Além de adquirir capacitação suficiente para atender às competências exigidas, é

preciso mostrar aptidão para a área de tecnologia. A melhor forma de fazer isso é
apresentar um portfólio que impressione, o que veremos a seguir.
## 2\. Entenda como montar um portfólio poderoso
Possuir um portfólio poderoso é uma ótima alternativa para quem procura uma
oportunidade no mercado de tecnologia. É por meio dele que você mostrará a
qualidade de seu trabalho e sua capacidade de adaptação às tendências de sua área
de atuação.
Ter um portfólio online é pré-requisito para a participação em muitos processos de

seleção. Caso o candidato não apresente projetos que já desenvolveu, ele nem sequer
seguirá para as próximas etapas da disputa por uma vaga. Porém, uma questão
incomoda jovens profissionais. Como é possível ter um portfólio sem clientes?
Ao construir essa página online, não é obrigatório relacionar apenas projetos

profissionais. Trabalhos desenvolvidos em estágio e faculdade são também
oportunidades de mostrar aptidão e competências, qual seu estilo e a capacidade de
atender às expectativas do cliente.
Caso ainda não tenha um portfólio, crie um. Comece com trabalhos para amigos ou
familiares, ofereça projetos para ONGs (Organizações não-governamentais) ou
instituições de caridade. Nesse caso, você não será remunerado, mas terá a
oportunidade de desenvolver material para apresentar a futuros clientes.
Se, por ventura, você tiver participado de apenas uma parte do projeto, isso não
impedirá que ele faça parte de seu portfólio. No entanto, é necessário identificar
de quem é a autoria do restante do material, assim como é fundamental esclarecer
quando o trabalho foi desenvolvido sob a supervisão de outro designer. Essas
medidas são imprescindíveis para evitar constrangimentos.
A partir da criação de um portfólio, esse será um processo que jamais terá um fim.
Afinal, novos trabalhos serão adicionados, até o ponto que os primeiros projetos
possam ser substituídos por aqueles em que você atingiu altos níveis de qualidade e
essa renovação se torne constante.
Há aqui, portanto, uma dúvida entre quantidade e qualidade. Embora ter muitos
trabalhos possa demonstrar que você esteve envolvido em muitos projetos, priorizar
aqueles com mais qualidade é importante para dar destaque aos seus melhores
trabalhos.
### Como organizar um portfólio?
**Além de apresentar bons materiais, a forma como será feita essa apresentação é
importante para causar boa impressão. A organização do portfólio pode ser feita por
ordem cronológica, categorias ou temas.**
Quando o fator é cronológico, priorizar dos mais recentes para os mais antigos pode
ser uma boa alternativa, já que a tendência é de que sua experiência tenha
contribuído para aqueles que foram feitos nos últimos meses terem mais qualidade.
Já a divisão por categorias e temas facilitará a identificação entre os diferentes

formatos de projetos, além de mostrar sua capacitação para diferentes trabalhos.
Versatilidade é importante para que o cliente saiba que você é capaz de fornecer a
solução para o que ele busca.
No entanto, algumas ferramentas podem facilitar essa organização. Avalie as opções

a seguir e descubra aquela que mais se adequa às suas necessidades.
### Ferramentas úteis para a criação de um portfólio
Uma vez que a criação de um portfólio é fundamental para mirar boas oportunidades
profissionais, utilizar alguma ferramenta pode tornar essa missão mais fácil de ser
alcançada. Acompanhe algumas das alternativas que você pode aproveitar para criar
seu portfólio:
- [Behance]: muito utilizada por designers, essa ferramenta conta com uma
plataforma gratuita e fácil de usar, além de espaço para a inclusão de um pequeno
currículo com informações básicas. Há a possibilidade de separação dos trabalhos
por projetos, que poderão reunir todos os materiais, em uma interface bem
organizada e bonita.
- [Coroflot]: desenvolvida para designers, essa ferramenta tem interface simples e
espaço ilimitado para armazenamento de trabalhos. Um diferencial é a possibilidade
de acompanhar todas as informações de tráfego da página e, assim, saber quais os
projetos que receberam mais visitas.
- [Clippings.me]: criada para jornalistas, essa ferramenta atende também a
profissionais de tecnologia da informação. É possível utilizar links de trabalhos
feitos, o que facilita a indicação de projetos desenvolvidos.
## 3\. Saiba como conseguir trabalhos como freelancer e ganhar experiência
Ainda que a área de tecnologia não sofra tanto com a crise econômica como os demais
setores, trabalhar como freelancer é uma alternativa que tem recebido mais adeptos
nos últimos anos. Além de possibilitar “fugir” dos impactos da redução de
investimentos e das ofertas de serviços, essa atuação dá mais liberdade ao
profissional, que tem autonomia sobre os horários de trabalho e sobre a escolha de
onde vai realizar suas atividades, além de receber por produtividade.
**Porém, trabalhos como freelancer exigem muita disciplina, organização e

planejamento financeiro. Quem oferece esses serviços, normalmente, busca por
profissionais com experiência e voltados para a prática. O foco está também em
designers que sejam eficientes e tenham agilidade em suas tarefas. A boa formação
acadêmica nem sempre será tão valorizada quanto à capacitação técnica.**
É importante ter em mente que a atuação como freelancer também exige

profissionalismo. Portanto, se organize para ter um horário de trabalho e uma
rotina bem definida. Saber definir prioridades é fundamental. Para defini-las,
utilize critérios como prazo de entrega, nível de dificuldade para produção e
conhecimento prévio sobre o trabalho a ser feito. Assim, você aumentará sua
produtividade e conseguirá atender melhor os clientes.
Para o freelancer, há momentos em que são muitas as oportunidades de trabalho e os

ganhos crescem. Porém, outros períodos apresentam menos serviços a serem feitos, o
que afeta na renda e no planejamento financeiro. Assim, realizar bons trabalhos e
se diferenciar no mercado é o caminho ideal para fidelizar clientes e sempre manter
um bom leque de indicações.
**A capacidade de inovação está diretamente ligada ao planejamento financeiro. Se

você apenas oferece trabalhos similares àqueles que são desenvolvidos por outros
designers, o cliente tende a optar pelo menor preço. Dessa forma, se diferenciar no
mercado amplia suas oportunidades e também o quanto você poderá cobrar por cada uma
delas.**
Como vimos neste artigo, criar um portfólio é imprescindível para ter oportunidades
de trabalho como designer. Afinal, é por meio do portfólio que o cliente conhecerá
seu estilo e os projetos em que já participou. Você também pode aproveitar esse
material para apresentá-lo a outros profissionais e aumentar sua rede de contatos.
Encarar outros designers apenas como concorrentes poderá limitar a chance de seu
trabalho ser reconhecido e indicado para novos clientes. O networking também lhe dá
a possibilidade de receber dicas, compartilhar conhecimentos e oportunidades de
negócios. Você pode, por exemplo, “dividir” clientes com pessoas que trabalhem com
suporte em tecnologia da informação e criar uma rede de indicações.
Ao receber novas oportunidades, esteja atento ao que o cliente procura. Ouça bem e
não tente impor ideias. Atender às expectativas é fundamental para ganhar confiança
e fidelizá-lo.
Para não decepcionar o cliente e gerar repercussão negativa sobre seu trabalho, não
aceite qualquer proposta de trabalho. Foque naquilo que você saiba fazer. Aceitar
oportunidades sem ter competência para atendê-las, fará com que você tenha muito
trabalho para conseguir realizar aquela tarefa e ainda pode abalar sua
credibilidade. Cumprir prazos é de suma importância para manter clientes
satisfeitos e aumentar as chances de novas indicações.
### Oportunidades para freelancers
**Assim como networking e indicações são um bom caminho para conseguir trabalhos
como freelancer, a internet oferece boas formas de encontrar oportunidades.
Diferentes sites e plataformas podem ser utilizados para encontrar um serviço.**
Designers podem identificar boas oportunidades no [99Designs]. Todos os inscritos

na plataforma podem disputar a mesma vaga, mas só o escolhido pelo cliente ganhará
a oportunidade de realizar o serviço.
Já o [Freelancer] é uma plataforma que apresenta oportunidades de todo o mundo e

paga em libras, o que representa mais ganhos para os designers brasileiros. Ele tem
como um concorrente o [Upwork], que também atua em nível internacional.
Também são muitas as plataformas brasileiras para quem busca um trabalho como
freelancer. Com foco na área de comunicação e tecnologia da informação, o [Trampos]
tem ainda divulgação de empregos fixos ou estágios. Já o [99freelas] e o
[Prolancer] permitem cadastro por email ou conta do Facebook e se apresentam como a
conexão entre empresas que buscam um talento digital e esses profissionais.
O [Nearjob] tem design simples e de fácil navegação. Uma boa oportunidade para quem
quer mais clientes, obriga o cliente a depositar na plataforma assim que é fechado
o acordo com o freelancer. Quando o trabalho é concluído, esse valor é repassado ao
profissional que o realizou.
Outra plataforma que intermedia a forma de pagamento é o [WeDoLogos], voltado para

trabalhos de criação de cartões, folders e identidade visual. O [ComunicaGeral],
por sua vez, apresenta oportunidades para profissionais de design gráfico, web
design, programação e tecnologia, além de comunicação e [marketing].
## 4\. Procure diferentes cursos de capacitação

Seja para realizar trabalhos como freelancer ou ter um emprego fixo, qualquer
profissional precisa demonstrar capacitação para vislumbrar mais oportunidades e
ter uma sólida carreira, especialmente na área de tecnologia. Para designers,
desenvolver competências se torna ainda mais importante. Afinal, essa é uma área
com inovações constantes, o que pode minar o futuro de profissionais que não
estejam qualificados para acompanhar essas mudanças.
Especialmente para freelancers, há uma demanda de profissionais que sejam capazes

de demonstrar agilidade, eficiência e, principalmente, sejam voltados para aspectos
práticos. Assim, a capacitação técnica pode sobressair à formação acadêmica.
Para atender a essa característica do mercado, os cursos profissionalizantes são um

bom caminho. Com conteúdos mais enxutos, eles têm foco na preparação para
conhecimento aplicável e oferecem retorno financeiro imediato. Na disputa por uma
oportunidade no mercado, esses cursos de capacitação mostram que o designer na área
de tecnologia procura se manter atualizado e em busca de novos conhecimentos.
Se cursos profissionalizantes são voltados para aspectos práticos, isso é ainda

mais acentuado nos cursos específicos. Essa forma de capacitação permite que você
esteja apto a corrigir pontos fracos e potencializar trunfos de seu currículo.
Com foco em áreas específicas, estes cursos desenvolvem habilidades para a solução
de questões da rotina de trabalho. Para que essa capacitação tenha o resultado
esperado, é necessário ter atenção ao seu programa e analisar se ele será destinado
à prática.
Caso detecte a necessidade de desenvolver uma habilidade específica, como o uso de

algum software, por exemplo, você pode investir seu tempo e concentração apenas
nesse ponto e estar mais preparado para novas oportunidades. Uma grande vantagem
desses cursos é a facilidade para encontrar alternativas online.
### Cursos para iniciantes em design
Para quem inicia carreira como designer, é importante conhecer quais alternativas
de curso proporcionam os conhecimentos básicos para se inserir no mercado. Os
primeiros passos nesse sentido podem ser dados com a entrada no mundo [Front End],
com capacitação em HTML e CSS.
Inicialmente, o designer deve ter contato com as tags de uma estrutura básica de
HTML, saber como evitar problemas de enconding com a tag charset e como aplicar
estilo em tags HTML usando CSS. Os cursos básicos ainda ensinam como adicionar
imagens utilizando tags, fazer tabelas com as tags TABLE, TR e TD, assim como criar
menus de navegação com as tags NAV, UL, E e A.
Num segundo momento, quando for compreendida a capacitação básica, a preparação

pode evoluir para o desenvolvimento de páginas da web (com HTML e CSS3), para web
design responsivo e bootstrap, que proporcionará conhecimento sobre a criação de
uma single-page responsiva.
Já se a intenção é ir além da estilização, o designer pode seguir para o caminho de

cursos voltados para [automoção e performance]. Essa capacitação envolverá
automação de tarefas front-end, testes automatizados em JavaScript e mais
habilidades em CSS.
Quando dominar os conhecimentos de JavaScript, parta para conhecimento de

frameworks que são utilizados na criação de apps usando front-end.
## 5\. Conheça mais sobre as tendências da área de tecnologia

Em busca das primeiras oportunidades no mercado ou apenas de mais um passo na
carreira, o designer na área de tecnologia já pode ter mente uma tendência: o
usuário é o foco atual. Proporcionar novas e satisfatórias experiências é a
principal missão de quem está envolvido nesse setor.
Em 2016, as tendências de UX se consolidaram como mais do que uma moda passageira.

O mercado de design demanda cada vez mais conhecimentos de programação. Essas
habilidades podem ser básicas, mas tendem a ser um diferencial para quem busca mais
espaço e novos horizontes. Assim, funções como front-end designer e UX designer têm
se consolidado como algumas das próximas competências a serem exploradas.
Com a ampliação da venda de smartphones e outros dispositivos móveis, oferecer mais

velocidade e melhores experiências são ainda mais importantes para um designer na
área de tecnologia. O avanço agora vai além do conceito de mobile first, com web
apps progressivos, que oferecem linkabilidade e compartilhamento, com ganhos em
engajamento.
O profissional de design, portanto, tem de se preparar para atender às essas

demandas e estar atento a possibilidades que surgem. Especialistas em avanços
tecnológicos já apontam mais mudanças e inovações.
Líder mundial em pesquisa e consultoria em tecnologia da informação, o [Gartner]

indicou que algumas tendências são claras para 2017 e preparam o cenário para Malha
Digital Inteligente. Elas podem ser divididas em três aspectos. O primeiro deles se
refere ao [aprendizado das máquinas e à inteligência artificial], a partir das
abordagens científicas de dados. Dessa forma, há a criação de inteligentes sistemas
físicos e baseados em softwares programados para aprenderem e se adaptarem à medida
em que interpretam mais dados.
Outras tendências apontadas pelo Gartner estão focadas na interligação entre os

mundos físico e digital. Nesse ponto, há a perspectiva do crescimento da realidade
virtual e aumentada em nosso cotidiano, a evolução de softwares que utilizam
sensores para responderem a mudanças e agregarem valor, e alterações nos formatos
de transações, com maior facilidade para distribuição de música, a verificação de
identidade, o registro de títulos e a segurança em cadeias de fornecimento.
E, por último, estão as tecnologias que envolvem as plataformas e os serviços

necessários para entregar toda essa inovação para os usuários finais. Os sistemas
conversacionais terão abrangência de mais pontos de contato, além dos tradicionais
chatbots e aparelhos habilitados por microfones. O Gartner indica ainda uma solução
otimizada para endpoints (com experiência contínua para o usuário na medida em que
transita entre eles), uma mescla entre plataformas digitais e também mais
responsabilidade para os profissionais encarregados pela segurança digital.
**Você está preparado para essas mudanças? Se a resposta ainda não for positiva,
não se assuste ou fique ansioso. Estabelecer uma carreira na área de tecnologia
demanda preparação, mas tem grandes vantagens. É justamente a evolução constante
desse setor que cria mais oportunidades e dá mais perspectivas de crescimento aos
profissionais que querem seguir esses passos.**
Além de se manter atualizado, o designer tem a possibilidade de utilizar os cursos

de capacitação para ampliar seu potencial para inovação. Desenvolver o próprio
estilo é uma forma de se diferenciar no mercado, conquistar mais espaço e fidelizar
clientes.
Oferecer apenas o que já é feito por outros designers, além de diminuir a

possibilidade de disputar por uma vaga ou serviço, impede uma boa remuneração.
Afinal, se não há um diferencial, o cliente pode optar por aquele que cobra o menor
preço.
**Se você se prepara, valorize seu trabalho. Mesmo para quem ainda está no começo
de carreira, o desenvolvimento de um projeto tem valor. O preço não deve ser o
diferencial naquilo que você oferece. Há outras formas de conquistar oportunidades.
Procure atender bem os clientes, corresponder às suas expectativas e agregar valor
ao que oferece. Assim,além de ganhar confiança e credibilidade, você amplia a
possibilidade de receber mais indicações.**
Assim como o **mercado de Startups e Fintechs**, o comportamento de consumidores é

muito dinâmico. Se em um dia ele está certo do que quer, no outro o pensamento pode
já não ser o mesmo.
Por isso, uma empresa, por mais que seu serviço/produto seja essencial ou
extremamente vantajoso, precisa fazer com que os clientes e possíveis clientes
lembrem-se disso frequentemente.
Uma das principais maneiras de permanecer em contato com o público é por meio do
marketing digital. Com uma presença online forte, as Startups, Fintechs e qualquer
tipo de empresa chegam nos lugares onde o usuário está e conseguem ser reconhecidas
por ele.
Apesar de existir uma infinidade de estratégias possíveis, cada qual com suas
vantagens, 4 ações serão responsáveis por viabilizar o relacionamento entre marca e
consumidor, gerando ótimos resultados ao primeiro e boa experiência ao segundo. São
elas:
- Estratégia de AdWords
- Remarketing com base em recência
- Conteúdo
- Coleta de leads.
## AdWords com sua própria marca
De acordo com o Google, mais de **1 milhão de empresas trabalham com AdWords**. A
ideia central é a atração de novos visitantes, aumento de vendas e maior
engajamento dos clientes com a marca.
Com o serviço, que vai muito além das buscas por palavras-chave, abre-se a
possibilidade de alcançar clientes em páginas com bastante relevância em toda a
web. A segmentação pode ser feita de inúmeras maneiras, como tipo de site, público-
alvo, remarketing etc. Basicamente, os anúncios são veiculados onde e quando são
relevantes para seu público-alvo.
O AdWords é capaz de mensurar precisamente como as pessoas agiram diante do

anúncio. O anunciante sabe quantas tiveram acesso à mensagem e qual a porcentagem
delas que clicou no link. Com ferramentas corretas, ainda é possível acompanhar as
vendas que o site gera a partir dos cliques vindos de anúncio.
As Startups e Fintechs com anúncio no AdWords terão a oportunidade de alcançar

pessoas na hora e local desejados, com a vantagem de pausar e reiniciar a campanha
quando bem entenderem e em qualquer dispositivo cujos clientes utilizarem. Nossa
dica é bem simples, mas algumas empresas ainda não utilizam: anunciar o próprio
termo da marca.
Lucas Burza, diretor de conteúdo da Agência Linka, defende que a ideia de anunciar
a própria marca garante a encontrabilidade para o caso de existir alguma busca pela
palavra-chave.
> “Além disso, deixamos de correr o risco da concorrência veicular sozinha e, por
fim, naturalmente com uma boa estrutura de campanha e criativos, o valor do CPC
(custo por cliques) será muito baixo, já que naturalmente terá um dos maiores
quality score para esse leilão”, reforça Burza.
## Remarketing com recência (curta e longa)
**A estratégia do remarketing com recência curta** tem a função de criar listas de
remarketing com períodos de tagueamento mais curtos, assim o usuário é impactado
justamente no momento em que apresenta as maiores chances de conversão.
Assim, o site de uma empresa com uma média de 80% das conversões nos 5 primeiros
dias após o primeiro impacto pede uma campanha como essa, a qual, para conseguir
maior impacto, contará com orçamentos mais agressivos ou a definição de lances para
o período em questão mais altos.
Com isso, os usuários são mais impactados nos 5 primeiros dias e, após tal período,
passam a ser impactados por outra campanha com a frequência, criativos e lances
diferenciados.
Já o remarketing com recência longa é normalmente usado com produtos e serviços dos
quais o tempo de decisão é maior, ou seja, são conversões em que o impulso não
funciona. Com isso em mente, a ideia é conseguir, por meio do remarketing, eliminar
as objeções.
> “A melhor estratégia de remarketing é conciliar a recência com as ações dentro do

ambiente online junto a uma mensagem com senso de urgência. Imagine comparar alguém
que há 15 dias acessou sua home e não voltou com uma pessoa que acessou, colocou um
produto no carrinho, iniciou o checkout e tudo isso há 1 dia. São usuários
diferentes, que precisam receber mensagens diferentes e, com certeza, investimentos
diferentes. O mais importante numa ação de remarketing é não incomodar e sim atrair
novamente”, avalia Lucas.
## Conteúdo
Trabalhar com marketing de conteúdo é pré-requisito para quem quer ver a marca
crescer no mercado. A prática é fundamental para engajar seu público-alvo,
estimular suas ações e, consequentemente, aumentar sua receita.
Um bom trabalho de marketing de conteúdo exige uma série de ações para ser
implementado com sucesso. Logo no planejamento, é preciso definir qual é o objetivo
de utilizar a estratégia, ou seja, o que se pretende alcançar por meio dela.
Alguns dos objetivos mais comuns são **geração de leads**, vendas e engajamento;
diminuição de custo por venda; e aumento do lifetime-value. Com o objetivo
definido, torna-se mais fácil o trabalho de encontrar a persona que agirá como dela
se espera.
Pesquisas de mercado, análise de dados, pesquisas online e entrevistas com os

próprios clientes são alguns dos meios para se estabelecer a persona. Em seguida, é
preciso optar por quais canais se pretende alcançar seu público.
Alguns deles costumam ser muito efetivos, como blog, mídia social e e-mail
marketing. A partir da escolha dos canais a serem utilizados, é o momento de
escolher o formato em que o conteúdo será veiculado.
Mais uma vez, são muitas opções, sendo texto, imagem e vídeo as mais utilizadas. No
entanto, pode-se ir além e apostar na criação e divulgação de infográficos, e-books
e hangouts, por exemplo.
Talvez a parte mais importante da estratégia seja o estudo do funil de vendas.

Apenas assim, uma marca será capaz de fornecer um conteúdo assertivo, respeitando o
momento da jornada de seus possíveis clientes.
## Coleta de leads
Obviamente, atrair pessoas faz parte da estratégia de qualquer negócio. Para ser
bem-sucedido nesse aspecto, o empreendedor pode se aproveitar de **4 aspectos
importantes na coleta de leads**:
- Landing pages
- Formulários
- Oferta
- CTA (call to action).
A página de destino é onde o visitante chega ao site. Ela deve ser clara, de fácil
utilização e com um layout amigável. Uma de suas funções é justamente conseguir
informações do usuário, por isso um formulário nesta página é muito bem-vindo.
A pessoa preencherá o formulário com seus dados para receber uma oferta, que pode
ser cupom de desconto, vantagens ou mesmo um material informativo, como um e-book.
A relevância dessa oferta é o que vai fazer com que o usuário clique no CTA para
recebê-la.
Ou seja, para coletar leads sem ser petulante, a oferta de um material rico é uma
solução. O visitante deixará seu e-mail em troca do acesso a esse material.
## Ponto de partida, não de chegada
Obviamente, uma campanha de marketing pode deve, aliás **envolver outras

estratégias para conseguir sucesso**. Entretanto, ter o know-how dessas 4 ações e
saber implementá-las já será o suficiente para colocar uma empresa à frente de suas
concorrentes no ambiente digital.
imagem
Na plataforma de ecommerce da [**Casa do Código**], quando queremos comprar algum

livro, precisamos passar estas informações:
imagem
Para diminuir as dúvidas do usuário ao interagir com nossos formulários ou nosso

wizard, é muito importante deixar claro que tipo de informação queremos dele. Na
Alura nós temos um curso de [Microcopy] que trata especialmente desse tipo de apoio
à informações dentro de formulário. Dá uma olhadinha lá! ;)
Fiz um programa em Python para ser iniciado sempre que meu computador liga. O
programa pega o nome de usuário de quem está usando e retorna uma mensagem de boas
vindas.
Caso o usuário seja eu mesmo, que sou o administrador do computador, quero que a
mensagem seja diferente. Decidi implementar utilizando um operador que aprendi
recentemente - [o **is**]:
py
Loguei no meu computador através do usuário **Visitante** e:
py
Quando loguei como **Yan**:
py
Certo, aparentemente está tudo funcionando! Acontece que eu resolvi mudar o meu
login de `Yan` para `Yan Orestes`. Alterei meu código:
py
Fui logar com meu usuário e:
py
Ué! Se o usuário era exatamente o mesmo, por que não deu certo?
## ìs` para identidade, `==` para igualdade
O que acontece é que estamos usando o operador ìs` sem entender de fato como ele
funciona! **O ìs` compara a identidade do objeto,** isto é, o valor de referência
de seu endereço na memória, não o valor definido por nós.
Mas espera… já vimos algo assim, não é? O operador `==` também funciona, a
princípio, desta forma, mas [**seu comportamento pode ser alterado através dos
métodos de comparação rica**], por exemplo.
Então como podemos alterar o comportamento do ìs`? Bem… na verdade, não podemos. O
propósito do ìs` é justamente esse, uma comparação que sempre se baseará na
identidade de um objeto, ou seja, se um objeto de fato **é** (_is_) o objeto que
está sendo comparado.
**Quando quisermos comparar um valor (ou qualquer coisa que definirmos) de um

objeto, usamos, então, o operador `==` e os métodos de comparação rica. Quando
quisermos comparar a identidade de um objeto, usamos o ìs`.**
Mas, se é assim, por que nossa primeira comparação com ìs` (ùsuario is 'Yan'`)
retornou `True`?
## _String interning_ no Python
Por padrão, no Python (na implementação padrão [**CPython**]), cada vez que
atribuímos um objeto a uma variável, estamos criando um objeto. Ou seja:
py
Deve resultar em:
py
Mas vimos que esse resultado esperado não foi obtido com a string `’Yan’`. Por quê?
Isso é o que chamamos, na computação, de _[**string interning**]_.
_String interning_ é uma técnica que força o armazenamento de **apenas uma** cópia
de cada valor de string diferente na memória do computador.
Essa técnica é de muita utilidade para poupar espaço na memória, mas, ao mesmo
tempo, pode prolongar o tempo de processamento de algumas operações, já que ao
criar uma string,o computador tem de procurar por todas as strings já existentes se
uma já tem o valor dessa nova.
O Python suporta essa técnica de _string interning_ através da função

**[intern()]** (que é _built-in_ no Python 2 e no Python 3 se localiza no módulo
**[sys]**), mas não a utiliza por padrão nas operações de strings. Entretanto, há
algumas exceções em que essa técnica é usada nativamente pela linguagem.
Um exemplo é com strings de apenas um caractere, que **sempre** passam por esse
processo:
py
E o resultado:
py
No nosso caso, com a string `’Yan’`, o que acontece é que as strings que se pareçam
com identificadores Python, isto é, contenham apenas letras normais (à-z A-Z`),
números (`0-9`) e underlines (`_`), passam automaticamente pela técnica de _string
interning_.
Por isso o teste com a string `’Yan’` teve um resultado diferente de com a string
`’Yan Orestes’`, que contém um espaço em branco. Olha como seria se não tivesse
esse espaço:
py
Como resultado:
py
## Peculiaridades com números inteiros
O Python nos traz um comportamento parecido ao do _string interning_ automático

quando lidamos com números inteiros. Vamos fazer alguns testes:
py
Como resultado, temos:
py
Dessa vez, o resultado é porque, na implementação em C do Python, [**os inteiros

entre -5 e 256 são armazenados em uma array**]. Assim, quando criamos um int nesse
alcance recebemos de volta uma referência para o int já criado na array, em vez de
criarmos um novo objeto.
## Relações entre `==` e ìs`

Depois de tantos testes e explicações, entendemos que o fato de `==` resultar em
**True** para determinadas variáveis **não significa** que ìs` também retornará o
mesmo. Mas como funciona na relação inversa?
Intuitivamente, podemos pensar que todos as operações com ìs` que retornam
**True** também retornam **True** com `==`, afinal se uma variável **é** outra
variável, elas devem ter o mesmo valor (além da mesma identidade).
Em geral, essa ideia está correta, mas não é uma regra, como nos mostra o próprio
Python com o valor **[NaN]** (_**N**ot **a** **N**umber_, não é um número) de tipo
float:
py
E o resultado é:
py
## Conclusão
Nesse post, entendemos a diferença dos comparadores `==` e ìs` e vimos quando
devemos usar cada um deles, concluindo que o operador ìs` deve ser usado **sempre
e somente** quando queremos comparar a identidade de um objeto, isto é, seu
endereço na memória.
O `==`, por sua vez, deve ser usado quando quisermos comparar valores (ou, na
verdade, qualquer outra coisa!) de objetos.
Além disso, analisamos algumas peculiaridades específicas da implementação CPython,

tornando mais pleno nosso conhecimento sobre o tópico.
Finalmente matamos essa dúvida, hein? E aí, gostou do conteúdo? Se quiser aprender
mais sobre Python, se aprofundando nessa interessante linguagem, dê uma olhada em
nossos [**cursos de Python na Alura**]!
Estudar sempre vale a pena. Podem tirar meus bens, mas o que eu aprendi, ninguém me
tira.
A outra pergunta importante é: **uma certificação Java é valiosa pelo certificado

ou pelo estudo**? Como co-autor do [curso de Certificação Java 7 e 8] pela
**Alura** essa é a pergunta que vale ouro - ou pelo menos o valor da
certificação :)
![]
## O real valor da certificação no mercado
Você está começando a carreira, na faculdade, atrás de um primeiro emprego? O papel

da **certificação** é uma maneira de atestar que você estudou para passar nela. Tem
valor e as empresas de Java darão este **reconhecimento**.
Você tem dez anos de experiência com **Java** e dominar alguns aspectos da
linguagem que nunca olhou a fundo? O canudo pode não fazer tanta diferença, mas o
processo de estudar a linguagem a fundo sim.
Aliás, acredito que o que me deu um primeiro empurrão na qualidade do meu modo de
pensar foi entender a linguagem Java. Estudando para a certificação lá em 2001
aprendi tanta coisa dela… como ela funciona por trás e quais os motivos pelos quais
ela funciona de um jeito e não de outro. Quais as **vantagens** das escolhas feitas
por seus criadores, e quais suas **desvatangens**.
E o grande valor da certificação está aí: **você vai aprender muito**. Muito mais
do que imaginou.
## Resumindo
Se você ainda não tem experiência no mercado, a certificação é uma maneira de

comprovar que se dedicou aos estudos. Se você quer dominar a linguagem e deixar de
ser um mero usuário dela, o processo do estudo é ainda mais valioso. Recomendo.
Faça um [**curso**] ou compre um [**livro**], tanto faz, o importante será praticar
tudo o que é visto!
No fim de sua jornada você será um programador bem melhor, entendendo a fundo o que
muitos colegas comentam somente por cima.
**Já está pensando em tirar a certificação?** Temos uma [**formação de certificação

Java disponível na Alura**].
Veja a diferença entre uma simples **Telnet** e o **SSH** e como cada um lida com
as conexões.
Estou querendo acessar um servidor para realizar algumas configurações que fica em
uma sala de servidores junto com vários outros servidores.
Logo, se desejo configurar esse servidor, basta ir até a sala e acessá-lo

localmente. Mas e se eu não tiver acesso a essa sala? Ou pior, e se essa sala
estivesse em outro prédio do outro lado da cidade, ou do estado, quem sabe até em
outro país? Ou em um **cloud**?
A melhor maneira é [**acessar esse servidor remotamente**]. Dessa forma, não

importa onde ele está localizado, sempre conseguiremos acessá-lo.
Existem diversos protocolos que conseguem realizar o acesso remoto, dois dos mais
conhecidos são o **SSH** e o **Telnet**.
Com ambos protocolos nós conseguimos acessar outro computador remotamente e criar
um terminal virtual, que nada mais é do que a emulação do terminal da máquina
acessada em nossa própria máquina.
Dessa maneira, conseguimos executar comandos, realizar configurações, ou seja,

temos total controle do servidor mesmo sem acessá-lo fisicamente.
Porém você deve estar se perguntando:
> _"Por que ter dois protocolos se ambos fazem a mesma coisa?"_
Ambos protocolos podem ser usados para acessar computadores remotamente, porém
existe algo muito importante que diferencia os dois. [**A criptografia**].
## Entendendo a criptografia
A gente pode definir [**criptografia como a simples ação de tornar uma mensagem
ilegível**]. Apesar de ser simples o conceito, existem diversos cálculos e métodos
complexos usados para [**garantir que uma mensagem seja criptografada**] e que
apenas os destinatários saibam o que ela significa.
Quando uma mensagem não criptografada trafega por uma rede, como a internet,
qualquer um que a intercepte consegue ler seu conteúdo. Ou seja, se o conteúdo
dessa mensagem conter dados sigilosos, como senhas, eles ficam vulneráveis.
Se essa mensagem está criptografada, o interceptador não conseguirá descobrir seu

conteúdo, pois apenas o receptor sabe como tornar a mensagem legível novamente.
Essa é a principal diferença entre os protocolos Telnet e o SSH.
**O Telnet não possui nenhuma criptografia**. Ele envia as mensagens em texto puro.
Dessa forma caso alguém intercepte esses dados conseguirá ver o conteúdo. Mas como
um hacker consegue interceptar essas mensagens?
Existem diversas formas de interceptar uma mensagem, ataques como [**Man in the
middle**] são um exemplo. Outra forma de interceptar essa mensagem é utilizar um
farejador (sniffer).
O sniffer fica farejando pacotes em uma rede, ou seja, ele fica capturando os
pacotes que passam em uma rede. Os pacotes capturados podem ser analisados e, se a
comunicação não for criptografada, ele consegue ver o conteúdo da mensagem. Um
sniffer muito conhecido é o [**Wireshark**].
## Farejando o Telnet
Vamos fazer uma conexão com o Telnet e usar o Wireshark para farejar essa
comunicação e ver se, de fato, conseguimos capturar o conteúdo dos pacotes.
Então, no terminal, podemos dizer para o `telnet` se conectar a um host. No meu

caso esse host é o `192.168.65.55`.
imagem e passamos o endereço:
`ssh yuri@192.168.65.55`
![]
Analisando os pacotes, vemos que não temos acesso as informações:
![]
Com o SSH mesmo se o pacote for interceptado o seu conteúdo é ilegível, pois o
único que sabe como descriptografar as informações é a máquina que estamos
acessando.
## Para saber mais
Mesmo o SSH criptografando os dados, ainda é possível descobrir o conteúdo dos

pacotes. Existem várias técnicas, como o ataque Man in the Middle, que interceptam
os pacotes e tentam abrir seu conteúdo. Ou ataques que tentam combinações para
desvendar a criptografia.
Nos dias de hoje, o SSH é muito mais usado do que o Telnet justamente pelos
benefícios da segurança.
Além de ser usado para conectar remotamente, com o SSH nós também conseguimos fazer
[**transferências seguras de arquivos**].
Segurança de redes é um assunto muito importante, principalmente nesse mundo tão

conectado. Entender como funcionam os protocolos, os equipamentos de redes, os
tipos de ataques, ajuda quando estamos pensando na política de segurança.
Aqui na Alura temos uma [** formação em redes**]. Nela você aprenderá sobre os
protocolos e equipamentos de redes, aprenderá sobre o endereços IPv4 e IPv6 e
aprenderá técnicas de segurança de redes e segurança web.
Temos um construtor `Conta` que define um atributo `saldo` e um método `deposita`:
javascript
Legal, funciona!
Agora, nosso cliente precisa de uma conta poupança: um tipo de conta que atualiza o
saldo de acordo com um índice.
Fácil: basta criarmos um construtor `ContaPoupanca`, copiar e colar todo o código

de `Conta` e definir um novo método àtualiza`:
javascript
Poxa, mas **copiar e colar é ruim**. Toda vez que mudarmos ou ampliarmos `Conta`,
temos que lembrar de copiar para `ContaPoupanca`.
O ideal é **reutilizar** o código de `Conta`, fazendo com que `ContaPoupanca` seja

um **tipo especial** de `Conta`, com tudo o que `Conta` tem mais o método
àtualiza`.
Em linguagens orientadas a objetos, essa ideia de criar um tipo especial baseado em

outro é chamada de _**Herança**_. A linguagem JavaScript é orientada a objetos e
tem suporte a herança.
A maioria das linguagens tem classes, com alguma maneira de estendê-las. Mas o
JavaScript não é uma linguagem "clássica" e herança em JavaScript é um pouco
diferente, baseada em **protótipos**.
Primeiro, crio o construtor `ContaPoupanca` sem as propriedades que quero herdar,

apenas com o método a mais:
javascript
Então, usando o `prototype` de `ContaPoupanca`, digo que quero copiar tudo o que há
em `Conta` para dentro de `ContaPoupanca`.
javascript
> Na verdade, existem outras maneiras de copiar as propriedade de `Conta` para o

`prototype` de `ContaPoupanca`. A maneira acima é a mais comum.
Finalmente, podemos criar uma conta poupança e usar tudo de uma conta, além de
atualizar:
javascript
Na última versão do JavaScript, o _EcmaScript 2015_, você pode definir herança
usando a palavra-chave èxtends`, presente em muitas outras linguagens:
javascript
A linguagem Javascript tem vários recursos poderosos! [**Formação Front-End**] da

Alura.
imagem
Lançamos um **grande redesign** do nosso site. Um visual renovado, mais limpo e

mais ilustrado, criado pelo nosso designer [Thiago Vilaça]. Reorganizamos o
conteúdo nas 6 principais categorias de cursos que temos hoje:
- [Cursos online de Programação]

- [Cursos online de Mobile]
- [Cursos online de Front-end]
- [Cursos online de Design & UX]
- [Cursos online de Infraestrutura]
- [Cursos online de Business]
A obrigatória imagem do antes e do depois:
imagem ao lado da versão anterior do site (a direita)]
A nova home do Alura (a esquerda) ao lado da versão anterior do site (a direita)
O novo site vem comemorar uma importante marca que também batemos hoje: os **200
cursos online** publicados no Alura! Cada curso ganhou um novo ícone, com nova
identidade visual, criada pelo nosso designer [Fabio Gushiken].
![Screen Shot 2016-02-29 at 16.18.48]
Dentro da plataforma de aulas para alunos, também reorganizamos o conteúdo para

ficar mais fácil de encontrar cursos nas novas categorias.

![Screenshot 2016-03-01 08.34.08]
E você, o que achou do novo site? Deixe seu comentário aqui ou compartilhe com a
gente no [Twitter] e no [Facebook].
Nos próximos dias vamos compartilhar mais sobre como fizemos a programação do
Front-end e do Back-end do novo site.
imagem
Nunca é tarde para incluir um _blog corporativo_ na estratégia digital de sua

empresa. Os _blogs_ são excelentes fontes de tráfego e um dos canais mais usadas
pelos negócios digitais para atrair “e-mails quentes” (os _leads_) através do
[_inbound marketing_]_._
Tudo bem, concordo que blogar soa bem menos atraente do que o Medium “_Mulheres que
Escrevem”_, as novas máscaras de Pokémon no Snapchat ou a popularidade da Gabriela
Pugliesi no Instagram.
Mas sabia que um _blog_ conversa com todas essas redes sociais, cabendo
perfeitamente em estratégias _crossmedia_? Além de ser o tipo de canal completo o
suficiente para se tornar um ponto de encontro com seus clientes, agregar diversos
formatos de conteúdo, _nichar_ sua audiência, interagir com públicos específicos e
propagar os valores da sua marca.
A blogagem é uma prática que pode gerar:
- _tráfego e brand awareness_, quando sua estratégia inclui esforços para

transformar seus visitantes em _leads_;
- novos _leads_, se você instalar formulários de captura de _e-mails_ e outros
_hacks_ para tentar aumentar a retenção de seus visitantes,
- novas vendas, se sua estratégia for orientada para tal objetivo.
Isso sem contar as vantagens de estar 24 horas online.
Um _blog_ responde às perguntas dos clientes rapidamente, atende a vários usuários

com a mesma dúvida ao mesmo tempo e apresenta os benefícios do seu negócio em
conteúdos diversos.
Ponto de encontro, o meu **blog** ? É. Já viu o tamanho da comunidade do Jovem

Nerd? E a longevidade do Bored Panda e do Techtudo? Imagine que cerca de 1.440
posts estão sendo escritos e publicados a cada minuto (só) na plataforma WordPress.
Se um dia tem 1.440 minutos, isso são 2.073.600 milhões de posts por dia. Todos os
dias. E se você prefere checar se o que digo é verdade, é só conferir o
Worldometers.
# Como criar (do zero) um blog corporativo
O maior objetivo de blogar é… Bem, depende da sua estratégia. Ou de como você

responderia a pergunta: “_Por que quero estar online?_”
imagem do _blog_ para capturar e-mails. Direcionados para uma plataforma de e-mail
marketing, o Mailchimp, as respostas dadas geram listas de e-mails segmentadas,
para o banco aumentar sua base de _e-mails_. Chamamos esse formulário de _opt-in_ e
instalá-lo em seu _blog_ pode ajudar a nutrir sua base de _leads_.
Para entregar conteúdos estratégicos, você pode usar o [**Canva**] e criar artes
visuais (isso se você não for um designer ou não dispuser de um na equipe, claro).
No [Canva], eu gosto de criar _e-books_ e oferecê-los na _homepage_ do _blog_ em
troca do _e-mail_ dos visitantes que desejarem fazer o _download_.
Se quiser uma ajudinha para seguir os 6 passos, você é convidado a colocar a mão na
massa diversas vezes no novo curso da Alura sobre [**Blog Corporativo: gerando
_leads_ e valor**], começando pelo exercício de escrever (ou reescrever) o
_copywriting_ da sua página **Sobre**, a página mais visitada em qualquer _blog_
WordPress.
Mesmo que pareça meio _old school_ ou passe a impressão de envolver muito esforço e
tempo na criação de conteúdos, blogar é uma atividade valorizada por profissionais
de marketing pela **autonomia**. Porque não há intermediários entre as plataformas
de _blog_ e seu negócio, o que facilita o **relacionamento** **direto** com sua
marca.

# Por que incluir um blog corporativo em sua estratégia de marketing digital?
imagem
2. Para promover sua marca (_branding_)
Ambos os motivos têm outro motivo agregado: gerar sentimentos positivos sobre sua
marca. E assim, fazemos o **branding**, ou seja, a impressão dos valores da sua
marca na experiência relacional com seu público e persona(s).
Ao reforçar seu _branding_, abre-se um canal de conexão, como um ponto de encontro,

entre seu público e marca. Exatamente como o banco Next fez quando se juntou ao
festival Lollapalooza 2018: jogando um [game] e ganhando, o internauta poderia ser
presenteado com ingressos para ir aos shows!
Sejam conteúdos informativos ou anúncios, ambos utilizam a mesma técnica para

despertar sua atenção: um título atraente! E pronto. A informação pulou na tela do
seu dispositivo e o conduz de um clique a outro até o conteúdo que as marcas querem
lhe apresentar.
“Para quem eu escrevo?” e “Por que escrevo?” são, portanto, duas perguntas-chaves
que orientam sua estratégia de conteúdo.
imagem
Essa estrutura é bastante usada como modelo para produção de conteúdos para a
_web_.

# Nunca é demais lembrar: “As pessoas não compram o que você vende, mas por que
você vende.”
imagem analisados pelos robôs do buscador para categorizar seu _blog_ e depois
ranqueá-lo, né?
Esses robôs se chamam _crawlers_ e são linhas de código. Eles analisam o

**título**, os **subtítulos**, os **textos**, as **legendas das imagens** e outros
elementos dos sites e _blogs_. Os itens semânticos são comparados às palavras que
digitamos para fazer as buscas e tentar estabelecer relações entre o que seu
visitante procura e o seu _blog_.
Nossa grande vantagem é que plataformas como o WP já têm os aspectos técnicos

adequados para o SEO. Por isso, foca-se tanto na produção de conteúdo para competir
nessa disputa pela atenção das _personas_.
Também é lenda a história de que SEO traz resultados imediatos para o seu
ranqueamento. Criar conteúdos e convergir uma microaudiência parecida com suas
_personas_ dá trabalho e costuma levar entre 3 e 6 meses para gerar os efeitos
esperados. E sim, é um esforço que vale a pena se você entregar conteúdos de valor
para seu público.

# Mas eu já sou profissional de marketing!
![]
Pensando na carreira do profissional de marketing orientado por _big data,

performance ou tração_, o interessante é focar suas estratégias na automação e
automatização de processos e tarefas, como fazem os blogueiros profissionais.
Eles usam ferramentas de automação de marketing que auxiliam na ideação, criação,

produção, monitoramento e gestão de conteúdo, como o Trello, a Contentools e o RD
Station. E assim, podem viajar tranquilos para participar de eventos enquanto
mantêm alimentados seus canais digitais.
Ah, deixa eu contar uns _hacks_ finais.
Blogar já não é escrever um diário online há muito tempo e existe um monte de robôs
produzindo conteúdo profissionalmente mundo afora. Quando comecei a acompanhar as
projeções futurísticas sobre o marketing digital, passei a concordar com o
seguinte:
\- não vai lhe fazer mal aprender o básico de HTML e CSS;
\- ter um pouco de conhecimento sobre UX e design pode alegrar suas estatísticas de

_churn_;
\- atenda o usuário e não o motor de busca, pois seu desafio é atender os dois
públicos, sempre com foco no usuário;
\- um pouco de conhecimento de marketing e copywriting melhoram sua presença

digital;
\- é sempre útil e interessante buscar amplo conhecimento sobre o negócio ou

serviço que você está promovendo.
Para seguir os nossos 6 passos, aprender a capturar seus primeiros pokemons _leads_
e automatizar tarefas e processos da produção de conteúdo, inscreva-se [aqui].
E aí, vamos criar um blog corporativo hoje mesmo?
P.S.: Ao se inscrever no curso, você ganha um _link mágico_ da Umbler pra

registrar, hospedar e publicar seu _blog_ de graça.
imagem
Quando vamos usar **count** no banco de dados nos deparamos com várias opções do
**SQL**, conheça as diferenças entre as várias possibilidades de contar linhas de
tabela com count em um banco de dados.
Como um exemplo, quantos produtos tem minha empresa mesmo?
sql
Mas...
sql
Como assim? SQL pirou? De novo?
sql
O **select count** verifica o número de linhas não nulas dentro do count que você
quer fazer! Se tinha nome nulo, não contou! Resultado? Zoou.
Muito cuidado com seus counts. Então o que devo contar? Se você quer contar valores
não nulos, use o count(campo), como fizemos:
sql
Mas se quer contar todos, count estrela nele pra não correr risco, ele vai contar o
número de registros retornados, independentemente de valores nulos:
sql
E o 1? Pra que o count(1)?
sql
O **count(1)** seria uma alternativa ao count(algum_campo) pois você teria certeza

que nunca seria nulo, e que não precisaria ler o campo... acontece que fica bizarro
select count(1), e você quer ter código bizarro ou código legível?
Como disse, eu prefiro contar estrelas... e você, conta estrelas conta um ou conta
id?
Fica agora o desafio: qual o resultado da SQL a seguir?
sql
Gostou dessas práticas e dicas de SQL? Então confira também os cursos que temos na
Alura para a [**SQL e banco de dados**]! ;)
Estou me preparando para a certificação da Oracle e me deparei com a situação de

comparação de booleanos. Todas as vezes que precisamos fazer comparações com tipos
`boolean` utilizamos operadores **E** ou **OU**:
java
Nesses exemplos a comparação é feita nos dois lados. Dois lados? Mas como assim?
Isso mesmo, dois lados! Por exemplo:
java
Quando ele verifica a expressão `1 > 2` é identificado como uma expressão `false`,
mas, mesmo sabendo que o resultado total será `false`, ele verifica o `1 == 1`.
Isso significa que sempre que utilizamos esses tipos de operadores a **verificação
será realizada tanto da condição anterior quanto da posterior**! Chamamos esses
operadores de _[bitwise]_ ou então bit a bit.
Agora vamos imaginar uma seguinte situação:
java
Testando esse trecho de código:
Resultado:
java
Como assim pagamento efetuado? Sendo que não tenho dívida... Nesse caso foi feita
uma comparação entre dois métodos que retornam `boolean`, porém o método
`pagamento()` possui um **efeito colateral** e só poderia ser executado se o método
`temDivida()` retornasse `true`... Para resolver esse problema podemos utilizar os
operadores **[short circuit]**: `&&` e `||`. Mas qual seria a diferença? Vamos
testar novamente, porém com o short circuit:
java
Verificando o resultado:
java
Ótimo! Agora se não tiver dívida o pagamento não é realizado! Se testarmos em um

momento em que tem dívida, ou seja, quando enviamos 1:
java
Resultado:
java
Agora o trecho de código funciona perfeitamente!
Todas as vezes que fazemos uma comparação precisamos tomar certos cuidados ao
escolher **operadores bitwise** (&, | e ^) ou um **short circuit** (&& e ||). Ao
**utilizar operadores bitwise corremos um grande risco** testando um método que
tenha um **efeito colateral**, como foi o caso do método `pagamento()`. A **boa
prática sugere o uso do short circuit** justamente para evitar esse problema.
E aí, gostou do short circuit? Quer aprender mais detalhes da linguagem Java?
Pensando nisso, o instrutor Guilherme Silveira criou a [**formação Java**] na Alura
!
No meu sistema de cadastro de produtos, preciso criar uma funcionalidade que, a

partir de um arquivo CSV com dados dos produtos, eu consigo ler esse arquivo e
separar todos os produtos contido nele. Para representar um produto temos a
seguinte classe:
python
Inicialmente temos o arquivo `dados.csv` com o seguinte conteúdo:
python
Nesse meu sistema, irei ler esse arquivo a partir do diretório

`"arquivos/produtos/"` portanto, criaremos a variável àrquivo` indicando o caminho
e o nome do arquivo que leremos:
python
## Implementando a função de leitura do arquivo
Agora precisamos criar uma função que ficará responsável em ler esses produtos por
meio da variável àrquivo`, portanto, criaremos a função `ler_produtos()` passando
o àrquivo` como parâmetro:
python
Primeiro, precisamos abrir o arquivo CSV, ou seja, utilizaremos a função òpen`

enviando a variável àrquivo` e utilizando parâmetro 'rb' que indica leitura:
python
No Python, para ler um arquivo CSV, podemos utilizar a função `reader` do módulo
`csv`, porém, precisamos importar o módulo:
python
Observe que também adicionamos o parâmetro `delimiter` que já separa cada

informação a partir de um critério, nesse caso, cada informação será separada no
momento em que aparecer uma vírgula, e também, estamos retornando a função `reader`
que é justamente o arquivo lido.
Então vamos realizar um teste, faremos a chamada para a função `ler_produtos` e

devolveremos para a variável `dados`:
python
Rodando o nosso código temos o seguinte resultado:
python
## Verificando a existência do arquivo
Opa! Ele não conseguiu achar o meu arquivo! Por que será que isso aconteceu?
Vejamos dentro do diretório onde está o meu projeto:
bash
De fato não existe esse diretório, então o que devemos fazer? Antes mesmo de
tentarmos pegar o arquivo, temos que verificar se ele pelo menos existe! Em outras
palavras, precisamos primeiro verificar se o caminho que queremos encontrar existe,
caso não exista, precisamos criá-lo!
Portanto, o nosso primeiro passo é separar a variável àrquivo` em duas, ou seja, a

àrquivo` e `caminho`:
python
Em seguida, vamos criar a função `verificar_arquivo`, que será responsável em

verificar se o diretório existe e o arquivo também, caso não exista, ela deverá
criá-los! Então vamos criá-la:
python
## Verificando a existência do diretório
Qual é o nosso próximo passo? É justamente verificar se o diretório não existe.

Para isso, no Python, podemos utilizar o módulo [òs`] com funções capazes de
realizar [chamadas de sistema].
Nesse nosso primeiro caso, utilizaremos a função `path.exists` que verifica se

existe um arquivo ou diretório com o parâmetro informado:
python
Observe que estamos varificando se o diretório não existe, caso isso for verdade, o
que devemos fazer? Precisamos criar o diretório! Mas como criamos um diretório no
Python? Simples! No modulo òs`, temos também a função `makedirs` que cria
diretórios:
python
O nosso próximo passo é verificar a existência do arquivo dentro desse diretório.

Podemos utilizar novamente a função `path.exists` do módulo òs`. Da mesma forma
como fizemos com o diretório, caso não exista o arquivo, precisamos criá-lo.
## Criando o arquivo
Para criar um arquivo, utilizaremos a função òpen` passando o segundo parâmetro

com o valor "w" que indica a criação para escrita:
python
Por fim, retornamos a variável àrquivo` para lermos na função `ler_produtos`:
python
Agora, basta apenas chamarmos a função `verificar_arquivo` devolvendo o seu

resultado para a variável àrquivo`, e então, chamamos a função `ler_produtos`
enviando a variável àrquivo` como parâmetro:
python
## Exibindo as informações
Agora vamos imprimir os dados para verificar os valores, porém, ao invés de fazer
um `for` de forma procedural, utilizaremos o recurso de [compreensão de lista]:
python
Executando o código temos o seguinte resultado:
python
Note que o primeiro valor ainda é o cabeçalho, isto é, linhas 'nome' e 'valor'.
Para eliminarmos esse cabeçalho basta chamarmos a função `next` antes de iterar a
variável `dados`:
python
Por fim, basta apenas armazenarmos os valores em objetos do tipo `Produto`:
python
Rodando o código novamente, temos o seguinte resultado:
python
## Situações inesperadas
Observe que todos os dados foram lidos sem nenhum problema! Entretanto, se o
caminho `"arquivo/produtos"` ao invés de ser um diretório, fosse um arquivo? O que
será que aconteceria com o nosso código?
Vamos fazer uma simulação! Primeiro eu vou alterar o nome do diretório para
`"arquivo/produtos"` para `"arquivo/produtos1"` e então, vou criar um arquivo
chamado "produtos" dentro do diretório "arquivo":
imagem
E que tal aprender a desenvolver com o Python hoje mesmo? Na Alura, temos a
[**cursos de Python**], onde você vai aprender desde o zero até uma aplicação web
usando o Python.
imagem
Estamos trabalhando em uma editora de livros que já vende diversos produtos por
conta das propagandas publicadas em revistas, estampadas em outdoor, transmitidas
em rádios e canais de televisão e, até mesmo, na internet, com anúncios pagos em
portais de notícias,sites relacionados a cultura e sites de blogueiros que fazem
resenhas de livros.
Com o passar de um tempo, percebemos que muitas editoras que interagiam com o
público nas redes sociais aumentaram suas vendas. Por mais que nossas vendas não
tenham diminuído, antes, as nossas vendas acompanhavam o das outras editoras,
agora, as vendas das outras editoras, que interagem com os clientes nas redes
sociais, está bem maior que as da nossa. Então, passamos a analisar que queríamos
ter esse contato com os clientes e pensamos em ter uma atuação mais direta com
eles, pelas redes sociais também.
Dessa forma, criamos contas no Facebook, Twitter e Instagram para a editora e

começamos a fazer diversas publicações relacionadas aos livros que são feitos e
vendidos pela empresa.
Porém, com o passar do tempo, percebemos que não estávamos atingindo o público da
maneira que queríamos, de uma forma com que eles interagem nas redes sociais da
editora e se interessasse pelos perfis.
Assim, começamos a pensar em outros tipos de publicações que poderiam fazer.

Pensamos em passar um conteúdo a mais dos lançamentos que seriam feitos pela
editora, como séries baseadas em livros publicados ou até mesmo curiosidades da
história e do processo de escrita de um livro que ainda será publicado.
Para isso, fazíamos publicações desse tipo nas redes sociais, mas também sentimos
que poderíamos usar outro canal para aprofundar mais nas novidades e curiosidades.
Pensamos em fazer um blog onde colocaríamos de forma bem mais aprofunda as
novidade.
A partir disso, também começamos a colocar os links dos posts do blog nas
publicações das redes sociais, tornando-as um ponto de encontro não só dos
leitores, mas também dos diversos canais da empresa.
Isso começou a gerar o resultado que queríamos, com muitas pessoas marcando umas às
outras para verem as novidades, para lerem mais sobre as curiosidades do livro ou,
então, para falar de um evento de lançamento.
Com o passar do tempo, percebemos que nossas redes sociais transmitiam um

conhecimento que, para algumas pessoas, era desconhecido, ou acrescentava mais
conhecimento para quem já possuía algum.
Assim, muitas pessoas começavam a se simpatizar pela editora e, depois de algum

tempo, começaram a comprar os livros publicados.
Isso que passamos a fazer na editora é o que chamamos de **marketing de conteúdo**,

que acontece quando você transmite um conteúdo que traz um conhecimento relacionado
ao que sua empresa faz, tornando-a conhecida e referência sobre o assunto.
Dessa forma, sempre que alguém pensar no produto da sua empresa, ela virá à mente
da pessoa, tornando a empresa uma autoridade a respeito do assunto.
Esse tipo de marketing tem como objetivo atrair clientes, mas de uma maneira sutil,
**sem se autopromover diretamente**, como acontece nas propagandas do marketing
tradicional.
A empresa transmite um conhecimento, que não tem necessariamente o objetivo de

vender, mas que pode resultar em uma venda, pois quando o cliente precisar do
produto que sua marca vende, ele sempre irá recorrer a ela.
## Funil do Marketing de Conteúdo
Diferente do tradicional, no qual a intenção é que a venda ocorra de maneira

direta, já que a pessoa vê e já procura comprar o produto, no marketing de conteúdo
acontece um processo dividido em etapas até que ocorra, efetivamente, a venda do
produto. Esse processo é o que chamamos de **funil do marketing de conteúdo** e ele
possui quatro etapas.
**Primeira: atrair pessoas**. Nessa etapa, você cria um conteúdo interessante e de

qualidade, que pode vir por meio de posts em blogs, publicações nas redes sociais e
o próprio site da empresa, para atrair as pessoas.
**Segunda: converter**. Nessa etapa você começa a converter a pessoa interessada em

um _Lead_, que é um possível futuro cliente da empresa. Isso acontece por meio de
_Call-to-actions_ e formulários, pedindo o contato da pessoa para que ela receba
futuras informações a respeito da empresa.
**Terceira: fechar a venda**. Isso acontece quando a pessoa efetivamente realiza a

compra do produto da empresa. Isso se dá por meio de envio de newsletters, alertas
de vendas, segmentação dos leads e a entrega de um conteúdo específico para aquela
pessoa para nutri-la com conteúdos que a interessem. Além disso mostrando que a
empresa possui produtos que têm a ver com o problema dela.
**Quarta: fidelizar**. Nessa etapa, tem outra diferença entre o marketing de

conteúdo e o marketing tradicional. No marketing de conteúdo é muito importante que
o cliente, além de comprar, também torne-se fiel à marca, pois, assim, ele sempre
comprará os produtos da empresa. São pessoas que gostam do seu conteúdo e do seu
produto, fazendo com que as chances deles divulgarem a marca sejam maiores. Então é
importante criar conteúdos que apresentem os produtos, para quem não os conhece, e
tragam as novidades da sua empresa, para aqueles que já a conhecem, também.
## Conteúdo
Primeiro, pense no conteúdo que poderia transmitir aos seus clientes. Deve ser algo
que seja relacionado a eles, ao seu produto e que os interesse. Caso seja
necessário, procure e pesquise os assuntos relacionados e tente trazê-los para a
realidade da sua empresa.
Pense que, no caso da editora, tentávamos trazer o leitor para perto do livro,
apresentando curiosidades da obra, para que, conhecendo os bastidores, o leitor
sinta-se bem próximo a ela.
Para isso, podem ser enviadas newsletters, para quem concedeu o e-mail para a
empresa, com as principais notícias e curiosidades da semana, por exemplo, e essas
notícias serem links para o site e redes sociais da editora.
Além disso, no blog, o conteúdo será algo mais aprofundado a respeito do tema e que
ensine ou solucione um problema do cliente.
Por exemplo, um post feito no blog da editora com o título "Compre tal livro" não é
marketing de conteúdo, mas sim uma propaganda direta. Já um post que fala sobre o
universo do livro, sobre curiosidades a respeito, sem fazer uma promoção direta, é
marketing de conteúdo, pois apresenta uma informação a respeito do produto da
empresa, e não somente a cara desse produto.
## Divulgando com conteúdo
Produzir conteúdo é uma boa forma de criar empatia com as pessoas que consomem seu
produto, ou com futuros consumidores, que terão na sua marca não somente algo que
poderão comprar, mas também uma referência, já que é a sua marca a especialista a
respeito, possuindo e compartilhando um grande conhecimento.
O marketing de conteúdo é um modelo de marketing em que não há uma promoção direta,

como no tradicional. É uma troca de informações que faz com que a empresa torne-se
autoridade em assuntos relacionados ao produto dela, além de ser um ponto de
encontro no qual os clientes podem se informar mais.
Assim, o cliente confia mais na empresa e pode se fidelizar a ela, sempre

consumindo produtos da marca, pois o contato com a pessoa é constante e direto, ao
contrário do marketing tradicional.
Lembre-se que para criar o conteúdo tem que saber qual o objetivo principal
daquelas informações serem passadas ao seu cliente. Pode ser para ajudar, informar,
entreter?
Essas ideias são a base para começar a implementar o marketing de conteúdo na sua
empresa. Caso queira saber mais detalhes e ainda receber umas dicas de como criar
os posts, infográficos e e-books é só acessar o nosso [**curso de Marketing de
Conteúdo**]. Além disso, também pode conferir mais informações no [**livro da Casa
do Código Marketing de Conteúdo: Estratégias para entregar o que seu público quer
consumir**].
Está com dúvidas sobre como deve acessar o banco de dados com PHP7? Sendo assim,
entenda a diferença entre mysqli e PDO.
Com a nova atualização do php de 5.6 para a versão 7, a extensão `mysql_*` para
conexão com banco de dados, já depreciada na versão antiga, deixou de existir! Já
se recomendava utilizar as extensões `mysqli` ou `PDO [(PHP Data Objects)]` e agora
as duas se tornaram nossas únicas opções para essa funcionalidade.
Mas, qual das duas utilizar? As duas fazem a mesma coisa? É comum que este tipo de
duvida apareça, até mesmo para quem já conhecia as extensões anteriormente!
Quando estamos desenvolvendo um sistema em PHP, uma hora ou outra nos deparamos com
a necessidade de utilizar um banco de dados. Nesse momento podemos escolher
qualquer um: PostgreSQL, MySQL, Oracle, SQLite, entre outros.
O mais comum entre a maioria dos desenvolvedores é o MySQL. Assim, podemos usar a
extensão `mysqli` do php para realizar a conexão! Então, ao desenvolver uma
query com a extensão `mysqli` temos algo como:
php
Perfeito, realizamos uma busca simples com um parâmetro através da extensão

`mysqli`. Mas, e com `PDO`? nesse caso ficaria:
php
Ótimo, as duas formas funcionam e retornam o mesmo array `$pessoaArray`! Mas, já da

pra ver que existem algumas diferenças entre as extensões.
Primeiro que ao instanciar `PDO`, precisamos de um prefixo `mysql` antes de passar

o `host`, entretanto, com `mysqli`, não havia essa necessidade. Isso porque o
`PDO`, ao contrario do `Mysqli`, consegue trabalhar com vários bancos de dados,
então precisamos dizer com qual banco vamos trabalhar.
Caso houvesse uma migração de MySql para PostgreSQL, a única mudança necessária no
nosso projeto com `PDO` seria:
php
Com `mysqli` essa migração simples não seria possível!
Outra diferença nos códigos é que com `mysqli` passamos o atributo `$nome` do
método associado ao atributo `?` da query pelo método `->bind_param` . Já com `PDO`
definimos um atributo `:nome` dentro da query e depois relacionamos `:nome` com
`$nome` pelo método `->bindValue`.
Além disso, com `mysqli`, precisamos especificar o tipo do atributo `$nome` como
`String` através da letra _"s"_. Isso porque o método `->bind_param` segue a
estrutura:
```php ->bind_param("primeira silaba do tipo do parametro",$parametro) ```
Já o método `->bindValue` segue a seguinte estrutura:
```php ->bindValue(":parametroDaQuery",$parametroQueSeraAtribuido) ```
Isso faz com que a realização de queries em `PDO` seja muito mais fácil pois
sabemos exatamente qual atributo estamos associando. No caso de termos mais de um
parametro o código com `mysqli` ficaria:
php
Agora precisamos seguir a ordem com que os parametros `?` foram inseridos na query
e especificar o tipo do `$id` como Ìnt` através da letra ì`. Caso houvesse uma
simples mudança na ordem:
php
precisariamos lembrar de inverter os parametros e as especificações de tipo no

método `bind_param()` para:
php
Já com `PDO`, a mesma situação ficaria:
php
Assim, não importa a ordem dos parâmetros, sempre estamos associando o parâmetro
certo!
Com nosso exemplo simples de buscar uma pessoa pelo nome no banco de dados podemos
perceber algumas vantagens do `PDO` e outras do `mysqli`:
- Com `PDO` conseguimos utilizar varios bancos de dados, facilitando possiveis

migrações além de nos possibilitar desenvolver códigos mais semanticos, o que
facilita muito a manutenção e melhora a legibilidade
- Com `mysqli` trabalhamos especificamente com banco de dados MySQL, o que da para
essa extensão maior perfomance e algumas funcionalidades a mais
Então, quando devemos utilizar `PDO` ou `mysqli`? Para um projeto em que

performance é de extrema importância, podemos optar pelo `mysqli`. Em outro
projeto, no qual vamos trabalhar com mais de um banco de dados, podemos optar pelo
`PDO`! Por isso, é importante refletir sobre qual deles utilizar em nossos projetos
a partir de nossas necessidades e limitações.
Nesse post a gente viu as principais diferenças entre a extensão `mysqli` e `PDO`,
um pouco da sintaxe dos dois e como escolher qual deles utilizar em nossos
projetos! Mas, e você? Qual você mais utiliza, ou pretende utilizar, no seu dia-a-
dia? Comente aqui!
Quer ver mais diferenças entre `PDO`, `mysqli` e o antigo `mysql_*`? Da uma olhada
aqui no [php.net] (Disponível em inglês). Você também pode encontrar tudo sobre PHP
e `mysqli` nos cursos online da alura: [PHP e MySQL I] e [PHP e MySQL II]
Todo mundo sabe que uma variável local é... local:
js
Mas e isso?
js
Uma variável declarada dentro do ìf` é visível fora dele? Sim!
JavaScript só tem **escopo de função** (e o escopo global). Não temos escopo de

bloco. Ou seja, o ìf` não define um escopo isolado.
Cuidado pra isso não te atrapalhar em alguns cenários. Por exemplo, dois fors
simples:
js
Ambos estão mexendo na mesma variável ì`, afinal o `for` também não define um
escopo. Temos que tomar cuidado pra não fazer alguma besteira.
O novo ES6 define, FINALMENTE, **escopo de bloco** na linguagem. É com a palavra

chave `let`:
js
Bom saber, mas o suporte ainda é fraco nos navegadores.
* * *
Quer fugir de outras enrascadas JavaScript e facilitar o seu dia a dia no front-
end? Receba 10 dicas e boas práticas do expert Sérgio Lopes, uma por dia:
**[Cadastre-se na série Boas práticas de JavaScript]**
Hoje estamos com mais um depoimento de nossos alunos. Dessa vez, a Nathalia Chaves
conta um pouco de todos os desafios que teve que enfrentar em sua trajetória para
alcançar a tão sonhada oportunidade como desenvolvedora! Bora saber?
imagem
Aqui na Alura temos várias [**formações**] que podem ajudar em sua jornada
profissional. Temos inclusive uma carreira em [**Ruby and Rails**], as tecnologias
que a Nathalia usa em seu dia a dia no trabalho.
O que achou da história da Nathalia? Bem bacana né? Quer compartilhar a sua
história também? Então entre em contato conosco através do e-mail
contato@alura.com.br
Fui contratado por uma empresa para analisar o que cada cliente está comprando. A
ideia é conseguir agrupar os clientes por gostos iguais. Dessa forma, serão feitas
_newsletters_, promoções e campanhas de marketing direcionadas para clientes com
algo em comum.
Para isso, precisamos pegar dados de clientes, como a categoria dos produtos que
cada um costuma comprar e com que frequência isso ocorre. Bem, já temos os dados
definidos, mas como podemos criar grupos com os clientes? Quantos grupos devemos
criar?
## O aprendizado não supervisionado
Quando estamos trabalhando com análise de dados, é muito comum utilizar o

aprendizado de máquinas, ou machine learning, para criar um modelo que classifique
os dados para gente. Existem [**algoritmos que podemos utilizar para ensinar a
máquina**] como trabalhar, mas qual deles utilizar?
Podemos classificar os nossos dados, mas não temos um rótulo para ensinar o
classificador. Podemos definir esses rótulos na mão, isto é, ir analisando o perfil
um por um e criar os grupos de clientes, mas isso levaria muito tempo e seria muito
trabalhoso. O que nós podemos fazer para obter esses rótulos, isso é, o grupo que
cada cliente pertence?
Vamos imaginar que temos dois tipos de frutas diferentes, maçãs e maracujás. Como
faríamos para agrupá-las? Bem, nesse caso, temos dois grupos, maçãs e maracujás.
Assim, utilizamos algumas das características das frutas para agrupá-las: cor,
formato, tamanho,gosto, entre outras.
A partir dessas características, criamos os rótulos dos nossos dados. Podemos pegar
as características que extraímos dos clientes, sua frequência de compra e a qual
categoria pertencem os produtos que mais compram e utilizar essas informações para
agrupá-los.
Podemos criar os grupos de acordo com a necessidade de segmentação, dois, três,

oito, grupos, segmentar bem o conjunto de dados ou não segmentar tanto.
Para agrupar os dados podemos pegar um cliente que compra dez vezes no mês e compra
muitos livros de ficção científica. Outra cliente também compra livros de ficção,
mas com uma frequência de oito vezes no mês.
Apesar de não terem as mesmas frequências de compra, elas são parecidas. Também são
os gostos. Logo, se fizer sentido, podemos colocá-los em um mesmo grupo. Isso nos
mostra que, se criarmos um gráfico de número de compras por categorias, os valores
que estão próximos podem pertencer ao mesmo grupo.
Existem diversos algoritmos que podemos utilizar para agrupar os dados, um desses é
o **K-médias, ou K-means**. Esse algoritmos pega cada um dos nossos dados
(observações), para cada grupo (k). Cada dado pertencerá ao grupo mais próximo da
média.
No Python, existe a biblioteca [**scikit-learn**]. Essa biblioteca é muito

utilizada pelas pessoas que trabalham com análise de dados e com machine learning.
Ela já tem implementado diversos algoritmos que usamos no dia a dia, sendo um deles
o K-means.
## Conhecendo a sklearn
Queremos utilizar a `scikit` no nosso código, então o primeiro passo é importá-la

(ìmport`):
python
Legal! Mas qual função da biblioteca nós queremos utilizar? Queremos utilizar o K-
means, então nós podemos, em vez de importar todos os módulos da biblioteca,
importar somente o K-means.
Para isso, falamos que da biblioteca (`from`) `sklearn`, do módulo de agrupamento

(**cluster**), queremos importar o `KMeans`:
python
Já temos a classe que implementa o algoritmo, o que precisamos agora? Criar um

objeto a partir dessa classe:
python
Com o modelo instanciado, podemos pedir para treiná-lo e para ele predizer os dados
dos usuários:
python
Esse método nos retorna uma série de números que são os rótulos dos nossos dados,
**a predição**. Ou seja, conseguimos atribuir esse retorno a uma variável e
utilizá-la em outra partes do código:
python
Agrupamos nossos dados, mas como podemos ver esses grupos?
## Visualizando os grupos
Uma das formas que temos para [**visualizar os dados é a criação de gráficos**].
Uma biblioteca muito utilizada para isso é a [**matplotlib**]. Como a outra
biblioteca, precisamos importá-la para começar a utilizar suas funções.
Nessa biblioteca, queremos utilizar o módulo de criação de gráficos com o Python

(`pyplot`):
python
Por convenção, muitos desenvolvedores colocam um apelido (alias) nessa importação,

chamando de `plt`:
python
Antes de mostrar os grupos, vamos ver como estão nossos dados. Para isso, podemos
pedir para o Matplot plotar um gráfico com os pontos dos nossos dados. Esses
gráficos tem dois pontos, um para o eixo **X** e um para o eixo **Y**
Como estamos querendo mostrar um gráfico do número de compras por categorias de

produtos, esses serão nossos valores de **X** e **Y**, respectivamente. No meu
caso, os dados dos usuários estão em um Array do [Numpy], onde a primeira coluna
são a frequência das compras e o segunda coluna são as categorias:
python
Agora só precisamos mostrar (`show`) o gráfico:
python
imagem vale quatro:
python
Plotando o gráfico agora, veremos que temos apenas três grupos formados:
![]
Além do K-médias, existem [**outros algoritmos**] que a SciKit implementa. Cada um

deles tem seu próprio meio de agrupar os dados.
O aprendizado não supervisionado é uma das áreas no aprendizado de máquinas. Com

ele, conseguimos rotular nossos dados e agrupá-los. Aqui na Alura, temos uma
[**formação em aprendizado de máquina**].
Nela você verá desde estatística, até o aprendizado de máquinas supervisionados com
classificação.
No dia 12 de Novembro de 2014 a NASA conseguiu [**pousar uma sonda em um cometa**]

e a [**Microsoft anunciou**] que o .NET seria open source. Que dia para a
humanidade.
Mas esse .NET não era bem o .NET "comum" que nós conhecemos, era o .NET Core - uma
reimplementação do .NET tradicional que prometia ser mais rápido, modular e
multiplataforma. E essa semana ele se tornou realidade. Depois de pouco mais de 1
ano e meio de desenvolvimento em conjunto com a comunidade nesta segunda-
feira(27/06) [finalmente foi anunciado] o release 1.0.
Esta versão 1.0 roda em Windows, Mac e várias distros de Linux como RedHat e
Ubuntu. Suporta C#, VB, F# e generics, LINQ, suporte assíncrono e mais. O código
fonte [**está todo aberto no Github**] para quem quiser baixar, testar e
contribuições são bem vindas.
## Começando com o .NET Core
Se você usa o Visual Studio 2015(pode baixar ele de graça [aqui]) tem que baixar o
[Update 3] antes de baixar o [.NET Core Tools for Visual Studio].
Se você for usuário de Mac ou Linux, a melhor forma e olhar a própria página
do .NET, a [http://dot.net] e ver as alternativas que você tem. O que a Microsoft
recomenda é que você use o [Visual Studio Code], mas você pode usar seu editor
favorito(Sublime Text, Atom, Brackets, etc).
## O futuro do .NET
Ao desenvolverem o .NET Core, a ideia da Microsoft é que ele seja o futuro do .NET
e que, devagarzinho, o .NET "tradicional" seja substituído pelo Core.
Não sabemos como será a adoção dos desenvolvedores e empresas e se o Core realmente
vai virar como a Microsoft espera. Mas ter mais opções sempre é bom, certo?
Se quiser ler mais sobre o .NET Core, eu escrevi sobre a [motivação do .NET Core] e
sobre os dois repositórios mais importantes do Core: o [CoreFX] e o [CoreCLR] lá no
meu blog.
Todas as informações que você precisa saber hoje sobre ele estão na própria [página
do .NET] e no [blog do .NET] :)
E aí, o que achou dessa novidade?
**A propósito, você sabia que temos [cursos de .NET]?**
imagem
Como usuário das múltiplas aplicações web, com certeza você já enfrentou algum
problema com uma senha. Talvez a tenha esquecido, ou talvez tenha tido uma conta
invadida.
Esses dias, decidi criar uma conta em uma rede social que meus amigos gostam.
Entretanto,logo quando digitei a senha que eu queria, uma mensagem de erro apareceu
na tela falando que minha senha era muito fraca. Pelo visto `senha` não ia
funcionar, mesmo.
Lembrei daquelas regrinhas que todos já ouvimos em algum momento, sobre uma boa
senha ter caracteres minúsculos, maiúsculos, números e símbolos, e remodelei ela;
dessa vez, deu certo!
Tudo parecia bem, não é? Duas semanas depois, porém, recebo uma notificação -
alguém havia invadido minha conta. Obviamente, fiquei indignado! Minha senha seguia
aquelas regrinhas que eu aprendi! A senha era `Senh@123`...
Depois de pesquisar, descobri que minha conta pode ter sido invadida através de um
**ataque de dicionário**, ou _[dictionary attack]_. Com essa técnica, o atacante,
através de um processo automático, tenta ganhar acesso com múltiplas senhas
diferentes. Essas senhas geralmente estão em um arquivo chamado de **dicionário de
senhas** - existem vários desses disponíveis na Internet.
Mas qual o problema dessa senha? Como, então, podemos criar uma boa senha? Quais
são os aspectos importantes que devemos levar em conta?
## Maiúscula, minúscula, número, pontuação - é isso?
Minha senha `Senh@123` contém três letras minúsculas, uma maiúscula, um símbolo e
três dígitos numéricos. Lembrando do que aprendemos em nossas aulas de matemática,
podemos até calcular quantas possibilidades de senha existem.
Temos **26** possibilidades de letras minúscula, mais **26** de maiúsculas, mais

**10** caracteres numéricos, mais por volta de **28** caracteres de pontuação,
totalizando **90** caracteres possíveis.
Como nossa senha tem 8 caracteres de comprimentos, a conta fica **90⁸**, que é
igual a **4.304.672.100.000.000** possibilidades!
Digamos que o atacante consegue testar 1000 senhas por segundo. Para testar todas
essas possibilidades, ele precisaria de **mais de 136 mil anos**.
> "_Uau! Que número gigante! Mas se é assim, como conseguiram descobrir a senha?
Foi sorte do atacante?_"
Na verdade, o que acontece é que essa conta toda não se aplica à nossa senha,
**porque ela não é aleatória**! Temos mais de 4 quatrilhões de possibilidades no
total, mas a nossa não é apenas mais uma nesse monte. Essa senha é deduzível, e é
assim que o ataque de dicionário trabalha.
## Seguindo as regras de uma maneira efetiva
O ataque de dicionário, diferente de outros tipos de ataque, como o **[ataque de

força bruta]** (_brute force_), não tem o objetivo de tentar todas as
possibilidades que existem dentro de um contexto. O que ele faz é, dadas algumas
[palavras ou grupos de palavras comuns em senhas], tentar o acesso com várias
possibilidades para cada palavra, considerando substituições e modificações comuns.
Ou seja, o ataque não vai só verificar se `senha` funciona, mas também `senha123`,
`Senha`, `senh@123` e, eventualmente, `Senh@123`. **Isso não significa que
caracteres especiais e de grupos diversos não fazem diferença, mas que é ilusório
entendê-los como garantia de segurança**.
Assim, se nossa senha tiver uma base tão simples e usual como `senha`,
substituições comuns como de à` para `@` e mudanças do gênero de fato não
aumentarão muito o nível de segurança desse nosso segredo. Mas e aí, o que devemos
mudar?
Se juntarmos um pouquinho de tudo, podemos selecionar uma palavra aleatória, como

**cordeiro**, e tentar fazer algumas modificações não tão usuais. Com algumas
alterações, cheguei em `C0rd3iro%6` - uma senha já bem mais segura comparada à
anterior.
Deixei um tempo parado e fui, finalmente, logar na minha conta. Coloquei meu email
e… qual era a senha, mesmo? _Cordeiro_ alguma coisa, um dos **o** virava **0** e
também havia algum símbolo no final, eu acho… Que complicado!
E agora? Será que a complexidade dessa senha é compensada pela segurança que ela
traz? Não haveria um método melhor para nós, usuários?
## Senhas complexas X senhas longas
Toda esse problema de memorização e usabilidade que esse tipo de senha mais
complexa traz é base das principais críticas contra ele. Randall Munroe, cartunista
do _webcomics_ **[xkcd]**, criou uma tirinha em 2011 brincando um pouco com o tema,
que continua sendo muito relevante.
imagem, nos garantindo uma senha pouco convencional e, ainda assim, bastante
efetiva!
Mas e aí? Criamos nossa frase-senha comprida, com diversas palavras aleatórias,
memorizamos e é isso? Podemos usá-la para todas as nossas contas, então?
## Senhas únicas para cada conta
Infelizmente, os ataques de dicionário não são o único perigo que nossas senhas
enfrentam, hoje em dia. Há casos em que a segurança nem depende de nós, usuários,
como quando alguma plataforma [armazena as senhas em texto plano], em vez de
armazenar uma [hash gerada a partir dessa senha].
Há ainda casos que, apesar de dependerem de nós, não dependem exatamente da

complexidade de nossa senha, como com _[malwares que capturam as teclas
digitadas]_, ou até mesmo um caso bobo de alguém observando o teclado enquanto
digitamos.
Por conta disso, não podemos confiar em uma única senha para tudo. O ideal é termos
senhas completamente diferentes (isto é, que não sigam um mesmo padrão) para cada
serviço em que criarmos uma conta. Assim, caso uma de nossas senhas fosse
descoberta, por qualquer motivo que seja, nossas outras contas não estariam
comprometidas!
Considerando tudo o que já aprendemos, podemos decidir por criar frases-senha

diferentes, com palavras diferentes, para cada conta que criarmos. Entretanto, isso
geralmente não é viável, afinal quem vai querer ficar memorizando dezenas de frases
aleatórias?
Por conta disso, muitos usuários acabam optando pela simplicidade de uma única
senha fraca para todos os serviços, em vez do método mais seguro. Mas será que não
temos como encaixar usabilidade e segurança, nesse caso?
## Usando gerenciadores de senha para evitar a memorização
Depois de tanto procurarmos pela melhor opção de senha, novamente caímos no

problema da memorização… Para gente, o melhor seria se realmente não precisássemos
memorizar nada, ou pelo menos não muita coisa, mas que ainda assim tivéssemos
senhas seguras.
Poderíamos guardar todas as nossas senhas em um único arquivo, para apenas

copiarmos e colarmos elas quando fôssemos usar. Mas deixar em um simples arquivo
solto seria um grande risco. E se houver um método melhor, que garante a segurança
dessas senhas armazenadas?
Para isso, existem os **[gerenciadores de senha]**, como o [KeePass] e o
[LastPass], que nos ajudam, de forma segura e organizada, a armazenar todas as
nossas senhas.
Podemos configurar o acesso a eles com senhas (que podem seguir as recomendações
que trabalhamos ao longo do post!) e até com arquivos-chave, no caso do KeePass,
necessários para a visualização do banco de dados. Mas se agora vamos guardar
nossas senhas em um gerenciador, como devemos criá-las, enfim?
## Usando senhas aleatórias como garantia
Agora que não precisamos mais memorizar senhas à toa, podemos abusar ainda mais do
aspecto de segurança, gerando nossa senha através de algoritmos de aleatoriedade, o
que, como calculamos mais acima, aumenta intensamente o nível de segurança de
nossas senhas.
Com um bom comprimento e uma boa variedade de caracteres (**que não precisam se
restringir aos ASCII, se a plataforma faz um bom trabalho de _hashing_ de
senhas**), podemos criar senhas (**quase**) impossíveis de quebrar com métodos de
dicionário/força bruta.
Uma senha gerada por esse [gerador aleatórios de senhas em emoji,] por exemplo,
poderia demorar mais de **1,49 X 10⁵² vezes a idade da Terra** para ser quebrada,
se todas as pessoas do planeta tentassem simultaneamente quebrá-la com um
computador diferente a 1 milhão de tentativas por segundo. Basicamente, é
improvável que uma senha dessas seja quebrada.
Para os casos em que precisamos de um acesso mais dinâmico a alguma conta, que não
se restrinja a um computador, podemos usar das outras dicas que aprendemos no post.
Além disso, é importante, **sempre que possível**, utilizar a ferramenta de

**autenticação de múltiplos fatores**, ou _[multi-factor authentication]_. Com essa
configuração, o acesso a uma conta não depende apenas da senha, mas também de
fatores externos diversos.
Uma possibilidade é, por exemplo, exigir um código de login por SMS. Assim,
estaremos ainda mais seguros, mesmo que nossa senha seja comprometida.
## Maior segurança de dados para maior segurança nossa
Apesar de muitas vezes pensarmos não fazer diferença utilizar uma senha (que
sabemos que é) fraquíssima, isso não é verdade. Não tomarmos atitudes em prol da
segurança de nossos dados pode acabar em grandes prejuízos na nossa vida.
Tratando-se das senhas, entendemos o que torna uma senha segura (e o que pode
torná-la insegura). Também aprendemos técnicas efetivas de criação de senhas que
podem nos auxiliar bastante como usuários de múltiplos serviços e plataformas.
Gostou do conteúdo? Se quiser se adentrar mais nas tecnicidades da área de

segurança da informação, que tal dar uma olhada em nossa [**Formação Segurança de
Aplicações**], lá na **Alura**?
imagem
Estamos com uma rede que está [**dividindo os setores por VLans**]. Temos o setor
de desenvolvimento e o setor de marketing, além de uma sala com um servidor que é
utilizado pelos desenvolvedores:
imagem pelo `terminal`:
imagem.
Como cada setor está dividido em VLans, basta dizer para o roteador permitir apenas
os tráfegos que tem como origem os endereços da **VLan** de desenvolvimento e como
destino o servidor.
Ou seja, queremos que essa lista se estenda desde a origem do pacote, até o seu
destino. Logo, queremos uma lista estendida (èxtended`).
Mas como vamos identificar essa lista? Precisamos dar um nome para ela para
facilitar sua identificação. No meu caso, vou dar o nome de `SERVIDOR-MARKETING`.
ìp access-list extended SERVIDOR-MARKETING`
imagem os pacotes da rede com o endereço ìp` `192.168.1.0`, no meu caso.
Essa rede utiliza a máscara de rede padrão (`255.255.255.0`). Ou seja, as partes

fixas do endereço IP são `192.168.1`. Já que são essas partes que dizem que os
computadores fazem parte da VLan Desenvolvimento. Nós os chamamos de **Wildcard
bits**.
Os wildcard bits nos dizem qual parte do endereço pode variar. Neste caso, como
estamos utilizando a máscara padrão, dizemos que apenas a última parte do endereço
IP pode sofrer variação.
Quando uma parte do endereço não pode variar colocamos o valor `0`. Quando ela pode
variar, colocamos um [**valor referente a máscara de rede**]. No nosso caso, este
valor é `255`.
Dessa forma podemos falar para o roteador negar os endereços vindo da rede
`192.168.1.0`, sendo que só a última parte pode variar `0.0.0.255`
`deny ip 192.168.1.0 0.0.0.255`
imagem que essa interface (ou sub-interface) faz parte, esse grupo é justamente o
nome da nossa lista.
Logo, vamos dizer para o roteador que os endereços IPs (ìp`) dessa interface fazem
parte do àccess-group` `SERVIDOR-MARKETING`. Precisamos também dizer que esse
grupo, vai analisar todos os pacotes que entrarem por essa interface (ìn`).
ìp access-group SERVIDOR-MARKETING in`
imagem e dizemos para o roteador permitir (`permit`) os demais pacotes ìp` de

qualquer origem (àny`) e qualquer destino (àny`).
![]
Pronto! Dessa forma a VLan marketing só fica bloqueada de acessar o servidor, mas
pode acessar as demais máquinas na rede.
## Para saber mais

Esse foi apenas um exemplo de como utilizá-las, porém existem outros, como, por
exemplo, bloquear os pacotes da [**camada de transporte**], como o TCP e o UDP, ou
então bloquear uma porta específica.
Listas de acesso são muito utilizadas para controlar o tráfego nas redes. Em
algumas provas de certificação da Cisco, elas são cobradas.
Aqui na **Alura** temos uma formação que te [**prepara para a certificação CCNA**].
Nele você verá todos os itens cobrados pela prova.
Se quiser estudar redes de computadores, mas não se preparando para uma prova,
temos uma [** formação em redes**]. Nela você verá listas de acessos, aprenderá
sobre como configurar VLans, como criar um servidor DHCP no roteador, além de
técnicas de segurança da informação.
Vamos ter uma reunião aqui na Alura sobre novos cursos. Só que esquecemos o
computador em um prédio que fica num bairro distante. A princípio, poderíamos
buscá-lo, porém, perderemos muito tempo no trânsito fazendo com que a reunião não
aconteça!
Será que tem alguma forma de acessarmos o computador remotamente?
Tanto o computador que temos aqui como o que esquecemo operam no sistema
operacional Linux, portanto, temos a capacidade de acessar diretamente um ao outro,
de forma remota, por meio do [**SSH**].
# o que é o SSH?
SSH é o protocolo para o acesso remoto. Ele nos permite fazer uma conexão segura
entre as nossas máquinas, acessando um **secure shell**.
Para acessar um computador utilizando o `ssh`, nós precisamos informar o usuário,

`yuri`, e onde está a máquina que queremos acessar, usando o `@` e um endereço,
como `192.168.0.10`.
Para isso é só abrir o terminal e digitar essas informações. O comando completo

fica assim:
`ssh yuri@192.168.0.10`
O sistema vai te pedir uma senha, ou nem mesmo isso caso você tenha configurado um
sistema de chave pública-privada para seu usuário.
imagem que facilitam e nos protegem de possíveis erros.] Mas, se for necessário
esse tipo de acesso, **CUIDADO DOBRADO,** pois a chance de algo acontecer é
grande**.**
## E no Android?
Supondo que nós estamos em uma situação em que precisamos acessar um servidor, mas
não temos um computador por perto, como por exemplo, dentro de um ônibus.
Além do acesso via Windows ou Linux, temos alguns apps na Play Store que nos
permitem acesso remoto também.
Para acessar um Linux por exemplo, temos o [**ConnectBot**]. É só informar o
usuário, o host e a senha e temos uma conexão.
![]
Vale lembrar que acessar os servidores de forma remota tem seus riscos, como por
exemplo, executar um comando sem querer e acontecer um problemão.
Também é importante se atentar ao consumo de dados, pois se você tentar usar algum
recurso que exija algum tipo de transferência e não estiver em uma rede Wi-Fi, por
exemplo, você pode consumir todos seus dados.
## Conclusão
Nesse post vimos como podemos acessar servidores Linux tanto com Windows, Linux ou
Android. Além disso, vimos que esse tipo de acesso exige alguns cuidados,
principalmente quando os servidores estão em produção.
Que tal aprender sobre servidores? Aqui na Alura, curso [**Windows Server**] no
qual aborda desde a configuração inicial à configurações de privilégios e
restrições para usuários.
Se eu tenho informações em 5 dimensões, eu consigo ver elas em 2d? Para responder

essa pergunta, gosto da analogia da viagem. Se você foi para Tokyo e Paris, gostou
muito das duas cidades e quando volta para o Brasil gostaria de compará-las. Você
consegue ver Tokyo e Paris ao mesmo tempo, no Brasil?
Claro! É só olhar as fotos que tirou nas duas cidades. E para vê-las ao mesmo
tempo, basta colocar as duas fotos lado a lado.
Mas aí você diz: Guilherme, você roubou, pois a foto diminuiu a experiência 3d da
viagem em duas imagens 2d, perdendo informações. Claro, mas mesmo diminuindo em uma
dimensão e perdendo informações, as fotos conseguem passar a mensagem que eu
desejava visualizar: comparar as duas cidades/viagens - na verdade perdemos também
a quarta dimensão, o tempo que passou durante a viagem.
Essa ideia de diminuir a dimensão de um conjunto de dados para poder visualizá-los

em 2d (3d etc) pode ser alcançada no mundo dos dados através da análise deles.
[**Um método estatístico para diminuir dimensões é o PCA, podendo ser usado não só
para visualização, mas em outras situações importantes de análise também**].
Para usar o PCA existem diversas características importantes (como a escala dos
dados nas diversas dimensões) portanto vamos ver um exemplo baseado em algo do
mundo real?
Opa, mas que dado do mundo real tem mais de 2 ou 3 dimensões? Vamos pensar nos
cursos que um aluno faz na Alura, seguindo o post e o código anterior sobre o
assunto, eu sou capaz de gerar matrículas aleatórias em N cursos:
py
E gerar alunos que tenham mais matrículas numa categoria de cursos do que em outras
categorias:
py
E podemos gerar todos os alunos, de todas as categorias de uma vez só:
py
Pronto, o código que me interessa é o que gera alunos que fazem cursos em 3
categorias. Teremos um grupo de alunos e alunas que faz mais programação, outro
design, outro mobile. E plotamos como no post anterior:
py
imagem e no plano em R^2 está aparecendo em (3,4)... juntamente com uma aluna que
fez 3, 4, 15, 2 cursos. Que horror, visualmente ao descartar duas das quatro
dimensões, perdemos muitas informações (óbvio):
imagem um número maior de dimensões, vamos mapear em 2 dimensões nossos alunos e

alunas, e plotá-los:
py
imagem com valores mais extremos, por isso seria interessante que todas as
dimensões possuissem valores bem distribuídos. No nosso exemplo eles já tem valores
máximos, mínimos e de distribuição próximas pois usamos distribuições normais para
gerar nossos dados.
Mas e se os dados estivessem em escalas distintas? Podemos "normalizar" os dados, e

existem diversas maneiras de reescalar informações. Uma delas é diminuir todos os
pontos pela média e dividir pelo desvio padrão. Isso faz com que todos os dados
transformados estejam entre -1 e 1 - todos numa mesma escala. Em Python podemos
fazer isso usando um `StandardScaler` e colocando junto com o `PCA`:
py
O resultado é diferente mas a dimensão continua sendo 2 e temos a visualização e

informações que buscávamos:
imagem e utilizá-los para mostrar como as 5 dimensões foram mapeadas em R^2:
py
Por causa da natureza do PCA, como os eixos originais (direção) e suas influências
(tamanho) são plotados indicam para onde eles foram parar no novo mapa (nosso
plot). Quanto maior a correlação entre duas dimensões originais, mais dois eixos
estariam alinhados.
imagem ou analisarmos os dados visualmente (uso exploratório).
Note que o objetivo dos posts não foi detectar agrupamentos (clustering), mas com
certeza é mais fácil visualizar clusters num plot 2d do que num plot 5d (há!) até
mesmo depois do processamento. Claro, se você é sortudo ou sortuda, e seus dados
iniciais já eram em duas dimensões, maravilhas, mas se como no mundo real, o número
de features e dimensões é bem maior, recorremos a métodos de redução de dimensão
para analisar nossos dados.
[**Você pode encontrar todo o código da plotagem em 2d, 3d e PCA no github**].

Dentre [**alguns dos cursos existentes de Data Science e Machine Learning na
Alura**], [**PCA pode ser utilizado no preparo e visualização dos dados**], além da
diminuição de dimensões e escolha de features.
imagem
Quando vamos começar a estudar programação, nos deparamos com diversas linguagens
de programação. Qual delas devemos aprender primeiro?
Independente da linguagem de programação, todas elas têm ao menos uma coisa em

comum: **a lógica**. Não importa a linguagem que escolhemos para começar, a lógica
executada será a mesma. Claro, talvez os passos para realizar essas tarefas sejam
diferentes, pois cada linguagem tem uma sintaxe diferente.
Em meio tantas linguagens de programação, uma [muito popular] é a [**linguagem

C**]).
A linguagem C é uma das linguagens mais utilizadas nos dias de hoje, e serviu como
base para diversas outras linguagens, como C++, C#, Java, PHP, Javascript, entre
algumas outras. Mas como podemos escrever um programa em C?
## Olá, mundo! E algumas coisas a mais
Temos que começar a escrever nosso código que será o nosso programa em C. Para
isso, podemos utilizar qualquer editor de textos. Precisamos falar para o
computador que esse é um arquivo da linguagem C, para isso, colocamos a extensão
`.c`:
imagem uma mensagem para a gente no vídeo:
Demos nossa instrução para o C. Falamos para ele imprimir um texto. O C pede que
todo texto, também chamado de string, deve estar entre aspas duplas e toda
instrução deve terminar com ponto e vírgula.
Esse código que escrevemos em C é um código legível por seres humanos. Isto é, uma
pessoa consegue ler esse código sem muitos problemas. Contudo, o computador não
entende essa linguagem.
Temos que transformar essa linguagem que nós escrevemos para uma linguagem que o
computador consiga entender. Esse processo de transformação de um código de uma
linguagem de programação em código de máquina é chamado de [**compilação**].
Quando compilamos um código, o compilador pega nosso código, neste caso escrito em
C, e transforma para uma linguagem que a máquina entenda. Existem [**alguns
compiladores disponíveis**], como estou utilizando um Linux, vou utilizar o
[**GCC**], que já vem por padrão na maioria das distribuições.
`gcc ola-mundo.c`
imagem no nosso arquivo:
Bacana, se tentarmos compilar nosso programa veremos o mesmo erro:
imagem. Essa função indica qual o ponto de entrada no programa. Como queremos que o
nosso `printf` apareça quando o programa rodar, precisamos declará-lo dentro da
função `main`. Mas como declaramos essa função?
## A função principal
Como todo programa em C tem a função `main`, o C padronizou o estilo que declaramos
essa função. Basta colocarmos ìnt main() { … }` e pronto! Temos a função
principal. Tudo que estiver entre as chaves (`{ }`) será executado linha a linha
quando o programa começar:
Agora podemos pedir para o GCC compilar nosso arquivo sem receber um erro:
imagem
## Para saber mais
O sinal de porcentagem que apareceu no final da frase, indica que naquele lugar
acabou a string, isto é, acabou a frase que passamos para o `printf`. Como essa
instrução não tinha uma quebra de linha, o meu \*\*terminal inseriu \*\*ela. Mas
isso não é um comportamento padrão do programa.
O comum é que a linha não seja quebrada. Para colocar esse comportamento de quebra
de linha como padrão, precisamos falar que no final da nossa frase, o `printf`
imprima também uma linha nova (`\n`):
Quando compilamos e rodamos o arquivo, veremos que o sinal de porcentagem sumiu,

pois a quebra de linha está explícita agora:
imagem para o arquivo òla-mundo.out`, por exemplo:
`gcc ola-mundo.c -o ola-mundo.out`
imagem`, falamos que a nossa função retorna um número inteiro. Contudo onde
indicamos esse retorno?
Em alguns compiladores, quando nós compilássemos nosso código ele geraria um aviso
(Warning) falando que a função `main` não tem valor de retorno. Isso não impediria
o programa de rodar, mas não é considerada uma boa prática.
Ou seja, o legal é que a nossa função `main` retorne um número falando que sua
execução ocorreu sem nenhum problema. Por convenção, este número é o `0`. Logo,
podemos falar para a `main` retornar o número zero quando ela executar tudo que
precisa:
O C é uma linguagem muito utilizada até hoje. Ela tem uma capacidade de
processamento muito alta.
Aqui na Alura, temos [**três cursos na linguagem**]. Em cada um deles você criará
jogos que ajudarão a conhecer as funcionalidades da linguagem.
Também temos um [**curso sobre a linguagem C na Alura Start**]. Nele você também
conhecerá as funcionalidades da linguagem. Além do curso de C, temos cursos que te
mostrarão como utilizar os [**recursos da linguagem em desafíos da Olimpíada
Brasileira de Informática**]. Nele você verá como utilizar o C para criar
algoritmos e se preparar para a olimpíada.
Como nasceu o AngularJS e em qual versão estamos agora ?
O [**AngularJS**] surgiu dentro do Google em meados de 2008 meio que sem querer.
Um desenvolvedor chamado [**Misko Hevery**] precisava resolver um problema

específico dentro de algumas aplicações e, depois de codar muito, olhou pro que ele
tinha feito e pensou:
> "Olha só, acho que dá pra eu deixar isso um pouco mais genérico e liberar pra
galera usar".
E assim nascia o **Angular**.
Por várias razões, este **framework** se tornou extremamente popular entre os

desenvolvedores e ganhou muita força na comunidade e uma quantidade enorme de
adeptos. Teve até muita gente que não precisava, mas mesmo assim construiu sua
aplicação com Angular.
O tempo foi passando e o pessoal do Google viu que o monstrinho que eles tinham
criado era muito legal, mas havia várias questões que poderiam ser melhoradas. Eles
resolveram, então, criar um framework novo, o [**Angular 2**].
Foram lá e reescreveram tudo do zero! Tomando muito cuidado de não repetir os erros
da primeira versão e fazendo tudo o melhor possível.
Quando essa segunda versão saiu, alguns devs ficaram um pouco chateados pensando:
> "poxa, mas eu estudei tanto a versão 1, agora vou ter que reaprender do zero?"
E eles ficaram ainda mais chocados quando, pouco tempo depois desta segunda versão
sair, o **Google** vir de supetão anunciar o **Angular 4**!
> "Mas pera... Eles acabaram de lançar uma versão nova e logo em seguida lançaram
outra? Tá meio estranho isso aí, não tá não?"
De início, pode parecer um pouco confuso sim. Mas no fim das contas é mais simples
do que parece!
Pra desmistificar tudo isso aí, eu chamei a [**Vanessa Tonini**] pra um episódio do
Alura Live!
A Vanessa é instrutora da **Caelum** e entre os cursos que ela dá, está o de

Angular :)
Confira como foi o nosso papo:
![]
Gostou deste vídeo? Então não deixe de se [**inscrever em nosso canal no Youtube!
**]
Os verdadeiros gênios da informática muitas vezes ficam desconhecidos do grande

público, mas sem o trabalho de programação deles, os sites e aplicações mais
utilizadas do mundo seriam bem diferentes do que a gente conhece hoje, se é que
existiriam.
## Programação C
imagem e do C++ (criado por Bjarne Stroustrup) para desenvolver a linguagem que é
base para o SDK e, como consequência, para muitos apps do Android.
## PHP
imagem, [**Rasmus Lerdorf**] é o criador da linguagem PHP, lançada no ano de 1994 e

instalada no código de 82% de todos os sites existentes, de acordo com contagem da
W3C.
Entre esses sites, se destacam Facebook, Twitter, Wikipédia e gigantes chineses,

como Baidu e QQ.
## Python
imagem, da LISP (de John McCarthy) e da Perl (de Larry Wall), o holandês [**Guido
van Rossum**] foi capaz de desenvolver a linguagem Python entre o fim da década de
80 e início de 90.
Focada na legibilidade do código, a Python já serviu de inspiração para a criação

das linguagens JavaScript e Swift.
## Ruby
![]
Criada pelo japonês [**Yukihiro "Matz" Matsumoto**] em 1995, a Ruby foi planejada
para ser uma linguagem de script. A ideia é que ela fosse mais orientada a objetos
que a Python e mais poderosa que Perl, duas de suas inspirações.
Segundo o Índice Tiobe, a Ruby está entre as dez linguagens de programação mais
populares do mundo.
## JavaScript
![]
Criada em 1995 pelo americano [**Brendan Eich**], a linguagem Javascript foi

desenvolvida com o intuito de dinamizar determinados processos de páginas web,
deixando seu uso mais agradável.
Após um ano de seu lançamento, a Microsoft utilizou a linguagem para seu navegador,
a alçando a uma das tecnologias mais importantes e usadas na internet.
Além disso, também escrevi um post sobre [**5 passos para aprender a programar**],
com dicas da minha experiência durante os estudos como programador.
Você está fora do mercado de trabalho e não sabe como procurar novas oportunidades?
A primeira dica é se conscientizar sobre a importância de sempre está atento a
novas oportunidades no mercado. Para isso, é recomendado fazer uma leitura de
contexto e ter atitudes que condigam com seus objetivos e aspirações.
Mas como fazer uma **leitura do mercado com foco em oportunidades de trabalho**?
Aguçar a sua percepção é uma orientação importante. É preciso perceber que buscar
um emprego hoje é muito diferente de procurar uma recolocação nos anos 1990 ou até
mesmo há cinco anos. As necessidades são outras, assim como as ferramentas de
recolocação e as prioridades das empresas.
Confira algumas dicas que vão te ajudar a fazer uma leitura do mercado com foco em
oportunidades de trabalho!
## **Saiba o lugar que você ocupa**
Você sabe exatamente o lugar que ocupa no mercado de trabalho atualmente? Não basta
dizer que está sem emprego ou que ainda não sabe o que quer. É preciso ter essa
consciência, mas isso é resultado de um processo de autoconhecimento.
Verifique se a sua **formação é sólida**, se as suas experiências anteriores te

fizeram crescer, avalie o quanto você está disposto a aprender e se está preparado
para competir de igual para igual com outros profissionais. Da mesma forma, se você
ainda não acumulou experiências, saiba da importância dessas ações para ter
visibilidade e despontar no mercado.
Quando você consegue perceber esses fatores, fica claro em que pontos você precisa
se aperfeiçoar e quais são as suas características fortes e pontos de melhoria.
Assim, você tem uma noção clara de quais oportunidades no mercado de trabalho são
mais adequadas ao seu perfil. De repente, você pode estar tentando vagas voltadas a
profissionais em nível pleno, mas o mais adequado no momento seria uma vaga de
trainee, por exemplo.
## **Dê atenção às tendências**
O mercado tem dados sinais claros de que as vagas de trabalho têm passado por
mudanças. Isso diz muito sobre as suas novas necessidades, e é preciso se adequar.
Diversos profissionais estão aproveitando oportunidades para empreender e descobrir
novas habilidades que podem levar a **caminhos inovadores**.
Em virtude dessas alterações, o movimento empreendedor tem crescido no país. As

empresas têm adotado sistemas mais flexíveis, como trabalho via home office ou
consultorias especializadas, em vez de terem profissionais alocados 100% do tempo.
Outro mercado crescente são as empresas de base tecnológica, as famosas startups.
Os profissionais estão notando que o velho e bom emprego de carteira assinada não é
tão bom assim e que há muitas outras formas interessantes de trabalho. É preciso
acompanhar essas tendências e se qualificar para enfrentá-las.
## **Desenvolva habilidades**
As mudanças pelas quais o mercado de trabalho tem passado exigem que o profissional
desenvolva novas habilidades. Já não bastam as capacidades técnicas, é
preciso [**investir no desenvolvimento humano e gerencial**]. O cenário requer
pessoas mais autônomas, capazes de desenvolver múltiplas tarefas ao mesmo tempo e
que consigam lidar com cenários de instabilidade.
Os diplomas continuam sendo importantes, mas deixam de ser diferenciais. Saber

novas[**linguagens de programação**] e usar diferentes ferramentas é um pré-
requisito. Além disso, é importante saber se organizar frente a demandas diversas,
estar preparado para tomar decisões rápidas e ter habilidade para gerir pessoas.
A capacidade de trabalhar com equipes e profissionais de diferentes áreas também é

muito valorizada em tempos em que o trabalho colaborativo é uma máxima.
## **Nunca estanque a sede de conhecer**
O gosto pela aquisição de conhecimento é um dos requisitos muito avaliados pelas

empresas nos dias de hoje. O profissional não pode estar satisfeito com seu
repertório atual. É preciso demonstrar interesses em descobrir coisas novas a cada
dia. Em tempos de internet, o conhecimento está mais democratizado, o que abre um
leque de oportunidades para quem deseja se desenvolver.
Os autodidatas têm espaço garantido nesse meio. Conseguem aprender com vídeos,
textos e múltiplas plataformas. Essa disposição para desvendar possibilidades é
muito valorizada pelo mercado atual, pois demonstra persistência e dedicação. O e-
learning contribui muito nesse quesito, já que é uma modalidade de ensino que
ultrapassa as barreiras físicas e oferece opções que cabem no bolso.
## **Use as ferramentas disponíveis**
Não basta ter um bom currículo, é preciso exibi-lo em formato que favoreça suas
habilidades e disponibilizá-lo em sites que façam a diferença. Dedique-se a
atualizar o seu [LinkedIn,] preencha cadastros nas empresas de seu interesse e
capriche no portfólio online. Ferramentas digitais como essas aumentam as
possibilidades de contratação. É preciso separar um tempo para fazer e atualizar
cadastros em sites especializados.
Outra estratégia interessante é participar de eventos da sua área. Fique atento às

mídias sociais e participe de seminários, encontros e debates que contribuam para a
sua atualização profissional. Nessas ocasiões, sempre é possível se atualizar sobre
o que de mais moderno está sendo oferecido na área, além de também se poder
encontrar possíveis empregadores ou clientes. Tenha sempre seu cartão de visitas em
mãos!
## **Invista em network**
Você pode ser um profissional exemplar, ter uma boa formação e um ótimo perfil, mas
uma boa indicação supera qualquer barreira. Ela não basta, mas abre muitos
caminhos. Invista no network sempre. Isso pode te render participação em eventos,
trabalhos importantes ou apenas te colocar no lugar certo na hora exata. E se você
estiver começando a vida profissional, não se acanhe de pedir indicação aos seus
professores!
Independentemente de você trabalhar em uma empresa ou abrir o próprio negócio, os

contatos representam uma força importante nesse grande mundo das oportunidades de
trabalho.
Para manter as relações sempre ativas, marque happy hours, participe de almoços,
aproveite o horário de café para fazer ligações e atualizar as mídias sociais.
Produzir e compartilhar conteúdos relevantes nas mídias sociais também ajuda a

mostrar o seu trabalho para a sua rede. Você não precisa emitir opinião sobre todos
os temas que estão em debate, mas é essencial que saiba que eles estão acontecendo.
Um profissional atualizado contribui para a empresa em que está inserido e se
mantém crítico sobre as questões do mundo.
Como se pode perceber, para estar preparado para assumir oportunidades do mercado
de trabalho atual, é preciso muita perspicácia e dedicação. Isso requer tempo,
dedicação e mudança de hábitos.
imagem
O momento ideal de coletar os dados de usuário pode interferir muito na UX do seu

app. Entenda como e em quais contextos podemos utilizá-lo.
No Aluroom, um aplicativo de e-commerce, foi implementada uma feature de login logo

que o usuário abre o app:
![]
Nessa tela temos apenas duas opções: Fazer login ou criar uma conta. Isto é, não
conseguimos entrar no app sem estar logados.
Só que, sem saber ainda do que se trata o app e o esquema de compras, muitos
usuários podem deixar de dar continuidade à interação e desistir do app. Seria
muito mais interessante para mim poder conhecer melhor o app antes de decidir me
registrar e criar algum tipo de conta, certo?
Por outro lado, para a Aluroom seria um problema não ter o registro do usuário, por
diversos motivos:
- Ao registrar-se, o usuário pode já inserir seu endereço e até uma forma de

pagamento preferencial, como o cartão de crédito, por exemplo;
- Criando uma conta, podemos personalizar a experiência do usuário, guardando

informações de buscas feitas anteriormente e oferecendo produtos já filtrados com
os itens de interesse;
- Aproximamos o usuário de outros benefícios que a empresa pode oferecer

especialmente a quem se cadastra.
Esses e outros benefícios podem ajudar muito tanto o usuário quanto a empresa.
Mas, então, como permitir ao usuário a possibilidade de conhecer e interagir com o

app e ainda manter esse recurso de registro?
## Um test drive ao usuário
Se precisamos que o usuário ganhe interesse no app, nada melhor do que fazer uma
espécie de "test drive".
Assim como quando vamos à uma loja e queremos visualizar o produto, manuseá-lo e
verificar melhor sua qualidade, permitir ao usuário a chance de decidir por conta
própria se curte ou não seu app é essencial.
Esse tipo de solução, quando falamos de UI Design Patterns, chama-se **Lazy

Registration**, ou registro preguiçoso.
Quando utilizamos esse recurso, permitimos que o usuário interaja com o app e, em
um momento oportuno, ou somente quando necessário, requisitamos um cadastro para
que ele possa aproveitar as demais features do app.
No caso da Aluroom, o fluxo da interação ficaria mais ou menos assim:
> Tela de produtos > Produto selecionado > Tela de compra > Cadastro do usuário >
Conclusão da compra
A primeira tela é já a de produtos oferecidos e só quando o usuário fecha o

carrinho de compras e decide concluir a compra a tela de cadastro aparece.
> _"Mas e os aplicativos que ainda hoje forçam o registro ou login logo de início?
Por que fazem isso?"_
De fato, existem alguns apps que ainda forçam o registro do usuário, porém existem
diversos motivos para essa escolha.
## Analizando diferentes contextos
Alguns aplicativos, como o Facebook, Instagram e outros que pedem login ou registro
logo na abertura do app, tem uma proposta um pouco diferente a oferecer ao usuário.
Se tratando especificamente desses dois apps, podemos analisar as principais

features que apresentam e logo perceberemos que todo o funcionamento é baseado em
uma conta de usuário.
Isto é, para conseguir visualizar algo na timeline, curtir, compartilhar,

interagir, é necessário que o usuário crie uma rede de contatos que alimentarão o
feed de notícias dele para todas essas interações acontecerem.
Nesse caso, faz todo sentido que se crie, logo de cara, um perfil de usuário.
Porém, existem também os casos em que, para simplificar o processo de registro,

algumas empresas decidiram reaproveitar apenas as informações relevantes do usuário
para alguma tarefa, diminuindo o tamanho desses formulários, como é o caso do
[Shopify Pay].
![]
Nesse caso, o usuário insere apenas o e-mail e as informações de pagamento e envio

para entrega, recebe um código via SMS para assegurar a compra e, num segundo
momento, precisará apenas inserir o e-mail e o código recebido pelo SMS, encurtando
o processo de compra.
Esse é um exemplo interessante para solucionar o problema recorrente que temos em

formulários de cadastro longos e trabalhosos para o usuário.
## Dando liberdade aos usuários
Entendemos que alguns pontos são relevantes a considerar quando falamos de telas de
registro, como, por exemplo, não limitar o usuário a experimentar o app antes de
efetivamente concluir um cadastro.
Ainda assim, existem alguns contextos em que a implementação de um registro logo de

início pode sugerir a grande necessidade dessa informação para a aplicação, bem
como a redução dela a passos mais simplificados pode ser uma boa pedida para a UX
em outros casos.
É sempre importante considerar os diversos tipos de contextos e intenções com as

quais teremos de trabalhar, para então decidir se essa é uma boa escolha ou não.
Para diminuir o impacto desse tipo de decisão, precisamos pensar sempre em passar
por todos os passos de prototipação e testes, acompanhando o dia a dia do produto
no mercado para adequá-lo à melhor abordagem.
Na Alura temos um curso de [**UX Strategy**] apontando alguns pontos importantes no
planejamento da sua aplicação, desde as definições iniciais até o [**MVP do
produto**].
Quero gravar uma locução para um video de divulgação da Alura que vamos colocar no
Youtube, nós ainda vamos inserir essa locução em um vídeo e em que vamos realizar
uma compressão, isso no nosso software de edição no momento de exportar o vídeo
como um todo.
Um dos grandes problemas que sempre enfrentava trabalhando com vídeo era entender
qual a diferença entre diversos tipos de arquivos de audio que existe, alguns são
maiores, outros menores mas me faltava o treinamento para entender qual tipo de
arquivo utilizar em cada situação.
Então, para gravar esse audio estou utilizando o Adobe Audition. Quando apertei o
botão vermelhinho de gravar dentro, do Adobe Audition ele me pediu para selecionar
Sample Rate, Channels e Bit Depth
![image00]
Dei ok e fiz minha gravação. No fim da gravação selecionei a opção salvar e nesse
momento apareceu uma janela pedindo que nós definissemos o tipo de arquivo.
![image01]
E aí, qual a melhor opção? O que precisamos nesse momento? Esse arquivo já está
finalizado certo? Quando falamos em comprimir, pensamos em diminuir o tamanho, pode
ser reorganizando informações ou jogando-as fora.
Imagine, que seja salvo um arquivo comprimido que joga informações dessa locução
fora e depois, no momento de exportar o video aconteça outra compressão e jogue
fora mais alguns pedaços de todo esse arquivo, estou perdendo muitas informações
importantes para um audio de qualidade. Pior seria se quisessemos, por alguma razão
fazer uma edição neste audio antes de inseri-lo no video.
Neste momento o ideal seria salvar sem perda alguma, mas o que é um formato de
audio sem perda? Qual formato podemos usar? Quando estamos falando em audio com sua
maxima qualidade, o nome é exatamente esse sem perda , só que ingles **Loseless**.
Os arquivos Loseless mais utilizados são o **.WAV** e o **.AIFF**, eles não tem
perda pois cada pequeno ponto utilizado para marcar a onda de audio é gravado, sem
nenhum tipo de otimização.
Então, vamos escolher salvar em .AIFF. Essa minha primeira gravação, neste formato,
ficou com 1.4MB tendo apenas 9 segundos é, o arquivo ficou bem grande... 1.4mb?
Isso é tão pouquinho! Mas e se fizermos uma gravação um pouco maior?
Vou fazer uma segunda gravação, de uma pequena chamada de teste para um novo
podcast que queria criar aqui no Alura, vou repetir o mesmo processo.
![image02]
No fim da gravação vou salvar e olha só 24mb para um arquivo de 2 minutos! Isso é
muita coisa, principalmente se depois gravarmos um podcast de uma hora, imagina,
quase 1gb em um arquivo de audio é muita coisa.
Os nossos ouvintes não vão conseguir baixar na 4G no carro. O ideal é que
conseguissmos fazer um formato que tivesse uma boa qualidade, mas que tivesse um
tamanho menor, mas não vou gravar assim, precisamos ter um original com qualidade
que podemos editar a qualquer momento. Precisamos de um arquivo com menor qualidade
quando terminarmos de editar todo o nosso audio.
Seria ideal ter um formato com perda, um **pouquinho de perda**, uma perdinha e o
nome é esse mesmo, só que em inglês de novo **Lossy**. Os formatos Lossy mais
utilizados são **.MP3** e **.WMV**. A caracteristica desses audios é que além do
formato, você pode escolher a quantidade de informações que serão transmitidas por
segundo, ou seja o **BitRate** e assim definir se você precisa de uma compressão
maior ou menor, os Bitrate mais utilizados para .MP3 são **128kbps** e **320kbps**.
Será que nosso ouvinte vai notar a diferença entre o .MP3 com uma leve compressão e
o .AIFF? Existem pesquisas indicando que uma pessoa comum, sem treinamento, não
consegue notar a diferenças entre arquivos com compressão e arquivos sem perda.
Isso acontece pois a mudança nesse audio é muito sutil. Então quer dizer que é
inutil gravar arquivos Loseless?
**Na verdade não, quando se trata de gravações o ideal é gravar o primeiro arquivo
com uma boa qualidade, pois sempre é possivel diminuir o tamanho depois, comprimir,
descartar informações e fazer um arquivo menor, mas é impossivel recuperar
informações que você descartou.**
Um bom audio é fundamental para um vídeo de qualidade, e com o arquivos certo de

audio conseguimos extrair o maximo de qualidade de nossos recursos. Se você deseja
aprender mais sobre edição de vídeo, motion graphics e edição de audios para video
confira a [**Formação Edição de Vídeos**] da Alura.
imagem
Apesar de parecer uma tarefa trivial, tentativas aparentemente simples e óbvias

podem ter resultados inesperados, visto que listas, no Python, são objetos
mutáveis. Mas o que significa tudo isso?
Eu e meus amigos do clube de livros criamos um sistema em Python para organizar que
livros cada um de nós tem.
Cada um tem sua própria lista, na qual os livros são divididos por categoria (no
meu caso, **SQL**, **PHP** e **Front-end**). Cada categoria também é uma lista:
py
Recentemente, recebemos um participante novo do clube, Pedro, e ele decidiu comprar

uma cópia de todos os livros que eu tinha:
py
E agora a lista de livros do Pedro:
py
Tudo certo!
Seguimos o clube e eu acabei adquirindo outro livro de uma categoria que eu ainda
não tinha - **Games**:
py
Agora olha como está minha lista:
py
Certo, como esperávamos! Acontece que o Pedro foi checar a lista de livros dele:
py
Mas olha qual foi o resultado:
py
Ué! Mas ele não tinha comprado o livro **Jogos iOS**! A lista dele ficou como a
lista dos meus livros… Por que será?
## Listas são objetos mutáveis
Por que quando alteramos a minha lista, a lista do Pedro foi alterada junto? O que
acontece é que não eram listas separadas, **eram a mesma lista**.
Quando atribuímos como valor de uma variável a referência de uma outra, o que
estamos fazendo é apontar as duas variáveis, ou seja, os dois nomes, para o mesmo
objeto na memória do computador. Podemos comprovar isso com nosso conhecido
[**operador de identidade ìs`**]:
py
E o resultado:
py
O mesmo acontece com qualquer outro tipo no Python, como strings:
py
O resultado:
py
E o que acontece se tentarmos alterar uma dessas variáveis?
py
Olha o resultado:
py
Só alterou a variável que pedimos para alterar! Mas ué, não era o mesmo objeto?
**Era, mas deixou de ser quando fizemos essa alteração**. Olha só:
py
E o resultado:
py
Note que o identificador da variável `meu_nome` mudou assim que alteramos seu
valor. Isso é porque **strings, assim como grande parte dos tipos nativos do
Python, são imutáveis**.
> "_Mas como imutáveis, se acabamos de mudar o valor de uma string?_"
Apesar de parecer que alteramos a string, na verdade o que alteramos foi apenas a
referência que era guardada no nome de variável `meu_nome`.
Não alteramos o objeto string original, porque **não podemos fazer isso**, mas
criamos outro objeto string com valor `Yan Orestes` (ou `meu_nome + ‘ Orestes’`) e
mudamos a referência em nossa variável. Por isso, o ID mudou.
Diferente das string, **listas são mutáveis**. Ou seja, podemos alterar um objeto
lista mantendo ele no mesmo espaço na memória, em vez de termos de criar outro
objeto para substituir a referência da variável.
Assim, quando usamos o método `clear()`, ainda estamos tratando do mesmo objeto
lista com os dois identificadores:
py
E o resultado:
py
O identificador das duas variáveis se manteve o mesmo, pois continuamos tratamos do

mesmo objeto mesmo depois de sua alteração. Como, então, podemos criar um segundo
objeto lista igual a um já existente?
## Fazendo a cópia de uma lista
Os tipos sequenciais no Python, como as lista, nos disponibilizam uma técnica que
pode nos ajudar em nosso objetivo - o fatiamento, ou _[**slicing**]_. O _slicing_
nos permite criar um **outro** objeto apenas com um pedaço desejado do objeto
original.
A sintaxe do _slicing_ é parecida com a de uma indexação comum, mas com um `:`
separando o primeiro elemento que queremos do último, **sendo o último
descartado**. Com listas, podemos fazer algo como o seguinte:
py
Assim, podemos ter uma cópia da lista em outro objeto:
py
E os IDs:
py
O Python ainda nos permite omitir o primeiro número do _slicing_ se quisermos pegar
desde o começo, e o segundo se quisermos até o final, o que simplifica nosso
código:
py
E o resultado:
py
Os mesmos da minha lista!
Agora vamos tentar adicionar uma categoria à minha lista de livros e ver se a do
Pedro muda também:
py
Dessa vez:
py
Deu certo! Também podemos usar o método de lista `copy()`, que tem o mesmo
comportamento:
py
E continua funcionando da mesma maneira!
## O problema das cópias rasas
Todo o nosso sistema estava funcionando bem, até que eu consegui tirar a
certificação PHP e decidi doar meu livro sobre o assunto para um amigo, criando a
necessidade de remover esse livro de minha lista:
py
E agora, minha lista:
py
De novo, o Pedro foi checar a lista dele:
py
E o resultado:
py
O livro sumiu para ele também! Repare que nossas listas de livros ainda estão
diferentes, mas quando eu removi um livro da categoria **PHP**, na lista dele
também foi removido. O que acontece?
Quando usamos o método `.copy()` ou o _slicing_ para copiar uma lista, estamos
fazendo uma **cópia rasa**, ou, tecnicamente, uma _[shallow copy]_.
Em uma lista, a cópia rasa vai criar outro objeto lista para armazenar os mesmos
valores da primeira lista, **mas vai usar os mesmos objetos que a primeira lista em
seu interior**, como indica a imagem:
imagem` ter criado um outro objeto lista para armazenar os valores, todos os
elementos da lista `livros_yan` foram reutilizados.
Dessa forma, temos o mesmo problema do começo, já que listas são objetos mutáveis.
Isso é o que limita as cópias rasas. Como podemos superar isso?
## Fazendo uma cópia profunda de uma lista

Em programação, ainda temos outro conceito de cópia, que se diferencia da cópia
rasa - a **cópia profunda**, ou [**deep copy**].
Diferentemente da cópia rasa, ela não simplesmente insere as referências dos

valores da lista original dentro a nova lista, mas também cria novos objetos para
cada elemento, de fato separando uma lista da outra.
A imagem abaixo complementa a imagem anterior com esse novo conceito:
imagem]
Mas como podemos usar esta técnica no Python? Será que teremos que implementar nós
mesmos uma função que faça isso recursivamente? Parece trabalhoso…
Por conta desse problema recorrente de objetos compostos, como nosso caso de listas
que incluem outras listas, o Python já vem nativamente com uma solução em sua
biblioteca padrão - com o módulo **[copy]**.
Dentro desse módulo, temos uma função específica para isso - a `deepcopy()`.
Importando-a, seu uso é objetivo:
py
Agora vamos tentar modificar a lista `livros_yan`:
py
Dessa vez:
py
Certo! Agora sim funcionou exatamente como queríamos!
## Conclusão
Nesse artigo, pudemos entender a diferença de objetos mutáveis e imutáveis no

Python, com exemplos usando listas. Vimos, então, uma forma de não nos
atrapalharmos com isso com o método `copy()` ou o _slicing_ de lista.
Assim, aprendemos sobre **cópia rasa** e seus possíveis problemas para com objetos
compostos, e como resolver isso com **cópias profundas**.
Agora sabemos quando basta uma cópia rasa, como em listas comuns, e quando
precisamos de cópias profundas, como em listas que contêm outras listas.
E aí, gostou do conteúdo? Se quiser conhecer outras funcionalidades e

peculiaridades de listas no Python, dê uma olhada em nossos artigos sobre
[**adicionar novos elementos em uma lista**], [**ordenar uma lista**],
[**compreensões de lista**] e [**outras ferramentas básicas desse tipo**].
Se quiser continuar estudando Python, temos alguns [**cursos na Alura sobre a

linguagem**] para você seguir em frente com seu aprendizado!
Em contraponto, a concorrência acirrada, os prazos apertados, a falta de rotina de

trabalho e as dificuldades em organizar as tarefas por prioridade e prazos de
entrega, deixam muitos profissionais com os nervos à flor da pele. O surgimento de
ferramentas de trabalho remoto nos últimos anos trouxe não apenas fôlego renovado,
mas muita organização para as empresas.
Uma evolução natural reuniu as funcionalidades de planilhas, timesheets, servidores

e geradores de mensagens em dispositivos cada dia menores e mais eficazes. O
resultado? Mais qualidade no trabalho, mais tempo para pensar, se planejar,
trabalhar leads e prospects, gerando um portfólio mais rentável e fiel!
## Dropbox
**xCriar, compartilhar, colaborar. Conhecido e utilizado por muitos, o [Dropbox]

permite salvar arquivos e imagens na nuvem, compartilhando com seus contatos, mesmo
que algum deles não possua conta na plataforma.**
Independentemente do tamanho e natureza dos arquivos, sejam eles vídeos, imagens,

textos ou qualquer outro tipo de arquivo, eles estarão seguros e protegidos contra
qualquer descuido ou ação de terceiros.
Outra vantagem é que, assim que um contato realizar alguma alteração no arquivo
compartilhado, todos os envolvidos conseguem acessar as atualizações, opinar,
alterar novamente e seguir até o desfecho do trabalho em conjunto.
## Trello
Simples de usar, flexível, com um apelo visual e lúdico, o [Trello] lista as

tarefas, os responsáveis, tudo em ordem de prioridade. Para os casos de tarefas
compartilhadas, com fases bem definidas e responsáveis com interdependência no
trabalho, o aplicativo sincroniza as informações e alterações, salvando na nuvem
com a segurança e garantia já conhecidas.
O Trello é um dos mais populares dentre as ferramentas de trabalho remoto, pois

permite otimizar tempo, seja trabalhando de forma isolada ou em equipe.
## Mindmeister
Excelente organizador de ideias, o [Mindmeister] cria mapas mentais, permitindo até

mesmo um [**brainstorming**] entre os participantes. Seu apelo motiva a captura, o
desenvolvimento e o compartilhamento visual de ideias, podendo transformar os mapas
em slides lindos e dinâmicos em alguns segundos.
Se quiser, ainda é possível exportar os slides, anexar à apresentação em seu site

ou transmitir ao vivo para equipe, pares, colaboradores e clientes que tenham
atuação conjunta no projeto.
## Slack
Um software de comunicação entre equipes com suporte a diferentes canais, opções

para conversas privadas e integração com outros serviços, internos ou externos.
Esta definição já o credencia a estar entre os queridinhos do pessoal de design e
desenvolvimento.
Falando de produtividade, o [Slack] permite integrações diversas, como com o

Trello, por exemplo. Esta funcionalidade permite que você seja notificado sobre
cards que mencionem seu nome ou tarefas com prazos que estejam perto de expirar.
Esteja você envolvido em um time ou no trabalho de forma isolada, a comunicação é e
sempre será vital.
## Skype
Já pensou uma ferramenta de mensagens, chamadas de voz ou com vídeo, sem custo?
Estamos falando do [Skype], claro! Mas, além destas funcionalidades, ele permite
compartilhamento de [telas], por exemplo, se precisar compartilhar uma apresentação
ou animação, compartilhamento de arquivos diversos, chamadas de vídeo em grupo, e,
por valores bem acessíveis, oferece alguns serviços de comunicação internacionais.
## Remember The Milk
O [Remember The Milk] tira a lista de afazeres de sua cabeça, transportando-a para
um ambiente onde os lembretes surgem nos momentos certos, onde quer que você esteja
e em qualquer um de seus dispositivos. Com a vantagem de que os lembretes não
perdem a cola, não molham ou rasgam, nem sequer somem.
Com o aplicativo, a rotina, os compromissos e as anotações pessoais são organizados

e gerenciados, deixando o [profissional] livre para seu objetivo
principal: produzir e criar um portfólio melhor e maior.
Para freelancers que trabalham por conta própria, por exemplo, é uma excelente
ferramenta que lembra a hora de ligar para aquele cliente, retornar uma solicitação
de orçamento ou cuidar das tarefas mais simples que, quando deixam de ser feitas,
podem trazer muito transtorno.
## Toggl
Levar suas "timesheets" a outro nível. Com esta proposta intrigante, o [Toggl] pode
ser definido como um aplicativo de controle de horas efetivamente trabalhadas,
permitindo criação de gráficos para melhor visualização de quais tarefas estão
tomando mais ou menos tempo. Deixando que você compare se aquele determinado tipo
de tarefa é compensador ou não.
Estas informações o ajudarão a definir preços e até mesmo qual tarefa é mais, ou
menos, interessante. Como seu preço não é nada proibitivo pode ajudar indivíduos ou
equipes a contabilizarem cada minuto de trabalho, facilitando a apresentação e a
conferência de faturas de serviço. Se você está pensando em iniciar carreira em
tecnologia, uma excelente pedida é conhecer as ferramentas disponíveis para começar
à frente da concorrência.
## Zeplin
Uma plataforma colaborativa entre designers e [desenvolvedores], que não exige

conhecimento de linguagens de programação, sendo suficiente um conhecimento básico
para iniciar a operação? [Zeplin], é claro! Mas os benefícios continuam, a
ferramenta oferece a oportunidade de reduzir a quase zero os erros na implementação
do desenvolvedor.
Como ele faz isso? Entregando os dados de forma visual, otimizando assim o trabalho
do desenvolvedor e melhorando a fidelidade do trabalho do [designer]. Estas
funcionalidades contribuem para reduzir o tempo das reuniões de trabalho e os
prazos de entrega.
Buscar [capacitação profissional em tecnologia] significa se integrar com o mundo

virtual, mergulhando fundo nas funcionalidades e facilidades que este universo
oferece. Uma particularidade deste mercado é que, contrariando a lei da gravidade,
o mergulho é para cima, em direção à nuvem, e não para baixo.
Significa que, quanto mais você mergulhar, mais subirá nos níveis de conhecimento,
pesquisa, aprendizado e compartilhamento. Considerando que estamos em uma aldeia
global, estes aspectos terminarão te impulsionando, em um círculo virtuoso que
contribuirá para sua evolução como pessoa e profissional.
Outro aspecto que não pode ser desconsiderado é a velocidade com que as coisas
acontecem no mercado de tecnologia. Quando alguém pensa em começar algo, outra
pessoa já pensou na mesma coisa do outro lado do mundo ou mesmo no apartamento ao
lado. Logo, não dá pra esperar!
Sempre que escrevemos uma entidade utilizando **JPA**, precisamos definir qual a
chave primária desta e geralmente, também colocamos uma estratégia para **geração
das chaves**.
Por padrão, quando utilizamos somente a anotação **@GeneratedValue** sem passar

nenhum argumento, a JPA utiliza a estratégia automática **(GenerationType.AUTO)**.
Ou seja, a implementação da especificação escolherá uma estratégia para geração dos
ids.
Por exemplo, utilizando o **Hibernate** como implementação da JPA, a estratégia

AUTO escolherá o método de sequências **(sequence)** para o banco **Postgres**.
Agora quando utilizamos o **MySQL**, qual estratégia esperamos?
Podemos pensar que ele usará o **AUTO_INCREMENT**, porém, a partir da versão 5 do

Hibernate , a estratégia utilizada é a **TABLE** que já veremos como ela funciona.
Mas já podemos falar que essa estratégia tem alguns problemas relacionados a
performance.
A partir do Hibernate 5, toda vez que é utilizado o GenerationType.AUTO, ele

tentará utilizar **sequences.** Caso não consiga, ele utilizará
GenerationType.TABLE. Por não termos controle da estratégia de geração, muitas
pessoas optam por não utilizar o GenerationType.AUTO.
Além disso, pelo fato de a partir da versão 5 o Hibernate colocar a estratégia

TABLE como padrão, não é recomendado utilizar essa estratégia Mas qual o problema
da GenerationType.TABLE?
# Conhecendo o GenerationType.TABLE
Essa é a estratégia que funciona em todos os **bancos de dados relacionais**, sendo

compatível com todas as soluções do mercado, pois todos os bancos possuem tabelas.
Parece perfeita, não? Então qual o problema com ela?
Quando utilizamos a **GenerationType.TABLE**, o Hibernate utilizará uma tabela para

gerar as chaves primárias. Essa tabela pode ser global, servir para todas as
entidades no banco, ou específica para uma entidade.
Podemos definir a tabela geradora pelo parâmetro generator da anotação

@GeneratedValue e através da anotação **@TableGenerator** definir a tabela que será
usada para gerar os ids:
java
O problema de utilizar a TABLE como estratégia está justamente no fato de

precisarmos de uma tabela para ficar armazenando os próximos ids. Mas qual o
problema de fato com isso?
O problema começa quando começamos a escalar a aplicação. O que acontece se duas

entidades sejam persistidas ao mesmo tempo? Precisamos, sempre, fazer um lock
pessimista da tabela que gera os ids. Não só isso, mas o que acontece se tivermos
que usar outras instâncias do banco de dados? Como faremos com essa tabela?
Por coisas assim, a recomendação é nunca utilizar o GenerationType.TABLE, dado seus

problemas com escalabilidade.
Como o GenerationType.AUTO usará o TABLE caso o banco de dados não suporte

sequences (isso a partir do Hibernate 5), as pessoas preferem utilizar outras
estratégias mais específicas como a GenerationType.SEQUENCE e
GenerationType.IDENTITY
# Criando sequências com o GenerationType.SEQUENCE
Quando utilizamos o **GenerationType.SEQUENCE**, o Hibernate utilizará as

**sequences** do banco de dados para gerar as **chaves primárias**. Da mesma forma
que TABLE, podemos ter apenas uma sequence para todas as entidades, ou sequences
específicas para cada tabela.
O bom de utilizar as sequences é que, pensando em performance, podemos utilizar o

batch do **JDBC** na hora da inserção e atualização.
O problema de utilizar sequences é que nem todos os bancos de dados oferecem

suporte a esse tipo de estratégia de geração. Portanto, utilizar essa estratégia
aumenta um pouco o acoplamento com o banco utilizado (se bem que não é todo o dia
que trocamos o banco de dados).
Podemos definir o gerador das sequências através da anotação **@SequenceGenerator**

de uma forma parecida com a @TableGenerator.
java
Com essas anotações, será criada uma sequência chamada sequence_livro que será
usada para popular os ids da entidade Livro. Além de sequences, podemos falar para
o banco gerar os números da coluna id através da **estratégia Identity**.
# Conhecendo a estratégia Identity
A estratégia **GenerationType.IDENTITY** é, talvez, uma das mais utilizadas no

mundo da JPA.
java
Vamos supor que estamos utilizando um banco de dados como o MySQL. Quando falamos
que a estratégia de criação é a IDENTITY, o Hibernate utilizará como estratégia a
geração AUTO_INCREMENT. Já, se o banco de dados for o Postgres, o Hibernate gerará
uma coluna do tipo **SERIAL**.
Isto é, a cada nova inserção, uma chave primária será gerada para a entidade. Isso
é um pouco menos performático para o Hibernate, pois ele utiliza a chave primária
para gerenciar as entidades. Ou seja, neste caso, ele precisa fazer a inserção no
banco imediatamente, não conseguindo usar técnicas como o JDBC batching.
# Para saber mais
Podemos usar o Hibernate para gerar **UUIDs** também. Dessa forma, caso algum de
nossos modelos utilizem um UUID como chave primária, o Hibernate consegue gerá-la
também.
Uma curiosidade sobre usar **ids sequenciais** é que isso pode trazer algumas
informações na hora que estamos analisando os dados do banco. Por exemplo, um id
com o número mais baixo significa que é um cadastro mais antigo, enquanto números
altos é um id mais recente.
Aqui na Alura, temos uma [**formação Java**] onde vemos mais sobre JPA e Hibernate.
Nessa formação, você verá como começar a utilizar a especificação, entenderá alguns
conceitos como **EntityManager e LazyLoading**, aprenderá a fazer consultas com
**JPQL**, relacionar entidades e muito mais.
imagem
No aplicativo de uma loja de ecommerce tínhamos um processo de checkout - todo o

processo desde a compra até o pagamento -, que seguia essa ideia:
> **_Coletar itens de compra > Realizar pagamento > Confirmação_**
Nesse fluxo pensamos apenas na lógica do processo:
> **_Escolher itens > Carrinho de compras > Informações de entrega e pagamento >
Confirmação_**
A partir desse fluxo chegamos a essas telas:
imagem
imagem
## Design de Experiência
Já há um tempo venho estudando _softwares_ de prototipagem para os apps que

desenvolvo. Buscava um que englobasse o maior número de vantagens possíveis, sendo
uma premissa a possibilidade de **compartilhamento simples e rápido** com a minha
equipe, que trabalha remotamente, e _stakeholders_ de nossos projetos.
Uma grande vantagem seria se fosse, de preferência, **gratuito**.
Fazendo um levantamento das características positivas, negativas e recursos

oferecidos por cada software analisado, minhas conclusões destacaram o **Adobe
XD**.
> Seria ele o _software_ que melhor se adequaria ao trabalho que desenvolvo com a
minha equipe?
Para chegar à esta conclusão me aprofundei ainda mais em analisar os pontos

positivos do **Adobe Experience Design** (ou Adobe XD).
## Selo de qualidade Adobe
Com o selo de qualidade Adobe, que é um desenvolvedor de alta confiança com o qual
já trabalho em outros programas como InDesign, Illustrator e Photoshop, que
inclusive se comunicam com o XD, o software vem ganhando cada vez mais adeptos, que
se dá tanto pelo bom desempenho relatado quanto pelo fato de estar sofrendo
frequentes atualizações e prometer ainda mais melhorias.
> "Nós estaremos lançando novas versões do Adobe XD com frequência. Estaremos
respondendo ao feedback que você compartilha com nossa equipe, para que todos
tenham a oportunidade de nos ajudar a moldar o produto.
> Você pode ver os atuais recursos votados pela comunidade em ordem de prioridade
em nosso [Adobe User Voice] e é bem-vindo para adicionar novas solicitações de
recursos e votar nas existentes para influenciar o que trabalhamos enquanto
desenvolvemos o Adobe XD."
_\- Adobe_
## Mapeando atualizações de melhoria
Fui pesquisar quais atualizações a Adobe promoveu para o XD no ano de 2019, que
ainda está começando, e já são muitas as melhorias oferecidas:
**#1** Agora é possível **editar vetores no Illustrator** - copiando e colando,

através do bom e velho Ctrl C + Ctrl V, e passar o conteúdo vetorial do XD para o
Illustrator e do Illustrator para o XD sem que nenhum deles seja convertido em
pixels, mantendo-se editáveis.
**#2** Ficou mais fácil **selecionar objetos de um grupo**. A forma antiga era
dando um clique duplo para acessar os elementos do grupo e clicar no desejado:
Agora é possível fazê-lo através de um atalho simples e além disso, selecionar
múltiplos elementos de grupos diferentes.
**#3** Quando imagens do Photoshop e Illustrator são importadas, **seus objetos são
automaticamente marcados para exportação**. Também tornou-se possível selecionar um
objeto no _artboard_ e marcá-lo para exportação no Property Inspector ou utilizando
o menu.
**#4** Tornou-se possível **ver em seu navegador as animações de gestos de

arrastar** quando estiver visualizando seus protótipos e especificações de design.
**#5** Para testar a usabilidade de seu protótipo, agora é possível desativar os

controles de navegação online e **criar um ambiente mais controlado para seus
testes** com usuário, checando se ele pode realmente navegar por conta própria sem
nenhum /problema. É uma atualização muito útil porque nestes testes busca-se checar
se algo está confuso, esperando um feedback real. A nova atualização facilitou este
processo onde é possível obter a informação que é realmente útil para o
desenvolvedor do protótipo.
**#6** O software gerou **melhorias no gerenciamento de fontes**: caso a fonte que

esteja utilizando esteja faltando, quando o arquivo XD for carregado não mostrará a
mensagem indicando as fontes ausentes e sim verificar automaticamente se elas estão
disponíveis no Adobe Fonts, ativando-as. A(s) fonte(s) que não estão disponíveis no
Adobe Fonts estão mais fáceis de visualizar no documento, sendo possível a
substituição em lote.
**#7** Agora o Adobe Experience Design **está mais integrado com o [Jira]**, uma
ferramenta que permite o monitoramento de tarefas e acompanhamento de projetos
garantindo o gerenciamento de todas as suas atividades em único lugar. O caminho do
design até o desenvolvimento ficou mais curto: além do Jira Software Cloud, os
designs do XD compartilhados no Jira Software Server e no Data Center podem ser
acessados pelas equipes do projeto.
Além do que já oferece de novidade para o XD, a Adobe conta com seus usuários para
identificar mais gargalos a serem melhorados:
> "Você pode ver os atuais recursos votados pela comunidade em ordem de prioridade
em nosso [Adobe User Voice] e é bem-vindo para adicionar novas solicitações de
recursos e votar nas existentes para influenciar o que trabalhamos enquanto
desenvolvemos o Adobe XD."
_\- Adobe_
No Adobe User Voice mapeei também algumas futuras melhorias já garantidas pelo
desenvolvedor que foram me comprovando que o Adobe XD pode ser sim o futuro do UX
Design e uma excelente ferramenta para a minha equipe:
- Em breve será possível definir uma **área rolável (scroll) dentro de um

_artboard_** sem que todo ele seja movimentado.
- Haverá um suporte de importação que permitirá **simular animações ou até vídeos**
reproduzíveis na visualização interativa.
imagem será habilitada, conforme já funciona em outros softwares da Adobe.

- O Adobe XD oferecerá **efeitos interativos para Tap e Hover** em listas, botões e
links que poderão ser exibidos durante apresentação para o cliente.
## Interface
Um ponto alto da minha análise sobre o Adobe Experience Design foi o fato dele
possuir uma **interface minimalista**, _clean_ e mais organizada do que a maioria
dos _softwares_ de prototipagem disponíveis no mercado (até mesmo se comparado com
os outros programas da Adobe).
imagem do Adobe Experience Design nas etapas de alto nível abaixo para concluir o
levantamento de pontos altos de seu uso para a minha equipe de desenvolvimento:
**Design:** crie elementos de layout, adicione artboards e importe recursos de

outros aplicativos do mesmo desenvolvedor. Você também pode usar _plug-ins_ para
automatizar as operações repetidas ou partes do fluxo de trabalho do designer que
são tediosas, complexas ou repetitivas.
**Protótipo:** Selecione objetos ou artboards no seu design e crie interações entre

diferentes artboards.
**Compartilhamento:** Uma vez que seu projeto esteja pronto para ser revisado, você
pode compartilhar especificações de design e protótipo ou exportar o projeto ou
ativos com as partes interessadas.
Em outubro de 2018 a Adobe ampliou a funcionalidade do software para fluxos de

trabalho e integrações com a crescente coleção de _[plug-ins]_ criados pela
comunidade de desenvolvedores da Adobe. Desde então é possível gerenciá-los com
facilidade diretamente no aplicativo para automatizar funções, gerar integrações
com outras ferramentas, criar designs com dados, entre outros.
## Conclusão
Ao longo da minha análise do Adobe XD já fui me convencendo que, de todos os

_softwares_ disponíveis no mercado, este seria o mais adequado para as minhas
necessidades. O programa já é excelente e promete ficar ainda melhor: quero estar
em utilização para acompanhar todas as novidades que a Adobe promete para o XD!
Compreendendo o Adobe XD como uma poderosa ferramenta para o desenvolvimento de UX
Design e apostando nela, a [**Alura**] já desenvolveu cursos e pretende lançar
ainda mais, para que seus assinantes possam usufruir de todas os recursos e
melhorias desta fantástica ferramenta.
- [**Adobe XD: Design visual de um site mobile**]

- [**Adobe XD: Componentes da interface**]
- [**Adobe XD: refinando o visual da interface**]
- [**Prototipagem e UX parte 1: Alta fidelidade com o Adobe XD**]
- [**Prototipagem e UX parte 2: linkando telas no Adobe XD**]
O [Bruno Lopes] mandou lá no [**fórum da Alura**] essa pergunta sobre usar ou não o
Google Fonts. Em especial tendo em vista as discussões sobre **Critical Path** que
temos no [**curso avançado de Performance Web**].
## Considerações gerais sobre o load de fontes
A desvantagem do Google Fonts é que ele está em um hostname externo, o que vai
exigir uma nova conexão extra (em geral 2, uma pro CSS e outra pras fontes mesmo).
E se você carrega as fontes com um `<link>` normal como a maioria das pessoas, isso
é blocante. Sendo blocante, pode ser bem ruim colocar 2 hostnames externos no
critical path da sua página (dá pra aliviar fazendo o `preconnect` do segundo
hostname por exemplo, mas ainda é pouco).
## Vale a pena usar o Google Fonts?
A vantagem do Google Fonts é o potencial para a fonte já estar cacheada na máquina

do usuário por causa de uma visita eventual anterior a outro site que use a mesma
fonte que você. Mas, sei lá, é um tiro no escuro isso. Você não sabe direito como
tá o cache do usuário, mas sabe com certeza que 2 conexões a mais no critical path
são ruins.
Se for carregar fontes da forma tradicional com `@font-face` e sem as customizações

que o Google Fonts permite, aí talvez compense **servir no seu próprio domínio**.
Dá pra colocar o CSS do `@font-face` inline na página ou fazer um server push. Dá
pra fazer `preload` dos arquivos das fontes. E tudo no mesmo hostname com
prioridade máxima de entrega.
Você perde, claro, o cache global entre sites que o Google Fonts em teoria poderia
te dar.
Agora, isso tudo pensando que a fonte foi carregada com CSS via `@font-face` e está
bloqueando o Critical Path. Digo isso porque existem outras formas de carregamento
mais lazy que não são tão ruins pra performance. Têm outros tradeoffs, como causar
um **FOUT - Flash Of Unstyled Text**. Mas podem ser apropriadas.
Dependendo do nível que quiser se aprofundar nisso, recomendo fortemente [**esse

artigo**] com estratégias de carregamento de Web Fonts.
Cada vez mais e mais desenvolvedores fazem parte do mercado de trabalho e muitos
tem o objetivo de se destacar na carreira, mas ainda tem dúvidas de como chegar lá?
É muito comum encontrarmos profissionais que conhecem back-end profundamente e
sabem todos os detalhes de como fazer uma integração multiplataforma através de
mensageria assíncrona de forma eficaz. Ou então o profissional front-end que é
craque em todas as nuâncias do CSS e design responsivo.
No entanto, quando esses dois tipos de profissionais precisam se conversar sobre a

especialidade de um ou de outro, a conversa não flui. O profissional back-end não
conhece de front-end e vice-versa. Quer adicionar mais uma pimenta aí nessa
conversa? Inclua o DBA, que administra os bancos de dados.
Seria muito mais interessante se todos esses profissionais conhecem um a área de

especialidade do outro, por exemplo, que o especialista de back-end tivesse
conhecimento suficiente para trabalhar bem com banco de dados e com front-end.
É justamente isso que significa ser um desenvolvedor full-stack. Ter conhecimento

de toda a pilha que envolve a área de desenvolvimento para que você possa colaborar
em todas as áreas do projeto.
Cada vez mais esse tipo de profissional é requisitado pelas empresas [no brasil] e
[no exterior] e geralmente com remunerações atrativas. Mas como conseguir chegar
lá?
## O que devo aprender para ser um desenvolvedor full-stack?
O primeiro ponto que deve ficar claro para você é que não é necessário ser
especialista em todas as áreas e todos os assuntos.
**Provavelmente haverá uma área que mais te atrai e nela terá mais conhecimentos,
ou seja, você será especialista nessa área e as outras vertentes serão
conhecimentos que te ajudarão no dia a dia, mas sem necessariamente ser
especialista. Esse perfil de profissional é conhecido como [T-shaped].**
### 0) Controle de versão
O requisito básico para qualquer desenvolvedor é ter conhecimentos de pelo menos

uma ferramentas de controle de versão. Atualmente as mais demandadas são o Git e o
SVN e [aqui na Alura você consegue aprender Git de forma bem fácil].
### 1) Aprender programação front-end, HTML, CSS e JavaScript
Front-end não pode ser um trauma para você. Aprender o básico pode ser muito
divertido e com certeza vai ser bastante proveitoso na sua carreira. Aprenda bem
HTML, entenda as noções de posicionamento e as nuâncias do CSS, além de claro,
conhecer os principais recursos do JavaScript para front-end. [**De quebra, aprenda
também como funcionam os designs responsivos e como eles são feitos**].
### 2) Noções de Usabilidade
Quem nunca viu um desenvolvedor back-end que precisou colocar uma mensagem na tela
e acabou fazendo isso através de um javascript com um àlert()` (não vou negar que
eu já fiz muito isso) que fugia completamente do padrão e estragava toda a
usabilidade da aplicação ou site.
[**Conhecer UX**] e saber o que pode ser feito e como aquela nova funcionalidade
vai ser encarada pelo usuário final é fundamental para qualquer profissional full-
stack. Isso vai ajudar a tomar decisões que tenham o usuário final como objetivo
principal.
### 3) Aprenda desenvolvimento back-end

Aqui a gama de linguagens e opções é enorme. Para quem está vindo de aprender
front-end, talvez seja o maior passo de todos.
Se você nunca teve contato com uma linguagem back-end, recomendo fortemente começar
por linguagens em que a curva de aprendizado sejam mais tranquilas, como PHP e
Ruby. Aqui na Alura temos as carreiras que te guiam a aprender [tanto PHP] [como
Ruby].
Depois que se sentir confortável, você pode partir para novas linguagens e
paradigmas, como Java e ASP.NET e depois se aprofundar.
### 4) Banco de dados
Sim, você vai precisar trabalhar com bancos de dados no dia a dia. E isso não
significa apenas fazer selects básicos. Aprenda a realizar joins complexos, como
fazer queries eficazes e que não exijam desnecessariamente do banco de dados também
é fundamental no dia a dia. Além de conhecer como funciona os mecanismos de
indexação disponíveis.
Você pode começar por aprender [MySQL], [Oracle], [PostgreSQL] ou qualquer outro
servidor de banco de dados que seja o utilizado por você no seu atual ou futuro
trabalho.
### 5) Mobile
Esse é um grande diferencial, dado que cada vez mais as empresas tem adotado as
apps mobiles. Saber como funcionam e são estruturadas os aplicativos mobile para as
principais plataformas também é um ponto importante.
Na maioria dos projetos, os aplicativos mobile se integram com um back-end, então

esse conhecimento dos dois mundos pode ser um enorme diferencial para a sua
carreira.
Você pode começar aprendendo [Android] ou [iOS], mas caso tenha mais familiaridade
com HTML, CSS e JavaScript, pode optar também por aprender [Ionic ou Cordova], que
através de um HTML, geram aplicativos para as principais plataformas mobile.
### 6) Infraestrutura, cloud e devops
Se você vem do mundo de front-end, é importante conhecer a infraestrutura, saber,

por exemplo, que com HTTP2 você pode ter muito mais recursos legais para as suas
páginas ficarem muito mais rápidas, entre outras coisas importantes e saber como
configurar e disponibilizar tudo isso para o usuário final.
Já para quem vem do mundo back-end, montar um servidor de aplicação e preparar o

terreno para o deploy é tarefa mais que comum nos projetos e que atualmente fica
bastante a cargo dos desenvolvedores.
Entenda como funciona os diferentes tipos de serviços de cloud, como automatizar

processos de montagem de ambientes e perca o medo de mexer na linha de comando e
com certeza você terá muitos benefícios na sua carreira.
### 7) Bônus: conhecimento do negócio
Imagina o presidente da empresa chegando ao seu lado e perguntando: "Mas essa

funcionalidade que você está fazendo, traz qual resultado para a empresa?".
Sua resposta poderia ficar apenas no aspecto técnico como "Estamos fazendo essa
funcionalidade para saber desenvolver em Angular 2", o que provavelmente não faria
os olhos do CEO brilhar, apesar de ser importante, claro.
Por outro lado, se a resposta fosse: "Essa funcionalidade é importante para

diminuir o tempo o usuário espera para receber o atendimento. O legal é que depois
dela no ar, a gente vai conseguir atender 20% mais pessoas, ou seja, muito mais
clientes felizes com a gente."
Sempre tente entender o impacto do que você está fazendo no negócio como um todo.
Desde a mais simples das funcionalidades, até a mais complexa, todas geram um valor
para o negócio. Entender qual é esse valor é fundamental até para justificar o seu
próprio trabalho.
## Como aprendo tudo isso?
Tenha em mente que você não precisa ser especialista em todos esses itens.
Especialize-se em um desses pontos (se já não for) e, em seguida, comece a aprender
os outros aspectos. Os principais desenvolvedores full-stack que conheço começaram
sendo especialistas onde já trabalhavam e depois foram aos poucos aprendendo novas
habilidades.
[O ponto importante aqui é fazer isso regularmente mantendo uma rotina de estudos!]
A grande vantagem de ser um desenvolvedor full-stack é ter desenvoltura para

participar das diferentes fases do projeto, podendo se tornar até mesmo uma peça
chave dentro dele, sendo aquela pessoa que tem um conhecimento especial sobre o
projeto, que sabe de ponta a ponta como as peças se encaixam e claro, esse pode ser
um diferencial importante para sua própria valorização como profissional.
Quando um container é removido todas as suas informações são perdidas. Será que
existe algum meio de persistir as informações do container? Esse meio se chama
volume e vamos ver como criá-los.
imagem
## Criando nosso volume
Nós queremos criar uma cópia dos dados que estão no **container** para a nossa
máquina. Caso o container venha a cair ou seja removido, podemos falar para ele
onde está os dados. Dessa forma, nossas informações ficam salvas independente do
estado do container.
Ou seja, queremos falar para o **Docker** criar um repositório de dados para os

containers, ou, como é chamado **volume**.
Vamos falar para o `docker` que queremos criar um **volume** `volume create`
chamado `dados-do-banco`, no meu caso:
`docker volume create dados-do-banco`
imagem:
`docker volume ls`

imagem do Docker.
Bacana, já temos um volume criado, mas como podemos atribuí-lo a um container?
## Referenciando um volume
Já temos o nosso volume criado, então, vamos falar para o `docker` rodar um
container `container run`, chamado `db` (`--name db`), no meu caso, com o nosso
volume (`-v`) `dados-do-banco` associado ao diretório do container que guarda as
informações que desejamos salvar, `/var/lib/mysql`, neste caso:
`docker container run --name db -v dados-do-banco:/var/lib/mysql`
Dessa forma, estamos falando para o Docker criar um container e associar o

diretório `/var/lib/mysql` ao volume `dados-do-banco`. Nossa aplicação precisa de
uma senha para se logar no **banco de dados**, então vamos falar que este
container, em seu **ambiente** (`-e`, environment), terá a senha àlura`:
python
Legal, agora basta falarmos qual é a imagem que criará nosso container, no nosso
caso, é a imagem do **MySQL**:
python
imagem com um terminal interativo (`-ti`) no nosso container `bd` com o

interpretador `/bin/bash`:
`docker container exec -it db /bin/bash`
imagem `root` e com a senha `-p` àlura`:
imagem um banco de dados (`database`) para fazer o nosso teste, no meu caso, vou
chamar esse banco de dados de `loja`:
imagem `db` e em seguida falar para ele removê-lo (`container rm`):
`docker container stop db`
`docker container rm db`
imagem as bases de dados existentes (**databases**):
`show databases;`
imagem:
`docker volume rm dados-do-banco`
![]
Lembrando que para remover um volume, nenhum container pode estar utilizando-o.
O Docker ganhou muito espaço tanto no cenário de desenvolvimento quanto no de

infra, isso porque ele vem com o objetivo de facilitar o desenvolvimento de
aplicações.
Aqui na Alura, temos uma [**formação em DevOps**], nele você aprenderá tudo sobre o
que é um container, como fazer eles se comunicarem, além de aprender como criar
suas próprias **imagens** para personalizar seus container.
imagem
Fui navegar pelo app da [Enjoei] e iniciei minhas buscas por um produto específico:
fones de ouvido. Quando a tela de resultados abriu, haviam diversas opções desse
mesmo produto.
imagem
Neste episódio do Alura Live recebi o **Giovanni Bassi**, que é Microsoft MVP, um
dos grandes nomes por trás da Lambda3 e entusiasta do C#. Conversamos bastante
sobre esta linguagem querida por muitos, falando desde seu nascimento até os dias
atuais.
https://www.youtube.com/watch?v=eUl0mWTnL_A
Gostou deste vídeo? Então não deixe de se [inscrever em nosso canal no Youtube!].
Confira os cursos de C# na Alura:
[**C# I: Fundamentos da linguagem**]
[**C# II: Orientação a objetos**]
[**C# III: Tópicos Avançados**]
[**C# Brasil: Formate datas, cpf e números nacionais**]
[**C#: Paralelismo no mundo real**]
[**NHibernate: Persistência de dados com C#**]
Aqui na **Alura** temos uma [**formção em certificação em C#**]
imagem
O design editorial ocupa um importante espaço no mercado de trabalho dos

profissionais gráficos. Ele é responsável pela construção visual de livros, jornais
e revistas.
Uma área tão ampla e importante demanda [**profissionais atualizados**] e criativos

para o desenvolvimento de projetos gráficos atraentes e eficientes. Se você é um
designer ou pretende ser, pode ganhar muito com o mercado editorial.
## Faça as pesquisas necessárias
O 1º passo para desenvolver um design editorial eficiente é **conhecer o cliente**

e o seu público-alvo e projetar para eles. Por isso, não tenha receio de fazer uma
pesquisa detalhada.
Seja para um trabalho novo ou reestruturação de publicação já existente, é

essencial fazer um briefing para entender as necessidades do cliente e da sua
audiência.
Conhecer o perfil dos principais leitores, os seus interesses e os seus desejos

facilita na hora de construir o projeto de design editorial.
## Acompanhe as tendências de design
Outro ponto importante é conhecer as [**tendências do mercado de design**]. Como em

todos os setores, existem os ciclos de mudanças visuais.
Por mais que seja importante respeitar a identidade do cliente e as preferências do

seu público, as tendências do momento devem ser consideradas. Afinal, elas darão um
toque de atualidade e de modernidade ao material.
Por isso, não deixe de pesquisar o mercado e fique sempre atento às novidades do
Brasil e do mundo. Quanto mais repertório visual você tiver, melhor será o
resultado do seu projeto de design editorial.
## Crie uma hierarquia
Ao colocar a mão na massa e **iniciar o projeto de design editorial, um dos

primeiros fatores a serem considerados é a hierarquia**. Isso significa entender
que algumas partes do conteúdo são mais importantes do que outras e que, por isso,
merecem destaque.
Essa definição será demonstrada por meio do tamanho das fontes, da organização das
imagens e dos blocos de destaque. As áreas em evidência servem como pontos de
atenção e guias para o olhar do leitor.
Esses cuidados devem ser aplicados tanto nos projetos impressos quanto nos
[**materiais para web**].
## Tome cuidado com as fontes
O mercado disponibiliza uma variedade quase que infinita de fontes para os

designers gráficos. Entretanto, nem todas são adequadas para o uso editorial.
É preciso considerar o volume de texto e procurar um tipo que facilite a leitura,

deixando o visual leve e agradável. Nesses casos, as [**fontes serifadas**]
costumam ser mais eficientes, especialmente em projetos impressos.
Já para as versões digitais, é possível considerar as fontes sem serifa para o

corpo do texto.
A dica é simples: teste! Faça protótipos e visualize no navegador ou imprima,

conforme o caso. Analise a qualidade e peça a opinião de outras pessoas.
Faça alterações até encontrar a fonte e o tamanho certo para deixar a leitura
confortável e atrativa.
Além disso, é interessante respeitar as boas práticas de design e evitar o uso de

mais de 2 fontes no projeto. O ideal é ter um tipo para os títulos e outro para o
corpo. Isso ajuda a criar uma identidade visual para a publicação e transmitir o
conteúdo com mais clareza.
## Preste atenção ao alinhamento
Os textos podem ser alinhados à esquerda, à direita, centralizados ou justificados.

Não existe uma regra que diga o que é certo e o que é errado: tudo vai depender da
necessidade do seu projeto de design editorial.
**O alinhamento justificado é o mais comum** e também o mais formal. Ele permite
que as colunas fiquem bem separadas visualmente. O cuidado aqui deve ser o uso da
hifenização correta para que não fiquem “buracos” na diagramação.
Apesar da opção justificada ser mais comum, cresce o uso de [**textos alinhados à
esquerda**], especialmente para a web.
Você pode definir diferentes alinhamentos para áreas específicas. As caixas de

destaque, por exemplo, podem se diferenciar com texto centralizado. O importante é
manter o padrão estabelecido em toda a publicação.
## Garanta o bom espaçamento
Esse é mais um mantra do design gráfico: não tenha medo do espaço branco! Deixar
uma área para o conteúdo “respirar” é essencial. Por isso, não caia na tentação de
acumular muita coisa em uma só página.
É preciso respeitar o espaço entre as colunas, as linhas, assim como entre o texto
e as imagens. São essas quebras visuais que garantem a clareza do conteúdo e ajudam
a tornar a leitura mais agradável.
## Lance mão dos grids
Todos os detalhes de caixas de texto, tamanho das colunas e das imagens devem ser
definidos em um [**grid**]. Ele é um esqueleto padrão da sua publicação e deve ser
mantido em todo o projeto.
Você até pode apresentar algumas variações de número de colunas por páginas, por
exemplo, mas isso deve se justificar por uma mudança importante no conteúdo.
Na construção do grid é que você vai prever os espaços livres, a área destinada às
imagens, aos gráficos e aos textos. Por isso, tenha paciência e seja bastante
detalhista nessa etapa.
Faça testes, na quantidade que for necessária, para garantir o melhor resultado.
## Invista em imagens
As imagens são componentes essenciais de qualquer publicação. Um bom projeto de

design editorial conta, necessariamente, com belas fotos e gráficos.
Se o cliente não possui fotos próprias, é útil contar com um [**banco de

imagens**]. Existem opções pagas e gratuitas — o importante é escolher o que mais
se adapta à realidade do projeto.
Independentemente da maneira como as fotos chegam até você, a sua preocupação deve
ir além do visual. As imagens precisam ter resolução adequada ao seu uso, seja ele
impresso ou digital.
Poucas coisas são tão prejudiciais a um projeto de design editorial quanto imagens
de baixa resolução, distorcidas ou mal tratadas. Por isso, o cuidado na etapa de
manipulação e de fechamento de arquivos é essencial.
## Garanta uma exclusividade
Como falamos na 1ª dica, é importante que o projeto de design editorial seja

adequado à identidade do cliente e às necessidades do público-alvo. Logo, fica
fácil imaginar que copiar outra publicação não é nada interessante, certo?
**Invista em um projeto visual exclusivo**: é a melhor maneira de conseguir a

diferenciação no mercado e o destaque entre os concorrentes. Mas isso não quer
dizer que você precise de recursos totalmente inovadores em cada projeto.
Aposte nos elementos gráficos e nas cores para construir uma identidade única para
o seu trabalho.
## Conheça as ferramentas para design editorial
Por fim, você precisa de conhecimento técnico para poder executar os conceitos de
design definidos para o seu projeto. As ferramentas são o meio pelo qual todas as
ideias são colocadas em prática.
Você pode, por exemplo, procurar por cursos para aumentar as suas [**habilidades no
InDesign**]. Outra opção é investir no seu conhecimento de [**programas como o
Photoshop**], que é uma ferramenta importante para garantir o melhor resultado no
tratamento de imagens.
O mercado do design editorial é amplo e cheio de oportunidades. Se você deseja

fazer parte dele com sucesso, não deixe de buscar sempre por atualização
profissional.
E quando falamos em design editorial,[**uma poderosa ferramenta para utilizarmos na

produção dessas peças é o famoso InDesign**], que conta dom diversos recursos
focados especialmente para esta atividade de diagramação. ;)
Vamos ver **o que é necessário para desenvolver com o flutter e como criar uma
primeira aplicação e entender o básico de tudo**.
Prefere conteúdo em vídeo? Então confere ai o **Alura+** que eu fiz sobre esse post
:)
http://www.youtube.com/watch?v=xSC8j3gl7xM
> Se você ainda não entende direito o que é esse tal de flutter e quer entender
onde ele se encaixa e como ele funciona, da uma olhada nesse outro post aqui:
[Conhecendo o flutter e uma visão do desenvolvimento mobile]
## **Preparando o ambiente**
Vou aproveitar o comecinho aqui para adiantar que não iremos ver como instalar a
ferramenta aqui, sugiro que você siga o passo a passo da sua plataforma conforme
descrito na [**documentação**] super bem escrita do pessoal do flutter, a ideia
aqui é vermos como começar na parte de código somente.
Na essência você também poderia ver esse conteúdo direto na documentação

do [**Flutter no get started**], mas aqui nesse artigo eu tenho algumas dicas e uns
probleminhas que peguei que podem acontecer :)
## **Começando o projeto com Flutter**
Após ter tudo instalado e configurado, rode um **`flutter --version`** em seu

terminal para checar se está tudo certinho:
imagem
Feito isso, se tudo der certo, podemos ver nosso emulador surgindo
imagem**, que será executada como o ponto de entrada da nossa aplicação, ela é
obrigatória no nosso arquivo **main.dart** pois é ela que será executada no
bootstrap da nossa aplicação.
Dentro dela vamos fazer uma chamada para a função **runApp()** que vem do pacote do
flutter e é a responsável por chamar o ponto de entrada principal que vai servir de
base para a estrutura da nossa aplicação e dentro dela passar um **widget** que
veio do nosso import anterior chamado **MaterialApp()** com um atributo home com um
outro widget inserindo um texto dentro, o código fica assim:
js
Salvamos isso no arquivo e … como visualizar? O flutter possui um recurso mega
bacana chamado **Hot Reloading**, seguindo a mesma ideia do recurso famoso do
**React Native** que preserva o state e nos ajuda a simular comportamentos de
navegação complexos para testar bugs ou novas funcionalidades, então para ver as
alterações basta abrir a aba do terminal onde seu projeto esta rodando e apertar a
tecla “r”
imagem para facilitar algumas funcionalidades nas ferramentas.

- **android/ e ios/**: É a pasta que possui uma casca para gerar o APK/IPA dos
aplicativos para que os mesmos sejam publicados nas lojas. Também permite que seja
possível acessar comportamentos específicos das plataformas por meio dos Platform
Channels
- **build/**: É onde fica o build do nosso projeto em Dart, a linguagem que iremos
conhecer em breve quando começarmos a alterar o arquivo da aplicação. Ela é gerada
sempre que rodarmos o comando \`flutter run\`.
- **test/**: É a pasta onde podemos escrever testes para nossas aplicações, em
próximos posts eu irei falar dela com mais calma com toda certeza :)
- **.gitignore**: Já vem configurado com alguns arquivos para serem ignorados na
hora de fazer os commits com o git
- **.metadata**: É um arquivo usado pelo flutter para gerenciar alguns recursos
internos e não devemos mexer nele manualmente. Inclusive ele possui uma mensagem
dizendo exatamente isso, mas o mesmo sempre deve ser versionado junto com o
projeto.
- **pubspec.yml**: É o arquivo onde podemos gerenciar as dependências de um projeto
Dart (similar ao package.json do mundo JavaScript). Caso queira dar uma olhada
sobre como instalar algo deixo o link da documentação
([https://flutter.dev/docs/development/packages-and-plugins/using-packages#package-
versions])
- **.packages**: Esse arquivo faz um mapeamento de onde estão instaladas as
bibliotecas do seu sistema para o sistema de imports do nosso projeto atual, ele é
gerado automaticamente sempre que uma biblioteca nova é instalada
- **helloworld.iml**: É um arquivo criado para facilitar algumas integrações com o
IntelliJ.
- **pubspeck.lock**: É um arquivo usado para gerenciar quais versões as libs das
libs que você está usando estarão utilizando. Quando desenvolver algum pacote
commit ele, quando criar um projeto pessoal
não. [https://www.dartlang.org/guides/libraries/private-files#pubspeclock]
- **README.MD**: Aqui o arquivo não tem nada muito útil, você pode colocar nele
suas primeiras impressões quando for subir seu projeto no github para todo mundo
ver :P
- **lib/: **A pasta lib foi deixada por último porque é nela que vamos escrever o
código da nossa primeira aplicação agora mesmo.
Deixarei [todo o código] que fizemos no github também, caso você queira só baixar e
ver tudo rodando. Se você ficou perdido com algum código principalmente nessa etapa
final fique tranquilo, em próximos posts irei falar mais sobre como a linguagem
**Dart funciona**. No geral, ela é bem familiar com uma mistura de Java com
JavaScript, ou um TypeScript da vida.
Se quiser começar agora, não perca tempo e da uma olhadinha na

documentação: [dartlang] Recomendo ter uma familiaridade trabalhando com
[linguagens Orientadas a Objeto], vai ajudar bastante a entender os conceitos. Veja
mais no início do curso de [flutter].
Por hoje é isso, vejo você no próximo post, Espero que tenha gostado do post, em
breve trarei mais dicas, não deixe de [me seguir nas minhas redes sociais] e
acompanhar meus outros posts em meu site pessoal [https://mariosouto.com] até mais.
## **Referências**
- [https://medium.com/@dev.n/a-flutter-project-has-always-had-ios-and-android-
folders-to-create-ipa-apk-files-for-the-respective-aad215470e46]
- [https://flutter.dev/docs/development/ui/layout]
- [https://flutter.dev/docs/development/ui/widgets]
- [https://flutter.dev/docs/get-started/codelab]
O **Growth Hacking** é um conjunto de técnicas com **foco em experimento**. Se

acordo com Sean Willis, que cunhou o termo, é simplesmente **marketing orientado a
experimentos**. Encontrar oportunidades rápidas que possam trazer ganhos, mesmo que
pequenos. O ideal é que esse ganho seja sustentável, o que muitas vezes não
acontece.
As estratégias mais comuns estão relacionadas realizar pequenos experimentos, por

meio de mudanças em partes isoladas da interface ou produto, pequenas campanhas
específicas em mídia paga ou redes sociais, sempre com objetivo de que os usuários
engajem mais, comprem mais, cliquem mais.
Para isso, é fundamental encontrar um processo que seja fácil priorizar e

documentar todos os possíveis testes de Growth, como é feito, por exemplo, no [ICE
score].
As histórias mais impactantes costumam contar que uma simples troca de cor de botão
gerou um aumento incrível de vendas, mas esse não é o caso comum. Passamos por
vários cases no nosso [curso de Growth Hacking: crescimento para negócios
digitais] e queremos mostrar rapidamente um caso de exemplo:
# Caso de exemplo: clube de assinatura
Vamos considerar um clube de assinatura de chocolates, no qual todos os assinantes

recebem todo mês em suas casas uma seleção dos mais diversos chocolates.
Como é uma empresa que quer aumentar o interesse do público nesse segmento, eles
decidiram que o primeiro mês da assinatura seria gratuito, para que as pessoas
possam testar. Depois, o plano é renovado e os consumidores começam a pagar uma
quantia mensal pelo serviço.
Após um ano de empresa, o número de pessoas que realmente continuavam com o plano
foi diminuindo. De cada 20 pessoas que experimentaram o clube, cinco cancelavam.
Alguns meses depois de feita a assinatura, de cada 20 pessoas, apenas sete
continuavam com o clube.
Mas por que será que isso aconteceu?
# Foco nos dados
A empresa começou a pensar em técnicas que buscassem analisar, com dados, quais
novas estratégias podem ser feitas, por meio de pequenas mudanças na interface e no
produto. Com isso, querem aumentar o número de clientes que assinam o clube e
diminuir a taxa de cancelamentos (**churn rate**) após o período de teste.
# Foco no usuário
E como sabemos quais experimentos fazer? Que tal começarmos a fazer experimentos
relacionados a algo que possa agradar o cliente?
Então, antes de fazer qualquer experimento, focaram no que o usuário busca. Para
saber isso, eles **realizaram pesquisas**, **observaram dados** e **analisaram o
comportamento dos seus clientes** no site do clube e nas redes sociais, como:
- No que clicaram;
- O que liam;
- Para onde iam depois de acessar determinada página;
- Número de adesões ao clube;
- As pessoas que continuavam e as que desistiam.
Uma ferramenta que pode ser utilizada, e que foi empregada nesse projeto, para
medir o comportamento dos clientes é o [**Hotjar**]. Ela é possui uma versão
gratuita, que é limitada, mas permite visualizar onde eles clicam no site, os
locais do site onde ficam com o mouse em cima por mais tempo e a porcentagem de
pessoas que leram além da primeira parte do site, ou seja, que rolaram para ver um
conteúdo mais abaixo.
Em suas pesquisas, **observaram que os usuários não clicavam na chamada** que os

convidada a continuar com o plano de assinaturas logo após o fim do período de
teste.
# Experimentação: testes pequenos e variáveis isoladas
Então, o clube de assinatura decidiu fazer pequenos experimentos em tudo que o

cerca. Desde as redes sociais, com as quais se comunicam com os clientes e lead, o
site, no qual a pessoa começa a assinar, até a plataforma de assinantes.
Esses experimentos serão **pequenas mudanças** em algum desses canais, para

analisar qual trouxe mais adesão depois de modificado.
Para fazer esses experimentos, a empresa determinou um **problema específico** que

estava repelindo os clientes e decidiu realizar o experimento sobre ele.
Um dos problemas identificados foi a [**call to action**] para assinar o clube,

após o primeiro mês gratuito, na plataforma de assinantes, que não estava sendo
clicada pelas pessoas. Analisando, perceberam que ficava difícil de ler com o
background colocado no site.
imagem acerca dele, com os testes ocorrendo um de cada vez, sempre analisando os
resultados dessa modificação depois.
Primeiro, alteraram a cor do título e analisaram o resultado dessa mudança, para

então, testar colocar um filtro para deixar a imagem de fundo mais escura e
analisar novamente seus resultados. Tudo isso com o objetivo de melhorar a chamada,
o que se provou ser o que impedia que os clientes continuassem com a assinatura.
Também realizaram um teste nas redes sociais, analisando o horário em que as

pessoas mais acessam e mudando o horário de publicação. Depois, analisaram quantas
foram atingidas e como reagiram a ela.
![]
A partir do dia 8 de março, que foi quando começaram a agendar as publicações de

acordo com os horários em que os usuários utilizavam o Facebook, o alcance aumentou
e se manteve estável em valores altos e as publicações também passaram a ter mais
envolvimento do público, reagindo, comentando ou compartilhando a publicação.
Essa estratégia representa uma das características do Growth Hacking, a

**experimentação**, que considera **testes pequenos e variáveis isoladas**.
imagem
Na editora em que trabalho, depois de [**definirmos qual conteúdo**] iremos

compartilhar com os clientes, [**por quais canais**] iríamos publicar essas
informações e [**qual linguagem**] usaremos com nossos clientes, começamos a criar
o conteúdo e publicá-lo.
Definimos que é bom termos uma periodicidade, ou seja, uma frequência determinada
de postagens, desde o início de nosso marketing de conteúdo. Dessa forma, sempre
publicamos informações para os nossos clientes para que eles saibam que poderemos
ajudar quando eles precisarem.
Montamos um cronograma, a partir de informações disponibilizadas no Instagram e no

**Facebook** e de uma pesquisa realizada com os nossos clientes sobre o horário no
qual eles mais mexem nas redes sociais.
Dessa forma, determinamos o que deveria ser publicado em cada dia da semana e em
qual horário, enquanto criamos novos conteúdos.
Haveriam posts todos os dias em todas as redes sociais e o tema das publicações
mudaria a cada semana - como curiosidades, novidades e perguntas.
- Duas vezes por semana serem publicados posts no blog sobre novidades ou
curiosidades de um livro;
- Duas vezes por mês, posts de entrevistas com os autores e resenha de uma pessoa
externa.
Por fim, uma vez por semana seria publicado um vídeo no Youtube e uma vez por mês
seria disponibilizado o episódio do podcast.
Colocamos essas informações em uma planilha e ficou assim:

imagem, separando cada um para um canal da editora, e em cada um desses quadros
adicionamos todo o nosso time.
Em cada quadro, organizamos em várias colunas os posts que estão sendo feitos,
sendo cada coluna um momento do post, como escrita, revisão, finalizado, agendado e
o que já tinha sido publicado.
Também, fizemos um quadro geral onde criamos uma coluna para cada pessoa, nas quais
foram colocadas as tarefas a serem feitas por ela ou tarefa que deve ser feita, por
meio de cartões (_cards_).
Cada cartão pode possuir um nome, uma descrição, anexar arquivos e links, além de
permitir definir uma data e horário limite para a finalização da ação que está
naquele cartão, além de outras funcionalidades.
Além disso, é possível mover os cartões pelas colunas, para determinar em qual fase
a tarefa está.
Podemos também adicionar membros aos cartões sendo fácil a visualização de quem é o
responsável por determinada atividade
Podemos estruturar e utilizar da maneira que quisermos, de forma que todos entendam
e consigam se organizar. Pensamos em utilizá-lo criando um quadro para cada canal,
incluindo para cada rede social.
![]
O **Trello** é uma aplicação gratuita mas pode também ser paga, depende do tipo de
funcionalidade a mais que você possa precisar.
Aqui na Alura, para os posts do blog, também usamos o Trello para organizar quais
estão em desenvolvimento, quais estão na revisão, quais foram finalizados,
agendados e publicados.
Caso queira saber mais sobre as funcionalidades do Trello, leia [**este post do
blog da Caelum**] ou então [**essa Alura Live sobre como usar Kanban**] para
organizar os quadros da sua equipe.
## 2 [Google Calendar]
A segunda ferramenta que escolhemos foi o Google Calendar, que já usávamos

individualmente, para criar eventos, convidando outras pessoas, que nos são
lembrados por e-mail e por notificação no celular.
Assim, começamos a criar eventos para as datas limites de cada tarefa e para quando
alguma publicação deveria ir ao ar. Também, passamos a criar eventos para reuniões.
Em todos eles, todas as pessoas da equipe são convidadas por meio de seus e-mails.
Essa ferramenta traz a possibilidade de visualizar o dia, a semana e o mês, e quais

tarefas irão acontecer naquele período, permitindo uma visão a curto e longo prazo
de tudo que deve ser feito.
![]
## 3 [Quire]
Quando pesquisamos por ferramentas para planejamento, descobrimos o Quire. Na

página inicial da conta é possível observar uma lista de tarefas que devem ser
feitas, de forma geral, sem serem separadas. E, quando finalizadas, podem ser
marcadas como finalizadas.
Em cada tarefa adicionamos o responsável, prioridade e data final. Por conta disso,
passamos a utilizar como uma forma de visualizar todas as tarefas a serem feitas,
em todos os canais e em todas as fases. Assim, podíamos ver qual tinha que ser
realizada primeiro e por quem.
![]
Assim como o Trello, ela permite a criação de quadros. Cada quadro já vem com três
colunas: "Para fazer", “Em Progresso” e “Concluída”, seguindo o modelo do Kanban,
que [**você pode aprender nesse curso da Alura**].
## Planejamento nas ferramentas
Gostamos das três ferramentas, e agora, qual delas iremos utilizar? Ou podemos usar
todas?
Para resolver essa dúvida, primeiro utilizamos cada uma em um mês. No próximo mês,
usamos as três ferramentas em conjuntos e deu super certo! Como cada uma tem uma
funcionalidade mais específica, em cada uma delas temos uma noção diferente das
tarefas que temos que realizar.
No Trello ficaria para tarefas mais gerais, como por exemplo fazer uma postagem
sobre um conteúdo específico.
O Quire foi utilizado para tarefas mais detalhadas, como o que deveria ser feito
para que a tarefa geral fosse realizada.
E o Google Calendar usamos para lembretes e avisos de quando as postagens deveriam

ser feitas e marcar nossas reuniões.
Todos os meses, colocamos todas as etapas do processo de criação do conteúdo:
- planejamento;
- pesquisa;
- criação;
- revisão;
- edição
- e publicação.
Depois do mês que usamos as três ferramentas, percebemos que nossa produção e
publicações de conteúdo aumentaram consideravelmente, o que acabou por aumentar
também o engajamento nas nossas redes sociais e cada vez mais pessoas nos seguiam e
interagiam com nossos perfis.
Após vários meses de postagens constantes e seguindo o cronograma, a venda dos

nossos livros cresceu 5%.
Por fim, concluímos que a periodicidade para a publicação de conteúdo é muito

importante porque, sem um intervalo definido ou postagens recentes, as pessoas
perdem o interesse e param de acompanhar.
E a organização e visualização desse intervalo, assim como o planejamento de

postagens só foi possível utilizando essas três ferramentas. E você pode utilizá-
las em conjunto ou experimentar como se sai usando só uma.
Se quiser descobrir outras ferramentas que podem ser usadas pro marketing de
conteúdo, assista [**nosso curso de Marketing de Conteúdo**].
imagem
Muita gente tem um bom senso estético e produz boas composições naturalmente.
Outras pessoas talvez não tenham tanta familiaridade com trabalhos criativos e não
entendam completamente como um designer realiza suas composições com tanta
naturalidade. É claro que a experiência conta: conhecimento em softwares de
criação, prática de desenho, fotografia, vídeo, atuação profissional, etc. Mas o
assunto que tratarei neste post é a **Teoria de Percepção da Forma** – a
**Gestalt**.
Essa teoria da psicologia explica como definimos a forma, apresenta princípios (ou
leis) de composições visuais e também descreve as propriedades da nossa percepção.
Portanto, a Gestalt é um dos principais recursos para justificar as composições
visuais e também para identificar questões que podem ser corrigidas ou melhoradas
em uma criação.
O que é “forma”? É o estado físico em que se apresenta um corpo, um objeto. Mas

como se define “forma”? Christian von Ehrenfels propôs pela primeira vez em 1890,
na Universidade de Graz (Áustria), os conceitos de Supersoma e Transponibilidade, a
fim de defini-la.
![supersoma]
Supersoma é o conceito de que não se pode ter ideia do “todo” somente pelas partes
que o constituem. Já Transponibilidade é o conceito de que identificamos as formas
independentemente das suas características e peculiaridades: uma mesa é uma mesa,
não importa se é de vidro, madeira, metal, retangular, redonda – é uma mesa. Então,
temos os meios para definir o que é forma.
![transponibilidade]
**A partir dessa definição de forma, Max Wertheimer, Wolfgang Köhler e Kurt Koffka
desenvolveram a Teoria Gestaltista com uma série de princípios, também chamados de
leis, que serviriam para justificar, corrigir, melhorar e gerar composições
visuais. As leis definem questões que muitas vezes parecem óbvias, mas na verdade
não são tão simples assim. A explicação de espaçarmos, aproximarmos, diferenciarmos
ou atribuirmos características semelhantes e distribuirmos os elementos
uniformemente em uma composição está em cada uma das Leis da Gestalt. Ao respeitá-
las, temos certeza da realização de uma boa composição.**
A Gestalt também define as propriedades da nossa percepção, que são as diferentes

características da nossa interpretação das formas. De acordo com a propriedade da
Invariância, identificamos a forma independentemente da sua posição, rotação,
disposição e distorção – conseguimos identificá-la sob diferentes condições.
Existem mais propriedades que servem para explicar outras situações: por que só
identificamos as formas sob determinada distância, por que uma forma pode
transmitir diferentes informações e ideias, ou por que identificamos a forma em
espaços de uma composição que não estão preenchidos.
Este é um assunto fundamental para arquitetos, artistas plásticos, estilistas,

publicitários, designers e qualquer outro profissional que trabalhe com a criação
de composições. A Gestalt define o que é forma; suas leis orientam a criação e
possibilitam que o profissional justifique seu trabalho com argumentação e
embasamento; e a noção das propriedades da percepção permite desenvolver trabalhos
que possuam informações não tão óbvias, múltiplas informações ou significados
implícitos.
**Quer saber mais sobre a Gestalt? Acesse meu curso no Alura: [Gestalt:

desmistificando o Design]**
Quando estamos trabalhando em um projeto de interface, depois de entender e estudar

nosso problema/ideia, chega um momento que precisamos materializar as nossas
soluções.
No mercado, se percebe (não é regra) o hábito de ir direto para os wireframes de

alta fidelidade. Não chega a ser um problema, mas há outros caminhos e um deles é
começar a desenhar em papel.
A vantagem de desenhar em papel é que, além de ser mais rápido, “rabiscar” no papel
também possibilita que todos da equipe (não apenas designers) possam contribuir e
compartilhar suas ideias e ajudar a conceber a solução, evitando retrabalhos e idas
e vindas em um wireframe de alta fidelidade. Uma técnica que busca juntar a
informalidade e rapidez do rabiscoframe com um geração de ideias é chamada [8
steps] (ou crazy eights).
**8 Steps ou Crazy Eights** é uma técnica adaptada do [gamestorming] que se chama
[“6-8-5”]. Essa técnica ganhou fama através do *Design Sprint* (processo criado
pela Google Ventures para responder questões críticas de negócios através de
design, prototipagem e teste das ideias), pois nele o 8 steps foi adotado como o
ponta pé inicial do processo de materializar ideias sobre um produto no papel.
> ### A ideia do 8 steps é ajudar o time a sair da sua zona de conforto e das
ideias mais óbvias.
Naturalmente, temos uma forte tendência a ficar com as primeiras ideias que temos,
ao invés, de tomar um tempo para explorar abordagens complementares. Essa técnica é
projetada justamente para combater esse padrão, pois ajuda o time a gerar muitas
ideias, sem se preocupar com os detalhes ou implementação de qualquer ideia em
particular.
Além disso, essa técnica também funciona como um bom exercício de aquecimento para
levar o time envolvido a pensar visualmente e tomar consciência do poder do
pensamento visual para representar informações.
Embora você vai estar gerando ideias, não pense nisso como o brainstorming, pelo
menos não do tipo que todo mundo está conversando e interagindo. Em vez disso, em
um primeiro momento, todos da equipe estarão trabalhando silenciosamente e
individualmente, muitas vezes em torno da mesma mesa.
> ### Basicamente, cada indivíduo do time é convidado a esboçar 8 ideias em 5

minutos.
Sim, se você já fez as contas, isso é cerca de 40 segundos por esboço, o que é um
pouco “crazy“, mas ao mesmo tempo é uma ótima maneira de “obrigar” você a desligar
a auto-edição e apenas colocar suas ideias no papel.
Vale destacar também, que não é um storyboard ou um fluxo de navegação, as ideias

não precisam estar em sequencia ou contar uma narrativa coesa. Na verdade, o foco é
gerar 8 ideias totalmente diferentes, de forma rápida e visual para o seu
produto/ideia.
Você pode estar se perguntando? E se eu não tiver 8 ideias? Se isso acontecer e

você se sentir preso, tente repetir um dos esboços anteriores com uma pequena
variação, esse tipo de exploração é útil e mantêm você em movimento.
Com o tempo e prática, você percebe que você estará mais relaxado e automaticamente
se torna mais produtivo em dinâmicas como essa, apenas deixando fluir suas ideias.
imagem
Aqui no [curso de UX da Caelum], trabalhamos com dois tipos de gamestorming para 8

steps. O primeiro, conhecido por “Momentos chaves”, é indicado para quando estamos
em um processo muito inicial do nosso produto/ideia e ainda estamos buscando
entender nosso problema. Entenda que por “momentos-chave”, estamos nos referindo as
diferentes experiências possíveis e interações que o usuário tem com o software.
Um momento pode ser uma tela propriamente dita, ou uma interação (o usuário vai
clicar, vai dar zoom, vai deslizar o dedo sobre a tela?) ou ainda um caso de uso
(onde o seu usuário vai estar usando o seu produto? Quando que o seu produto vai
intervir na vida do usuário?).
Já o outro, *8 steps*, elimina os casos de uso e interações e foca mais na

concepção da telas propriamente dito. Esse segundo é usado normalmente, quando
temos uma ideia mais clara do nosso produto/ideia e já conseguimos imaginar como
nossa aplicação vai funcionar.
Para obter melhores resultados, sempre tente aplicar pelo menos duas rodadas do
Crazy Eights. Com certeza, na segunda rodada, a equipe vai sofrer mais para gerar
as 8 novas ideias.
Fazendo uma analogia rápida, é como se a gente tivesse raspando o fundo do pote, o
que torna tudo mais doloroso para se conseguir novas ideias. No geral, na primeira
rodada os participantes vão gastar as suas oito ideias mais óbvias.
A segunda rodada é, justamente, para reforçar a questão de sair da zona de conforto

e fazer cada participante buscar ideais mais inovadoras.
Vale destacar que não significa que você vai abandonar as ideias antigas, elas
tendem a vir na sua mente por serem mais fortes, mas vale uma segunda rodada
justamente para poder ir além do óbvio e ter mais opções e situações para se
analisar sobre o projeto/ideia.
# Gamestorming – 8 steps – Momentos chaves
## Objetivo
Materializar as ideias (telas, caso de uso e interação) que temos sobre o nosso
aplicativo no papel de forma rápida e visual.
## Ambiente
* As ideias/histórias/cenários descritos nos gamestorming anteriores.

* Folha A3
* Canetinhas
* Regras
Duração de 5 minutos;
Cada integrante do time deve fazer um 8 steps mesmo sem habilidades artísticas.
# Passo a Passo para o Crazy Eights
Distribua folha A3 em branco e canetas para todos os participantes.

Faça com que todos dobrem a folha de papel 3 vezes de modo que todos eles tenham a
folha divida em 8 pedaços.
Peça à equipe que desdobre o papel e observe a grade de 8 retângulos foi criada.
Dê 5 minutos no total para desenhar oito momentos chaves, uma média de 40 segundos
para cada quadro.
Ao longo do exercício continue a lembrar as pessoas do tempo e se certificar de que
está claro o que elas devem esboçar
Repita conforme necessário.
Obs: Lembre-se que você pode aplicar esse mesmo *gamestorming* desconsiderando
casos de uso e interação e apenas focado em telas quando sua equipe já tem uma
ideia mais clara do que estão criando.
Uma vez que o *gamestorming* está finalizado, convide cada participante para
compartilhar seus esboços favoritos, obter feedback do seu time e definirem quais
steps são fundamentais para o seu produto/ideia funcionar. Aqui, por exemplo, pode-
se usar a técnica do zen-voting para fazer a seleção final.
Como um **podcast** é em forma de conversa, compensa criarmos um roteiro? Ou uma

organização das ideias seria melhor, já que queremos dividir a tarefa de falar
essas informações entre os dois?
Seria legal se a gente tivesse algo mais estruturado, pelo menos para o começo do
episódio, para dividirmos as falas e sabermos quais tópicos viriam em seguida, né?
Por isso, vamos montar um **roteiro estruturado**. Assim, iniciamos um rascunho da

estrutura do roteiro.
Começamos escrevendo quais informações seriam lidas por quem, já que queremos
apresentar a voz de ambos para o público, já nessas informações iniciais sobre o
livro. Mas, achamos que fica chato para o ouvinte as informações serem apresentadas
de qualquer forma, sem um ritmo ou um texto mais bonitinho.
Assim, decidimos elaborar alguns parágrafos mais organizados com os dados do livro.
Neles, escrevemos exatamente o que falaríamos, em letras maiúsculas, pois fica mais
fácil de ler enquanto estivermos gravando.
Marcamos as pausas com uma barra “/” para sabermos quando fazer uma pequena pausa
no meio do texto e não trazer aquela sensação de algo que foi falado correndo só
porque precisa ser falado. Queremos enfatizar as informações porque as achamos
importantes.
Também marcamos os pontos finais com duas barras “//” para indicar que, naquela
parte, o texto deve ser finalizado e possuir uma pausa um pouco maior, para mostrar
que o assunto está mudando.
Depois, pensamos no debate que será feito no episódio. As nossas conversas sobre
livro sempre levam horas, porém, não podemos deixar o episódio muito longo. Como
poderíamos resolver isso? Queremos que as falas tenham ritmo de conversa, mas com
uma certa linearidade de ideias.
Então, escolhemos os tópicos que queremos abordar e os colocamos depois das
informações do livro, sem uma fala definida, só o tópico, para que vejamos a
respeito do que falaremos a seguir.
Esses assuntos são como a autora começa o livro, apresentando a história do

personagem principal, logo após o evento que será destaque em toda a saga, a
apresentação do mundo, que é apresentado ao leitor ao mesmo tempo que é apresentado
ao protagonista.
Por fim, gostaríamos de falar sobre como vemos a leitura desse livro para a
classificação indicativa, já que é um livro infanto-juvenil, e como foi nossa
experiência pessoal quando lemos pela primeira vez, ainda crianças, as dificuldades
que encontramos e momentos que mais nos marcaram. Com isso, desenvolvemos um
**roteiro para estruturar o episódio**.
E agora como montar todas essas informações?
# Roteiro para podcast
Optamos por montar uma tabela, que deixa separado cada parte, de quem fala e
vinheta, para a fala e os tópicos, e fica mais organizado.
### Roteiro
> **Apresentador 1** (A1), BEM-VINDOS AO PRIMEIRO EPISÓDIO DA LEITURA ALÉM //
Apresentação da pessoa
> **Apresentador 2** (A2), EU SOU / Apresentação da pessoa // E O LIVRO ESCOLHIDO

PARA DISCUTIRMOS NESTE PRIMEIRO EPISÓDIO É O HARRY POTTER E A PEDRA FILOSOFAL
> A1, O LIVRO ESCRITO PELA AUTORA J.K. ROWLING / FOI LANÇADO ORIGINALMENTE EM 1997
NO REINO UNIDO //
> A2, E FOI LANÇADO NO BRASIL / NO ANO 2000 / PELA EDITORA ROCCO // A EDIÇÃO
BRASILEIRA CONTA COM 264 PÁGINAS / ENQUANTO A BRITÂNICA POSSUI 223 // E MAIS UMA
VEZ / BEM VINDOS AO LEITURA ALÉM
### Vinheta de abertura
A1 e A2, Discussão sobre o livro.
Principais tópicos:
- Começo do livro; Apresentação do Harry;
- Morte dos pais do Harry e tentativa da morte dele;
- Apresentação dos outros personagens;
- Introdução ao mundo bruxo;
- Livro infantil?;
- Nossas impressões quando lemos pela primeira vez;
- dificuldades;
- o que marcou
Então, estruturamos o roteiro base desta maneira, para apresentá-lo de uma forma
geral, para ser seguido na maioria dos episódios.
# Um roteiro para cada tipo de podcast
A maneira como o roteiro base é estruturado é de acordo com a forma em que as

pessoas querem apresentar o podcast.
Dependendo do formato e estilo, se for completamente uma conversa, muitas vezes nem
é necessário um roteiro, somente uma **lista com os tópicos** que podem ser
abordados, para uma **condução melhor dos temas**.
Caso seja com um **texto fixo** para cada episódio, como o podcast [Escriba Café],
no qual um texto a respeito do assunto é falado, um roteiro estruturado, no qual
estão as **falas exatas que devem ser feitas, é bom para o locutor saber o que
falar e, ainda, em quais momentos teria uma pausa, uma música, efeito sonoro ou
vinheta.**
Também existem podcasts em que acontece uma entrevista com **diversos convidados
sobre determinado assunto**,como no [Mamilos Podcast].
Nele você pode não escrever um roteiro,podendo escrever apenas as informações e

perguntas principais, que os produtores e apresentadores querem que sejam
abordadas.
Para o nosso podcast sobre livros, escolhemos seguir um roteiro pré-estruturado,

para que saibamos a parte das informações dos livros e quais tópicos definimos e
que gostaríamos de abordar, para não nos perdermos completamente na conversa.
Mas no fim das contas, nem todo podcast precisa seguir um roteiro totalmente
estruturado,que mostre exatamente o que deve conter no áudio do episódio, como o
que usamos para o começo do nosso, ou até mesmo, nem todo podcast precisa de
roteiro. Isso vai de acordo com o objetivo dos produtos e do formato definido.
Tanto no [**marketing de conteúdo**] quanto no [**inbound marketing**], os podcasts

são uma ótima forma de trazer informações aos seus clientes, mantendo contato e até
os fidelizando.
No nosso podcast, que queremos trazer uma **fala mais definida**, ao menos do
começo dele, achamos importante fazer uma pesquisa e definir um roteiro com um
conteúdo.
Aqui na **Alura**, também temos um podcast sobre diversos assuntos em tecnologia,

marketing e outras modinhas, [**o Hipster ponto Tech**]. Além de um [curso] e um
[livro] sobre Marketing de Conteúdo, onde você aprenderá sobre diversas maneiras e
canais para fazer um bom marketing de conteúdo.
imagem
Estava em um sala aqui na Alura com o meu notebook. Quando mudei de sala, meu
notebook não se conectava ao Wi-Fi dessa sala, mas o de todos os outros sim… Por
que só o meu não conecta? :’(
Podemos pensar que é algum problema com a minha placa de rede sem fio, porém estou
conseguindo listar outras redes e conectar a elas. Apenas essa rede não é listada e
nem consigo me conectar.
Então, por que eu não consigo me conectar?
As redes sem fio têm diferentes especificações, isto é, cada rede funciona sobre um
padrão (ou mais de um) específico. Caso no local exista um padrão que a rede não
reconheça, não existirá conexão.
Para resolver meu problema, preciso antes entender quais são esses padrões.
## Entendendo os padrões de Wi-Fi
Existem alguns padrões de rede sem fio como: 802.11a, 802.11b, 802.11g, 802.11n.
Cada um funciona sobre uma frequência diferentes, alguns na faixa de 2,4 GHz
(Gigahertz), outros na faixa de 5 GHz. Se essas frequências forem diferentes uma
rede não consegue ver a outra.
Mas, bem, vamos falar desses padrões...
### O padrão 802.11a e sua grande velocidade
O padrão 802.11**a** consegue atingir uma velocidade de transferência de 54 Mbps, e

trabalha com uma frequência de 5 GHz
Contudo, por conta de sua frequência, os dispositivos que utilizam esse padrão têm
um preço maior do que o seu padrão irmão (o 802.11b). Por esse motivo, essa
tecnologia foi pouco adotada, principalmente em redes domésticas.
Sua frequência também tem um impacto em dispositivos móveis. Como esse padrão tem
uma maior frequência, o consumo de bateria é maior.
### O popular 802.11b
Devido ao seu preço ser mais baixo, o padrão 802.11**b** foi, e ainda é, muito mais
usado que o anterior, principalmente em redes domésticas, entretanto, sua
velocidade é menor que a anterior, alcançando 11 Mbps.
Sua frequência também é menor que a anterior, fica na faixa de 2,4 GHz. Logo, ele
consome menos energia que o anterior, o que significa uma economia de bateria para
Muito bem, ele não consome muita bateria e é mais barato, mas além da velocidade,
esse padrão tem algum ponto negativo?
Esse padrão também tem alguns inconvenientes, entre eles:
- Por trabalhar em uma frequência diferente do padrão 802.11a, os dois são

incompatíveis;
- Essa frequência é a mesma de outros aparelhos domésticos, como telefones sem fio
e microondas, o que causa interferências no sinal.
Mesmo assim, essa tecnologia foi bem aceita, tanto que algum tempo depois foi
desenvolvida outra que visava manter esses benefícios e trazer algo mais: uma
velocidade de transferência maior.
### Surge o 802.11g
Visando manter os benefícios do padrão 802.11b, , foi criado o padrão 802.11**g**.

Assim como o anterior, ele trabalha na faixa de 2,4 Ghz, o que gera uma economia de
bateria em relação ao 802.11a, e traz uma velocidade de 54 Mbps assim como este.
Por ter a mesma frequência que o 802.11b, uma tecnologia é [**compatível**] com a
outra e, por consequência, possui os mesmos problemas relacionados a interferência
do sinal.
Analisando a velocidade desse padrão você pode estar se perguntando:
> _"As redes sem fio não conseguem passar dessa velocidade de transferência?"_
Com as tecnologias de antigamente, não, porém nos dias de hoje lançaram outro
padrão: o 802.11**n**.
### O rápido 802.11n
Esse padrão consegue atingir uma velocidade de até 300 Mbps. Contudo, esse não é
seu único diferencial em relação aos outros:
- O alcance do sinal é melhor;

- Seu sinal é mais estável;
- Compatível com outros padrões.
Tudo isso graças a uma tecnologia chamada [**MIMO**]. Essa tecnologia permite ter
múltiplas entradas e múltiplas saídas para os dados. Com ela, aumentamos a
velocidade do Wi-Fi, seu alcance e estabilidade. Esse padrão também tem
compatibilidade com os padrões anteriores.
Alguns roteadores têm a opção de escolher em qual padrão trabalhar, outros podem
trabalhar em mais de um modo ao mesmo tempo. Sabendo disso, podemos ir até a
configuração do Wi-Fi e escolher aquela que melhor nos atende atende.
imagem.
Apesar dos dispositivos sem fio terem essas velocidades máximas, dificilmente eles
a atingem por causa de alguns problemas como [**overhead**]).
## Problema Resolvido!
Não conseguia conectar meu laptop na rede sem fio de outra sala aqui na Alura,
vimos que a causa disso era a incompatibilidade entre os padrões.
Entendemos o que são os padrões, como eles funcionam, suas velocidades de

transferência e como colocar o roteador para aceitar mais de um padrão.
Gostou de saber sobre Wi-Fi? Essa é só uma pequena parte do vasto mundo de redes.
Aqui na Alura temos uma [**formação em redes de computadores**]. Nela você
aprenderá sobre os conceitos e como montar uma rede corporativa, com tecnologias
como VLans e IPv6, além de técnicas de segurança.
O marketing digital é uma grande área de especialização muitas vezes inexplorada

por quem está [prestes a começar sua carreira].
A verdade é que nenhuma estratégia de marketing se sustenta sem comunicação visual,

e a procura por designers na área só cresce a cada ano.
Se você se interessa e quer saber mais sobre o assunto, nós te ajudamos a dar os
primeiros passos para ser um profissional de design para marketing digital.
## Por que o design é tão importante para o marketing digital?
O objetivo do [**marketing digital**] é promover produtos e marcas por meio de

mídias digitais, principalmente a internet. Para isso, uma estratégia bem
desenvolvida é aquela que atrai, informa, converte e encanta o público para
transformá-lo em um cliente fidelizado e engajado.
Você já identificou onde entra o seu trabalho de design nessa história? A
comunicação visual é fundamental para o marketing digital. O design gráfico é a
forma de apresentar o conteúdo e guiar o usuário para o próximo passo sem que ele
se perca ou desista no caminho.
## Por que aliar beleza e funcionalidade?
O design sempre foi um casamento entre forma e função, mas no marketing digital a
segunda parte ganha um pouco mais de destaque.
O encantamento visual é muito importante para atração e compartilhamento de um

produto ou marca, mas esse é um esforço desperdiçado caso o designer não consiga
guiar o público para uma próxima etapa de conversão.
Se você se interessa e pretende trabalhar nessa área, deve prestar muita atenção
para a usabilidade do seu trabalho. É uma questão de descobrir como fazer o usuário
navegar pelo conteúdo e instigá-lo a clicar no botão certo, na hora certa.
## Quais são as melhores práticas de design para marketing digital?
Certo, você entendeu a importância da sua profissão para o marketing digital. Mas
como colocar em prática o seu design para trabalhar nessa área? É o que vamos
mostrar agora.
### Sites
É claro que o site de um produto ou marca é o centro da estratégia de marketing

digital. [**O designer contratado para cuidar dessa área**] costuma se preocupar
muito com a navegação e exposição da marca, para facilitar a conversão de usuários
em clientes.
Isso significa criar Landing Pages atraentes e que mostrem tudo o que ele precisa
saber imediatamente. Deve conter chamadas destacadas, descrições bem diagramadas
para fácil leitura e imagens atraentes.
Caso a conversão seja feita em várias etapas, também é necessário pensar em todo o
fluxo do processo. Dessa maneira, pode-se usar formulários intuitivos, navegação
bem sinalizada e dicas visuais pelo percurso.
### Blogs
Uma estratégia bastante presente hoje nos planejamentos de marketing pelo mundo é o
marketing de conteúdo. Ao contrário da mídia tradicional, que expõe a marca para um
público geral de forma uniforme, essa estratégia é uma forma de oferecer às pessoas
um conteúdo relevante na hora certa para que os clientes venham até a empresa por
conta própria.
No centro do marketing de conteúdo está o [**uso de blogs**], que necessitam de um

designer para uma diagramação focada em conversão. O design de blogs deve valorizar
o conteúdo e garantir a facilidade da leitura, para depois guiar o usuário
intuitivamente a se aprofundar mais naquele produto ou marca.
### Imagens para redes sociais
Outro alicerce do marketing digital é o engajamento do público por meio das redes
sociais. Hoje em dia, não se faz esse trabalho sem a ajuda de um designer.
Todas as empresas já perceberam que a [**comunicação por meio de imagens**],

vídeos, infográficos e animações tem uma chance muito maior de atingir o público e
gerar compartilhamentos do que apenas o texto sozinho.
Seja em uma capa de Facebook, uma imagem para o Instagram ou um GIF para o Twitter,
uma campanha de marketing digital bem-sucedida sabe criar uma linguagem visual
própria e aplicá-la em suas redes sociais. Todo designer interessado nessa área
adora este tipo de desafio.
### E-mail marketing
Design para e-mail? Sim! O e-mail não é só uma ferramenta muito importante para
estratégias de marketing digital, como a atuação de um designer nessa peça em
específico pode alavancar as conversões de uma empresa.
O importante aqui é que o profissional saiba criar um design simples, porém

impactante, que chame a atenção em um segundo e não deixe que o usuário feche a
mensagem.
Outra [**característica do e-mail marketing**] que exige um designer atento e

interessado é a forma como os e-mails são lidos. As plataformas mobile se tornaram
quase onipresentes para pessoas que checam suas mensagens o dia inteiro.
Por isso, as práticas de design responsivo são indispensáveis para não atrapalhar a
experiência de atração da marca. Independentemente de como o seu cliente abra a
caixa de entrada do e-mail dele, o conteúdo de sua marca tem que estar lá, limpo,
claro, objetivo e passando a mensagem para o qual foi criado.
### Call to action
Em todas as situações acima, o trabalho mais importante de um designer no marketing

digital é criar os chamados **"Call to action" (Chamado Para a Ação — CTA)** da
melhor forma para atrair e converter clientes.
Um CTA pode ser um link, um botão para cadastro, um formulário para capturar e-
mails, um bom e velho "Compre agora!" ou qualquer chamada que instigue o usuário a
tomar uma ação para se aproximar mais de consumir uma marca ou produto.
Essa é uma tarefa essencial de um designer, demanda muito estudo e várias

tentativas. Dependendo da natureza do público-alvo e do seu comportamento na
internet, é preciso testar formas, tamanhos, cores e o posicionamento de CTAs para
encontrar o mais eficiente em atrair cliques.
O design para marketing digital é uma área [**repleta de desafios**] para o

profissional que está começando a sua carreira. Precisa de pessoas que gostem de
estar o tempo todo testando novas possibilidades e criando novas formas de se
comunicar visualmente.
Esse é o seu caso? Então compartilhe este artigo no Facebook e no Twitter e quem
sabe você não começa a criar uma rede de contatos com profissionais tão
interessados quanto você!
No desenvolvimento de qualquer sistema, é muito comum lidarmos com **listas**, como

por exemplo, uma lista de produtos. Suponhamos que tenhamos a seguinte
representação de um produto:
python
Então temos uma lista com alguns produtos:
python
Se executarmos esse código, temos o seguinte resultado:
python
Por enquanto, tudo ocorrendo conforme o esperado, mas, e se quisermos adicionar um

novo produto nessa lista? Como podemos fazer isso? Nas listas do **Python**,
existem duas funções capazes de **adicionar elementos**, que são a **àppend`** e a
**èxtend`**. Vamos então testá-las! Começaremos pelo àppend`:
python
Vejamos qual é o resultado:
python
Aparentemente ocorreu tudo conforme o esperado. Então vamos testar a função

èxtend`:
python
Opa! Parece que o èxtend` não consegue adicionar um objeto na lista... Será mesmo?
Se analisarmos a mensagem de erro, ela nos informa que o objeto do tipo "Produto"
não é **_iterable_**, mas o que será que isso significa?
O èxtend`, diferente do àppend`, itera sobre o elemento que deseja adicionar, ou

seja, envolve o argumento passado por parâmetro dentro de um laço, e então,
adiciona os valores contidos dentro desse parâmetro, nesse caso, ele tentou fazer
isso com o objeto do tipo Produto. É justamente por isso que não foi possível
adicionar o objeto do tipo Produto e apresentou esse erro.
> Então significa que não podemos utilizar o èxtend` para adicionar objetos?
Não exatamente!
Uma solução para esse problema é, ao invés de enviar um objeto puro, mandar como
parâmetro uma **estrutura iterável** que contenha um objeto do tipo "Produto", ou
seja, enviar uma lista que contenha um Produto!
python
Será que agora funciona? Vejamos o resultado:
python
Funcionou como o esperado! Entretanto, adicionamos apenas um único elemento! E se

quiséssemos adicionar vários elementos? Em outras palavras, adicionar uma lista de
produtos novos. Será que funcionaria sem nenhum problema? Vamos testar primeiro com
o àppend`:
java
Testando o código temos o seguinte resultado:
python
**Aparentemente funcionou**, mas repara que ao invés de adicionar cada produto na
lista de produtos, ele adicionou uma lista inteira! Ou seja, quando utilizamos o
àppend` ele simplesmente adiciona o **valor completo na lista**. Mas e se
utilizarmos o èxtend`? Será que funciona? Isto é, adiciona produto por produto?
Vamos verificar:
python
Rodando novamente o código:
python
Funcionou conforme o esperado! Portanto concluímos que as duas funções funcionam da

seguinte forma:
- **append**: Adiciona qualquer valor **completo**, por exemplo, se enviarmos um

objeto, ele adiciona o objeto, se enviarmos uma lista, ele adiciona a lista inteira
ao invés de seus itens.
- **extend**: Adiciona itens de uma **estrutura iterável**, por exemplo, se
enviarmos um objeto puro, ele não sabe como adicionar, porém, se enviarmos esse
mesmo objeto dentro de uma lista, ele varrerá a lista e adicionará esse objeto e,
caso exista outros, os demais dentro da lista.
Podemos ver claramente a diferença entre as duas funções no momento que tentamos
adicionar uma string, por exemplo, a string "chocolate":
- **Append:**
python
Resultado do àppend`:
python
* **Extend:**
python
Resultado do èxtend`:
python
Veja que, enquanto o àppend` adicionou toda a string, o èxtend` adicionou letra
por letra, pois a string, por de trás dos panos, é um array de **`char`**,
portanto, ele varre esse array, isto é, essa estrutura iterável, e adiciona cada
item.
Sabia dessa diferença no momento de adicionar algum elemento nas listas do Python?
Não sabia? Quer aprender mais? Então dê uma olhada na nossa [**formação de Python
para web**] na Alura e aprenda hoje mesmo os diversos recursos que essa linguagem
nos oferece!
Como podemos criar uma vaixa de dialogo no **android**?
No post onde vimos como criar [**context menu**], criamos um menu de deletar um
curso da lista, ou melhor, um item da lista. Para isso criamos o método `deletar()`
que recebe a posição do curso, e então, deleta o curso a partir da posição:
java
A princípio, esse método está perfeito, porém, uma funcionalidade de **deletar é

algo perigoso**, pois o usuário, de fato, perde a informação! Portanto, a boa
prática é fazer com que o usuário tenha ciência do que está preste a fazer.
Em outras palavras, precisamos, de alguma forma, **alertar o usuário que a sua ação
é perigosa!** Como podemos chamar a atenção do usuário? Podemos tentar adicionar
uma janela de confirmação. Algo próximo do exemplo a baixo:
imagem` que nos permite adicionar um título ao dialog:
java
Mas o nosso dialog tem apenas um título? Ele também precisa de uma mensagem, certo?
Porém, não referenciamos essa instância para um objeto, então como podemos
adicionar uma mensagem?
O legal dos métodos do ÀlertDialog.Builder` é que eles devolvem o próprio objeto,

ou seja, podemos chamar mais de um método ao mesmo tempo. Portanto, vamos também
chamar o método `setMessage()`:
java
Agora que o nosso dialog tem um título e mensagem, basta apenas exibí-lo! Para
isso, finalizamos as chamadas de métodos com o método `show()`:
java
Vamos rodar a nossa App e verificar o resultado:
imagem`:
java
Porém, precisamos enviar 2 parâmetros:
- **1º parâmetro:** texto que será exibido para esse botão.

- **2º parâmetro:** ação após tocá-lo.
Então daremos o nome para esse botão de "sim":
java
Para adicionarmos uma ação, precisamos implementar a interface

`DialogInterface.OnClickListener`, faremos isso da mesma forma como costumamos ver
nos outros listener do Android, ou seja, pelo recurso de classe anônima:
java
Quando o usuário tocar no "sim", o que deve acontecer? deletar o curso né?
Portanto, adicionaremos o código que deleta o curso dentro do ònClick()`
java
Outro erro de compilação!? Agora na linha `listaDeCursos.remove(position);` Por que

será? :(
Já que a variável `position` está fora do escopo da implementação do

`DialogInterface.OnClickListener()`, precisamos deixá-la como `final`, ou seja,
basta apenas modificarmos no parâmetro do método `deletar()`:
java
Já podemos testar, porém, antes de executar a nossa App, precisamos pensar na
seguinte questão:
- E se o usuário não querer deletar?
E então? Como o usuário faz pra não deletar sem tocar no botão "back" do Android?
Por enquanto não demos essa opção pra ele. Então vamos adicionar também esse botão!
Da mesma forma que existe o método `setPositiveButton()`, também existe o seu

oposto, ou seja, o `setNegativeButton()` que recebe os mesmos parâmetros do
`setPositiveButton()`. Então vamos utilizá-lo enviando o primeiro parâmetro com o
valor "não":
java
Porém, lembra que também precisamos adicionar uma ação para o botão? Pois é, qual
ação daremos para ele? A princípio, nenhuma, mas como informamos isso? Simples!
basta apenas enviar um `null`:
java
Rodando a nossa App novamente, temos o seguinte resultado:
![mostrando_opcoes_do_alertdialog]
Veja que agora alertamos o usuário e ainda mostramos quais opções ele pode
escolher, isto é, se ele quer confirmar ou cancelar a determinada ação!
Nesse post vimos como podemos interagir com o usuário a partir de um dialog. A
partir do dialog, podemos mostrar tipo de mensagem de alerta que permite que o
usuário confirme ou não alguma ação que está acontecendo.
Que tal aprender a desenvolver para Android hoje mesmo? Na Alura, temos uma
[**formação Android**], onde você aprende desde os conceitos mais básicos aos
avançados.
As capacidades de aprender e de reaprender se tornam cada vez mais essenciais em um

cenário de mudanças rápidas de tecnologia. As *hard skills* de hoje não são as
mesmas de amanhã.
Quantas vezes você precisou que alguém da sua equipe adquirisse novos conhecimentos
técnicos em um projeto ou até mesmo mudasse quase que completamente de ferramentas
e tecnologias?
# O Mundo VUCA
VUCA já se tornou um buzzword, mas parece que veio pra ficar.
> “Volatile, Uncertain, Complex and Ambiguous”
E em um ambiente como esse, fica ainda mais difícil de saber que capacidades
precisaremos amanhã. Um ambiente mais colaborativo, de fácil acesso a informação,
cursos, conteúdo, onde todos possam ficar atualizado no que *cada um* considera
importante para seu trabalho, é um ambiente cada vez mais buscado.
# Modo focado e modo difuso
Em estudos mais recentes, Barbara Oakley, neurocientista conhecida no campo da

educação, aponta que duas formas são comumente utilizadas em um aprendizado
eficiente...
Não é à toa que utilizamos diversos canais, algumas vezes simultâneos, para
adquirir conhecimento de um tema.
imagem
# Universidade Corporativa
A universidade corporativa precisa expandir seu espaço e derrubar paredes, assim

como as universidades tradicionais tem feito. Envolver os colaboradores no processo
de aprendizado e mostrar que isso faz parte do trabalho.
Se você busca um ambiente assim, com facilidade para desenvolver os indivíduos em

habilidades de tecnologia e negócios digitais, ficaremos contentes em conversar. E
não deixe também de ler X e Y sobre isso e ouvir um podcast Z sobre inovação e ver
essa entrevista W no youtube.
Repare que a sua própria jornada para entender mais sobre o lifelong learning e a
universidade corporativa passa por diversos tipos de media e também no
difuso/focado. É disso que a [**Alura**] entende.
Mas afinal, do que se trata este produto? Como ele é? Ou ainda, por que eu iria
comprá-lo se não faço a menor ideia do que ou como é?
Temos a seguinte imagem:
imagem.
Ao utilizar os microtextos reduzimos as chances da informação chegar ambígua ou

confusa. Veja um outro exemplo comum, utilizado em formulários:
![]
Perceba que nos próprios campos do formulário temos uma dica explicando mais
claramente do que se trata, como "Escolha um nome de usuário", “Seu endereço de e-
mail” e “Crie uma senha”.
Além disso, os pequenos textos abaixo do formulário são outro exemplo, que informam
também algumas orientações essenciais ao usuário em seu primeiro cadastro.
## 4\. Botões que parecem botões
Os botões são os gatilhos para novas ações do usuário dentro da nossa página e
elementos essenciais para a interação.
Se esse gatilho não estiver claro e visível, podemos acabar perdendo uma venda, um
[**lead**] ou até mesmo um envio de informações importantes. Veja o exemplo:
![]
Para isso, existem as [**boas práticas**] a serem seguidas para criar um botão
pensando na experiência do usuário, considerando cores, contrastes, rótulos, entre
outras variáveis muito importantes.
![]
Note que agora temos uma percepção muito melhor do botão e ainda somos guiados,
pelo contraste visual, a interagir com o botão mais chamativo, ainda que haja uma
segunda opção. Este é um bom recurso para guiar o usuário a escolher a ação que
desejamos.
## 5\. Usuários no controle
![]
Essa é uma opção comumente encontrada quando nos cadastramos em algum site.
A grande questão é: Será que vamos perder vendas e leads se disponibilizarmos essa
opção ao usuário?
Sim, de fato! Mas então por que utilizar esse recurso?
Dar ao usuário a oportunidade de escolha, de fazer ou desfazer edições ou mesmo de

definir se algo é positivo ou não, é dar [**liberdade e controle**] para essa
interação.
Afinal, se queremos proporcionar uma experiência memorável, nada melhor do que

permitir que o usuário personalize a seu próprio gosto.
Uma boa experiência gera maiores chances de conseguir que este usuário retorne à
sua página.
## O detalhe que faz toda diferença
Ainda que pareçam questões muito sutis, estes são justamente os fatores que as
pessoas acreditam ser "apenas detalhes", mas que ao serem deixados de lado, mudam
completamente a percepção e a experiência do usuário.
Se atentar aos detalhes, pensando em UX, é como pensar em todas as pontas soltas e
possibilidades de problemas, tapando todos os buracos que possam comprometer a
usabilidade.
Além disso, que tal aprofundar seus conhecimentos com os [**cursos de UX**] da
Alura? Aprenda desde os conceitos mais básicos até os passos para desenvolver uma
estratégia de UX para seu projeto!
Eu trabalho bastante com Node em diversos projetos no meu dia a dia, e me lembro
que no começo eu sofria bastante por não saber como debugar meu código. Afinal,
existem inúmeras formas de se fazer isso e eu gostaria de compartilhar com vocês a
que eu mais gosto - usando o VSCode
## Pré-requisitos
Fica tranquilo que para esse post você não precisa ser um ninja master em **Node**.
Com uma base de **JavaScript** e interesse em Node já vai conseguir pegar a
ideia :).
## Mão na massa
Para não perder muito tempo, eu já tenho um projeto previamente criado com Express
que possui o seguinte código:
js
No `package.json`, eu deixei criado nos scripts um comando `dev` para rodar o

servidor em modo de desenvolvimento
json
> Caso você não conheça o [**nodemon**], ele é uma ferramenta que encerra e inicia
um processo node, facilitando o _reload_ para testarmos alterações feitas no código
do nosso servidor.
## Encontrando o problema
Repare que ao acessarmos nosso projeto no navegador, a resposta nos retorna um

ùndefined`. Isso acontece pelo fato de que não informamos a variável na query
string `dadoExterno`.
imagem` em `dadoExterno` para entender o que está acontecendo:
imagem em nossos projetos. Em linha gerais é aberto um socket que diversas

ferramentas podem se inscrever e nos permitir o debug
imagem
- Para desligar tudo é só clicar no botão vermelho ao lado da setinha arredondada
na lateral superior direita
Espero que tenha gostado do post, em breve trarei mais dicas, se curtiu e quiser
saber em primeira mão quando vierem novos conteúdos, [me segue no meu twitter] e
pra acompanhar meus outros posts ta tudo centralizado em meu site pessoal
[https://mariosouto.com] até mais \\o
Se gostou do artigo, que tal dar uma olhada na nossa [**formação de engenheiro
front-end na Alura**] e aprender mais um pouco sobre essa gigantesca área?
Nesse artigo vou mostrar sete dicas para se utilizar o **Illustrator**, desde de
como aplicar **máscara de recortes** até trabalhar com **múltipas pranchas**.
## 1. Crie paletas de cores a partir de uma seleção
Escolher a [**combinação de cores adequada**] é uma das tarefas mais difíceis na

hora de desenvolver layouts funcionais. Definir aquelas adequadas ao seu projeto
fica mais fácil com a **Color Guide Tool**, que gera paletas incríveis
automaticamente.
imagem e, no canto superior direito da tela, clique no leque de cores para

visualizar as combinações geradas**.
imagem, pressionando alt ao longo do processo para que possa nomeá-lo.

imagem + n** todos os recursos pré-definidos são aplicados automaticamente. Para
salvar um template, clique em Archive > Save as template e escolha a localização
desejada.
imagem + n.**
## 5. Trabalhe com múltiplas pranchas
Não fique preso numa tela só! Componha com até 99 pranchas num mesmo arquivo,
obtendo uma **visão global do layout** desenvolvido em um só lugar.
imagem + R**. A partir daí, é só definir o posicionamento das suas guias de acordo
com o desejado. Para alinhar elementos utilizando o **snap to grid**, selecione um
ou mais objetos (sempre usando o **shift** neste caso) e acesse no menu de
contexto View > Snap To Grid. As guias criadas com auxílio da régua são invisíveis
e não podem ser vistas na impressão ou composição final, ficando armazenadas apenas
no arquivo editável do Illustrator.
![]
Gostou dessas dicas do Illustrator que vão poupar tempo e te ajudar a ser [**ainda
mais eficaz**] no uso da ferramenta? Que tal aprender também a criar layouts para a
web? Se interessou? Então dê uma olhada na nossa [**formação de Desing Gráfico**].
Muitas vezes precisamos **extrair** o valor de algum objeto em JavaScript:
javascript
Veja que para imprimir simples informações de um JSON representando um aluno foram
necessárias 3 linhas de código. Além disso, note que em três das quatros linhas
temos uma grande repetição de código, que seria a variável onde o objeto JSON está
armazenado.
Uma tarefa às vezes muito repetitiva e verbosa...
Com todos esses recursos que o JavaScript vem ganhando, e essa sendo uma tarefa
muito comum no dia a dia, será que não existe uma maneira mais simples e menos
verbosa como essa?
## Desestruturando o Objeto
Considerando o nosso exemplo inicial, uma das maneiras para diminuirmos o nosso
código seria devolver os atributos do objeto de uma vez, e então, dessa forma, a
gente chamaria eles sem a necessidade de um objeto. Mas será que isso é possível?
Sim é possível, para isso o JavaScript na versão [**ES6**] lançou o chamado

"**Desestruturação de objetos**", visando **facilitar** essa tarefa de **extração**
de valores referente a um determinado objeto, mas como seria essa nova extração?
javascript
Veja que em apenas uma linha conseguimos pegar o valor de todos os atributos de
nosso objeto e criar uma variável para eles, mas afinal, como foi possível imprimir
o valor referente aos dados do aluno?
Primeiramente vamos reparar na estrutura de nosso objeto, podemos notar que dentro
dele existem três informações, sendo elas: Nome, Idade e Email, respectivamente os
mesmos nomes de nossas variáveis informadas dentro das chaves no lado esquerdo.
Então, basicamente, a desestruturação de objeto segue a seguinte sintaxe:
js
Então quer dizer que se tivermos um objeto:
js
> _"Basta informar no lado direito o nome dos campos dentro das chaves que eu
pretendo pegar?"_
Sim, dentro das chaves é onde fazemos a assossiação dos campos que pretendemos
extrair de um determinado objeto JSON.
Por exemplo, se quisermos pegar apenas a razão social do objeto `fornecerdor`,

podemos fazer da seguinte maneira:
js
Assim conseguimos extrair apenas a informação que precisamos, ou seja, podemos

passar N campos dentro de nosso objeto.
## Cuidados com a Desestruturação de Objetos
A princípio, desestruturar um objeto parece resolver todos os nossos problemas,

certo? Mas e se informarmos um campo que não existe?
js
Como de costume, o JavaScript não vai encontrar o campo com o nome que informamos,
pois ele não existe. Sendo assim, não será realizada a associação. Em outras
palavras, a variável ficará com o valor ùndefined`.
Mas, e se por acaso recebermos o seguinte objeto:
js
Veja que, para nós, esse objeto trata-se de um aluno onde à`, `b` e `c` são
informações referente ao seu nome, idade e email respectivamente, nesse caso vamos
ter que criar variáveis com esses nomes sem significado?
Felizmente, não! A equipe responsável pelo desenvolvimento da funcionalidade já

pensou nisso e criou o recurso para referenciar um objeto mas trocando seu nome na
criação da variável:
js
Repare que agora informamos qual campo desejamos extrair a informação de nosso
JSON, e passamos para uma nova variável com o nome logo após os dois pontos,
seguindo a seguinte sintaxe:
js
Seria o mesmo que fazer:
js
Veja novamente como economizamos linhas e deixamos nosso código muito menos
verboso! Mas então devemos usar esse tal de desestruturação sempre que precisamos
extrair informações do JSON?
Acredito que devemos usar sempre que precisamos economizar a verbosidade. Isso
significa que, se precisamos pegar apenas uma informação talvez não seja tão
vantajoso utilizar tal recurso.
## Desvantagens no uso da Desestruturação de Objetos
Certo, agora já mostrei as vantagens, já dei exemplos para us... E onde ficam as
desvantagens?
Embora seja menos verboso, em algumas situações o **destructuring** pode aumentar a

complexidade do código, ficando um pouco mais complicado caso você não esteja
acostumado com a nova funcionalidade.
Outro ponto a destacar é que quando usamos a desestruturação sempre atribuímos os

valores desejados em variáveis, sendo assim, quando uma deixar de ser usada, será
necessário apagá-la manualmente.
Por último, não menos importante... Como já foi mencionado no artigo, quando
passamos o nome de algum atributo que não existe dentro do nosso objeto, a variável
torna-se ùndefined`.
## Para saber mais
Para finalizar, também podemos utilizar a desestruturação em funções, imagine que

temos uma função responsável por imprimir as informações de nossos alunos:
js
Para evitar a repetição da variável aluno, podemos utilizar a nova funcionalidade:
js
Em ambas as funções e chamadas, teremos o mesmo resultado.
Caso tenha interesse em conhecer e saber um pouco sobre a história do JavaScript

tem um [post] que fiz em meu blog.
Aqui na **Alura** temos uma [**Formação Front-End**] onde ensinamos **Javascript**

do básico até o avançado, passando
interação com elementos do **DOM** até programação funcional e testes.
A vida de freelancer não é fácil! Você precisa bater escanteio e cabecear ao mesmo
tempo. Precisa executar o trabalho, cobrar do cliente e prospectar novos jobs.
Saiba que esse alguém já existe. São os marketplaces, sites que ajudam na
contratação de freelancers. Eles podem ser comparados ao Uber — mas, em vez de
conectar motoristas e caroneiros, conectam empresas a designers,
[**desenvolvedores**], fotógrafos, por exemplo, dentre muitos outros profissionais.
A lógica desses sites é bem fácil de entender. A plataforma cadastra os

profissionais interessados em trabalhar como [**freelas**]. Enquanto isso, também
registram empresas e pessoas que estão precisando contratar profissionais
capacitados para algum projeto específico.
Depois dessa etapa, a plataforma conecta os profissionais cadastrados aos

potenciais clientes. Se der match, o negócio está feito! Simples assim.
Graças aos marketplaces, você não precisará mais investir tempo em prospecção e
contato com potenciais clientes. A plataforma faz isso para você, e de uma maneira
muito rápida.
Se você acessou este texto, é porque tem interesse pela ideia. E deve, também,
estar com algumas dúvidas do tipo: como são feitos os pagamentos; quanto pode ser
cobrado por trabalho e qual o custo da plataforma.
Para ajudá-lo a entender melhor o mundo dos marketplaces, destacamos os principais

tipos de plataformas, de acordo com o modelo de negócios, ou seja, a forma como
eles são remunerados e como remuneram os freelas.
Veja qual site é melhor para o seu perfil profissional. Boa leitura!
## 1\. Pagamento por comissão
Um dos modelos de negócios para marketplace mais difundidos da internet é o

pagamento por comissão fixa.
Funciona assim: o contratante cadastra um projeto que precisa ser executado por
algum freela (designer, fotógrafo, programador etc) na plataforma. Em seguida, os
profissionais enviam as ofertas e uma delas é aceita pelo contratante.
Com base nesse valor, o marketplace adiciona uma taxa de administração normalmente
em torno de 10%. O freelancer recebe o valor acordado. Contudo, o contratante
precisa desembolsar um pouco a mais para pagar a plataforma.
As plataformas que trabalham nesse modelo são:
### [99freelas]
É uma plataforma brasileira que começou focada no mercado de programadores. Cresceu

muito e hoje atende freelas de várias outras áreas, como vendas, administrativo,
advocacia e fotografia. Cobra uma taxa de administração de 10%.
### [Workana]
A plataforma é internacional, mas dá prioridade para freelas de língua portuguesa e

espanhola. Também trabalha com advogados, desenvolvedores, designers e até
atendentes à distância. Cobra até 15% de comissão.
### [WeDoLogos]
Foi um dos primeiros sites de freelas do Brasil e é focado no trabalho de

designers. Funciona assim: os profissionais se inscrevem e enviam propostas para os
pedidos de contratação em aberto. O contratante paga um valor que será dividido
entre o designer e a taxa de comissão do marketplace.
## 2\. Taxa mensal cobrada do freela
Nesse modelo de marketplace, o site cobra uma taxa mensal dos profissionais
cadastrados. O valor depende da área de atuação, da concorrência interna e do plano
escolhido pelo profissional. Quem paga mais aparece em destaque na lista dos
freelas e tem mais chances de ser contratado por alguém interessado.
Citamos uma plataforma que trabalha nesse modelo:
### [GetNinjas]
É o principal marketplace no Brasil e uma das startups de maior sucesso dos últimos
anos. O GetNinjas cobra dos profissionais um “anúncio” para se destacarem entre a
concorrência. Essa propaganda parece com os links patrocinados do Google —
localizados no topo da lista do resultado de busca. O valor do trabalho é acertado
entre o contratante e o freela.
## 3\. Mix de mensalidade, conta gratuita e comissão
Alguns sites mesclam contas gratuitas com pagamentos mensais e taxas de

administração. É um mix de opções. Nesses casos, o freela precisa avaliar bem os
valores com os quais a plataforma trabalha e entender qual é a melhor opção para
cada caso.
O lado positivo é que você pode começar a usar o marketplace gratuitamente, porém,
as plataformas sempre priorizam as contas premium na listagem de jobs.
Sugerimos o site:
### [Freelance.com]
Esse é, provavelmente, a maior plataforma do mundo para freelas. De origem

australiana, o marketplace oferece trabalhos em várias áreas. O profissional pode
começar com uma conta grátis. E se quiser ter mais chances de ser contratado, deve
pagar um valor mensal para a plataforma, que varia dependendo do plano.
Em alguns casos, também é cobrada uma taxa de comissão do contratante.
## 4\. Quem paga é o contratante
Algumas opções de mercado cobram taxas das empresas que precisam contratar um
freelancer. O pagamento nem sempre é mensal e pode ser realizado por demanda: a
cada anúncio de recrutamento de profissionais, o contratante desembolsa um valor.
Porém, são oferecidos descontos para quem publica várias oportunidades ao longo do
tempo.
A plataforma que opera nesse modelo é:
### [Trampos.co]
Este marketplace nasceu como uma plataforma colaborativa, em 2008. Desde então, não
parou de crescer, e os donos resolveram cobrar dos contratantes para poderem
rentabilizar o negócio. O pagamento é feito por anúncio.
Para o freela, tudo pode ser gratuito, mas a plataforma também oferece uma versão
premium, que dá algumas vantagens ao profissional, como: receber os anúncios antes
dos demais, ser informado sobre quem viu seu currículo e ganhar desconto em cursos
promovidos pela plataforma.
## 5\. Marketplace 100% gratuito
São raros, mas o mercado oferece marketplaces que são 100% gratuitos, tanto para
anunciantes quanto para freelas. É algo parecido com a OLX, ou seja, um grande
classificado em que as empresas ofertam vagas e os freelas escolhem para quem
trabalhar.
O site de serviço gratuito é:
### [Vagas 3D]
Essa é a principal plataforma free do Brasil. Conecta profissionais e empresas para

trabalhos temporários, freelas e empregos [**fixos.**] Não há qualquer cobrança de
taxa ou comissão. Atualmente, pede apenas uma contribuição para ajudar a construir
o novo seu site.
Bom, como você já percebeu, o que não faltam são marketplaces com os quais você
pode trabalhar. Qual deles é mais interessante para você? É importante ressalvar
que você precisa avaliar bem qual se encaixa melhor no seu perfil.
Antes de se inscrever, certifique-se do modelo de negócios da plataforma, quais as

taxas cobradas e como é feito o pagamento. Se valer a pena para você, vá sem medo e
comece a "freelar"!
Gostou do texto sobre marketplaces? Não deixe de ler também nosso artigo sobre
[como organizar sua rotina de trabalho como freelancer].
Uma imagem vale mais que mil palavras: este é um dos ditados mais conhecidos e
verdadeiros ao redor do mundo. Muitas vezes, uma imagem correta pode ser a
diferença entre sucesso e fracasso. O melhor texto pode não significar muita coisa
se a imagem que o acompanha desvirtua completamente a escrita.
Então, sabendo que o contato visual é crucial na comunicação, ter acesso a um bom
banco de imagens com certeza fará toda a diferença no trabalho final.
Escolher a imagem ideal para uma peça publicitária pode ser mais difícil do que
se imagina. Não é apenas escolher a que condiz com a ideia: é necessário que a
figura tenha boa qualidade (para sobreviver aos redimensionamentos) e,
principalmente, capte a atenção e faça com que o observador realize uma ação.
Para ajudar na busca da imagem ideal, existem diversos bancos de imagens onde

você encontrará planos de fundo, vetores, vídeos e fotos de diversos temas, além de
poder solicitar a designers peças personalizadas.
## Fotografia ou banco de imagens?
Algumas pessoas acham que um banco de imagens seria o equivalente a contar com um
bom fotógrafo ou contratar um estúdio de fotografia, mas são coisas muito
diferentes.
Contar com fotógrafos ou uma agência encarecerá de forma considerável o projeto,

pois envolve muitos custos adicionais como deslocamento, aluguel de espaço,
modelos, maquiagem, entre outros fatores.
No banco de imagens encontramos gravuras prontas, o que torna o custo muito menor,
até porque uma mesma foto ou imagem pode ser utilizada por mais de uma pessoa.
**Naturalmente, na fotografia existe algo muito mais personalizado e exclusivo, o

que pode ser um fator importante se o seu negócio depender disso (como para exibir
produtos ou modelos vestindo suas roupas e acessórios, por exemplo), enquanto no
banco de imagens o investimento é muito menor e a praticidade e diversidade muito
maior.**
Caso ache necessário, pode contratar um freelancer para editar as imagens, tornando
a peça exclusiva e mantendo o baixo custo. Portanto, se você quer ter um baixo
investimento, uma grande gama de opções e excelentes peças, utilize um banco de
imagens.
## Direitos autorais
É muito comum na internet encontrar sites que fazem uso das mesmas imagens. Em
grande parte das vezes, elas são utilizadas sem os direitos de uso, o que pode
acarretar diversos problemas para a empresa ou profissional, desde uma pequena
reparação até condenação prisional, que está previsto na constituição.
No entanto, há esforços para reverter essa situação e fazer do uso de obras

autorais algo que beneficie tanto o criador quanto o usuário. A [**Creative
Commons**] é uma empresa não governamental nascida na Califórnia, Estados Unidos,
que tenta revolucionar o mundo cultural no quesito “direitos de cópia". Trabalha no
intuito de permitir o maior número de compartilhamento de imagens e obras culturais
sem ferir os direitos autorais.
**Para isso, a empresa criou as [licenças Creative Commons]. Essas licenças foram
criadas para padronizar as declarações dos artistas quanto ao licenciamento e
distribuição de seus conteúdos. Assim, no que tange às imagens, você pode encontrar
peças que possuam uma licença que permita o uso irrestrito delas, contanto que você
dê os devidos créditos aos autores.**
Também há modalidades onde o uso é limitado, ou seja, a imagem só pode ser

utilizada em determinadas mídias ou não pode ser modificada. Em todos os casos,
porém, tudo é uma questão de verificar com calma os direitos de reprodução das
peças que deseja manipular.
## Pagos ou gratuitos?
A grande maioria dos bancos de imagens oferecem os dois serviços. Os planos de

imagens gratuitos contam com uma disponibilidade menor de imagens e qualidade
oferecida é, em sua grande maioria, de menor qualidade.
Cada empresa utiliza critérios próprios para liberar as imagens gratuitamente, como
por exemplo, inserir uma _tag_ para identificar a origem da imagem, disponibilidade
da imagem com baixa qualidade ou com marcas d'água, necessidade de se cadastrar e
receber newsletter, etc.
Os planos pagos contam com uma quantidade muito maior, todas as imagens são de
altíssima qualidade e disponibilizadas em diversos formatos e tamanhos.
Antes de escolher por qual opção inciar, que tal conhecer algumas opções? Para
ajudar na procura e sanar essas dúvidas, trouxemos algumas opções de bancos de
imagens gratuitos e pagos. Confira:
## Bancos de imagens gratuitos
### Pixabay
Com mais de 840 mil conteúdos incluíndo fotos, ilustrações, imagens vetoriais e
vídeos, o [Pixabay] é uma das melhores alternativas para banco de imagens por se
tratar de conteúdos livres de direitos autorais sob a licença [Creative
Commons CC0].
### Everystockphoto
Sendo, na prática, um sistema de buscas em variados bancos de imagens, o

[Everystockphoto] possui um acervo quase infinito sobre vários assuntos. Para
facilitar a busca do usuário, os temas mais procurados ficam destacados na lateral
do site.
### Dreamstime
Com mais de nove milhões de fotografias, o [Dreamstime] contém uma enorme galeria

de imagens. Ainda que seja um site gratuito, também podem ser encontradas imagens
pagas. Outro detalhe interessante, é que no Dreamstime, fotógrafos podem vender
suas artes e receber até 60% de comissão.
### Freeimages
Com milhares de imagens no acervo, o [Freeimages] é famoso entre os fotógrafos

profissionais. O site possui um repertório de mais de 300 mil imagens gratuitas,
todas em alta qualidade e baixáveis com a condição de um cadastro (também gratuito,
não se preocupe).
## Bancos de imagens pagos
### iStock
O [iStock] oferece milhares de imagens e fotografias únicas. Os usuários podem

utilizar os créditos iStock, que são vendidos em pacotes, para baixar os conteúdos
desejados.
Com uma navegação por categorias, o site facilita a busca e torna simples a procura
dos clientes no meio de milhões de opções de imagens. Além disso tudo, o site está
disponível em português brasileiro.
### Fotolia
O [Fotolia] possui mais de vinte milhões de imagens. O site tem uma particularidade
interessante: quanto mais você comprar, mais barato vai ficando o conteúdo. O
Fotolia também é dividido em seções, além de disponibilizar uma ferramenta de
pesquisa para facilitar a navegação. Um ponto negativo é que o site é totalmente em
inglês.
### Shutterstock
Um dos mais populares bancos de imagens da internet, o [Shutterstock] possui mais

de trinta e cinco milhões de imagens em alta resolução e em formato vetorial.
Tal como o Fotolia, este site possui uma peculiaridade interessante: se o usuário
possuir um site ou blog que tiver um número considerável de visualizações, basta
mencionar de onde foram retiradas as imagens do post que poderá pagar um valor
diferenciado. Além de tudo isso, o Shutterstock também conta com uma área para
compra de vídeos.
## Por onde começar?
Se você está [**começando agora**] ou se possui pouco dinheiro para investir, o

mais indicado seria começar a trabalhar com imagens disponibilizadas gratuitamente.
Outra boa alternativa é deixar o cliente escolher, incluindo o custo da imagem
escolhida ao serviço prestado.
Ao ganhar experiência e aumentar a quantidade de clientes você pode migrar para um
plano pago e conseguirá ter custos mais competitivos pelo volume. E por que não
criar peças ou fotos, disponibilizar nesses bancos e aumentar a fonte de renda?
**Nesse artigo você conferiu a diferença entre o uso de fotografias próprias e de

banco de imagens, a importância de contar com imagens licenciadas em seus projetos
e várias alternativas de bancos de imagens grátis e pagos. Agora é só escolher a
melhor opção e atrair os seus clientes com belas peças!**
Mais conhecida como autocomplete, ela não só vai evitar erros de digitação, mas
também promover outros destinos de acordo com o que o cliente digitar no campo de
busca.
Como podemos utilizar o **JavaScript** para nos auxiliar nessa tarefa?
## Começando o autocomplete
Atualmente os nomes das cidades que a agência oferece os pacotes estão armazenadas
no seguinte array:
js
A primeira coisa que vamos fazer é criar uma **função** para o autocomplete que vai
receber o destino como parâmetro e retornar para os usuários as opções.
js
Uma das vantagens do autocomplete é digitar uma ou duas letras e já receber algum
resultado. Então temos que encontrar uma maneira de pegar a quantidade de letras
que forem digitadas e verificar se existe alguma cidade que corresponde a essas
letras e retornar os resultados para o usuário.
## Filtrando o array
Para evitar de encontrar divergências entre o que o usuário digita e o nome das
cidades no array, precisamos padronizar o input do usuário para comparar com o nome
da cidade de forma mais assertiva. Para isso, vamos colocar todas as letras
digitadas em minúsculo usando o método [**toLowerCase**].
Quando fizermos a comparação,precisamos retornar uma nova lista, onde somente os

dados que baterem com o que o usuário digitou devem estar presentes, para nos
ajudar a [**filtrar**] iterando por todo o array.
js
Agora que já temos todas as cidade em minúsculo, para fazer a comparação e retornar
a nova lista no filter vamos usar o método [**includes**]. Ele vai dizer se a
string que digitamos, seja ela uma letra ou o nome todo da cidade, está na variável
`valorMinusculo`. Caso a resposta seja verdadeira, retornamos essa string para o
usuário.
js
Nosso código completo ficou assim:

js
Ótimo! O **autocomplete** foi criado, agora vamos exibir o resultado para o usuário
=)
## Exibindo o resultado para o usuário
Temos dois campos no nosso HTML, um campo para o usuário digitar o destino e uma
[`<ul>`] que vamos usar para exibir os resultados:
html
Primeiro temos que capturar os seletores do campo:
js
Agora é só adicionar um evento ao campo de busca para quando o usuário digitar já

trazer o nome das cidades automaticamente.
js
Como a variável `dadosDoCampo` está recebendo o que está sendo digitado, criamos
uma condição: caso a string capturada pelo evento seja verdadeira colocamos o
resultado dentro do campo `sugestoes` com a ajuda do [**innerHTML**].
A função autoComplete, nos retorna sempre um array. Precisamos gerar uma lista de
elementos baseada na lista de sugestões, para "mapear" a lista de sugestões para
elementos, vamos usar a função [**map**] que vai ser responsável por iterar pelos
resultados e vai criar `li` com a resposta, não esquecendo de usar o `join` para
devolver o resultado como string.
js
O nosso código agora com o evento ficou assim:
js
## Para saber mais
Uma outra maneira de fazer um rápido autocomplete é através das propriedades do

HTML5 como [**datalist**] que vai representar um conjunto de elementos e a
[**option value**] que representa um item.
html

melhor, aqui na **Alura** temos uma [**formação engenheiro front-end**]. Nela, você
verá como programar em Javascript, utilizar expressões regulares, dentre outras
muitas coisas.
imagem
Qual a diferença de Outbound para [**Inbound Marketing**]?
Neste episódio do Alura Live, a nossa co-host Giovana Delfino recebeu Adriano
Almeida, chefe de vendas aqui da Alura e um dos diretores do grupo Caelum pra uma
conversa sobre este termo que está tão na moda.
Tá afim de saber um pouquinho mais sobre o assunto? Então confere ai, que tá bem
legal o tema! 😀
https://www.youtube.com/watch?v=UbUicCXoHt8
Conheça nossos cursos de [Marketing Digital]
A mudança no mundo das midias sociais é uma constante: novas plataformas, novas
maneiras de se comunicar e alterações nas plataformas já existentes. Para se manter
atualizado, é necessário estar lendo constantemente e acompanhando as novidades
conforme elas saem.
## Videos ao vivo
Bom, essa é uma tendência que já é uma realidade para muitos. Aqui na Alura mesmo,
nós já fazemos um programa ao vivo todas as quintas, o [Alura Live].
Transmissões ao vivo dão um pouco de frio na barriga, eu confesso! Mas depois que
você pega o jeito, é muito divertido. E é legal porque estabelece uma conexão
direta entre a marca (empresa, loja, etc) e seus seguidores. É uma ótima maneira de
se aproximar, tirar dúvidas e criar intimidade com o seu público.
Além do Facebook Live, você pode fazer videos ao vivo através Twitter (com
[Periscope], Instagram e também no [Google Hangouts].
Existem várias maneiras de explorar transmissões ao vivo: cobertura de eventos,

perguntas e respostas sobre seu produto, lançamentos de novas funcionalidades, dia
a dia dentro da empresa e muito mais. As possibilidades são inúmeras :)
## Suporte através das redes sociais
Quando você tem um problema com algum serviço ou produto, qual o canal mais comum
de comunicação? E-mail. E e-mail não é ruim, mas é muito impessoal, pelo menos pra
mim: você envia um e-mail e horas depois (às vezes) dias recebe uma resposta, que
geralmente é um pouco automatizada, aquela coisa meio quadrada.
Mais e mais marcas estão utilizando o Facebook Messenger, WhatsApp e Telegram para
se comunicar com seus usuários. As pessoas ficam genuinamente **felizes** quando
enviam uma mensagem para nós através da [**página da Alura**] e nós respondemos em
menos de 5 minutos. E não é só porque respondemos rápido: é porque a pessoa sabe
que do outro lado tem um ser humano ali, falando com ela, esperando ela responder,
"ouvindo" o que ela tem a dizer e o que ela precisa. E essa sensação é muito boa.
Existem algumas ferramentas que ajudam no suporte através das redes sociais, como o
[Zendesk] e [Sprout Social].
## Migração do Snapchat para o Instagram Stories
Ano passado, o Instagram anunciou o [Stories], uma forma de compartilhar videos

muito parecida (senão igual) à que o Snapchat se propõe.
Pouco tempo depois do lançamento, muita gente já migrou para o Stories. Isso foi
bem perceptível pra mim: dos amigos que eu seguia no Snapchat, 90% não estão mais
lá e só usam o Stories agora.
Algumas vantagens do Instagram sobre o Snapchat: -Tem uma base de [600 milhões de
usuários], contra 150 milhões do Snapchat.
\-O Instagram é do Facebook, quando você vai fazer anúncios nele pode se basear em
Insights do Facebook, e vice-versa. -Você pode postar fotos e vídeos permanentes no
seu perfil além das histórias, o que torna seu conteúdo mais "compartilhável".
## A luta contra notícias falsas
É cada vez mais comum encontrar pessoas que consomem pouca (ou nenhuma) informação
por outro meio de comunicação sem ser a internet. E com isso, também aumentou a
quantidade de sites bizarros de notícias falsas.
Noticias falsas podem ser criadas apenas pela zueira ou para gerar [desinformação]
em quem as lê. No auge da polêmica política que rolou ano passado eu vi muita gente
compartilhando notícias falsas. E o pior: muitas pessoas fazem isso sem nem ler a
notícia, lêem apenas o título e compartilham.
O [Facebook já anunciou] uma ofensiva para as notícias falsas, algo que irá nos
ajudar muito a filtrar o que é verdade do que é mentira.
Esse é um passo muito importante, já que muita gente se informa apenas pelas redes
sociais.
## Realidade aumentada
Os filtros do Snapchat são demais, vamos combinar. Pokemon Go também foi uma
sensação (mesmo que não por muito tempo) em 2016.
A realidade aumentada não é uma tecnologia nova, mas começou a se tornar viral por
vários fatores, entre eles as redes sociais. É bem provável que outras plataformas
comecem a brincar com esse recurso. O Facebook, por exemplo, [comprou um app
chamado Masquerade], que altera rostos em selfies. Além disso, o [tio Mark já
admitiu que eles estão brincando com realidade aumentada].
Ainda há muito espaço para este conceito crescer e melhorar em 2017. E assim como o
video ao vivo, a realidade aumentada traz novas oportunidades das marcas se
conectarem com seus usuários de formas originais :)
imagem
Não é à toa que o LinkedIn é um dos queridinhos dos recrutadores e usuários em

geral. Afinal de contas, o **LinkedIn é sinônimo de oportunidade**, tanto do ponto
de vista de recolocação profissional como pela busca por parcerias de negócios e
prospecção de novos clientes.
[Para se ter ideia, ele cresceu 25% em pouco mais de 1 ano.]
Pensando na importância disso, listaremos a seguir alguns pontos que podem

demonstrar as vantagens de você saber usá-lo a favor da sua carreira ou negócio.
**Vitrine profissional** O LinkedIn é um espaço democrático onde você pode expor as

suas experiências profissionais, descrever as suas competências (no que você é
bom?), projetos em que for voluntário, cursos e certificações. Para alguns
recrutadores e profissionais, a certificação é importante, e existem caminhos para
alcançá-las, onde além do certificado, você aprende bastante. Inclusive para
conhecer os cursos preparatórios para diversas certificações disponíveis na Alura.
Então que tal usar esses recursos a seu favor? Simples: inclua as suas experiências
profissionais, os projetos, os benefícios que o seu trabalho pode ter gerado para a
empresa, por exemplo.
**Competências** Quais são as áreas que você domina? Aproveite para deixar o seu
perfil recheado de competências. Quanto mais sincero você for, melhor. Quanto mais
validadas, maior pode ser a percepção que as pessoas terão de você. Ou seja, a sua
autoridade nessas áreas pode ser fortalecida a partir dessas competências.
**Cursos** Aproveite esse espaço para atualizar com os seus certificados. Se você
tiver muitos, use os mais importantes. Quando inserimos cursos em nosso LinkedIn
queremos demonstrar que somos profissionais atualizados e em busca do aprendizado.
E quem não gosta de ver isso?
**Recomendações** Embora algumas pessoas não usem com frequência esse recurso, é
importante falarmos sobre como as recomendações podem aumentam as nossas chances de
sermos reconhecidos como autoridades dentro da nossa área de interesse. Uma coisa é
eu falar que sou boa em algo, outra coisa é quando alguém fala que eu sou boa.
Dica: Para conseguir recomendações, lembre-se de recomendar antes, aguarde alguns
dias e se a pessoa não retribuir a gentileza, envie uma mensagem e pergunte se a
pessoa gostou da que você fez e se é possível ela retribuir. Recomendações precisam
ser genuínas, caso contrário, fica notável que a pessoa fez por qualquer outro
motivo, menos porque de fato ela te conhece.
**Grupos** Participar de grupos pode gerar muitas oportunidades. Você pode conhecer
pessoas com o mesmo interesse que os seu, trocar ideias sobre situações do dia-a-
dia, descobrir novas alternativas de resolver problemas e pode criar oportunidades
de negócios e parcerias. A dica para aproveitar melhor esse recurso é escolher de
um até três grupos que estejam relacionados com os seus interesses e participar
ativamente dos debates. Com o tempo você pode descobrir outros grupos e querer
ficar mais neles. Isso é natural, o importante é adotar o hábito de visitar um
grupo por dia para ver o que as pessoas estão falando e se for do seu interesse,
interaja com elas.
**Pulse** Que tal compartilhar experiências profissionais, ideias e os seus últimos

aprendizados em formato de artigo? O Pulse é uma plataforma dentro do LinkedIn que
serve para você publicar conteúdo. Uma das vantagens é que toda vez que você postar
algo novo, a sua rede será notificada, o que aumenta as suas chances de atingir
mais leitores.
**Networking** O LinkedIn é a plataforma para você manter contato profissional com

a sua rede de contatos e também com as pessoas que você conhecer através dos
eventos presenciais. Lembre-se de que o mais importante é fazer com que as pessoas
lembre de você, e não que você apenas colecione contatos. Com o tempo, é natural
que a sua rede tenha muitos contatos, então, sempre na medida do possível, interaja
com as suas conexões, seja através do envio de mensagens privadas, compartilhamento
de conteúdo na sua timeline ou em comentários de postagens que você ler.
Buscamos reunir aqui as principais vantagens para você se beneficiar no LinkedIn. O

dia-a-dia pode nos ensinar como aproveitar melhor cada recurso, mas se você quer
descobrir de forma ainda mais direta e prática de como otimizar e promover o seu
perfil, conheça o curso [**LinkedIn: como fazer o seu perfil trabalhar para você**]
Você já parou para ler todos os anúncios que aparecem na sua timeline do Facebook?
imagem com o objetivo de converter _prospects_ (clientes potenciais) em clientes.
Mas como isso funciona na prática?
Vamos comparar dois exemplos a seguir.
A Escola do Designer SA decidiu seguir uma linha mais voltada à venda. Até ai tudo
bem, mas será que não fica muito apelativo? Digo, dá a impressão que se a pessoa
estudar lá, terá 100% de sucesso, e sabemos que isso depende de outros fatores.
imagem** **Publicar conteúdo relevante é o principal modo de agradar a Google.**

Dizem que se você não está no Google, você não existe. Ok, pode parecer um tanto
exagerado, mas pare para pensar: vamos supor que a sua empresa ofereça serviços na
área de saúde e bem-estar. Será que ela vai aparecer na busca quando alguém
pesquisar no Google?
imagem É uma boa maneira de se diferenciar da concorrência.** As pessoas só vão

parar para ler algo que seja relevante para elas. Então será que se você seguir as
mesmas estratégias, estar presente nas redes sociais apenas por estar vai ser bom
para o seu negócio? O marketing de conteúdo fornece uma oportunidade para
reinventar-se a cada nova criação, com cada peça. No marketing de conteúdo, não
existem regras, tudo é descoberta.
Um bom exemplo disso é a Nubank que tem uma abordagem muito interessantes através
das redes sociais.
Se você acessar páginas das empresas que oferecem serviços bancários, notará que
eles usam uma linguagem mais formal para comunicar seus serviços e vai se deparar
com um emaranhado de reclamações nos comentários. Mas ao visitar a página do
Nubank, verá que eles usam uma abordagem diferente, mais amigável.
imagem O conteúdo permite o contato com o público-alvo em todas as fases do

processo.** Então você conseguiu chamar a atenção do seu cliente. Legal, mas e
depois? Até quando ele vai te acompanhar?
Bom, o Marketing de Conteúdo pode ser útil para você desde a atração até a
manunteção de clientes. A grande jogada é descobrir como usar o conteúdo a seu
favor.
Abaixo, podemos ver um exemplo interessante do Blog do Alura.
Esse post é para municiar o leitor que está iniciando ou tem interesse em começar
na carreira de programador.
![exemplo-blog-alura]
Já nesse outro exemplo, o conteúdo pode ser útil tanto para o profissional que está
iniciando na carreira como quem já atua.
![exemplo-alura-2]
O grande barato do marketing de conteúdo é conseguir descobrir o que compartilhar

para ajudar os seus leitores, em diversos momentos da sua jornada.
E ai, gostou de conhecer algumas maneiras de trabalhar com o Marketing de conteúdo?
**Quel tal se aprofundar mais no assunto? Acesse a Trilha de Marketing Digital no

Alura, e confira como o [Curso Marketing de Contéudo: Uma introdução ao Marketing
de valor] pode ser útil para você ou para o seu negócio.**
Estou configurando a rede em um prédio onde funcionará alguns departamentos da

Alura: Financeiro e Vendas.
Poderíamos colocar os dois departamentos na mesma rede, porém com isso teríamos
alguns problemas:
- Como todos os computadores estariam se comunicando pela mesma via, ao mesmo

tempo, a rede poderia ficar mais lenta;
- Um computador conseguiria "ver" o outro. Isso poderia fazer com que um usuário
malicioso direcionasse algum tipo de ataque;
- Caso ocorresse algum tipo de problema em alguma parte da rede, ambos

departamentos seriam afetados.
Então temos que configurar duas redes diferentes, cada uma relacionada a um
departamento.
Em uma primeira abordagem, podemos configurar essas redes fisicamente separadas.

Isto é, com um switch para cada departamento, assim como uma interface no roteador.
Porém o custo disso seria mais elevado, já que precisaríamos de mais switches e de
um roteador com mais portas.
Outra maneira seria separar logicamente o switch e o roteador, pois dessa forma,
além de separarmos a rede entre os departamentos, estamos economizando também. Esse
tipo de configuração é conhecida como [**VLan**].
## Entendendo as VLans
As VLans, nada mais são do que redes locais (Lan) virtuais. Ou seja, são redes
lógicas configuradas em um mesmo [**ativo de rede**] (roteadores e switches, por
exemplo). Com ela é possível dividir nossa rede em quantas partes precisarmos para
o projeto.
Além da divisão e economia da rede, temos as seguintes vantagens ao implantar esse

tipo de rede:
- Mais desempenho, já que o [domínio de broadcast] fica dividido entre as redes;
- Mais segurança, apenas os computadores pertencentes a VLan podem "ver" um ao

outro;
- Conseguimos isolar melhor os problemas, como as redes estão separadas, o problema

de uma não afeta a outra.
Bacana, agora que sabemos o que é uma VLan e como ela pode nos ajudar, como podemos
implementá-la na nossa rede?
Para isso vamos dar uma olhada na nossa rede e ver como ela está distribuída:
imagem via terminal (`terminal`). Portanto:
`# configure terminal`
imagem`? Os switches e roteadores Cisco nos mostram em que modo estão. Neste caso
no modo de configuração.
Agora podemos configurar nossas VLans, mas como identificá-las?
Para isto, cada VLan deve possuir um número de identificação única. Esse número
pode estar entre [2 à 1005]. Já que nossos dois setores estão no térreo, vamos
deixar os ids das VLans terminados em 0, assim saberemos o andar que elas estão.
Assim nossa primeira VLan será `1`, seguido do `0`, ficando `10`.
Vamos dizer ao switch que queremos criar uma `vlan` que tem o id igual a `10`:
`(config) # vlan 10`.
imagem # vlan 20`.
imagem # vlan 10`
Neste modo, falamos que esta VLan terá o nome (`name`), neste caso, `Financeiro`:
`Switch(config-vlan)#name Financeiro`
imagem, no nosso caso é uma `fastEthernet` e a porta que queremos acessar, `0/1`.
imagem ficará no modo (`mode`) de acesso (àccess`) a um dispositivo final

(computador, notebook, servidor...).
`(config-if) # switchport mode access`
E também que essa porta (`switchport`) estará acessando a VLan `10`
imagem, do tipo `fastEthernet` de `0/2` até (`-`) a porta `fastEthernet 0/5`:
`(config) # interface range fastEthernet 0/2 - fastEthernet 0/5`
Agora informamos que essas portas estão conectadas a um dispositivo final e que
acessarão a VLan 10:
imagem, para começar nossa configuração. Em seguida digitamos `configure terminal`

para dizer que ele será configurado:
imagem # interface fastEthernet 0/0`
Já que queremos ligar essa interface, temos que falar para ela não (`no`) ficar
desligada (`shutdown`). Com isso nossa porta já está habilitada.
`(config-if) # no shutdown`
imagem # interface fastEthernet 0/0`. E, para informar a subinterface, digitamos
`.` (ponto) e o seu número, `10` por exemplo.
`(config) # interface fastEthernet 0/0.10`
imagem está associada a uma VLan. Logo, precisamos dizer que ela está encapsulada
(èncapsulation`) em uma VLan (`dot1Q`) seguido do id da VLan.
`(config-subif) # encapsulation dot1Q 10`
imagem # ip address 192.168.0.1 255.255.255.0`
imagem # interface fastEthernet 0/0.20`
Dizer que ela está associada a VLan 20: `(config-subif) # encapsulation dot1Q 10`
E terá como endereço IP: `(config-subif) # ip address 192.168.1.1 255.255.255.0`:
imagem # interface fastEthernet 0/11`
imagem não está no modo (`mode`) de conexão a um dispositivo final, e sim em um

modo em que junta todas as VLans (`trunk`).
`(config-if) # switchport mode trunk`
![]
Vamos testar novamente e ver se nossas duas máquinas conseguem conversar entre si:
![]
Sucesso! Agora temos duas redes separadas logicamente que conseguem se comunicar.
## Para saber mais
Veja que neste caso foi interessante juntar todas as VLans na porta trunk, porém
existem casos em que nós precisamos isolar essas VLans escolhendo quais passarão
pela porta trunk. Apesar de esse não ser a proposta desse post, você pode conferir
[aqui] essa configuração..
## Conclusão
Vimos nesse post o problema que tínhamos ao conectar duas redes distintas e como as
VLans seriam uma solução. Vimos como configurá-las nos switches e nos roteadores
fazendo existir comunicação entre elas.
Gostou de redes? Essa é só uma pequena parte de muitas outras. Aqui na **Alura**
temos uma [**formação em redes de computadores**] onde você aprenderá sobre VLans,
protocolos, como configurar listas de acesso, segurança e muito mais!
Quantas vezes caímos na situação de necessitarmos de uma lista em nosso aplicativo?
Vimos uma forma bem simples de implementar uma lista no **Android** com `ListView`
e Àdapter`. Além disso, vimos como melhorá-la, ou seja, personalizá-la com um
Àdapter` personalizado e como reaproveitamos as `View`s por meio do `ViewHolder`.
Você pode conferir todos esses tópicos com mais detalhes [nesse artigo!].
Mesmo sendo pontos importantes para a implementação de uma **lista** no Android,

reparou o tanto de passos que realizamos para criar uma lista "ideal" para a nossa
app? Será que não existe uma forma melhor?
Para resolver esse problema de não sermos obrigados a manter a boa prática sem a
preocupação com alguns detalhes (que veremos no decorrer do post) foi criado uma
nova `View` para listas.
Para começarmos a utilizar, temos que trazer a lib como dependência do projeto:
groovy
## Inserindo o RecyclerView no layout
Já podemos começar a usar todos os recursos dessa biblioteca! Vamos iniciar

colocando ela num layout:
xml
## Pegando a referência do RecyclerView
Por enquanto nada muito diferente do `ListView`: declaramos da mesma forma. Para
usá-la precisaremos de uma referência para ela:
java
Tudo está bem tranquilo até o momento, mas ainda falta fazermos bastante coisa.
## Criando uma entidade e lista de exemplo
Como estamos tratando de uma view que mostrará uma lista, em algum momento teremos
que fazer essa lista surgir magicamente em nosso código. Vamos criar uma lista de
livros, para isso criaremos uma classe `Livro`:
java
E agora vamos utilizar nossa lista de livros na nossa Àctivity` :
java
## Implementando o adapter do RecyclerView
Está faltando pegarmos essa lista e a colocarmos para ser exibida, da mesma forma
que **ListView**, mas como transformávamos mesmo nossos objetos em **Views**?
Precisávamos criar um **Adapter**:
java
Para nosso código compilar, o objeto que precisamos passar deve ser um Adapter.
Então, nossa classe precisará ser um também :
java
Para nossa classe ser um Àdapter`, temos que sobreescrever alguns métodos:
java
Repare que nos deparamos com três **métodos** novos: **onCreateViewHolder,
onBindViewHolder, getItemCount**, vamos entender um pouco mais sobre eles.
O mais fácil de matarmos logo de cara é o **getItemCount**, que é a quantidade de

itens que teremos, então vamos deixar nosso código certo:
java
## Implementando o ViewHolder do RecyclerView
Vamos partir agora para o **onCreateViewHolder**, que é o método que criamos o

`ViewHolder`, que fazíamos por boa prática no `ListView`. Além disso, é neste
método que devemos inflar a view para vincular ao `ViewHolder`.
Como esse `ViewHolder` saberá fazer os **findViewById** que precisaremos? Ele é

muito genérico, não conseguirá resolver este problema!
Mas nós, como ninjas da programação orientada a objetos, sabemos como resolver:
iremos criar uma classe que herde desse tipo mais genérico e que faça o que nós
precisamos! Veja:
java
O compilador está reclamando que a classe pai tem um construtor que precisa de uma
`View`. Vamos solucionar isso:
java
Retornando ao problema inicial, agora podemos solucionar instanciando nosso

`ViewHolder`:
java
Precisamos passar uma `View` para nosso código compilar:
java
Perceba que precisamos providenciar um `Context` para que nosso `LayoutInflater`

possa funcionar direitinho :
java
E na nossa Àctivity` :
java
Bacana, tudo certinho, agora basta vermos o que o último método faz e tudo certo!
## Populando cada item do RecyclerView
E agora o que ficou faltando fazermos? Apenas popularmos cada item, com as
informações do livro.
É exatamente o que faremos no método ònBindViewHolder`, por isso recebemos um

`ViewHolder`, aquele que foi criado no método ònCreateViewHolder`, com isso
conseguimos popular de maneira que desejamos.
java
Terminamos. Vamos rodar, tirando do **banco de dados** com registros ou do
webservice e temos esse resultado:
imagem
imagem, alterando apenas o tipo do `LayoutManager`?
Quer saber mais de **Android**? Aqui na **Alura** temos uma [**formação android**]
completa !
Se você está ligado nos novos cursos da Alura deve ter notado que temos um [**curso
novo**] sobre Maratona de Programação. Mas você sabe o que é?
## Entendendo a maratona
**A Maratona de Programação é um evento de nível nacional da Sociedade Brasileira

de Computação que existe desde 1996 e é destinada a alunos de cursos da graduação
ou do início de pós-graduação na área de computação.**
Legal, mas como funciona? Trata-se de uma competição em equipes de 3 pessoas que
tentarão resolver em 5 horas o maior número de problemas que conseguir utilizando
apenas 1 computador. O que achou? Desafiador né? Então vamos ver mais alguns
detalhes:
> - Ganha a equipe que resolver mais problemas.

> - Em caso de empate, ganha quem fez em menor tempo.
> - A correção é feita em tempo real. Caso sua resposta seja julgada errada a
equipe é imediatamente avisada e tem a oportunidade de remandar o problema, caso
esteja certo, a equipe recebe um balão referente ao problema que acabou de acertar.
Isso mesmo, um balão, olha que bonito que fica:
![]
Além disso os balões são utilizados como referência, ou seja, você tem uma
demonstração visual do desempenho das demais equipes, por exemplo, na imagem acima,
vemos muitos balões azuis, logo, muito provavelmente o problema referente ao balão
azul é um dos mais fáceis da prova, sendo assim, você deve começar com ele já que
tempo é essencial.
## Conhecendo os tipos de problemas
A essa altura você deve estar se perguntando:
> _Mas que tipo de problemas aparecem nessa competição?_
Bem, os problemas envolvem programação dinâmica, teoria dos grafos, fluxo,

estruturas de dados entre diversos outros campos da computação.
Calma, vou especificar um pouco melhor, olha aí um exemplo de problema para você
tentar resolver:
![]
## Benefícios da maratona para o mercado de programação

Agora você deve estar pensando que isso tudo parece muito teórico e nada prático,
então por que um bom desempenho nesta competição seria um diferencial no seu
currículo? Vamos lá.
**Um bom maratonista sabe trabalhar em equipe, afinal, são 3 pessoas em apenas um
computador, portanto vai bem a equipe que souber se comunicar e delegar melhor as
tarefas que surgem.**
Também deve saber trabalhar sob pressão, não só por ter pouco tempo para fazer os
problemas mas também saber controlar os nervos ao ver o desempenho dos seus demais
concorrentes, por exemplo, imagine só você no meio da competição travado em um
problema vendo balões chegando a todo momento, complicado né?
Como se tudo isso já não bastasse, o bom competidor deve ter raciocínio lógico
rápido e programar com agilidade e precisão, afinal, erros custam muito tempo.
Agora pense bem, não são essas qualidades que as empresas procuram em seus
profissionais?
É muito comum maratonistas em destaque serem contratados por grandes empresas como
Google e Facebook devido à similaridade dos problemas da competição com os
apresentados nas entrevistas técnicas dessas empresas.
## Ganhos além do currículo
Ainda não está convencido se deve ou não participar? Bom, indiretamente a Maratona
te proporciona experiências incríveis.
As finais mundiais da competição são sediadas cada ano em um país diferente, você
tem então a oportunidade entrar em contato com programadores do mundo todo,
melhorar seu networking e ainda por cima conhecer diferentes culturas e lugares.
E então, vai participar? Para mais informações sobre a competição acesse esse
[link].
## Algumas dicas para se preparar
Agora, caso você queira testar suas habilidades existem diversos sites que simulam
a competição, dentre eles, eu recomendaria o [**codeforces**] que contém simulações
online periódicas porém requer o domínio do inglês.
Além do codeforces também tem o [**URI**] que é excelente para quem está começando
pois possui seus problemas separados por assunto, contando até mesmo com uma
categoria especial voltada para iniciantes.
Além disso, vale lembrar que o URI é um site brasileiro e por isso seu conteúdo
pode ser visto em português!
imagem
Ultimamente, diversas empresas estão passando por esse processo e fazendo

verdadeiras transformações em seus sites. Muitas vezes, essas transformações vão
além do visual, facilitando a navegação e deixando a vida do usuário ainda mais
simples. A [**Caelum mesmo passou por um redesign**] há um tempo.
Ao lidar com o processo de redesign de site, deve-se levar em consideração, além de
todos os objetivos da companhia, a mensagem que ela deseja passar aos seus
clientes, desde a fase de planejamento até a execução da ideia. Apesar disso, é
importante notar que nem todos os elementos de design criados anteriormente
precisam ser alterados com esse procedimento.
A verdade é que redesenhar o website é justamente isso: realizar modificações

funcionais,que tornam o site mais amigável para o usuário, com o intuito de
favorecer o alcance dos objetivos da estratégia de marketing da empresa.
No post de hoje, vamos explorar um pouco mais esse assunto para que você saiba por
onde começar ao fazer o redesign de site!
## Quando devo considerar o redesign de site?
Existem diversas razões que provam a relevância do redesign do site para uma
empresa e mostram como esse processo pode facilitar o alcance das metas. Abaixo,
listamos algumas delas para que você entenda melhor. Acompanhe!
### 1\. Quando não se obtém os resultados esperados
Ainda que o site esteja ótimo e funcionando conforme foi programado, se ele não
está gerando os resultados desejados, a reformulação do design é, com certeza, uma
solução bem plausível.
Nesse caso, os dados presentes no site e o modo como as pessoas o acessam são
ótimos indicadores daquilo que deve ser redesenhado no site para melhorar a
experiência do usuário ao navegar por ele. Para facilitar, algumas perguntas podem
ser feitas, como:
- O **Call To Action** (CTA) está convertendo os visitantes em [leads]?
- As páginas possuem um design bem trabalhado?

- Elas encorajam o usuário a passar mais tempo no website?
- A mensagem da empresa está sendo transmitida da forma correta ao público-alvo?
### 2\. Quando o site não tem um design responsivo
Hoje em dia, uma grande parcela do tráfego da internet deriva de dispositivos

móveis, provando o caráter fundamental e a [**importância de sites responsivos**].
Se o site de uma empresa não é totalmente compatível com dispositivos como tablets
e smartphones, ela pode perder visitantes e, consequentemente, possíveis clientes.
Assim, é de extrema importância que as empresas enxerguem a responsividade dos seus
websites como algo de alta prioridade. Um conselho é tentar pensar [**mobile
first**] a fim de facilitar a adaptação desse novo layout para tamanhos de tela
maiores.
### 3\. Quando a concorrência se atualiza
Claro que não é preciso fazer alterações no site sempre que a concorrência fizer
isso. Contudo, se o concorrente fizer grandes mudanças que impliquem na melhoria da
posição dele nos motores de busca, o site da sua empresa poderá ser prejudicado.
Dessa forma, é importante dar uma olhada nos sites dos concorrentes para que se
tenha uma ideia de como alterar os objetivos do próprio site, antes de executar o
processo de redesign. O importante, nesse caso, é apresentar melhores respostas aos
atuais e possíveis clientes.
Lembrando sempre que o usuário do seu concorrente não é seu usuário. Se o
concorrente mudar a cor padrão do site e apresentar crescimento de alguma forma,
não é mudando para a mesma cor que acontecerá o mesmo com você.
### 4\. Quando há mudanças na estratégia de conteúdo
Por conta da colaboração para as campanhas de SEO, o conteúdo do website é sempre

uma das prioridades. Entretanto, de que vai adiantar um conteúdo tão bom se o
usuário não puder encontrá-lo?
Se o planejamento abrange alterar a estratégia de conteúdo ou expandir a produção

de conteúdo para o blog da empresa, por exemplo, é muito importante que seja feito
um novo desenho para o site, para que a comunicação com o usuário continue
eficiente.
Acima de tudo isso, é importante que o visitante se sinta confortável para

pesquisar e percorrer todo o site, além de localizar de forma prática tudo o que
lhe interessar.
### 5\. Quando as ferramentas são modernizadas
Se temos um site que recorre a ferramentas externas para fornecer uma experiência
completa — como um sistema de pagamento de uma loja virtual, por exemplo — é
preciso que essas ferramentas sejam compatíveis e estejam de acordo com
os [**padrões de funcionalidade atuais**].
## O que exatamente devo levar em consideração?
### 1\. Qual o impacto do novo design para o usuário?
O processo de mudança faz parte dos sites. Mesmo assim, muita gente cria uma
barreira quanto à utilização daquilo que é novo, ainda que a mudança seja para a
melhor.
Dito isso, é preciso ter bastante cuidado ao implementar um redesign completo no

site, pois, além disso implicar numa mudança na forma de navegar, também é uma
introdução a um visual totalmente novo.
Para que haja uma boa aceitação, essas mudanças precisam influenciar positivamente
a experiência do cliente e, para isso, é fundamental que ele se sinta totalmente
confortável.
Caso seja coerente, procure manter os títulos das principais seções do site. Também
é válido criar uma página explicando a mudança, sendo esta uma ótima oportunidade
para explicar as alterações no site e até mesmo pedir um feedback sobre a mudança.
### 2\. Qual a vantagem para a empresa de ter um site responsivo?
É mais viável desenvolver um [**site que seja totalmente compatível**] com desktop

e dispositivos móveis. Isso ajuda a economizar a longo prazo, em comparação a ter
dois ou mais projetos em desenvolvimento para diferentes tipos de aparelhos.
Além disso, é vantajoso para a empresa ter um site responsivo pois ele poderá ser
facilmente acessado pelo cliente, não importando de qual dispositivo ele esteja
acessando naquele momento. Isso impactará diretamente no número de visitas e,
consequentemente, no número de compras realizadas — no caso das lojas virtuais.
### 3\. As estatísticas do site antigo foram analisadas?

Não há como olhar para um negócio sem imaginar as possibilidades de melhoria, não é
mesmo? Ainda mais em pontos onde os clientes interagem de forma direta com a
empresa.
Entretanto, assim como em qualquer outro projeto, para que possamos evoluir, é
preciso saber onde estamos, antes de tudo. Assim, o primeiro passo deve ser fazer
uma análise atenciosa das atuais estatísticas de visitas do site.
Talvez você esteja se perguntando quais estatísticas poderiam ser analisadas. Isso
é relativamente simples, basta se basear na demanda ou necessidade vista nos dados.
Se existe uma alta quantidade de usuários estrangeiros, não seria uma boa ideia
lançar uma versão em inglês do site, por exemplo?
Além de se certificar de que está partindo do ponto certo, os dados analisados

poderão ser comparados com os que serão obtidos futuramente, ajudando a melhorar
cada vez mais o projeto.O Google Analytics é seu amigo.
### 4\. Que tal aplicar o flat design?
Ao utilizar o flat design pode-se ter uma [**estrutura visual mais plana**] sem

abusar de cores e tipografias, o que torna a navegação pelo site mais simples e
intuitiva.
Além de auxiliar na boa navegabilidade nos smartphones e tablets, o [**flat

design**] facilita a compreensão do conteúdo e também na detecção de botões de ação
e CTA.
É importante ressaltar que a aplicação desse tipo de design depende da intenção e

linguagem de cada empresa e a identidade da marca. Logo, dê atenção a esse aspecto,
ok?
### 5\. E se o usuário clicar em um link antigo?
Quando o redesign do site é realizado, é possível que também ocorram alterações nos
endereços das páginas. Isso normalmente acontece, pois, ao montar um novo design,
podem ser feitas alterações na estrutura de pastas ou a inclusão/exclusão de
arquivos, a depender do caso.
Nesse caso, o problema é o desperdício de usuários, já que, quando eles vierem de

antigos links espalhados pela internet, não encontrarão mais o site.
Já que é praticamente impossível que todos os endereços das páginas se mantenham

intactos, registre todos os [**erros 404**], ou seja, todas as páginas não
encontradas.
Além disso, também inclua os antigos endereços às páginas do site mais recente.
Quando não fizer isso, pelo menos redirecione o usuário para a homepage do site
quando uma mensagem de página não encontrada aparecer. Nessa hora o Google
Analytics continua sendo seu amigo e consegue _trackear _esses 404.
A experiência do usuário é muito importante quando estamos criando, ou redesenhando

um site. Aqui a Alura temos uma [**Formação em UX design**]. Nela você aprenderá
sobre o que é User Experience, como entender as necessidades do usuário, como
elaborar protótipos e muito mais.
Pensando em uma filosofia open source onde todos podem fazer uso de soluções de
maneira gratuita e colaborativa, o que vamos fazer é aprender a criar uma
**biblioteca Javascript** e publicá-la no **NPM**, por onde todas as pessoas terão
acesso.
Nessa biblioteca vamos ter uma lista com os nomes de várias linguagens de
programação que poderão ser usadas como base de dados. Para desenvolver esse
projeto vamos precisar do [**node.js**] e do [**git**] instalados em nossa máquina.
## Clonando o repositório
Para começar, criamos um repositório no github e marcamos a opção de inicializar

com o README. Com isso podemos trazer o repositório para o nosso computador através
do comando **git clone <url do repositório>** e teremos uma resposta parecida com
essa:
imagem podemos ver que todas as configurações estão lá:
imagem. Aqui precisamos fazer uso do **require** uma função embutida do nodejs
responsável por incluir módulos em arquivos separados.
No nosso caso ela está incluindo **linguagens-de-programacao.json** dentro do

**index.js** para que possamos usá-lo.
javascript
Quando as pessoas forem utilizar nossa biblioteca em seus projetos, elas precisarão
usar o **require** para incluí-la dentro do código, então, precisamos exportar
nosso código para que ele possa ser importado em outro lugar, e para isso vamos
usar o [**module.exports**].
Dentro do module.exports temos um objeto que contém uma propriedade chamada **all**
que vai exibir todas as linguagens quando for executada.
js
Nosso código final ficou assim:
js
Se fizermos um teste rápido no console do node fazendo um require no nosso entry

point e depois executando **.all**, vamos ter o seguinte resultado:
![]
Podemos ver que ao chamar a **teste.all** conseguimos exibir todas as linguagens.

Estamos quase no fim.
Porém nosso código está apenas no nosso computador, temos que enviar esses arquivos
novos de volta para o github.
## Adicionando os arquivos no Github
Primeiro usamos o comando **git status** que vai nos mostrar os arquivos não
monitorados,aqueles que criamos depois de clonar o repositório:
![]
Como podemos ver precisamos adicionar ao nosso repositório **src/** e

**package.json**. Podemos adicioná-los de uma só vez com o comando **git add \*** e
logo depois disso fazemos um commit **git commit -m “comentário”** para salvar as
alterações:
![]
Por fim com o comando **git push**, mandamos as atualizações de volta para o
repositório no github:
![]
Agora falta o último passo, publicar a biblioteca no npm para que todas as pessoas
possam ter acesso.
## Publicando na npm
Na pasta do nosso projeto basta digitar o comando **npm publish** e pronto:
![]
Se voltarmos no site da npm podemos ver que nossa biblioteca foi publicada com
sucesso [https://www.npmjs.com/package/nome-das-linguagens-de-programacao].
Podemos sair da pasta do projeto e instalar a biblioteca rodando o seguinte

comando:
js
Vamos fazer um teste?
## Testando nossa biblioteca
Depois de instalar a biblioteca, criamos um novo arquivo index.js e dentro dele

fazemos um **require** do nosso pacote de imprimimos através do console.log:
js
Rodando no nosso terminal temos o seguinte resultado:
![]
Ufa!! depois de criar a conta no github, no npm, configurar o git e criar nosso
código Javascript, conseguimos publicar nossa primeira biblioteca no NPM!!!
E se quiser se aprofundar mais no front-end, aqui na **Alura** temos uma

[**formação front-end**] para você começar do zero e se tornar um profissional de
ponta.
A facilidade de criar seu **podcast** e publicar em ferramentas como o Spotify

cresceu muito. Ao mesmo tempo, vejo um possível grande problema se repetindo cada
vez mais: a **captação do áudio** com baixa qualidade.
Um podcast sem uma excelente edição e cortes, porém com áudio bom, que faz com que
você se sinta próximo as pessoas e narradores, é um produto bastante aceitável. O
contrário não funciona bem: não adianta tentar fazer mágica com um áudio distante,
cheio de reverberação, ruídos de fundo e palavras ininteligíveis.
Com um equipamento bastante básico é possível ter um resultado incrível, mesmo em
salas que não sejam adequadas para gravação. Temos três podcasts gravados pelo
grupo Caelum Alura: Hipsters Ponto Tech, Like a Boss e Carreira sem Fronteiras. O
setup dos três é bem parecido e gostaria de compartilhar com vocês. Grande parte do
aprendizado aqui veio da equipe da [Radiofobia].
## Microfone: ATR2100-USB
Minha preferência é usar cardioides direcionais: aqueles microfones que parece com
o dos cantores de banda. Por quê? Pois dessa forma você não precisa de uma sala
acústica, nem precisa se preocupar com o latido do cachorro do lado de fora da sua
casa: ele basicamente só capta o som que estiver na direção dele.
imagem
O [ATR2100] foi uma recente descoberta: relativamente barato, bom e possui entrada
USB dispensando o uso de adaptadores ou interfaces diferentes com o computador. É
facilmente encontrado no Brasil. Outra opção, porém sem USB, são os populares
[XM8500 da Behringer].
Nunca gostei dos microfones condensadores como os populares Yetis: eles captam até
uma agulha que cai a 10 metros de distância na sala. Se você tem uma sala de música
em casa, pode ser uma opção viável. Não é o meu caso e a diferença no final será
mínima para o podcast.
## Gravações externas: Zoom H6
O [Zoom H6] é um gravador portátil realmente leve, que comporta até 4 microfones (e
6 com um adaptador). Se você vai gravar com convidados, essa é de longe a melhor
opção. Usa pilhas, tem um visor para acompanhar a gravação, consegue gravar cada
microfone em um canal diferente e tudo em SD card. Eu consigo carregá-lo junto com
outros 4 microfones e um headphone em uma pequena bolsa.
imagem
De quebra, o H6 pode ser usado como interface entre um microfone XLR e o

computador. As alternativas são usar um Tascam ou uma mesa da Zoom.
## Software de comunicação: Google Hang Outs
Aqui vai um pouco do gosto de cada um. Skype ou Hangouts são as opções mais óbvias,
mas há outras. O Whereby (antigo appear in) é um serviço para as pessoas se
conectarem sem necessidade de logins e senhas, além de ferramentas como o zencastr
(que eu e colegas já tivemos muitas dores de cabeça).
## Software de gravação: Audio Hijack
Novamente influenciado pela equipe da Radiofobia, eu utilizo o [Audio Hijack] para

Mac, que permite definir de onde gravo o som, em que arquivo, formato, etc.
Para o Windows, há o software grautito [OBS Studio], que também funciona nas outras
plataformas. Para o Skype há o plugin _ecamm_ que dizem funcionar bem.
Você pode aprender muito mais com o [curso de podcast do Leo Lopes] aqui na Alura.
imagem
Neste episódio do Alura Live, recebi Rodrigo Turini, líder da equipe de

desenvolvimento da Alura que também é entusiasta do Java 9 e seu fiel escudeiro e
estagiário de desenvolvimento, Philippe Ehlert, para batermos um papo sobre as
novidades e as novas tendências dessa nova versão do Java que vem dando o que
falar.
Fique por dentro das novidades da versão 9 do Java.
https://www.youtube.com/watch?v=RQor1jDHi1g
Achou legal esse vídeo? Assista o [episódio completo]!
Dê seus [primeiros passos com Java] e [orientação a objetos].
Quer começar uma carreira como desenvolvedor ou se aprofundar nos conceitos mais
avançados? Conheça nossas carreiras: [Desenvolvedor Java Junior] e [Avançando na
Plataforma Java].
Veja outros cursos e carreiras na [Alura]!
Não deixe de seguir: [Rodrigo Turini], [Philippe Ehlert], a [Alura] e [euzinho] no

Twitter! :D
Criar um objeto em JavaScript é bem tranquilo:
javascript
Como faríamos pra ter um segundo produto, com o mesmo cálculo de desconto? Assim:
javascript
Puxa... Perceba que repetimos _exatamente_ o mesmo código no método

`calculaDesconto` para os dois produtos. Além disso, repetimos o nome dos outros
atributos, correndo o risco de digitá-los errados.
Como resolver isso? E se pegassemos a estrutura comum dos produtos (ter nome, preço
e poder calcular desconto) e colocássemos em uma função `criaProduto`? Algo como:
javascript
Perceba que na função `criaProduto` retornamos um objeto que terá sempre os nomes
de atributos. Além disso, não repetimos o código da função de desconto :)
Interessante! E o mais bacana é que o JavaScript já vem com uma sintaxe para
definir a estrutura comum entre os objetos:
javascript
Observe que:
- não precisamos retornar nada
- as propriedades são definidas com `this`
- é usado `=` ao invés de `:` para atribuir
- as linhas são separadas por `;`
- ao criar os produtos usamos o `new`
A sintaxe anterior é a maneira correta de definir a estrutura para seus objetos e é

chamada de **construtor**. Essa estrutura comum dos objetos muitas vezes é chamada
de _classe_.
Na nova versão da linguagem JavaScript, o _EcmaScript 2015_, há uma outra maneira

de criar um construtor (e a classe):
javascript
Repare que:
- temos uma `class`, e não mais uma `function`

- definimos os atributos dentro de `constructor`
- o método `calculaDesconto` fica a parte, sem o `this`
**A linguagem Javascript tem vários recursos poderosos. Nossos [cursos de

Javascript] da Alura e a [Formação Front-End] da Caelum podem te ajudar a
aprofundar nessa linguagem :)**
Sou monitor de um professor na faculdade e uma das minhas tarefas é corrigir alguns
trabalhos.
A turma tem uns 40 alunos e eles farão 3 trabalhos ao longo do semestre. No final
do curso, preciso fazer um relatório para o professor, indicando quais alunos estão
de recuperação, reprovados ou aprovados.
Rapidamente fiz um programa em Python que lê uma lista de alunos e suas notas e
imprime na tela a situação de cada um. O código ficou mais ou menos assim:
python
Não tem problema se você não manja de Python, o importante aqui é entender que esse
código lê várias linhas do teclado na forma:
```
Nome do aluno;
Nota1;
Nota2;
Nota3
```
E imprime na tela algo como:
```
Nome do aluno: Aprovado
```
A execução do código é a seguinte:
```
$ python media.py > João da Silva;8;7;9 João da Silva: Aprovado > Larissa
Souza;10;9;10 Larissa Souza: Aprovado > Mario Oliveira;5;4;5 Mario Oliveira:
Recuperação > Pedro Carvalho;3;0;1 Pedro Carvalho: Reprovado
```
Embora o programa funcione, existem alguns detalhes que ainda dificultam a rotina
de gerar o relatório, vamos entender quais são:
- O programa imprime imediatamente depois que digito, deixando o resultado final

confuso.
- Dá muito trabalho rodar de novo. Se eu esquecer de um aluno, preciso digitar 40
nomes com 3 notas cada de novo.
Se o programa lesse os alunos e notas de um arquivo, daria para modificar só uma

linha facilmente. Uma opção é alterar o código para trabalhar com arquivos. Essa
alternativa é viável porque o código é meu e eu sei trabalhar com Python. Ficaria
mais ou menos assim:
python
## Entendendo o redirecionamento
Nem sempre temos o luxo de ter acesso ao código fonte dos programas que usamos.
Então como podemos fazer para ler as informações de um arquivo e direcionar cada
linha para o nosso programa sem mexer no código?
Em sistemas baseados no Unix (como é o caso do Linux e do Mac), todos os programas

são associados a uma **entrada e saída padrão**. Em geral, a entrada é o teclado e
a saída é a tela (terminal). Podemos **redirecionar** tanto a entrada quanto a
saída padrão de qualquer programa sem mexer no código, podendo facilmente ler e
escrever em arquivos.
### Redirecionando a entrada
Para **redirecionar a entrada** do código original, basta utilizar o caractere `<`

na hora de rodar o programa, indicando um arquivo de entrada. Então vamos criar o
arquivo `notas.txt` com o conteúdo:
```
João da Silva;8;7;9
Larissa Souza;10;9;10
Mario Oliveira;5;4;5
Pedro Carvalho;3;0;1
```
Rodando o programa da seguinte forma:
python
O resultado já ficou muito melhor. Agora posso copiar e colar a saída e mandar para
o professor tranquilamente. Também posso mudar o nome do arquivo a ser lido com
facilidade.
### Modificando o código para escrever num arquivo

Já melhorou bastante, porém estamos lidando apenas com 4 alunos. E se fossem 1000?
Copiar 1000 linhas do terminal não é nada produtivo. Seria uma boa jogar a saída
num arquivo também, certo?
Podemos fazer isso modificando o nosso código, da seguinte forma:
python
Observe que modificamos algumas boas linhas de código. Meio trabalhoso, não acha?
### Redirecionando a saída
Que tal utilizarmos o redirecionamento também? É muito mais cômodo porque não vamos
mexer em código.
Para **redirecionar a saída** do código original, basta utilizar o caractere `>` na

hora de rodar o programa, de forma semelhante ao redirecionamento da entrada:
text
E se olharmos o conteúdo de `resultado.txt`, veremos:
```
João da Silva: Aprovado Larissa Souza: Aprovado Mario Oliveira: Recuperação Pedro
Carvalho: Reprovado
```
### Redirecionando entrada e saída ao mesmo tempo
Uma coisa legal sobre o redirecionamento é que podemos fazer uma combinação. Não há
nenhum problema em redirecionar tanto a entrada quanto a saída, isto é, podemos
realizar o redirecionamento de saída e entrada **ao mesmo tempo**, veja como:
```
$ python media.py < notas.txt > resultado.txt
```
Quando fazemos esse redirecionamento o nosso programa primeiro lê o arquivo

`notas.txt` e depois escreve em `resultado.txt`.
## Truncamento
Agora os principais detalhes foram resolvidos, vou corrigir os trabalhos e gerar o

relatório para o professor.
Como a turma é tanto para alunos do curso de Ciência da Computação como para alunos
de Sistemas de Informação, decidi colocar as notas em dois arquivos diferentes:
`notas_cc.txt` e `notas_si.txt`. Seus conteúdos são mais ou menos o seguinte:
```
notas_cc.txt Julia Aparecida;8;9;9 Gabriel Russo;2;4;2
notas_si.txt Danilo Gomes;10;9;10 Horacio Soares;5;7;4
```
Vou rodar meu programa duas vezes e meu relatório estará pronto:
```
$ python media.py < notas_cc.txt > resultado.txt $ python media.py < notas_si.txt
> resultado.txt
```
Olhando o conteúdo de `resultado.txt`:
```
Danilo Gomes: Aprovado Horacio Soares: Aprovado
```
O que houve com os alunos de Ciência da Computação? Eles deveriam estar no arquivo
também.
O problema é que quando redirecionamos a saída de um programa para um arquivo, o

sistema operacional **trunca** o arquivo antes, isto é, apaga todo seu conteúdo.
Não é isso que queremos... E agora?
Podemos redirecionar a saída com os caracteres `>>`, que fazem exatamente a mesma
coisa com a diferença de que o arquivo não é truncado. Veja:
```
$ python media.py < notas_cc.txt > resultado.txt $ python media.py < notas_si.txt
>> resultado.txt
```
Na primeira vez, truncamos o arquivo e escrevemos. Na segunda, apenas escrevemos.

Olhando para o conteúdo de `resultado.txt` vemos:
```
Julia Aparecida: Aprovado Gabriel Russo: Reprovado Danilo Gomes: Aprovado Horacio
Soares: Aprovado
```
## Para saber mais
Além de ler e escrever em arquivos, com esses redirecionamentos é possível fazer os

programas conversarem, ou seja, podemos redirecionar a saída de um programa para a
entrada de outro.
O programa [`ps`] com a flag `-x` imprime todos os processos que estão rodando
nesse momento. Muitas vezes, esta lista é enorme e fica muito difícil procurar um
processo. Podemos utilizar o programa [`grep`] para filtrar esses resultados.
O `grep` funciona de várias formas, mas uma delas é procurar um texto na entrada.
Mas como redirecionar a saída do `ps` para a entrada do `grep` ?
Poderíamos utilizar um arquivo para guardar a saída e depois utilizá-lo como

entrada, porém podemos fazer isso diretamente utilizando o caractere `|` (chama-se
_pipe_). Basicamente, pegamos a saída padrão de um programa e jogamos para a
entrada padrão de outro. Vamos ver um exemplo:
```
$ ps -x | grep Eclipse 41891 ?? 0:37.48
/Users/gabriel/Applications/Eclipse.app/Contents/MacOS/eclipse
```
Agora que eu sei que meu processo tem o _PID_ 41891, eu posso rodar `kill 41891`
para fechar o Eclipse travado.
## Resumindo
Nesse post aprendemos que é possível ler e escrever em arquivos sem precisar mexer
no código de nossos programas. Para fazer isso, utilizamos os seguintes
redirecionamentos:
- `<` para redirecionar a entrada

- `>` para redirecionar a saída truncando (apagando) o arquivo
- `>>` para redirecionar a saída sem truncar o arquivo
Que tal aprender mais sobre o Shell e Linux no geral? Aqui na Alura temos diversos
cursos online de [**Linux**] para você aprender desde a estrutura básica do Linux
como também os principais programas e comandos desse sistema operacional.
Na Alura, alunos fazem diversos cursos de diversas categorias. Queremos visualizar

isso. Pense por exemplo um aluno que faz [**5 cursos de programação**] e [**2 de
design**] pode ser representado como (5,2) enquanto uma aluna que fez 10 de design
e 1 de programação como (1,10). Portanto se tenho duas dimensões (programação e
design) os estudantes caem num plano em R^2 (estritamente positivo) que pode ser
facilmente plotado.
Pensando em estudantes que fazem muitos ou poucos cursos, podemos gerar uma
quantidade (1000) aleatórias de cursos que eles fazem em Python:
py
E imprimir dois exemplo de muitos cursos feitos e poucos cursos feitos:
py
Com a saída:
py
Ótimo, somos capazes de criar agora um conjunto de dados de alunos que fazem muitos
cursos de programação e poucos de design, por exemplo:
py
Tendo como exemplo de resultado:
py
Ótimo, somos capazes então de criarmos um conjunto de dados aleatório de alunos e

alunas que fizeram mais programação e mais design:
py
Agora podemos usar a biblioteca `seaborn` para plotar os alunos:
py
imagem, o gráfico permite visualizarmos os 3 grupos de alunos de maneira clara.

Isso pois o grupo de mobile foi gerado intencionalmente com um número baixo de
cursos de programação e design.
É comum em situações como essa desejarmos colorir cada ponto de acordo com uma
característica ou categoria. Vamos definir uma categoria (texto) para cada ponto:
py
Que resulta em uma coluna nova chamada categoria, indicando o que escolhemos para
esse grupo:
py
Ótimo, mas o código está bastante repetitivo, que tal deixarmos valores padrão de
poucos cursos para todos os cursos que não passarmos?
py
Pronto, vamos indicar no plot que queremos o tom de cor (`hue`) de acordo com a
coluna categoria:
py
py
imagem para determinar a cor. O `scatter` do `matplotlib` é mais baixo nível e

requer, nessa situação, strings que condizam com cores reais, e não categorias. Uma
maneira de fazer isso é mapearmos cada categoria para uma cor com um dicionário:
py
E agora usarmos uma lambda para mapearmos a coluna categoria pra a cor:
py
![]
[Você pode encontrar todo o código desse primeiro post no github]. Dentre [**alguns
dos cursos existentes de Data Science e Machine Learning na Alura**], [**o plot de
dados em diversas dimensões é fundamental para explorar os mesmos**].
Estou desenvolvendo um sistema de vendas web utilizando [**Spring Boot**] e agora o

cliente pediu algumas funcionalidades um pouco peculiares...
Ele deseja saber como está o fluxo de vendas por um determinado período, por
exemplo, a cada hora, ou então, a cada dia... Como será que podemos fazer essa
rotina que irá realizar essas tarefas agendadas?
### Utilizando a API Timer do Java
Inicialmente, em uma implementação utilizando as APIs disponíveis em Java,

poderíamos fazer uso da classe [`Timer`]:
java
Em seguida, faríamos uso do método `scheduleAtFixedRate()` que espera uma

implementação da classe abstrata [`TimerTask`] como primeiro parâmetro e mais dois
parâmetros do tipo `long` que indicam o início da execução e tempo constante para
reexecutar sucessivamente em **milisegundos**:
java
Em outras palavras, neste exemplo estaríamos executando o código, inicialmente,

depois de um segundo, e então, todas as vezes após 5 segundos!
Considerando esse exemplo, para que conseguíssemos realizar aquela consulta para o
cliente que verifica o fluxo de vendas de um determinado período, como por exemplo,
uma hora, faríamos algo como:
java
Em outras palavras, poderíamos criar uma classe responsável em ficar verificando as

vendas realizadas a cada uma hora e nos devolveria a resposta que o nosso cliente
tanto espera!
## Utilizando a annotation @Scheduled
Porém, veja a quantidade de código que tivemos que escrever para que fosse possível
realizar essa tarefa! Neste caso, já que estamos utilizando o Spring, será que não
tem uma forma mais fácil?
Felizmente, temos a annotation [`@Scheduled`] que já faz todo o papel do `Timer` e

`TimerTask` pra nós! Em outras palavras, faríamos a mesma coisa que fizemos
anteriormente da seguinte maneira:
java
Veja que o código diminuiu e muito! Porém, o que está acontecendo agora? No momento
em usamos a annotation `@Scheduled` indicamos ao Spring que aquele método será
agendado.
Além disso, veja que está sendo enviado o parâmetro `fixedDelay`, esse parâmetro é
equivalente ao último parâmetro do método `scheduleAtFixedRate()` da classe
`Timer`, ou seja, é o tempo fixo que sempre vai ficar rodando!
Também podemos usar outros parâmetros caso for necessário, segue alguns exemplos:
- **initialDelay**: Configura a espera inicial do agendamento, basicamente ele é

equivalente ao primeiro parâmetro do método `scheduleAtFixedRate()`. Ele também
recebe valores `long` indicando os milisegundos.
- **fixedRate**: Configura um período fixo entre o início e fim da execução do

agendamento.
Observe que estamos fazendo a mesma coisa que fazíamos antes, porém com um código
muito mais simples de ser compreendido!
## Configurando o agendamento no Spring

Conhecemos o Spring como um framework que facilita e muito a vida do desenvolvedor,
isto é, com pouca configuração ele é capaz de gerenciar o ciclo de vida dos objetos
entre diversas outras coisas...
Porém, para que isso seja possível, pelo menos uma vez, precisamos indicar ao
Spring que ele tenha esse tipo de comportamento! Portanto, para rodarmos o
agendamento das tarefas com o Spring, será necessário realizar algumas
configurações também.
### Transformando a classe em Component
A primeira delas é fazer com que a classe que esteja utilizando a `@Scheduled` seja
gerenciada pelo Spring. A forma mais fácil de fazer isso é basicamente tornando-a
um [`Component`] por meio da annotation `@Component`:
java
### Habilitando o agendamento
Agora que a classe está sendo gerenciada, precisamos apenas informar ao Spring que
queremos habilitar o agendamento para ela por meio da annotation
`@EnableScheduling`:
java
Pronto, a nossa classe já está configurada! Agora basta apenas reiniciar o seu
projeto do Spring Boot que o agendamento rodará!
Lembrando que para realizar um teste mais perceptível utilize a base dos segundos
no parâmetro `fixedDelay` ou `fixedRate`. ;)
## Agendamento por um determinado horário do dia
Veja que agora conseguimos solucionar a situação em que o cliente queria ver a
quantidade de vendas a cada 1 hora, ou seja, fizemos um agendamento a cada X tempo.
Entretanto, se o cliente chegar e falar o seguinte:
> _"Quero também um relatório que me mostre quantas vendas foram realizadas até a
meio dia de todos os dias!"_
E agora? Como poderíamos fazer? Bom, uma solução inicial seria fazer com que a
nossa task iniciasse às 12:00h, e então, ela tivesse um tempo fixo de 24:00h,
certo? Dessa forma, todas as vezes que passe às 24:00h seria a meio dia de cada
dia...
Entretanto, veja que esse tipo de solução não é adequada, afinal, teremos algumas
complicações dependendo de alguns cenários, por exemplo:
- **Aplicação (servidor) reiniciando**: O período de 24:00h não seria mais válido.

- **Mudança de horário**: Dependendo do cambio do horário teríamos 1 hora a mais ou
a menos, ou seja, mais um preocupação.
E agora? Será que tem alguma forma de contornar essa situação?
## Agendamento com o Cron
Considerando todos esses cenários, o ideal seria fazer uso de algum tipo de recurso
que permitisse de fato configurar de uma forma mais específica, os minutos, horas
ou até mesmo o dia que o determinado agendamento será executado.
Um dos mecanismos utilizados em sistemas baseados no Unix (como é o caso do Linux),
para o agendamento de tarefas de uma forma mais pontual, é o [Cron].
Basicamente o Cron é um programa que permite realizarmos a execução de jobs em um

determinado período, como por exemplo: a cada A segundos, B minutos, C horas no dia
D execute uma tarefa!
Todas as definições são feitas por meio de um recurso chamado [**Cron

Expression**].
### Exemplos do uso do Cron
Abaixo seguem alguns exemplos de execução do Cron utilizando Cron Expression:
- **A cada segundo**: ```

"1"
```
- **Todos os dias que o horário tiver ao menos `01` segundos**: ```
"1"
Exemplos: 11:22:01, 11:23:01...

"0 0"
```
Exemplos: 00:00:00, 01:00:00...
### Significado de cada campo do Cron
A princípio o Cron pode parecer algo muito bizarro, porém, cada campo possui um
significado bem especificado. Abaixo é listado o que cada campo significa junto com
seus valores esperados:
```
A B C D E F
```
- **A**: Segundos (0 - 59).

- **B**: Minutos (0 - 59).
- **C**: Horas (0 - 23).
- **D**: Dia (1 - 31).
- **E**: Mês (1 - 12).
- **F**: Dia da semana (0 - 6).
Note também que nos exemplos foram usados o `*`, esse caracter indica que para o
campo específicado qualquer valor será considerado.
**Observação**: Quando fazemos uso do `"/"` concatenando algum valor, indicamos o

seguinte: para cada (`/`) X (valor numérico) repetição acione, em outras palavras,
`*/1` indica que se qualquer valor do campo **segundo** mudar será acionado, logo,
se fosse `*/2`, a cada 2 vezes que o campo **segundo** mudar de valor, será
acionado.
## Usando o Cron no Scheduled
Tendo conhecimento de todo o poder do Cron nessa pequena demonstração, seria

superbacana usar um recurso similar ao Cron no `@Scheduled`...
Felizmente podemos também fazer uso dele por meio do parâmetro `cron`, ou seja,
para executar aquele agendamento que pegaria as vendas todos os dias ao meio dia
poderia ser feito da seguinte maneira:
java
Nessa Cron Expression temos uma execução de todos os dias ao meio dia!
## Cuidados ao usar o Cron
Embora o Cron resolva o nosso problema de executar uma tarefa em um período bem
específico, existe uma situação que pode ser problemática, que é justamente a [Time
Zone]. Em outras palavras, se o local no qual o seu software estiver hospedado
tiver um Time Zone diferente do seu, o horário de meio dia pode ser que não seja
igual ao seu!
**Dessa forma, o Cron causaria mais problemas do que resolveria... E agora?**
Como sempre a gente vê, há sempre aquela flexibilidade em configurações quando

usamos o Spring, e com o agendamento de tarefas não seria diferente! Ou seja,
podemos também definir sob qual Time Zone a `@Scheduled` será executada por meio do
parâmetro `zone`! Então ficaria da seguinte maneira:
java
Veja que agora estou enviando o Time Zone Àmerica/Sao_Paulo` que é justamente o
Time Zone utilizado aqui em São Paulo - SP, portanto, o agendamento poderá ser
executado sem a preocupação de onde o projeto esteja alocado!
Querendo conhecer o Spring? Que tal começar hoje mesmo na Formacao de

[**Desenvolvedor Java Web com Spring**]? Nesta seleção de cursos, você irá aprender
a criar uma aplicação Web bem robusta desde o zero com um dos frameworks mais
famosos do mundo Java! Veja também todo nosso conteúdo de [**Java, Web, Spring,
Hibernate, Testes e mais**].
O número de cursos da Alura vem crescendo bastante e com isso temos um bom
problema: qual curso devo realizar primeiro? E depois, para onde ir?
## Novas formações Alura!
Pensando nisso, eu tenho um anúncio bem interessante para fazer hoje: estamos
lançando as formações Alura. São inicialmente [**seis formações**]:
- [Formação Engenheiro Front-end];

- [Formação Desenvolvedor Android];
- [Formação UX Designer];
- [Formação Desenvolvedor Java];
- [Formação Desenvolvedor .NET];
- [Formação Motion Designer].
![]
As formações são algo bem mais interessante que um simples conjunto de cursos:
**são verdadeiros guias** para você entregar o resultado que precisa. Além dos
cursos, há posts para blogs, podcasts, videos no youtube e muito mais.
## Projetos de Conclusão de Formação
E, para alunos Premium Plus novos e antigos, temos uma outra novidade: no final da
formação você pode entregar um projeto final, seguindo requisitos propostos pela
formação, e tê-lo avaliado pelos nossos instrutores e monitores, com um certificado
de avaliação e feedback.
Alteramos também os planos de acordo com os recursos que vocês mais usavam. O plano
Premium Plus reformulado dá acesso a Alura Start e aos projetos e avaliações da
formação. E o acesso à Alura Lingua ficou para o novo plano Max. Quem já era aluno
dos antigos planos continuam com os mesmos recursos e quem era Premium Plus ainda
ganha o acesso aos projetos e avaliações.
Então, se você tinha dúvidas de quais próximos passos dar nos seus estudos, que tal
conhecer melhor as seis primeiras formações da Alura e se organizar para esse
desafio? E se não conhece ainda a Alura, temos uma nova [**página mostrando como é
estudar com a gente**]!
Estou estudando aprendizado de máquina e, para isso, criei um algoritmo que tenta
predizer quais times de futebol podem ganhar na rodada.
O algoritmo utiliza de quatro perguntas:
- O time joga em casa?

- Teve algum jogador expulso?
- Está perto da zona de rebaixamento?
- O time ganhou?
Para treinar o algoritmo, eu utilizei dados de diversos times, vindos de um arquivo

CSV. No arquivo, esses dados estão agrupados dessa forma:
python
Respondemos as perguntas com os números `1` para sim e `0` para não. Por exemplo, o
primeiro time jogou em casa, não teve jogador expulso nem está perto da zona de
rebaixamento, e ganhou o último jogo. Enquanto o segundo time jogou em casa e teve
um jogador expulso, ele não está perto da zona de rebaixamento nem ganhou o último
jogo.
Já temos alguns dados disponíveis para serem usados, portanto, vamos começar a
treinar nosso algoritmo!
## Treinando a máquina
O **Python** é uma linguagem muito utilizada para análise de dados e aprendizagem

de máquina,por isso, vamos utilizá-la para criar nossos modelos.
Nosso algoritmo precisa conhecer nossos dados para começar a "adivinhar" os

resultados. Esses dados estão salvos em um arquivo CSV, onde cada linha representa
um dado sobre um jogo de um time.
Para treinar nosso algoritmo, antes precisamos abrir esse arquivo. Vou utilizar o
[**Pandas**] para conseguir abrir o CSV no Python.
O Pandas lê o nosso arquivo CSV e nos retorna um objeto com nossos dados agrupados
como se fossem uma tabela, esse objeto é conhecido como um [**data frame**].
Esse data frame tem todos os nossos dados. Contudo, nós temos dois tipos de dados
diferentes, os dados que o algoritmo usa para chegar aos resultados - se o time
joga em casa, por exemplo - e as marcações - se o time ganhou.
python
Bacana! Já temos nossos dados e marcações separados, agora podemos treinar nosso
modelo.
> Mas como o nosso algoritmo vai conseguir classificar os jogos?
Existem vários algoritmos para o aprendizado de máquinas, um bem conhecido é o

[**Naive Bayes**]. Com esse algoritmo, vamos conseguir classificar se um time vai
ganhar ou não dependendo das variáveis como se ele joga em casa ou não.
Na biblioteca [**Scikit-learn**] temos algumas implementações do algoritmo Naive

Bayes. Podemos falar para o Python importar do módulo `naive_bayes` da Scikit-learn
(`naive_bayes`) o algoritmo **MultinomialNB**, que é uma das implementações do
**algoritmo Bayesiano**.
python
Criamos nosso modelo, precisamos treiná-lo agora. Mas se nós usamos todos os dados
para treinar o nosso modelo, como podemos validar depois?
## Dividir e treinar
Se nós utilizarmos todos os nossos dados para treinamento, não conseguiremos

validar o nosso algoritmo. Quer dizer, até conseguimos utilizar os mesmos dados
para testar o aprendizado, mas o algoritmo já os conhecerá, ou seja, não teremos um
cenário "desconhecido" para realizar o teste.
Pensando nisso, o que podemos fazer é separar uma parte dos nossos dados em dados
de treino e dados de teste:
python
Agora basta falar para o nosso algoritmo treinar (`fit`) utilizando nossos dados de
treino:
python
Podemos pedir para o modelo predizer o resultado do conjunto de teste e, com base
nas nossas marcações, validar o tanto que o nosso algoritmo acertou:
python
Rodando esse código, vemos que nosso algoritmo acertou cerca de **66% das vezes**,
bacana, mas, o que acontece se mudarmos o valor do nosso tamanho de treino para que
nosso algoritmo tenha menos dados para treinar?
python
Mudando o nosso tamanho de treino, o nosso algoritmo acerta agora em cerca de

**65.9% das vezes**. Mesmo não sendo um valor tão distante um do outro, são valores
diferentes. O que acontece se aumentarmos um pouco o tamanho de treino?
python
Neste caso, o nosso modelo acertou em cerca de **60% dos casos**. Um valor já bem
diferente dos outros dois, por que isso aconteceu?
## Combinando os dados
O que acontece se o nosso primeiro time, que está sendo utilizado no treinamento,
for para a última posição do nosso conjunto? Neste caso, o algoritmo teve uma taxa
de acerto de **61.46%.**
Alterando a posição do elemento, temos um conjunto com dados completamente

diferentes. Isso ocorre pois prendemos o algoritmo na sequência que os dados foram
apresentados, isto é, a posição de cada elemento importa para o resultado do
algoritmo. É por isso que quando alteramos o tamanho de treino o nosso algoritmo
muda o resultado também. O que podemos fazer para evitar isso?
O que podemos fazer é separar uma parte dos dados para treino e teste criando
várias combinações diferentes. Dessa forma cada combinação nos daria um resultado
e, com esse resultado, veríamos o quão bom foi o nosso algoritmo.
Por exemplo, vamos supor que temos dez dados em todo o nosso conjunto. Podemos
pegar os dados de um a oito e treinar o algoritmo e utilizar os dados nove e dez
para testá-lo. Depois podemos pegar os dados de três a dez e utilizá-los para o
treino, e então pegar os dados um e dois e testar nosso algoritmo com eles.
Dessa maneira, podemos fazer `k` **combinações** cruzando o nosso conjunto de

dados. Cada um dos cruzamentos, nos retorna um valor que é a taxa de acerto daquela
combinação.
Assim validamos nossos dados cruzando várias combinações possíveis. O nome dessa
técnica em aprendizado de máquina é **validação cruzada**, ou em inglês **cross
validation**.
Podemos pedir para o Python importar da biblioteca Scikit-learn do módulo de

seleção de modelos (`model_selection`) a função de cruzamento de valores
(`cross_val_score`).
Passamos como parâmetro dessa função o nosso modelo, e os valores dos nossos dados
para treino, também precisamos falar quantas combinações (`cv`) queremos que ela
faça:
python
Essa função nos retorna um vetor com as taxas de acerto de cada combinação. Nós
podemos tirar uma média geral somando esses valores e dividindo pelo tamanho do
vetor:
python
Agora temos uma média de como o algoritmo MultinomialNB trabalha no nosso conjunto
de dados, que no caso é **60%**. Podemos utilizar essa mesma técnica em outros
algoritmos e decidir qual o melhor modelo para o nosso conjunto de dados e validá-
lo com o nosso conjunto de testes.
## Para saber mais
Essa técnica de validação cruzada que utilizamos é chamada de **K-fold**. Ela é uma
técnica muito utilizada em aprendizado de máquina, pois nos permite testar em
vários cenários os nossos algoritmos antes de colocá-los em produção.
Além do algoritmo de Naive Bayes, existem diversos outros algoritmos que podemos
usar para ensinar a máquina.
Aqui na **Alura**, temos uma [**formação em Machine Learning**]. Nela, você

aprenderá sobre estatística, sobre como funciona um algoritmo de classificação.
Aprenderá a classificar e-mails, a dizer se um usuário comprará ou não um produto.
Verá como criar um sistema de recomendação, e até chatbots.
Aproveitando o mês das mulheres, trouxemos um tema interessante: ser mulher,

profissional e mãe. Como isso funciona?
Poderia começar esse texto falando de todos os tabus que soam até mesmo como
clichês para a rotina da maternidade, mas a ideia aqui é colocar um relato pessoal
especialmente no que diz respeito à volta ao trabalho.
Não importa quantas histórias contem sobre como é difícil conciliar esses dois
papéis, cada uma sempre vai ser muito singular. Ainda assim, existem aí alguns
desafios que costumam acontecer muito em comum com todas elas.
## Ser uma boa mãe ou ser uma boa profissional?
O maior tabu sobre a maternidade nasce quando criamos essa divisão mental sobre a
profissão e o papel de mãe. Parece uma divisão muito sensível que aponta uma enorme
dificuldade em exercer bem os dois papéis ao mesmo tempo.
Existe um sentimento de culpa independente de qual das partes definimos como

prioridade. Quer dizer, se decidimos voltar a nos dedicar ao trabalho surge o
sentimento de culpa por não poder cuidar de perto de alguém que até então construiu
um vínculo muito forte com a gente e com a nossa rotina.
Mas se decidirmos deixar a profissão com menos prioridade, sentimos culpa por ter
dedicado tanto tempo de estudo e esforços que agora serão deixados de lado.
Tanto para mulheres quanto para homens existe uma necessidade de sentir-se
produtivo, de enxergar um sentido para as atividades que exercemos, sejam elas
quais forem.
Além disso, como citam [**Suzana Ayarza e Aline Prado**] da equipe de marketing do
Google:
> "A questão cultural tem um peso enorme nesse comportamento. O ato de cuidar é
inerente ao ser humano, seja qual for o gênero, mas a divisão convencional das
funções nas famílias levou o homem a trabalhar fora de casa, e a mulher a criar os
filhos e administrar a casa. Infelizmente, o aumento da participação feminina no
mercado de trabalho não trouxe a diminuição proporcional nas atividades
domésticas."
Existem muito mais degraus a considerar quando falamos nessa jornada dupla entre
profissional e mãe.
E essa pode ser uma das questões que surgem para as mães que regressam ao trabalho.
Só que, quando decidimos efetivamente voltar ao mercado profissional e nos ajustar
a essa nova fase, precisamos considerar mais algumas coisas...
## Produtividade na volta ao trabalho
Existem muitas pessoas que dizem conseguir retornar ao trabalho integralmente,

focada nos objetivos que veio cumprir ao longo do expediente - às vezes seguido até
de um segundo período como estudante - e, ao voltar para casa, voltam com 100% da
sua atenção ao filho e atividades pessoais.
Bom, nem sempre esse é o caso…
Em um relato pessoal, poderia dizer que ansiava a volta ao trabalho pelo simples
fato de gostar muito de me sentir produtiva, criando e entregando valor para a
minha profissão.
Só que, ao retornar, o que parecia muito simples de repente tornou-se um momento de

reflexão e adaptação um pouco mais intenso.
O ritmo parecia muito diferente. Os mesmos desafios de antes pareciam ter mudado de
sentido e o apego a determinadas atividades ficou muito menos motivador.
Me perguntei: Por que será que isso está acontecendo? Sempre fui muito metódica
quanto às minhas atividades, mas por algum motivo o lógico da teoria parecia muito
menos lógico na prática.
Acabei me sentindo muito frustrada por não conseguir acompanhar o ritmo de todo
mundo na mesma intensidade. Me cobrei (como uma característica da minha
personalidade) e tentei usar meu tempo em casa para refletir e chegar a novos
consensos, mas a rotina com um bebê de cinco meses me tirava toda a energia no fim
do dia (momento que eu teria para fazer essa reflexão).
Tudo parece virar uma bola de neve e a adaptação que acreditei durar no máximo uma
semana virou um mês. Nós criamos metas e mais metas sem ter a mínima noção de como
isso vai se desenrolar no meio do caminho.
Um mês sentindo uma dorzinha interna e uma insistente vontade de chegar a algum
lugar que fizesse mais sentido.
Um mês. Foi o que eu precisei para conseguir me ajustar. Algumas pessoas demoram
menos, outras demoram mais, mas uma hora essa produtividade chega.
O mais difícil e o menos recomendado é a comparação. Olhamos para o lado e vemos

diferentes tipos de mães trabalhando em ritmos frenéticos, lidando com tudo de
forma super eficiente e acreditamos muito que precisamos ser assim também: "Se ela
consegue, eu deveria conseguir.".
**Grande erro!** Assim como existem personalidades diferentes, pessoas diferentes,

gostos diferentes e até filhos diferentes, somos mães e mulheres diferentes e temos
cenários familiares diferentes também. Por mais óbvio e clichê que isso possa
parecer, na prática a dor do julgamento (muito mais o interno do que o externo) é
complicadíssima de lidar.
Portanto, o primeiro passo para a produtividade é o foco. Esqueça as distrações de

outras mães, mas não em um passe de mágica, exercite isso todos os dias. Se
pergunte: "Por que eu estou me comparando? Minha realidade é a mesma que a daquela
pessoa? Será que essa realidade que transparece é de fato o que acontece no dia a
dia dela?".
Nós vivemos desafios de formas diferentes e, como mulheres, enfrentamos muitas

outras questões também. Cada uma em uma realidade diferente, ainda que com traços
em comum.
Se cobrar talvez seja a coisa mais normal, o difícil é conseguirmos moldar essa
cobrança para que traga algum valor ou motivação. Em pequenos passos, esse lugar
chega.
## Somos mães, mas somos muito profissionais também
Sabemos de todas as histórias sobre como profissionais mães temem o mercado de

trabalho pelo simples fato de serem mães e como enxergam isso dentro da profissão.
Mas talvez o maior monstro que precisamos destruir é o da dúvida.
No início da carreira todos temos um pouco de medo e dúvidas se conseguiremos um

emprego, se vamos nos encaixar, se conseguiremos entregar o valor que a empresa
espera.
Só que, bem antes de pensar nessas questões, precisamos pensar em nós, mães,
mulheres e profissionais. Você e eu sabemos nossas capacidades e conhecimentos da
área.
Não chegamos até aqui por mérito de esforço e dedicação? Então, por que não
valorizar isso? Quer dizer, o mundo vai continuar sendo um lugar complicado e
assustador por muito tempo, mas nós temos muita capacidade e precisamos acreditar
nisso. Somos profissionais!
Uma vez me disseram algo como: "Você já é a melhor mãe que o seu filho pode ter,
independente de qualquer coisa" e também “Se você se preocupa em ser uma boa mãe,
já é uma boa mãe”.
Essas duas frases me fizeram olhar mais para mim mesma como profissional,
simplesmente porque consegui tirar um pouco da carga de "preciso ser perfeita em
tudo" para “estou dando o melhor de mim”. Isso importa para mulheres, mães e
especialmente para qualquer tipo de profissional.
Para as mães que estão nessa mesma situação em que eu estive, lembrem-se: "Você
está fazendo o seu melhor!" :)
imagem
No app Imagly, quando se entra a primeira vez em uma aba específica, temos a
seguinte tela:
imagem, é importante verificar se não deixamos nenhuma lacuna para que ele se
confunda no que estamos apresentando.
Então, como direcionar melhor o que cada funcionalidade do nosso app faz?
## Preenchendo as lacunas
Se nosso objetivo é orientar o usuário, poderíamos simplesmente adicionar algumas

informações no espaço vazio.
imagem
E o que acha de aprimorar seus conhecimentos para conseguir criar composições mais
atraentes e interessantes nas telas da sua UI? Na Alura temos um curso de
[**composição com Illustrator**] que mostra formas bem legais de como abordar esse
tipo de construção visual.
Quando estamos trabalhando com dados,principalmente na **fase de mineração**,

realizamos muitas mudanças no **dataset**.
Existem colunas que não queremos, ou precisamos usar, ou linhas que não contém
dados válidos que precisam ser removidas.
> Mas quantos mais dados não é melhor?
Quando estamos analisando dados, principalmente para treinar **modelos de

inteligência artificial**, alguns dados podem prejudicar ao invés de ajudar. Por
isso, temos que utilizar apenas os dados que fazem sentido para o modelo.
Legal! Já sabemos que precisamos tratar os dados, mas como podemos fazer isso, como
remover os dados?
# Removendo colunas no Pandas
Estou fazendo uma análise sobre gorjetas em transportes como táxis. Para isso,
estou utilizando o [**Pandas**] que é uma biblioteca que facilita a manipulação dos
dados.
No Pandas, temos um tipo de dado chamado `DataFrame`. Podemos dizer que um data
frame é como uma planilha. Ou seja, temos linhas e colunas.
Podemos ver o começo do conteúdo da planilha utilizando o método `head` do data

frame:
python
imagem** para retirar uma linha. Mas como remover todas as linhas que contém apenas
um passageiro?
Podemos fazer um loop e iterar por cada linha no data frame e checar se o número de
passageiros é maior que um. Se sim, mantemos esse dado, do contrário, removemos do
data frame. Mas qual o problema dessa solução?
Mas o Pandas já tem diversas formas para trabalhar com seus data frames. O que
podemos fazer é criar um filtro no qual é retornado um novo DataFrame com os dados
já filtrados.
O Pandas permite filtrar um DataFrame pelos dados de sua coluna. Por exemplo,
queremos pegar do data frame de gorjetas **(tips)** a coluna que define o número de
passageiros **(size)** e com base nisso, queremos as linhas nas quais a coluna size
é maior que um:
python
Agora, basta passarmos esse filtro como seletor no DataFrame:
python
Esse filtro nos retorna um DataFrame com as linhas onde o número de passageiros é
maior que 1. Ou seja, os dados que passam pelo filtro:
python
![]
# Para saber mais
Os filtros utilizados podem ser mais complexos. Podemos utilizar estruturas

condicionais,como o E e OU e checar o valor de mais de uma coluna. Além disso,
podemos fazer outros tipos de filtros.
Como checar se alguma linha tem um valor nulo, ou um valor de um tipo diferente do
esperado. Para isso, o Pandas utiliza o conceito de [**comparação rica, ou rich
comparison**].
Além de remoção, conseguimos fazer outras operações com os **data frames, operações
que envolvem string, renomear colunas e adicionar colunas novas, juntar um data
frame a outro, entre diversas outras operações**.
Aqui na Alura, temos uma [formação de data science com Pandas]. Nele você verá como
manipular data frames de diversas formas. Além de ver como **criar gráficos,
visualizar estatísticas descritivas, tratar dados faltantes e muito mais**.
Uma **paleta de cores** pode dar vida a um projeto, compor um ambiente, melhorar o
conceito de uma arte e [**servir de inspiração**], sendo limitada apenas pelo
tamanho da sua criatividade.
imagem
Em segmentos de **produção de conteúdo visual**, cada vez mais tem se falado sobre
a influência que a paleta de cores exerce na vida de um profissional, seja ele
aprendiz, amador ou experiente em sua área de atuação.
O fato é que há uma diferença marcante entre o designer que sabe não somente
absorver referências, mas também criar a sua própria paleta de cores, do designer
que sequer sabe da existência desse termo tão importante no ramo de criação visual.
## COLOURlovers
Para começar a nossa lista em grande estilo, nada melhor do que citar o famoso
[**COLOURlovers**], uma [ferramenta prática, acessível e intuitiva]. Trata-se de um
site com **interface agradável** que reúne conteúdos criados pelos usuários,
servindo como inspiração e aprendizado.
Por meio da plataforma é possível pesquisar por temas em diversas categorias, ou,
se você preferir, pode pedir dicas e trocar ideias com outros usuários nos grupos
de discussão do site.
Além disso, também é possível fazer upload de uma imagem de seu computador e
extrair a paleta de cores, por meio dos recursos que a ferramenta oferece. Após o
envio, basta selecionar a cor em uma **miniatura da imagem** e a composição será
apresentada, mediante a predefinição escolhida.
Você encontrará funcionalidades como o **COPASO**, que permitirá a criação da sua
própria paleta, utilizando o **Color Wheel** e um **seletor de HSV e HSL**, muito
parecido com o recurso do **Photoshop** (mas que também possibilita alterações na
saturação da imagem).
Você pode utilizar as predefinições do próprio site, se preferir, para complementar

o seu projeto.
Vale ressaltar, ainda, que além dos grupos de discussão sobre inúmeros assuntos
pertinentes à área de ilustração e design gráfico, o COLOURlovers também oferece
ferramentas interessantes para que você crie as suas próprias [**patterns**] de
maneira simples e divertida.
## Color Explorer
Outra ferramenta inteiramente online para que você crie a sua paleta de cores, sem
precisar instalar [**extensões no Illustrator ou no Photoshop**], é o site [**Color
Explorer**]. Sem dúvidas, um dos mais completos ambientes digitais que todo
estudante de design deveria acessar ao menos uma vez em sua carreira.
Por meio do Color Explorer, por exemplo, é possível extrair a paleta de uma imagem
e utilizar um seletor de cores com todas as opções de sombra ao mesmo tempo,
mostrando o efeito de cada alteração em tempo real.
Após criar a sua paleta de cores, você também pode aplicar diferentes estilos e
filtros que a modificam em tons mais quentes ou mais frios, além de estilos como
sépia e P&B, ou até mesmo cores vivas para projetos mais ilustrativos.
A funcionalidade **Color Matching** permite que a utilização de parâmetros para

encontrar a sua própria inspiração na hora de criar a paleta, bastando apenas
definir uma cor principal como referência e depois realizar ajustes de iluminação,
saturação, entre outros.
Outras duas ferramentas que podem ser muito úteis dentro do Color Explorer são o
catálogo e a conversão de cores. Lembrando ainda que é preciso tomar cuidado ao
utilizá-las, pois os recursos tentarão simular o equivalente à cor do RGB, como se
estivesse em uma versão impressa do arquivo.
Como estudante de design ou profissional na área, você deve saber que, sem um
trabalho minucioso de calibragem dos monitores, essa tarefa pode ser bastante
complexa, já que os dados e valores que constam na tela nem sempre são os mesmos
que sairão na arte impressa.
Por fim, é possível exportar a sua paleta de cores em diversos formatos, podendo
abri-la em inúmeros softwares de [**edição de imagem**] e plataformas diferentes.
## Adobe Kuler
Para utilizar esta ferramenta é necessário ter um nível básico de conhecimento de

informática, já que se trata de uma extensão de temas do Photoshop ou Illustrator,
mas nada que uma simples busca no Google não resolva.
O [**Adobe Kuler**] é um dos recursos mais conhecidos por designers e ilustradores,

por causa de sua integração com os softwares da Adobe. Com ele, é possível criar as
suas próprias paletas por meio do Color Wheel, com predefinições básicas (análogas,
tríade, cores vivas, etc) o que torna a combinação de tonalidades muito mais
prática.
Assim como as ferramentas que citamos anteriormente, o Adobe Kuler também permite
que você envie uma imagem de seu computador para que ele extraia suas principais
cores. A extensão fará uma varredura em toda a imagem, separando a sua composição
em sombras, tons e outras opções.
Vale ressaltar que, para buscar inspirações e referências, também é possível

explorar paletas criadas por outros usuários, já que, ao finalizar um projeto, além
de poder exportá-lo para os mais variados formatos de arquivo [**muito útil na hora
de montar um portfólio de design**], você também pode fazer upload de sua arte.
Basta ter uma **conta Adobe ID** (é totalmente gratuita).
## Color Scheme Designer
Para finalizar o conteúdo não poderíamos deixar de citar uma das ferramentas mais
funcionais e intuitivas para criar a sua paleta de cores, o [**Color Scheme
Designer**].
Além de permitir que você encontre a paleta por meio do tradicional recurso Color
Wheel, separando-as em cores frias e quentes, ele também mostra uma pré-
visualização de cada paleta de acordo com a cor selecionada, abrindo uma página
inteira como exemplo e permitindo que você altere até mesmo a saturação da cor
selecionada ou da paleta inteira.
As paletas de cores podem ser encontradas com o auxílio de alguns parâmetros que a
ferramenta oferece ou, se você preferir, pode gerar uma paleta aleatória. E, ao
finalizar o seu projeto, pode exportá-lo para os **formatos GIMP, +CSS, XML, HTML,
PSD e em texto** caso queira copiar as informações do arquivo.
Por fim, o Color Scheme Designer conta com um[**recurso de acessibilidade**]muito

interessante, que permite que as pessoas que têm algum tipo de deficiência
visual,como a deuteranomalia ou deuteranopia, possam criar uma paleta de cores sem
dificuldades.
Agora que você já conhece as principais ferramentas para criar uma paleta de cores
para seus projetos, aqui na Alura temos uma [**formação em Design Gráfico**] onde
além conhecer mais a fundo o **PhotoShop** vamos aprender **composição, processos
gráfico, tratamento de imagens** e muitas outras habilidades que um designer
profissional necessita.
imagem
Um aplicativo de vendas foi lançado e o layout desenvolvido pelos designers ficou

assim:
imagem
Estou me preparando para a certificação da Oracle e surgiu o seguinte cenário:

posso declarar variáveis com o mesmo nome na mesma classe? Vamos verificar a classe
Livro:
java
Testando minha classe:

java
O resultado é o esperado:
```
> Imposto do livro: 10.0
```
O método `calculaImposto()` sofreu um pequeno ajuste e agora ele mesmo define o

valor padrão do imposto:
java
Espera aí! Duas variáveis com o mesmo nome? Pode isso? Qual valor será retornado?
Testando a classe:
```
```
Como podemos ver, a variável **membro** `preco` não foi retornada, declaramos uma
variável **local** com o mesmo nome, por isso o `calculaImposto()` deu prioridade
para a variável com valor 12.3 e a retornou. A capacidade de esconder uma variável
membro é uma técnica conhecida como **shadowing**. Poderíamos, também, enviar um
parâmetro com o mesmo nome:
java
Modificamos a chamada do `calculaImposto()` para enviar um `double`:
java
```
```
Muito bom, mas... E se e eu quiser retornar o valor da variável membro? É simples,

basta utilizar a palavra chave `this`:
java
Imprimindo o resultado:
```
```
Veja que agora o valor retornado foi o da variável membro, ou seja, o atributo da
classe!
Agora já sabe como lidar com variáveis locais e membros? Gostou do shadowing? Quer
aprender mais dicas e nunca mais cair em pegadinhas no Java? Pensando nisso, o
instrutor Guilherme Silveira, criou a [**Formação Java**] na **Alura**.
imagem
Aqui na Alura temos um servidor para guardar alguns arquivos e projetos internos,
que basicamente funciona como um repositório interno.
Esse servidor tem um espaço de **armazenamento limitado** e, de tempos em tempos,

tenho que ficar conferindo se a pasta do compartilhamento está ficando muito cheia.
O servidor não possuí modo gráfico, então como posso saber o tamanho da pasta de
compartilhamento?
## Descobrindo o tamanho de um diretório
Para descobrir quanto do disco que o diretório está usando basta ir até o terminal
e dizer: "por favor, mostre-me o quanto do disco (`du`, **disk usage**) o diretório
`/compartilhamento` está usando":
`du /compartilhamento/`
imagem a informação:
`du -s /compartilhamento/`
imagem.
Podemos utilizar as duas expressões separadamente, `-s -h`, ou juntas `-sh`:
`du -sh /compartilhamento/`
imagem, cada um com suas diferenças. Para nosso script saber qual deles utilizar,
temos que especificá-los na primeira linha.
Um dos shells mais utilizados é o [**Bash**], vamos utilizá-lo. Logo na primeira

linha digitamos:
`#!/bin/bash`
Como queremos visualizar a tamanho ocupado pelo diretório `/compartilhamento`,

temos que fazer nosso script acessá-lo. Portanto: `cd /compartilhamento`
bash
Agora temos que pegar a informação sobre o tamanho do diretório. Já vimos como
fazer isso, basta atribuirmos esse valor a uma variável.
O comando que nos retorna o percentual é o `df`, como queremos saber apenas do
diretório compartilhamento, é ele que vamos especificar, já que queremos apenas a
informação da porcentagem, não precisamos colocar o parâmetro `-h`
bash
Só que, como vimos, esse comando nos retorna duas linhas, a primeira é um
cabeçalho, enquanto a segunda são as informações sobre a partição.
Queremos apenas a informação sobre o uso, que se encontra na coluna 5:
imagem nossa variável estiver com 70% ou mais, então (`then`) vamos escrever uma
mensagem na tela.
Para realizar essa comparação, vamos utilizar algumas [**expressões regulares**].

Nossa variável pode ter valores de 70% até 100%, ou seja, o dígito da dezena pode
variar de 7 a 9 (`[7-9]`) e o da unidade de 0 a 9 (`[0-9]`), seguido do símbolo de
percentual (`%`).
Essa expressão captura valores de 70% até 99%. Para acrescentarmos o 100%, dizemos
que ou é essa expressão (`[7-9][0-9]%`), ou (`|`) será utilizado 100% para realizar
a comparação.
A expressão completa fica assim:
`[7-9][0-9]%|100%`
Basta informar essa condição em nosso ìf`:
bash
Vamos testar nosso script e checar se está funcionando:
imagem para o arquivo onde ficará nosso log que, no meu caso, fica em
`/logs/compartilhamento.log`.
bash
O bacana é que mesmo que esse arquivo não exista, o programa o cria. Vamos testar
nosso código novamente:
imagem, como é o primeiro parâmetro, colocamos um `+` na frente, ficando `+%F`.

Esse parâmetro mostra a data do sistema no formato ano-mês-dia.
Vamos acrescentar o parâmetro para mostrar as horas , minutos e segundos, podemos

utilizar `%T` (**Time**):
`date +%F %T`
imagem esse espaço:
`date +%F\ %T`
imagem.
Dessa forma, cada vez que o minuto for 00, ou seja, a cada hora, será executado o
comando.
O usuário que irá executar o comando é, no nosso caso, o **superusuário** (root),

como ele é o mesmo usuário que criou o arquivo, não precisamos especificá-lo. E o
comando será: `bash consulta_tamanho_diretorio.sh`
Vale lembrar que se o script estiver em outro diretório sem ser o do usuário que
irá executá-lo, devemos especificar o caminho até ele.
`0 * * * * bash consulta_tamanho_diretorio.sh`
Para salvar e sair do arquivo de configuração do cron, pressionamos _Esc_ e depois

digitamos `:x`.
> _"Mas por que não colocar asterisco em todas as colunas? Assim nosso script não
seria executado a todo momento?"_
Sim. Dessa forma a cada minuto o script seria executado, porém isso poderia,
dependendo do número de requisições que o servidor recebe, sobrecarregaria sua CPU.
Agora nosso arquivo de log sempre será atualizado sobre essa informação.
Vamos olhar o arquivo de log e ver se ele está inserindo a informação:
imagem para fazer as configurações, mas podemos utilizar qualquer usuário para
criar os scripts.
Caso você esteja utilizando o usuário root para fazer os scripts **cuidado** para
não executar um script que comprometa o sistema.
## Problema Resolvido
Tínhamos que ficar checando de tempos em tempos se o diretório de compartilhamento

estava ficando cheio. Vimos como podemos fazer isso e como automatizar essa tarefa
utilizando Shell Script utilizando o cron para agendá-la.
Aqui na Alura temos um [**curso sobre Shell Script**]. Nele você aprenderá como
automatizar tarefas utilizando, criar estruturas de seleção e repetição, funções e
muito mais.
**SQL Injection** é uma forma que hackers usam para tentar acessar o banco de dados
da sua aplicação sem permissão para tal. Esses [comandos SQL](o-que-e-sql) são
injetados dentro da sua aplicação através de formulários web que não foram bem
processados e protegidos pelo back-end da aplicação, independente da linguagem.
IMAGEM HACKER
# Formulários web e SQL:
algo assim: https://img.ibxk.com.br/2017/01/05/05164905230860.jpg?w=528
# A técnica 'or 1=1'
# Como se proteger do SQL Injection?
Voce deve **sanitizar** os dados antes de processá-los. Isso é, deve tomar cuidado
com aspas, caracteres especiais e uma série de detalhes. Você pode fazer isso com
expressões regulares, mas certamente vai acabar esquencendo algum caso ou outro.
Sua sorte é: existem bibliotecas em diversas linguagens que já fazem isso:
## SQL Injection sanitize em PHP:
use a funcao TAL. exemplo:
exemplo de saida:
colocar python, java, c# e node.js
# Testes automatizados com o SQLMAP
link pro curso curso-online-seguranca-web-em-java-parte-1
Nesse artigo vou mostrar como adicionar extensões através do repositório central de
extensões o PECL.
Estou desenvolvendo um blog usando PHP e quando acesso a primeira página, os posts
mais recentes eram exibidos e, por baixo dos panos, eles eram obtidos através de um
banco de dados responsável por armazenar o conteúdo.
**Para o PHP conseguir conectar em um banco de dados, preciso informar o nome do

banco de dados, juntamente com o usuário e senha. Coloquei essas informações no
código fonte, porém, após um tempo precisei mudar a senha do banco de dados e tive
que modificá-la no código.**
Depois disso, percebi que é ruim que estes dados fiquem no código, pois uma
alteração neles implica em uma mudança direta no código fonte.
Procurando maneiras para melhorar essa questão, descobri que é uma boa prática
guardar estes dados em um arquivo separado em um formato como **XML, JSON ou
YAML**. Entre esses tipos de formato, escolhi o YAML, por ter uma sintaxe mais
simples de ler.
sql
Precisei ler este arquivo a partir do nosso programa PHP. Como a documentação da
biblioteca YAML apresenta a função `yaml_parse_file` para ler um arquivo YAML,
então usei a função:
php
Quando executei o programa no meu computador, ao invés dele funcionar, o seguinte

erro foi impresso na tela:
imagem
O que aconteceu? O PHP disse que a função `yaml_parse_file` não existe. Pesquisando
um pouco na internet, vi que YAML não faz parte da distribuição padrão do PHP, já
que é uma extensão.
E como podemos adicionar esta extensão no PHP?
# Extensões no PHP
Quando precisamos realizar alguma operação que exija alta performance, como no meu
caso de processar um arquivo YAML, e queremos que isso seja feito da forma mais
rápida possível, podemos utilizar uma extensão do PHP.
Existe um repositório online de extensões da linguagem PHP disponíveis para

download chamado PECL (PHP Extension Community Library), que é equivalente ao
Composer, só que armazena extensões e não bibliotecas.
Como estou utilizando Linux, instalei o PECL utilizando o comando:
php
imagem
No caso do Windows, utilizando o XAMPP, o PECL já deve estar instalado. No Mac, é

necessário utilizar o Homebrew e para instalar o PHP junto com o PECL, é necessário
utilizar o seguinte comando:
php
Com o PECL instalado, agora vamos procurar pelo YAML.
# Utilizando o PECL
Para utilizar o PECL, ele oferece somente uma interface por linha de comando, para
procurar pela extensão YAML utilizei o seguinte comando:
`pecl search yaml`
Para instalá-lo, o comando:
`pecl install yaml`
Legal! A extensão foi instalada e no terminal teve a seguinte saída:
imagem
Quando utilizei o comando para instalar, a última linha mencionou que eu deveria
adicionar “extension=yaml.so” para o arquivo php.ini. O que isso quer dizer?
**Existe um arquivo de configuração do PHP chamado php.ini, onde estão armazenadas

todas as configurações que são aplicadas a tempo de execução no interpretador da
linguagem e as extensões que devem ser carregadas.**
Às vezes pode ser um pouco complicado de encontrar este arquivo, pois, em algumas
instalações do PHP, podem existir mais de um php.ini, já que ele pode ser
encontrado de duas maneiras: na linha de comando e pelo servidor web.
Primeira maneira com o terminal
Para exibir as informações de configuração do PHP no meu computador, abri o

terminal e digitei o comando:
`php -i`
Com o qual obtive o seguinte retorno:
imagem
No meio desse monte de linhas, procurei pelo seguinte texto:
`Loaded Configuration File => /etc/php/7.2/cli/php.ini`
Isso mostra o diretório do arquivo de configuração que foi carregado. Porém, estava
um pouco difícil de encontrar essa linha. Para facilitar, decidi copiar o texto e
colar em um editor de texto, como o Visual Studio Code, para utilizar a função de
busca.
Segunda maneira com um arquivo php
Na minha máquina também estava utilizando o PHP na web, que é utilizado para exibir
páginas de websites, para obter as informações de execução abri um arquivo com a
extensão .php e digitei o seguinte código:
php
uando acessei este arquivo, apareceu a seguinte tela, que mostra a configuração
“Loaded Configuration File” com o arquivo php.ini utilizado:
imagem
Na linha Loaded Configuration File, o nome do arquivo retornado foi

/etc/php/7.2/cli/php.ini, com o nome do arquivo em mãos, abri ele em um editor de
código e no final do arquivo e incluí a linha que havia sido pedida.
extension=yaml.so
Agora que consigo utilizar a função que lê o arquivo YAML, executando aquele código
que foi citado no começo do deste post, consigo transformar este arquivo de
configuração em um array do PHP e assim, utilizá-lo no meu blog.
Caso eu precise remover a extensão, preciso utilizar o seguinte comando:
php
E para finalizar, precisei remover a chamada da extensão no arquivo de configuração

php.ini para que o PHP não tente mais executar esta extensão.
Conclusão
Existem funcionalidades da linguagem PHP, como a de ler arquivos YAML, que por
razões de performance não podem ser escritas em PHP e distribuídas como uma
biblioteca no Composer,mas podem ser escritas como extensões da linguagem.
Para instalar esta extensão utilizei o PECL, que é o repositório central de

extensões da linguagem PHP. O PECL possui uma interface via linha de comando, no
qual executei o comando para instalar a extensão YAML e depois, incluí ele no
arquivo de configuração do PHP.
Com isso você estará preparado para utilizar o PECL e instalar extensões do PHP!
Gostou do post? Por que não dar uma olhada nos [**cursos de PHP da Alura**]? Você
poderá aprender sobre muitas ferramentas importantes do PHP moderno como o
Composer, Doctrine e Laravel!
Sempre quis aprender sobre **SQL e banco de dados** mas não teve oportunidade ou
simplesmente não conseguiu nenhum material que focasse com exemplos do mundo real,
seus problemas e soluções do dia a dia?
Pensando nisso, escrevi a apostila de **SQL e modelagem com banco de dados**! Você
pode baixá-la [**aqui**].
Esta apostila é baseada nos cursos dos instrutores da Alura e ensina desde os
princípios básicos a **assuntos mais avançados sobre SQL e banco de dados**.
A nossa intenção é dar a oportunidade do aluno aprender sobre SQL e modelagem de

dados dando ênfase sempre que possível na compatibilidade entre bancos.
Na apostila usamos o **MySQL** para ver desde a criação de um banco e suas tabelas
até como funcionam diversos tipos de joins no mundo real.
Com essa iniciativa, esperamos retribuir o constante apoio da comunidade de

profissionais de tecnologia. E, claro, toda ajuda e opinião são sempre bem
vindas :)
Bons estudos!
No último [**desafio entre amigas**], Maya propôs um desafio a Victoria que o

encarou com maestria.
No final, Maya pediu que Victoria também a desafiasse para que pudesse mostrar suas
habilidades em JavaScript. Victoria não perderia a oportunidade de colocar sua
amiga à prova.
## Hora da revanche, o novo desafio
Depois de terem almoçado juntas, Victoria elaborou a seguinte estrutura HTML para o
desafio de Maya:
html
Victoria disse:
> "Maya, a página possui apenas um botão que ao ser clicado deve exibir no console
o texto "Fui clicado"".
E Maya disse, surpresa:
> "Só isso?"
Victoria a esclareceu que essa era a primeira parte do desafio, que lhe contaria o
próximo assim que ela a resolvesse primeiro.
Maya ficou em silêncio e deu início a sua implementação:
javascript
Victoria ficou calada, pediu para que Maya testasse o código e tudo funcionou. Em
seguida, elaborou o seguinte comentário:
> "O botão poderia estar realizando uma requisição para um servidor web, uma API,
certo? Nesse caso, o que aconteceria se o usuário, frenéticamente, clicasse várias
vezes seguidas igual ao "The Flash" no botão?"
Maya respondeu:
> "O servidor teria que atender todas essas requisições desnecessárias."
## O padrão de projeto Debounce
Por fim, com um sorriso malicioso no rosto, Victoria passou a instrução final do
desafio, que antes parecia simples:
> "Você deve postergar a execução de èxibeMensagem` caso ela seja chamada
novamente em menos de um segundo através do clique do botão. Fácil, não? Para
complicar um pouquinho, sua solução deve ser aplicável em diversos lugares de uma
aplicação, sem repetir código."
Maya quis confirmar se entendeu corretamente o pedido:
> "Se eu clicar 10 vezes em menos de um segundo, apenas o último clique será
processado, certo?""
"Perfeitamente", diz Victoria.
Por fim, Maya profere:
> "Você quer que eu implemente o padrão de projeto [**Debounce**], é isso?"
Victoria ficou pálida, pois tinha certeza que Maya não saberia resolver a questão e
ainda lhe disse o nome do padrão de projeto a ser empregado para solucionar o
problema. Ela ficou calada e Maya deu início a sua implementação.
Primeiro, ela criou a função `debounce`, mas apenas seu esqueleto:
javascript
Victoria pediu que a amiga explicasse para ela o esqueleto do código da função.
Maya esclareceu que a função `debounce` recebe dois parâmetros. O primeiro é a
função que desejamos assegurar que seja executada no máximo uma vez a cada X
segundos. O segundo é o valor em milissegundos do intervalo de tempo que será
considerado.
## Vendo como tudo se encaixa
Gentilmente, Maya pediu a Victoria uma licença poética e começou a utilizar a

função `debounce` antes de estar pronta, para que a amiga pudesse entender como ela
se encaixa com o evento "click" do botão.
javascript
Maya explicou que o retorno de `debounce` é uma função configurada para utilizar um
temporizador que chamará èxibeMensagem` respeitando a janela de tempo de um
segundo, como Victoria havia pedido.
Victoria disse:
> "Ah, muito engenhosa essa sua solução. Você está usando debounce para criar uma
nova função que encapsula èxibeMensagem`. Esse encapsulamento é necessário, porque
o evento "click" não pode chamar diretamente èxibeMensagem`, pois ela não possui
um temporizador. Já a nova função, sim."
## Simplificando um pouco as coisas
Como Victoria já tinha entendido como as coisas se encaixavam, Maya alterou seu
código, evitando a necessidade de declarar a variável `fn`:
javascript
## Implementando a função debounce
Agora, ela precisava continuar a implementação da função `debounce` para seu código
funcionar. A primeira alteração que fez foi usar `setTimeout` para agendar a
execução da função após a quantidade de milissegundos passada para `debounce`, no
caso, 1000 equivalem a um segundo:
javascript
## Um problema esperado
Maya explicou que Victoria poderia testar o código do jeito que está, mas que ele
não funcionaria como esperado. Se ela desse 100 cliques rapidamente no botão em
menos de um segundo, todos eles seriam executados, com a diferença de que cada um
esperaria um segundo antes de ser executado.
Maya disse que a solução estava no retorno de `setTimeout`. Ela ajustou o seu
código e guardou o retorno na variável `timer`:
javascript
A variável `timer` guarda um ID ligado ao `setTimeout` executado. Com o ID, é

possível parar o `setTimeout` através de `clearTimeout(timer)`.
Continuando sua implementação ela fez:
javascript
## Um problema não esperado
Assim que Maya acabou de realizar a alteração no código, Victoria, com ar de

confiança, disse que o código não funcionaria do jeito que está.
Maya hesitou durante alguns segundos e após realizar um teste viu que a amiga tinha
razão. Quando ela clicava no botão, a seguinte mensagem de erro era exibida:
java
## Há sempre uma explicação
"Quer desistir", diz Victoria. Mas Maya reconheceu o seu erro e decidiu explicar
para a amiga o que aconteceu:
> "Para que minha solução funcione, a cada clique do botão eu preciso parar um
timer já existente com `clearTimeout(timer)`. O problema é que no primeiro clique,
ainda não temos um `timer` rodando para ser parado, inclusive a variável `timer` é
declarada após o `clearTimeout(timer)`."
Então, Maya tentou resolver da seguinte maneira:
javascript
Maya esclareceu que estava iniciando o `timer` com zero e que isso não faria mal
nenhum para `clearTimeout`. Victoria respondeu:
> "Faz até sentido, pois na primeira vez que você clicar não existe um timer sendo
processado. Já podemos testar o seu código?"
Mais uma vez o código de Maya não saiu como esperado. Continuou com o mesmo
problema de antes. Todos os cliques foram processados, com a diferença de que cada
ação do clique foi executada um segundo depois.
Victoria pergunta mais uma vez se a sua amiga quer desistir. Maya já estava
entregando a toalha quando de repente deu um grito:
> "Já sei! Basta eu mover a declaração de timer para o escopo da função debounce."
E foi isso que ela fez:
javascript
Para a surpresa de Victoria, o código de Maya funcionou como esperado.
## Closure?
Reconhecendo a competência da amiga, Victoria pediu que ela lhe explicasse a razão
do seu código ter funcionado com essa pequena alteração. Muito modesta, Maya
respondeu:
> "A função de `debounce` é chamada apenas uma vez e seu retorno, uma nova função,
é associada ao evento click do botão. Certo? Essa nova função quando retornada por
`debounce` trouxe com ela todo o contexto no qual foi declarada. É isso que permite
a função ainda ter acesso à variável `timer` declarada no escopo da função
`debounce` mesmo após esta última ter sido totalmente processada e retornado seu
valor."
Com base no que acabei de explicar, o primeiro clique no botão fará

`clearTimeout(timer)` assumindo o valor zero, o que não resultará em erro nenhum,
para logo em seguida atualizar o valor de `timer` com um novo ID retornado por
`setTimeout`. Todos os outros cliques acessarão e modificarão a mesma variável
`timer`, fundamental para que a solução funcione.
Victoria, depois de olhar atentamente disse:
> "Isso tudo que você acabou de explicar, a noção de que uma função retornada por
outra função traz o contexto da função que a retorna nada mais é do que o conceito
de [**closure**]. Eu sabia desde do ínício, só queria saber se você tinha ideia
disso.
No final, as duas amigas se abraçaram e marcaram de ir ao cinema assistir

"Cangaceiro JavaScript".
Há alguns anos atrás eu estava entrando na faculdade, no caso para cursar Sistemas
de Informação, e me deparei com uma infinidade de assuntos diferentes para estudar:
Sistemas Operacionais, Programação, Redes, Engenharia de Software, Empreendedorismo
e várias outras possibilidades interessantes.
## Conheça as suas opções
O primeiro ponto fundamental que precisamos entender para que seja possível tirar o
máximo de proveito de uma faculdade ou universidade é o papel que ela desempenha na
nossa carreira e esse papel é justamente de te apresentar todas as opções que você
tem disponíveis.
Ao fazer um curso de Sistemas de Informação, não significa que você será um

_"Empreendedor Desenvolvedor Engenheiro de Software Especialista em Arquitetura de
Computadores"_ e o mesmo vale para outros cursos.
Na verdade, nesse momento você precisa é conhecer as possibilidades que você terá e
saber qual é a sua aptidão e interesse para cada uma dessas possibilidades.
Determinada matéria ou assunto, pode chamar mais a sua atenção do que outro. Esse é
um indicativo de qual caminho que mais lhe agrada para a sua carreira, e também,
que você talvez possa focar. Se você está ou já esteve na faculdade, tente fazer o
seguinte exercício:
> **Identifique as matérias que mais te interessam e veja se elas se alinham com o
que você quer para a sua carreira**.
## Organize-se para se aprofundar
Agora que você já sabe quais assuntos mais te chamam a atenção, você pode decidir
focar um pouco mais nas habilidades dentro deles. A graduação irá te dar uma
excelente base, mas você vai precisar ir além por conta própria e se aprofundar.
Por exemplo, se você decidiu que quer focar em programação e na faculdade aprendeu
Java e Orientação a Objetos, agora se aprofunde nesses assuntos. [**Aprenda algum
framework**], [**estude testes automatizados**], [**boas práticas de orientação a
objetos**] e [**design patterns**], por exemplo.
No meu caso específico, durante a faculdade decidi que queria me especializar em

Java, então comecei a estudar alguns frameworks e também para prova de
certificação.
É fundamental que você tenha seu próprio objetivo do que quer aprender e que depois
corra atrás desse objetivo.
Por fim, organize-se para estudar tudo o que precisa aprender. [**Monte seu próprio
calendário de estudos**], conciliando o que já é necessário estudar para a sua
graduação com o que você gostaria de se aprofundar.
Nessa época eu sempre tinha duas horas disponíveis no deslocamento de ônibus, então
aproveitava essas duas horas, todos os dias, para estudar para a certificação.
**Tente encontrar esses espaços disponíveis no seu dia a dia, nem que seja de 5
minutos**.
## Parceria entre a Alura e instituições de ensino
[Recentemente eu estive na Universidade Metodista], em São Bernardo do Campo,

falando para os alunos ingressantes justamente como tirar o máximo da graduação e
como agregar isso às respectivas carreiras. Veja só o quão bacana foi:
imagem contando um pouco sobre a sua instituição e suas aulas.
imagem
Quando fui testar um aplicativo que estávamos desenvolvendo, a primeira coisa que
fiz foi tentar abrí-lo. Depois de clicar no ícone do app, fiquei mais ou menos uns
3 segundos nessa tela em branco:
imagem são responsáveis por preencher exatamente essa lacuna que temos entre o
início do carregamento do app e a abertura efetiva dele.
Com esse recurso, podemos aplicar no nosso app algo mais ou menos assim:
imagem da tela, evitando frustrar o usuário que tentasse ler ou compreender do que
se trata aquilo, passar direto pela tela e depois não conseguir retornar para rever
com mais calma o que aconteceu.
Mas, note que a tela que adicionamos é bem simples e não comunica nada de muito
relevante sobre o app… Poderíamos aplicar essa mesma tela em qualquer app. Então,
por que não aproveitamos esse momento para encaixar algo que traga algum valor para
o usuário e para o app?
Geralmente, essas telas de lançamento, também conhecidas como _Splash Screens_,

podem ser utilizadas para apresentar a marca do seu produto, algo como:
imagem], podemos notar que, segundo eles, as telas de lançamento não devem ser
vistas como uma oportunidade de apresentação da marca.
Para eles, a menos que sejam elementos que fazem parte da primeira tela que o
usuário verá do app quando iniciar a interação, não temos motivos para adicionar
nada da marca do produto.
## Devo ou não devo usar as Splash Screens?
Se pensarmos no que representam as Splash Screens, ou melhor, a intenção que

buscamos com elas, essas telas nada mais são que um fragmento **chamado antes do
seu app inteiro ser carregado**, muito **mais leve** (para ser renderizado rápido),
e que **apresenta um feedback ao usuário** de que o carregamento do app está
acontecendo.
Se devemos ou não utilizar esse recurso vai depender de muitos fatores,

especialmente se isso for um pré-requisito para que o seu app seja aceito naquele
sistema operacional ou não se encaixar nas demandas que seu app pede (como pouco
tempo de carregamento, por exemplo).
E, para aqueles que optarem por usar a Splash Screen, temos um post bem legal aqui
na Alura mostrando o [**passo a passo para criar essa tela de abertura**].
Esse UI Design Pattern que comentei no post valoriza bastante o branding da marca.
Se quiser entender um pouco mais de como funciona o processo de criação de uma
marca forte, veja nosso [**curso de Branding da Alura**]!
imagem
Sinais sem fio nada mais são do que [**ondas eletromagnéticas**], ou seja, são como
as ondas de rádio, ou como a luz. Por serem ondas, eles trafegam em [**frequências
específicas**] (2,4 GHz ou 5 GHz ). Logo, barreiras físicas podem impedir a
passagem do sinal.
Porém, antes de sabermos quais são essas barreiras, precisamos entender o que é o
**sinal do Wi-Fi**.
## O que atrapalha o sinal do Wi-Fi
Paredes, portas, vidros, espelhos e até mesmo a [**umidade do ar**] podem afetar o
sinal Wi-Fi, em aparelhos que trabalham com a frequência na faixa de 5 GHz, a perda
de sinal fica mais perceptível.
A distância também influencia no sinal. Quanto mais distante o host do ponto de

acesso, mais fraco fica o sinal. Isso recebe o nome de [**atenuação**].
Atenuação nada mais é do que a perda de sinal. A distância e as barreiras, causam

perda de sinal. Ou seja, quanto mais barreiras existir entre o roteador, ou o
[**ponto de acesso**], e o host, ou mais distante estiverem, mais fraco ficará o
sinal.
Vamos imaginar duas pessoas conversando. Quanto mais paredes houverem no caminho,
ou quanto mais longe uma pessoa estiver da outra, mais baixo o som ficará e mais
difícil será para o ouvinte distinguir o que está sendo dito.
É isso que acontece com o sinal de wi-fi também. Pode ser que o sinal sem fio
chegue mais fraco na sala por conta do número de paredes e outros objetos que ele
tem que penetrar. Mas não existem muitas barreiras desse tipo entre meu quarto e a
sala. O que pode estar afetando o Wi-Fi?
Além dessas barreiras, existem outras que também podem atrapalhar o sinal do Wi-Fi.
Vamos voltar ao exemplo das duas pessoas conversando. Se por acaso outras pessoas
estiverem conversando ao mesmo momento, pode ser difícil distinguir o que a pessoa
que você está conversando está dizendo em meio ao caos de vozes.
Com as redes sem fio esse tipo de problema também ocorre. Como elas se comunicam em
frequências específicas, outros aparelhos que trabalham nessas frequências
atrapalham a comunicação.
**Telefones sem fio, micro-ondas, dispositivos bluetooth e outros dispositivos sem

fio**, como outras redes sem fio interferem no sinal Wi-Fi.
> "Como assim, um Wi-Fi atrapalha outro?”
Bem, sim e não. Se dois equipamentos trabalharem em frequências diferentes esse

problema não ocorre, pois seria como se duas pessoas estivessem se comunicando por
voz e outras duas estivessem por texto. As “frequências” não se encontram.
Agora, se dois equipamentos trabalharem na mesma faixa de frequência, isso já se

torna perceptível.
> “Existe alguma maneira de resolvermos esse problema?”
Existe uma possibilidade, que é de modificar um pouco a frequência na qual a rede

atua. Assim o sinal de uma não interfere em outra.
Quando alteramos essa pequena fração da frequência, falamos que estamos **alterando
o canal da rede sem fio.**
## Entendendo os canais de Wi-Fi
Quando existem duas redes na mesma faixa de frequência, o sinal de uma pode
interferir em outra. Por isso, podemos “mudar” um pouco a frequência dos sinais,
desta forma, um sinal não consegue “enxergar” o outro.
Podemos fazer um ponto de acesso trabalhar na frequência 2,412 GHz, e outro em

2,437 GHz. Os dois estariam na mesma faixa (2,4 GHz), porém um sinal não
“encontraria” o outro, logo um não prejudica o sinal do outro.
Para ajudar nisso, existem alguns softwares e aplicativos que nos mostram
informações sobre as redes sem fio. Um deles é o [**Wi-Fi Analyser**], disponível
para Windows, ou [**Wifi Overview**], para Android. Com eles conseguimos ter
informações como:
- Os canais da nossa rede e das redes vizinhas;

- Gráfico com as redes e os canais que elas pertencem;
- Os melhores canais disponíveis.
![]
Podemos ver muitas redes estão no mesmo **canal**, ou em canais próximos. Isso
causa a interferência do sinal e ainda pode causar quedas e lentidão na rede.
Mesmo em canais diferentes, uma rede pode interferir no sinal de outra. Por
exemplo, se uma rede está no canal 1 e outra o canal 2, O sinal de uma rede
conseguirá encontrar o sinal da outra e causará interferência.
Tudo bem, vimos que os canais de Wi-Fi podem fazer com que o **sinal de uma rede
não interfira em outra**, mas como podemos alterar esse o canal?
## Alterando o canal do Wi-Fi
Essa configuração pode ser feita diretamente no ponto de acesso que, em alguns
casos, principalmente em redes domésticas, é o próprio roteador.
Para acessar o roteador, temos que entrar em um navegador e digitar o **IP do

roteador**. Geralmente esse endereço fica anotado em baixo do aparelho, o mais
comum de ser encontrado é o `192.168.0.1`.
Basta logar com usuário e senha e pronto. Estamos no painel de configurações do

roteador.
Na opção `Wireless` temos uma opção chamada **Channel**, ou **Standard Channel**.

Se seu dispositivo estiver em português, pode aparecer como Canal. É nessa opção
que o ponto de acesso define o canal:
![]
Com isso nós podemos escolher qual canal melhor satisfaz a rede, para que não
tenham muitas interferências. Em alguns dispositivos existe também um modo
automático, que tenta buscar o melhor canal no momento.
## Para saber mais
O número de canais que existem disponíveis depende do país em que está localizado.
Contudo grande parte dos países adotam os canais 1 à 13 para as redes de frequência
2,4 GHz.
Vimos que mesmo em canais diferentes, a rede pode sofre interferência se estiverem
muito próximos um do outro. Por isso uma boa prática é alocar as redes nos canais
1, 6, 11. Dessa forma um canal não interfere em outro, garantindo melhor
estabilidade e, por consequência, desempenho.
## Como está o sinal?
Ficar sem sinal, ou com um sinal instável de Wi-Fi em casa é muito ruim. Por isso é
importante entender sobre o que é o sinal sem fio e o que atrapalha seu sinal.
**A distância, ou as barreiras**, como paredes ou portas, podem afetar o sinal da
rede. Porém, além desses, outros aparelhos que emitem sinais nas mesmas frequências
do Wi-Fi, inclusive outros Wi-Fi podem afetar o sinal.
Para evitar esse tipo de interferência, vimos que podemos alterar um pouco a
frequência de atuação do Wi-Fi, alterando assim seu canal.
Gosta de redes? Aqui na Alura temos uma [**formação de redes**]. Nela você
aprenderá sobre o que é um **endereço IP, switch, protocolos de redes, segurança**
e muito mais!
O design responsivo, então, surgiu como alternativa para resolver o problema de

todos os diferentes formatos aos quais os sites devem se adaptar. Ao projetar
templates com base na largura do visor de qualquer dispositivo, todo o conteúdo
online se reorganiza de acordo com o tamanho e a resolução da tela,
sendo visualizado de forma satisfatória em qualquer aparelho.
Nesse post, você vai entender melhor como essa tecnologia é útil não apenas para a
[**usabilidade do internauta**], mas também para potencializar o marketing de seu
negócio. Confira:
## Uma página, um URL
Quando várias versões de um mesmo site são desenvolvidas para dispositivos

diferentes (normalmente por meio de um processo caro e demorado), o esperado é
que cada uma delas possua um URL distinto.
O problema é que isso atrapalha a indexação e ranqueamento dessas páginas por parte

de buscadores como o [**Google**], que inclusive [**recomenda o uso do design
responsivo**] como padrão para a implantação de websites.
## Gerenciamento descomplicado
Com a configuração responsiva, as longas horas gastas com o gerenciamento de

páginas também estão acabadas. Afinal, vários sites diferentes precisam de
diversas campanhas de SEO, certo? Quando apenas uma URL é configurada, o link exige
uma manutenção menor.
O [**custo de desenvolvimento**] e gestão de uma só plataforma também é bem mais

vantajoso do que a elaboração de sites diversos, que podem exigir uma
especialização distinta para cada tipo de dispositivo escolhido.
## Páginas rápidas
Uma das normas feitas pelos desenvolvedores do [**Google PageSpeed**]recomenda que

o carregamento completo de uma página mobile aconteça em menos de dois segundos.
Afinal, se o usuário esperar muito tempo para que sua página abra, ele pode acabar
desistindo do acesso.
O problema é que, na maioria das vezes, uma versão desktop complexa de uma página
online não pode ser carregada em um dispositivo móvel em tão pouco tempo. Além de
prejudicar o usuário, esse problema também pode afetar o ranqueamento do site
pelo Google.
Felizmente, os sites responsivos são desenvolvidos de forma otimizada para os

dispositivos móveis. Por isso, a página é mais leve e pode ser até carregada com
mais rapidez do que na versão desktop.
## Foco na experiência do usuário
Engana-se quem pensa que o design responsivo busca apenas colocar um site
disponível para outras plataformas.
Essa tecnologia se preocupa até com detalhes mais simples, capazes de tornar o site
mais fácil de navegar, como links espaçados em dispositivos touch (para que seu
dedo não esbarre em algo que você não queira abrir), dimensões de layouts que
dispensem o zoom, mais rapidez de carregamento da página, melhor disposição
de imagens e textos, etc.
Vários fatores importantes como funcionalidade, usabilidade, desempenho e aparência

são cuidadosamente planejados para que o usuário tenha [**uma experiência única**]
e se familiarize com o website da forma mais fácil possível.
Os resultados não poderiam deixar de ser positivos e muito variados: eles vão desde

um melhor posicionamento de marca até o [**aumento significativo da taxa de
conversão**] de seus visitantes, impulsionada pela democratização do uso
descomplicado daquela página.
## Vendas potencializadas
Quanto tempo você já perdeu tentando navegar em um site que não funcionava muito
bem? Provavelmente não muito, certo? Não há como negar que, nessas
horas, a chance de o usuário fechar a página e procurar um concorrente é alta.
Por outro lado, o que dizer de um site otimizado para mecanismos de busca, com boa
usabilidade e ranqueamento nas primeiras posições do Google? Qual a probabilidade
desse mesmo usuário acessá-lo no lugar daquela outra página em que ele não
conseguiu navegar?
De acordo com o próprio [**Google Insights**], se um cliente fica satisfeito com o

seu site e obtém uma experiência positiva de navegação, as chances
de conversão para seu produto (ou serviço) são de 67%. Por isso é possível dizer
que, se o seu site não possui um design responsivo, ele está te fazendo
perder dinheiro.
## Taxas de rejeição combatidas
Mesmo que sua página esteja bem ranqueada em resultados de pesquisas, ela terá

problemas de aceitação se não funcionar de forma eficaz para usuários de
dispositivos diversos.
O Google interpreta essa rejeição como um sinal de que o site não está oferecendo

conteúdo relevante aos usuários, o que provavelmente levará a uma queda na sua
exibição e ranqueamento nas páginas desse buscador.
Um site projetado de forma responsiva é capaz de resolver esse problema. Ao

apresentar o mesmo conteúdo que você visualiza no desktop de forma funcional em
outros aparelhos, não há necessidade de comprometer a qualidade do site nem a
experiência do usuário.
Isso garante que os visitantes sempre recebam as informações que estão procurando,
o que os mantém na sua página, engajados com sua marca.
## Responsividade para o futuro

Como você já sabe, o design responsivo é feito com base no tamanho e resolução de
telas diferentes, levando em conta não o tipo de dispositivo utilizado, mas sim a
largura do visor. Ou seja, não importa se o seu cliente está usando um tablet, um
iPad ou um smartphone: o layout irá se adaptar bem em qualquer dispositivo, mesmo
que ele ainda não exista.
Isso é importante para o [**marketing digital**] da sua empresa, na medida em que

já prepara o seu site para novas experiências futuras.
Assim que os eletrônicos como smartwatches, óculos de realidade virtual e outros

lançamentos estiverem ainda mais presentes na vida dos seus clientes, sua página
continuará com um bom desempenho.
Atualmente, é fundamental que qualquer site forneça uma experiência agradável aos
usuários de dispositivos móveis. Sendo assim, ter um design responsivo já não é
simplesmente uma boa estratégia, mas sim uma necessidade capaz de provocar grandes
melhorias no crescimento de qualquer negócio.
E você, o que acha do design responsivo? É algo que você já implementou ou está

cogitando utilizar em breve? Compartilhe esse artigo em suas redes sociais e
informe seus contatos sobre essa prática a cada dia mais essencial!
Conseguir um lugar no mercado de trabalho é uma tarefa árdua, já que o pequeno

número de vagas disputadas contrasta com a grande quantidade de candidatos.
Entretanto, é possível ter sucesso na busca por um novo emprego investindo na
atualização profissional constante.
## Conheça bem a sua área de atuação
Um bom profissional deve ter domínio sobre os assuntos de sua área de atuação.
Procure saber tudo sobre o nicho em que atua, como o número de empresas
especializadas no segmento, as inovações tecnológicas que podem afetá-la e as
tendências do momento.
Procure também por material específico direcionado à sua profissão, como revistas,
publicações científicas ou mesmo sites dedicados ao assunto.
Se não for possível pesquisar em português, é recomendável procurar por textos

escritos em outros idiomas. E por falar nisso, você já domina alguma língua
estrangeira?
## Estude outros idiomas
Falar sobre a importância de aprender uma língua extra pode parecer clichê, mas
essa é uma necessidade no Brasil, onde apenas uma pequena parte da população
conhece idiomas além do português.
Apenas [52% dos executivos brasileiros], por exemplo, têm algum conhecimento da
língua inglesa, que na maioria das vezes é básico.
Os dados acima revelam a importância e os benefícios de investir parte do seu tempo

no aprendizado de outro idioma. Além das vantagens profissionais e do acréscimo de
valor ao seu currículo, ter essa nova habilidade possibilita que você entre em
contato com diferentes pessoas, culturas e materiais publicados, expandindo o seu
horizonte de informações.
O inglês, embora seja a escolha mais comum, não é a única saída para a
diferenciação profissional: cursos de mandarim, a língua oficial da China, falada
por 14% da população mundial, ou de espanhol, o idioma dos vizinhos e parceiros
comerciais na América do Sul, são outras ótimas opções.
## Mantenha-se em constante aprendizado
Mais importante do que aprender tudo sobre sua área é compreender que o avanço da
tecnologia e da informação torna obsoletos muitos conhecimentos que pouco tempo
antes eram vanguardistas.
Na área de Design, um software de edição gráfica que tenha sido lançado em 2012,
por exemplo, já é considerado ultrapassado, tanto por novas atualizações como por
lançamentos da concorrência.
Um profissional que tenha investido no aprendizado desse conhecimento ultrapassado

e deixou de se atualizar perde pontos preciosos na competição pela vaga de emprego.
Uma forma de evitar a desvantagem é manter um ritmo de estudos constante: eleja os

pontos de maior importância da sua área que devem ser sempre estudados e procure
atualizações e novidades sempre que possível.
Também é indispensável ficar atento às novas tecnologias ou processos que

acrescentem novidades à sua bagagem de conhecimentos. Ao antecipar o problema, os
prejuízos são muito menores.
## Frequente e participe de eventos na sua área de formação
Uma das maneiras de manter-se em dia com o que há de novo na sua área de atuação é
procurar por eventos e reuniões temáticas. Congressos, palestras e seminários são
uma ótima oportunidade de adquirir novos conhecimentos e ouvir pessoas de grande
importância no cenário nacional ou internacional.
Outra oportunidade possibilitada por tais eventos é a de fazer um networking com

pessoas de sua área. Networking é o termo usado para nomear a criação de redes de
contatos entre profissionais, o que pode tornar o seu nome conhecido e recomendado
por colegas de profissão. Desenvolver bons contatos é um dos pontos-chave de uma
carreira de sucesso!
**Com o tempo e de acordo com seu desenvolvimento profissional, é possível até

mesmo inscrever-se como palestrante ou ministrar oficinas nestes encontros,
assumindo um papel ativo e aumentando sua exposição entre pessoas consideradas
referências em suas respectivas áreas de atuação.**
## Melhore os seus pontos fracos
A pergunta mais temida por qualquer candidato a vagas de emprego é o questionamento

sobre pontos fracos. Não se trata de um medo injustificado: mesmo com um currículo
exemplar, demonstrar um ponto fraco que cause desencontro com os valores da empresa
pode ser fatal no momento da seleção.
Existem várias maneiras de contornar estes problemas e lidar melhor suas fraquezas.
Uma das formas mais procuradas por profissionais, mesmo altos executivos é o
coaching. A técnica envolve uma gama de conhecimentos, de disciplinas como
psicologia e administração, dedicada a treinar o profissional para desenvolver-se
profissional e pessoalmente.
## Procure cursos online para atualização profissional

É inegável que a internet é o meio de comunicação e pesquisa desta geração. A
ampliação do acesso e das velocidades de conexão à rede abriu incríveis
possibilidades, como a de realizar seus estudos online.
Com o conforto de [**estudar em casa**] e a praticidade de escolher os horários de

estudo, esta modalidade tem conquistado grande público, [crescendo mais] que as
formas tradicionais de ensino.
A oferta e a variedade de cursos são imensas: procure por um que se adapte ao seu
modo e ritmo de aprendizado, e dê preferência para plataformas que possuam boa
reputação, considerando também as avaliações positivas dos usuários.
Outra forma de aprendizado online está nos [grupos de discussão de

nicho] espalhados por toda a internet e em aplicativos de conversa. Eles oferecem
uma possibilidade de contato com profissionais de todo o mundo, facilitando a troca
de informações.
É possível encontrar grupos como essa característica em [**redes sociais**] ou em

fóruns mais específicos, como o [Stack Exchange], que possui mais de 100 sub-fóruns
dedicados exclusivamente a assuntos como design, programação ou linguagens.
## Esteja informado sobre o que acontece no mundo
Embora não seja contado em currículos ou portfólios, saber quais são as

movimentações mais recentes no palco mundial - no âmbito da política, economia ou
cultura - faz de você uma pessoa e um profissional mais completo.
Possibilita, ainda, oportunidades para conversas produtivas com outros

profissionais, elevando e destacando o seu perfil.
Neste texto, falamos sobre a importância de se manter em atualização profissional

constante e ensinamos algumas dicas para quem quer aumentar seus níveis de
conhecimento e tornar-se um profissional de destaque. Comece agora mesmo a sentir o
impacto do estudo contínuo em sua carreira!
Gostou do post e quer melhorar suas chances no mercado de trabalho? Não perca tempo
e invista agora mesmo no seu [aprendizado online]!
Trabalhar com Flutter rodando ele pelo terminal pode ser prático, mas ter ele
integradinho na sua ferramenta de desenvolvimento favorita pode ser muito mais
produtivo, e no meu caso com o VsCode eu realmente curto bastante! Se baseando
nisso hoje vou ensinar como integrar o **Flutter no VsCode**.
**Pré requisitos**
Para aproveitar melhor esse post, eu recomendo que você faça ele após ter um
projetinho Flutter criado, se você quiser ver como começar [da uma olhada nesse
artigo] ou se preferir em vídeo assiste aqui
http://www.youtube.com/watch?v=xSC8j3gl7xM
Lembrando que na plataforma da **Alura**, esses e vários outros conteúdos mais

extra cursos de diversas [tecnologias estão disponíveis através do **Alura+**]
dentro da plataforma da alura
> Você vai precisar ter criado pelo menos um **emulador Android** e ter feito o
[**processo de setup do Flutter em sua máquina**]
## **Mão na massa**
Eu usarei no [exemplo esse projetinho de instagram fake], mas fique a vontade pra
criar o seu projeto para acompanhar o post. Com o VsCode aberto, baixe a extensão
do Flutter, que irá fazer a integração dos comandos da **CLI** com a estrutura do
nosso editor
imagem + Shift + P é possível visualizar todos os comandos Flutter disponíveis

dentro do VsCode
![]
Para subir dois emulador basta selecionar o comando launch emulator e escolher o
que falta pra você.
O VSCode atualmente não suporta sincronizar dois emuladores, portanto caso você
queira debugar vai precisar ficar alternando entre os emuladores através da opção
**">Flutter Select Device"** desligando e ligando o projeto.
O que eu faço no dia a dia para ser mais produtivo é escolheru ma plataforma, ex o
**Android** e deixar a outra rodando via uma aba do terminal 100% separado do
VSCode, o único foco é garantir que o layout está saindo certinho nas duas
plataformas.
Para isso, após ter 2 emuladores abertos, rode o comando **flutter run** e na
sequência pede o ID como na imagem abaixo do emulador que você quer abrir
![]
Após copiar o ID, basta rodar o comando novamente mas com esse formato **flutter
run -d IDDOEMULADOR**
![]
Por hoje é isso, vejo você no próximo artigo, Espero que tenha gostado, em breve
trarei mais dicas, não deixe de [me seguir nas minhas redes sociais] e acompanhar
meus outros artigos em meu site pessoal [https://mariosouto.com].
Nos tempos atuais de incertezas e mudanças, as empresas com modelos tradicionais

não dão conta de responder rapidamente a um momento em que as tecnologias se
renovam constantemente.
Para responder rapidamente a essas mudanças, muitas empresas estão em busca do

modelo *Business Agility*, que se trata de agilidade do negócio. E quando falamos
em *Business Agility*, estamos falando em muito mais do que aplicar apenas os
[**métodos ágeis**]. As empresas estão repensando todo os seus modelos de negócios,
destravando muitas vezes processos e burocracias que impedem que a organização
cresça de maneira ágil.
O ponto de partida das organizações é [**adaptar a cultura organizacional**] a

essas mudanças também. Se uma empresa não tiver como valor na cultura a
adaptabilidade, dificilmente terá sucesso com a mudança comportamental das pessoas.
Os colaboradores precisam se adaptar a esse ambiente e estar preparados para as
mudanças. Adaptabilidade é uma característica determinante para fazer parte de uma
organização com a cultura ágil.
Mas como você pode se preparar para trabalhar em uma empresa com a cultura ágil?
Aqui vai algumas dicas:
- **Aprender sobre o manifesto Ágil**: O primeiro ponto é aprender sobre

[fundamentos de agilidade]. Independente da área que você trabalhar, precisará
entender esse mundo, para a engrenagem funcionar.
- **Explorar um pouco sobre o Mindset necessário para embarcar no mundo Ágil**:

Explorar características como autonomia, confiança e colaboração são
características chaves nesse processo de mudança.
- **Conhecer os papéis e suas responsabilidades**: Conhecer os papéis necessários e

suas responsabilidades, faz parte para que uma transformação ágil seja bem
sucedida. Explorar como as equipes ágeis são organizadas, vai ajudar muito a fazer
parte desse novo universo.
- **Agilidade no dia a dia**: Aprender como priorizar tarefas, mensurar resultados,

identificar gargalos e tudo que possa agilizar o fluxo de trabalho.
- **Entrega de valor**: Toda essa mudança se resume em entregar valor para o

cliente de maneira rápida, e com qualidade. Esteja preparado para se alinhar com a
cultura ágil da empresa e gerar mais valor para o negócio e para o cliente.
https://www.youtube.com/watch?v=F_XPMcLo9ao
Nesse mundo de de tantas mudanças, muitas empresas já começaram ou vão começar a

enraizar a cultura ágil, e estarão em busca de pessoas atualizadas, e nós como
colaboradores precisamos estar preparados para entregar o que estão buscando.
Se você pensa em se preparar, ou preparar toda a sua empresa, conheça nossa

[**Formação Bussiness Agility**]. Com ela, você, sua equipe, e toda a empresa vão
poder colocar tudo em prática!
Quando vamos fazer um aplicativo Android, inúmeras vezes será necessário utilizar
uma lista, o Alex mostrou para gente como [**criar uma lista**] e [**personaliza-
la**] usando `ListView`.
Depois que fazemos todo esse procedimento vemos que a listagem às vezes engasga
quando estamos passando os seus itens, vamos entender porque isso acontece. Vamos
analisar esse Àdapter` :
java
Bom, nada de novo até agora, mas nesse momento estamos com um pequeno problema,
quando nossa lista está com muitos itens ela trava, por quê ?
## Entendendo o processo de criação entre a ListView e o Adapter
O `ListView` quando é criado, pergunta ao Àdapter` qual é a quantidade de itens

que ele terá, e recebe a resposta atráves do método `getCount()`.
Quando recebe a quantidade ele começa a se preparar para exibir os itens, vendo a
quantidade que caberá na tela, vamos imaginar que sejam apenas 5 itens qua possam
ser exibidos, nisso o Android vai inflar esses 5 itens e vai devolver para o
`ListView` através do método `getView()`, além disso o Android acaba inflando mais
duas views, para reaproveitarmos.
Está view que é criada para reaproveitamento é a view que recebemos como parâmetro
no método `getView()`, chamamos ela de `convertView` :
imagem` para cada view.
O `findViewById()` percorre o xml em busca da view, perguntando para cada view se

ela possui aquele id, indo da view principal descendo sobre seus "filhos" da
esquerda para a direita, como se fosse uma árvore genealógica.
Isso num layout mais complexo levaria um certo tempo para encontrar cada view
certinha e popula-la, por isso precisamos dar um jeito de fazermos a busca apenas
quando criamos o item e quando reaproveitarmos o item criado, também aproveitar as
buscas.
java
Dessa forma resolvemos o problema! Pena que o compilador está reclamando, pois
quando formos reaproveitar uma view não teremos referência para os `TextView`, e
agora?
## Implementando o ViewHolder
Bom, para resolvermos esse problema existe um **design pattern** chamado

`ViewHolder` que irá segurar as informações da view.
Para utilizarmos esse pattern iremos criar uma classe que precisará da view que ela
pegará as informações.
Java
Legal, classe criada, está faltando apenas a usarmos. Bora fazer isso !
java
Poxa, parece tudo certo, entretanto ainda estamos sendo barrados pelo compilador. O
mesmo erro que estávamos lendo antes, quando formos reaproveitar a view o
`ViewHolder` não será criado, portanto não terá referência para ser usado.
Para resolver isso, precisamos deixar o `ViewHolder` "pendurado" na view que ele
pertence, dessa forma, quando formos reaproveitar a view, conseguiremos o
recuperar.
java
## Conhecendo a API RecyclerView
Embora tenhamos implementado a `ListView` considerando todos os detalhes que vimos

neste post, repare que tivemos que ter o conhecimento do `ViewHolder` para
implementá-lo. Em outras palavras, se não o conhecêssemos, ainda teríamos o
problema de performance conforme a lista fosse crescendo...
Pensando justamente nesse e outros detalhes, a Google disponibilizou uma API mais
inteligente para a criação de listas que já nos obriga a realizar todas as
implementações que vimos no Àdapter` e na `ListView`, e também, a implementação do
`ViewHolder`!
Essa é a API `RecyclerView` que é explicada com mais detalhes [nesse post que
escrevi]! Recomendo fortemente a leitura, pois é a forma mais adotada pelos
desenvolvedores Android para criação de lista nas Apps.
## Resumo
Como vimos, para termos um `ListView` com boa performance, precisamos reutilizar as
views que o Android cria a mais para gente, só para lembrarmos o nome que damos
para essa view é `convertView`.
Além disso para melhorar de vez a performance, podemos evitar que ele faça
`findViewById`s desnecessários, utilizamos o padrão `ViewHolder` que irá cuidar de
fazer isso para nós e associamos ele a view cujo ele pertence, desta forma
otimizamos bastante o funcionamento da lista, agora nada de ve-lá engasgar! :D
**Quer ver mais dicas bacanas sobre Android? Aqui na Alura [temos vários cursos de
Android], se você preferir presencial na Caelum [temos dois cursos bem bacanas]!**
imagem
Veja como manipular string no Pandas e veja meios de manipular seu data frame e
tratar os dados da forma que precisar.
Imagine uma plataforma de música online chamada Alurafy, que permite tocar músicas,
playlists e assinar dois tipos de planos. Os usuários acessam as páginas (URIs) e
temos os dados crus em uma tabela com:
- coluna representando o ID do usuário (caso ele/a esteja logado/a)

- coluna com a URI acessada
- coluna com o status de resposta, se foi sucesso (200) ou um erro interno (500):
python
imagem:
python
Resultando nas colunas em minúsculo:
python
Mas os espaços em branco ainda estão lá. Podemos pegar essa série de dados, usar
novamente o `str` e trocar os espaços por ùnderlines`:
python
Finalmente com as colunas com os nomes que eu desejava:
python
Se atribuirmos os valores dessas colunas a elas mesmas:

python
![]
E essa linha de padronização dos nomes das colunas pode ser usado em quase todo
projeto logo após importar um csv.
Agora vamos dar uma olhada nas páginas acessadas através de suas URIs:
python
python
Agora gostaria de criar uma coluna nova indicando se ao acessar aquela página, o
usuário estava querendo comprar algo. Isto é, a URI começa com `/compra/`? Se sim,
`True`, se não `False`. Para isso temos a função `startswith`:
python
Portanto estamos buscando numa coluna de string/texto pelas linhas que começam com
determinado valor. Agora imprimimos com uma query os 5 primeiros elementos que
estão com `True`:
python
Resultando em:
![]
Para agrupar e contar o número de páginas de compra versus o número de outras

páginas, vamos pegar a coluna `comprando` e somar seus valores:
python
E percebemos que temos cerca de 9.5% de acessos as páginas de compras:
python
Por fim, cometemos um erro. Na verdade existem também as páginas de compra como do
dia primeiro de abril em `/promocao_primeiro_de_abril/compra/plano_basico`.
Portanto queremos não só as URIs que começam com `/compra/` mas que posseum no meio
o trecho `/compra`. Além da função `startswith`, str nos permite executar diversas
outras funções, como `contains`:
python
![]
Agora sim, criamos a coluna nova de acordo com quaisquer páginas que possuem o
trecho `/compra/` em sua URI.
Resumindo, sempre que precisar trabalhar com uma coluna do tipo string, para
extrair valores dela, fazer transformações de string para string, [**dê uma olhada
na documentação da `str` para ver se ela já possui o que você deseja fazer**]. São
algumas dezenas de funções.
O notebook com [**todo o conteúdo desse post pode ser encontrado no github**].
Dentra da **Alura** disponibilizamos diversos [**cursos de Python, Pandas, Data
Science e Machine Learning**], onde vamos muito além da manipulação inicial dos
dados.
Vamos supor que você é um líder que contratou treinamentos online para a sua
equipe. Você escolheu os cursos, planejou e fez um cronograma para que cada membro
do time pudesse aprender o máximo possível. Agora chegou a hora de mostrar para o
seu supervisor,ou mesmo para o setor financeiro, os resultados que esse treinamento
teve.
Medir o retorno sobre o investimento dos treinamentos online corporativos pode ser
um desafio, pois é preciso **comprovar que foi o investimento em pessoas que gerou
um determinado resultado**, e não outros fatores. Mas, seguindo o Método
Kirkpatrick-Philips, você vai conseguir entregar um relatório do ROI com sucesso.
Então, como medir o ROI dos treinamentos online?
## Primeiro, faça uma análise dos impactos positivos
Para facilitar na hora de medir os resultados, você precisará analisar vários

fatores que possivelmente foram impactados pelo treinamento, começando com as
mudanças imediatas. Que tal descobrir as reações dos participantes? Eles
consideraram o treinamento adequado às suas necessidades? Você pode realizar uma
pesquisa com formulários online, ou entregar fichas de satisfação, para que os
funcionários avaliem o treinamento de forma anônima.
Depois de vários dias após a finalização da capacitação, você vai querer saber se
os participantes ganharam novos conhecimentos que podem ser aplicados no trabalho
deles. Caso o treinamento foi focado nas habilidades técnicas, você pode verificar
se a execução das tarefas do dia a dia melhorou em questões de **maior
desempenho**, **menos bugs** ou **criação de novos produtos**.
Caso a sua equipe tenha participado de um treinamento em _soft skills_ – como

atendimento ao cliente, negociação ou liderança – você pode observar **mudanças no
comportamento ou melhorias no trabalho em time**.
Com o passar do tempo, você vai querer **validar se os resultados do treinamento

foram duradouros ao longo prazo**, então você pode realizar pesquisas de satisfação
dos funcionários, conhecidas como pesquisas de clima. E, por último, você vai
precisar avaliar os resultados totais do treinamento para dizer **qual foi o
impacto no negócio**.
### Método da avaliação do treinamento em 4 níveis
Baseado nesses passos, Donald Kirkpatrick, ex-presidente da _American Society for

Training and Development_, elaborou o _Método da avaliação de treinamento em 4
níveis_, sendo eles:
- **1\. Avaliação da reação de quem aprende** _Como os participantes se sentem após

o treinamento?_
- **2\. Avaliação do aprendizado** _Os participantes adquiriram novo conhecimento
e/ou mudaram a sua atitude após o treinamento?_
- **3\. Avaliação do comportamento** _Os participantes aplicaram o conhecimento no
dia a dia do seu trabalho mesmo após um longo período da finalização do
treinamento?_
- **4\. Avaliação do resultado** _Quais foram os efeitos finais do treinamento em
seu negócio, tais como aumento no número de vendas, diminuição das reclamações dos
clientes, rotatividade dos funcionários?_
Como você pode perceber, nenhum dos níveis examina especificamente o retorno sobre
o investimento que o treinamento possivelmente trouxe para a sua empresa. Para
avaliar estes impactos, é preciso comparar os gastos com os ganhos.
Ainda que o nível 4 do método do Kirkpatrick já ajude a medir alguns resultados

financeiros – como aumento nas vendas ou indicadores chaves da performance (KPIs)
da empresa –, ele recebeu várias críticas por deixar de lado a questão do custo-
benefício.
Então, **como fazemos para obter um relatório que indica se o nosso investimento
valeu a pena?**
## O ROI dos treinamentos na prática
Jack Philips, fundador do _The ROI Institute_ – organização que ajuda gestores no
processo de avaliação dos treinamentos corporativos –, aprimorou o Método do
Kirkpatrick com o seu trabalho.
Este grande mentor em avaliação de treinamentos acrescentou o quinto nível a esse

método, e trouxe uma **fórmula para medir o ROI**, comparando os custos totais dos
treinamentos com os benefícios líquidos obtidos mediante estas ações.
A fórmula do Philps para medir o ROI dos treinamentos é a seguinte:
imagem com Java, com duração de 12 horas, no seu horário de trabalho. Se formos
considerar que ele recebe R$ 70 por hora, a empresa investiu mais **R$ 70 x 12
horas = R$ 840**.
### Curso TDD com Java
Antes de iniciar o curso de TDD com Java, Thiago enfrentou a seguinte situação: a
cada 5 funcionalidades desenvolvidas, 2 voltavam com erro e ele precisava de 10
horas para consertá-las. Após completar o curso, só 1 das 5 funcionalidades
continha um erro para arrumar, então, **o retrabalho neste caso diminuiu pela
metade**, de 10 para 5 horas.
Por mês, o Thiago precisa testar 15 funcionalidades, logo, temos um **retorno sobre
investimento de 15 x 70 = R$ 1.050**.
Agora, ele pode dedicar mais tempo ao desenvolvimento e à liderança da sua equipe,
pois tem menos retrabalhos. Para a empresa, os gastos com esses retrabalhos
diminuíram.
Entretanto, você percebeu que o time do Thiago está entregando menos, comparado com
a equipe de designers. Após falar com ele sobre os desafios da sua equipe, ele
contou que, atualmente, as reuniões semanais ocupam 20% do tempo dos
desenvolvedores, e só 10% delas são realmente produtivas, resolvendo bugs e
trazendo ideias de melhorias. **Será que é possível diminuir o tempo das reuniões e
aumentar a produtividade da equipe?**
### Curso Metodologias Ágeis com Scrum
Considerando que a equipe dos desenvolvedores tem 7 pessoas, e que cada uma delas
trabalha 40 horas por semana e recebe R$ 50 por hora, se 20% dos seus horários
forem gastos com reuniões – das quais só 10% são significativas para o crescimento
da empresa –, isso resulta em um gasto semanal de 7 x 200 (10% do salário semanal
de R$ 2.000) = R$ 1.400.
Então, você decidiu que o Thiago faria mais um curso, desta vez sobre metodologias
ágeis. Ele participou de dois cursos de Scrum na Alura, com duração total de 10
horas. Então, seria outro investimento de horas do seu trabalho: **10 x 70 = R$
700**.
Após concluir os dois cursos, ele trouxe novas ideias e técnicas de gerenciamento
ágil. Agora, ele realiza reuniões várias vezes por semana que são mais curtas e
focadas em um assunto concreto. Estes encontros **passaram a ocupar só 10% do
horário dos colaboradores** e levam sempre a resultados importantes. Então,
comparado com o tempo passado em reuniões anteriormente, \*\*a empresa poupa
semanalmente R$ 1.400, e mensalmente R$ 5.600.
## Agora, vamos medir o ROI dos treinamentos online da Alura
**Chegou a hora de preparar o relatório dos resultados dos treinamentos.** O

investimento total era de R$ 900 (investimento no plano corporativo de cursos
online) + 700 + 840 (horário de trabalho investido em treinamento) = **R$ 1.810**.
Os **ganhos líquidos monetários** da capacitação eram de R$ 1.050 (ganhos obtidos

com o treinamento em TDD com Java) e R$ 5.600 (ganhos obtidos com o de Scrum).
Assim, teremos um total de **R$ 6.650**.
A fórmula do ROI dos treinamentos para o nosso exemplo seria:
![fórmula para medir o ROI dos treinamentos online]
No nosso exemplo, obtivemos um **retorno sobre investimento de 367,40%** já nos

primeiros meses desde o treinamento. Se formos avaliar os benefícios após um ano de
sua conclusão, ganharíamos um número até maior. Logo, poderíamos considerar a
disponibilização dos cursos para outras equipes ou setores, seja para ganhar mais
_insights_avançados de Scrum ou continuar com cursos diferentes, seguindo a demanda
dos clientes.
E na sua empresa, **quanto tempo as reuniões das equipes ocupam**? Quais delas
estão realmente gerando soluções de problemas e trazendo ideias relevantes para o
negócio? E, finalmente, você já mede os resultados dos treinamentos corporativos
para obter o ROI?
## Cursos online como um investimento valioso
Os cursos online representam uma das diversas opções para os colaboradores da

empresa adquirirem conhecimento e, sem dúvida, podem trazer resultados financeiros
interessantes para o seu negócio.
Contudo, para sermos capazes de relatar o sucesso das capacitações e justificar o

nosso investimento, devemos sempre **medir os resultados para descobrir onde e
quais benefícios ganhamos**, comparando os ganhos líquidos com o investimento feito
inicialmente.
Para saber mais sobre a mensuração dos treinamentos online acesse o eBook [**Como
mensurar o ROI dos treinamentos online: Exemplo dos cursos na Alura**]. Ele pode
servir como um guia para ajudar a medir o retorno sobre o investimento, usando mais
uma vez o Método Kirkpatrick-Philips.
Vou personalizar uma **ListView no Android** para que cada item da lista tenha seu
próprio visual, dando uma maior flexibilidade para o desenvolvimento minha app.
No artigo sobre [**como criar listas com o `ListView`**] que eu escrevi

anteriormente, vimos como é possível criar uma lista bem básica no Android. O
resultado da lista criada foi:
imagem`, `getItem(int position)`, `getItemId(int position)`. Perceba que são

métodos relacionados a uma lista! Para implementá-los da maneira correta,
precisamos de uma lista dentro do nosso adapter.
Lembra que enviávamos a nossa lista via **construtor** no ÀrrayAdapter`? Faremos o

mesmo no nosso adapter para que possamos implementar esses métodos da maneira
esperada:
java
### Informando o total de itens da lista
Agora podemos implementar os nossos métodos! Vamos começar pelo `getCount()`. O

próprio método já diz o que ele faz: conta quantos itens existem na lista. Ou seja,
o **tamanho** da lista.
java
### Devolvendo o item da lista pela posição
Agora vamos para o `getItem(int position)`. Veja que ele quer saber um item a
partir de uma posição. Isso é fácil! Basta apenas retornamos por meio do método
`get()` mandando a posição:
java
### Devolvendo o id do item da lista
Vejamos o próximo: `getItemId(int position)`. Esse método espera saber qual é o

**id** do objeto que está sendo buscado. Porém, se verificarmos a nossa classe que
representa um curso:
java
Veja que ela não possui um id. Para esse caso nós temos duas alternativas:
- 1) Manter o retorno como 0;

- 2) Adicionar o id ao curso e, pegar o objeto pelo método `get()` e então usar o
getter do id.
Atualmente, não precisamos do id, então, por enquanto, devolveremos 0.
## Criando a View para cada item
Ótimo, implementamos os 3 primeiro métodos referente a lista que enviamos, porém

ainda falta mais 1 que é o `getView()`:
java
Repare que agora ele retorna uma `View`, ou seja, esse é o método responsável pela
construção de cada item! O que precisamos para implementá-lo?
Inicialmente, precisamos, de alguma forma, pegar a `View` que representa o nosso
**layout personalizado**. Afinal é ela que queremos apresentar na nossa lista!
Mas, para pegar uma `View`, nós precisamos de uma Àctivity` e a nossa classe, além
de não ser uma Àctivity`, não possui uma Àctivity`.
E agora? O que faremos? Se dermos uma olhada na forma que fizemos para instanciar o
ÀrrayAdapter` anteriormente:
java
Veja que estamos passando passando o parâmetro **`this`** que representa o objeto
da própria Àctivity` que está fazendo a chamada. Precisamos receber também essa
Àctivity` via construtor:
java
Agora sim podemos chamar uma `View`!
Queremos criar uma **`View`**, ou seja, ao invés de só buscá-la via o método

`findViewById()`, nós iremos criar a `View`.
Em outras palavras, inflar uma `View`! E para isso iremos utilizar o método
`getLayoutInflater()` da Àctivity` que é responsável em inflar uma `View`:
java
Pegamos o responsável em inflar e chamaremos o **método ìnflate()`** que criará a

`View` e a retornará para nós:
java
Perceba que utilizamos o `parent` que vem como parâmetro do método `getView()`. Mas
o que ele representa? Como podemos ver, o `parent` é a própria `ViewGroup`, ou
seja, o layout pai ao qual iremos adicionar a nossa lista, por isso enviamos ele.
Além disso, ainda existe o último parâmetro que recebe um valor booleano, esse
parâmetro indica se queremos criar, nesse exato momento a `View`.
Mas, não fizemos nenhum tipo de alteração como adicionar as informações do curso,
por isso mandamos o `false`. Dessa forma, podemos associar tudo que queremos e só
depois ele criará de fato a `View` :)
Certo, pegamos a nossa `View` e agora precisamos de um curso, certo? Mas qual
curso?
Veja que, ainda existe um parâmetro no `getView()` que é o `position`, ou seja, é

justamente nessa posição que devemos pegar o elemento da lista que foi passada,
nesse nosso caso, o curso:
java
## Preenchendo os valores para cada item da lista
Ótimo! Agora já podemos chamar as outras `View`s e preencher as informações e

então, retornar o objeto `view`:
java
O nosso próprio adapter está implementado:
java
Para testarmos a nossa implementação, basta apenas alterar na Àctivity`, que

chamava o ÀrrayAdapter` do Android, para chamar o nosso adapter:
java
> Observe que não foi apresentada a implementação do método `todosOsCursos()`

justamente para ser mais objetivo na implementação do componente `ListView`.
Compreenda esse método como um acesso aos dados qualquer, seja uma lista estática,
banco de dados ou qualquer meio que devolva uma lista de cursos.
Agora se testarmos a nossa app:
imagem` do nosso adapter:
java
Observe que estamos setando a **mesma imagem para todos os elementos da lista**!
Precisamos de alguma informação do curso para sabermos a que ele se refere!
Atualmente, não temos nenhum tipo de informação para categorizar os nossos cursos,
então que tal criarmos um enum para isso?
java
E agora adicionamos um **enum** para a nossa classe curso:
java
Muito bom! Agora basta verificarmos a qual categoria o curso refere-se e então
settamos a imagem apropriada:
java
Essa solução com esse tanto de ìf` e èlse` funciona, porém não é uma boa prática!
[**Nesse post**] eu detalho um dos grandes problemas que temos com esse tipo de
solução e como podemos resolver de uma maneira mais elegante.
Adicionamos as nossas condições para setar as imagens, então agora vamos testar e
ver o resultado:
imagem` para adicionar conteúdo diferente de acordo com algum critério, como foi o
caso da imagem específica para cada curso.
## Código fonte
Caso tiver dúvidas ou simplesmente quiser consultar o código fonte do projeto

utilizado como exemplo, fique à vontade de dar uma olhada no [github]. Lembrando
que para essa etapa do projeto eu fiz uso da branch **lista-personalizada**.
E aí, gostou de criar uma lista própria? Quer aprender mais dicas sobre o Android?
Que tal conhecer [**a formação Android**].
Temos um sistema desktop que gerencia os funcionários de uma certa empresa. Para
realizar tal tarefa, o sistema necessita que todos os usuários estejam cadastrados.
Temos nosso formulário de cadastro representado pelo seguinte código:
java
Ao executarmos a aplicação, temos o seguinte resultado:
imagem 99713-3837, para o CPF 893.920.408-57 e, também, não é nada legal deixar a
senha explícita desse jeito. Como formatar tais dados?
## JTextFormattedField
Precisamos colocar uma máscara em cima dos nossos campos para que, conforme os
dados sejam inseridos, nossos campos já consigam formatá-los. Infelizmente a classe
[**JTextField**] não dá o suporte para formatação dos dados, mas para isso existe
outra classe.
A classe [**JTextFormattedField**] estende a classe `JTextField`. Essa classe

adiciona suporte para mascarar os dados do seu campo. Com isso podemos limitar e
formatar os dados inseridos pelo usuário.
Agora que já sabemos o que precisamos usar, vamos por a mão na massa. Primeiro
vamos colocar máscara no campo de telefone, para isso vamos alterar o atributo
`telefone`:
java
Perceba que só foi necessário trocar o lado direito da declaração, pois como
`JFormattedTextField` estende `JTextField` o mesmo não deixa de ser um
`JTextField`.
Também podemos observar que passamos um objeto do tipo [**MaskFormatter**] e nele

passamos a máscara que nosso campo terá. No caso, passamos "(##) #####-####", essa
“#” significa que o campo só irá aceitar números.
Se rodarmos nossa aplicação novamente veremos o resultado:
![]
Boa, deu certo. Agora para o CPF, queremos, também, que só seja permitido dígitos e
a formatação específica do CPF, certo? Bom, para isso vamos fazer a mesma coisa que
fizemos com o telefone:
java
Executando o código:
![]
E por último, a senha. Como encobrir os caracteres da senha com aquela bolinha
preta?
## JPasswordField
Igual ao `JFormattedTextField` o [**JPasswordField**] também estende `JTextField`.

Essa classe, por sua vez, é um componente que representa um campo para digitar
senhas ou informações sigilosas, pois ela esconde o valor original digitado e, por
padrão, converte para as bolinhas pretas que estamos habituados a ver em campos de
senha.
Para adquirir o resultado esperado, vamos trocar o atributo `senha`. Dessa forma:
java
Ao executar a aplicação temos:
![]
Pronto, todos os campos foram devidamente formatados!
## Conclusão
Praticamente todos os formulários têm a necessidade de usar máscara para seus

campos para auxiliar o usuário que está inserindo os dados, evitando erros e
complicações no momento de preenchê-los.
Outra vantagem de fazer isso é que você vai conseguir ter um conhecimento melhor de
como os dados vão chegar no seu servidor, logo, facilita na hora de tratar os
dados.
Todas as classes que usamos aqui são do pacote [**javax.swing**], que, por sua vez,
nos provê componentes para montar nossas telas em aplicações Java para desktop.
Atualmente temos o [**JavaFX**], que, também, é uma biblioteca do Java para montar
aplicações desktop. Ele veio para resolver alguns problemas do `swing` como a
dificuldade para desenvolver usando os componentes desse pacote, a falta de
componentes mais ricos visualmente e outros empecilhos.
Para saber mais sobre JavaFX, a [**Casa do Código**] possui um livro que
[**destrincha grande parte dos seus componentes**], lá você vai entender o que é o
JavaFX e como utilizar em suas aplicações. E a Alura tem a [**Formação Java**],
onde você aprenderá muito mais sobre a linguagem e suas peculiaridades.
Isso acontece com um carro, por exemplo, depois de uma certa quilometragem você
precisar trocar os pneus, algumas peças do motor, etc. O mesmo acontece com o seu
computador que, depois de um tempo precisa de um upgrade, um disco maior, adição de
mais memória RAM e assim por diante...
imagem
A aplicação de técnicas por meio da engenharia de software tem o objetivo de

utilizar esses mesmos conceitos: módulos plugáveis que podem ser atualizados ou
trocados.
No mundo dos **softwares open source as comunidades acabam fazendo isso com certa
normalidade, evitando ao máximo que essas atualizações gerem impactos negativos no
que já está funcionando.**
Falando no framework **Emberjs**, podemos citar a relação entre o Ember, Handlebars

e Glimmer como um exemplo. Apesar de seu surgimento ter acontecido em momentos
diferentes, estão em busca de uma mesmo ideal: **tornar o desenvolvimento web mais
eficaz**.
O projeto Ember surgiu como um fork do Sproutcore e a engine de templates
Handlebars foi um aprimoramento do [Mustache].
Uma engine de templates serve para **interpolar valores dinâmicos obtidos em uma
Linguagem de Programação a trechos de código HTML**.
No caso do **Handlebars** isso pode ser feito utilizando a linguagem Javascript,

rodando em praticamente qualquer navegador de internet, evitando de usar HTML
embutido, base de tecnologias que são utilizadas em arquivos .erb, .jsp, .asp, etc.
Por exemplo, tendo o seguinte template:
js
Combinado com o Objeto:
js
Traria o seguinte resultado:
html
Além do Ember e Sproutcore já mencionados, outros projetos também usam o

Handlebars, como o [**YUI**], que tem sua própria versão do Handlebars, ou o
[**Marionette.Handlebars**], que é a integração com a biblioteca [**Marionette**].
O Ember extende o Handlebars, dando a ele uma forma de estruturar os arquivos e

suporte ao binding de propriedades automaticamente. Vamos exemplificar com um
componente no Emberjs
js
A principio teríamos o HTML:
html
Mas a medida que o alterarmos o conteúdo do input, o valor do também será alterado,
por exemplo se digitarmos Glimmer, teríamos algo parecido com o HTML:
html
Essa "facilidade" do **two way data binding**, onde você altera o valor do atributo
no HTML refletindo no Javascript ou vice-versa, tem seu custo e até a versão 2.9.X,
o Ember tinha um problema de performance, se comparado aos concorrentes do
mercado(Angular, React, etc).
A partir da versão [2.10] o Ember trouxe uma grande atualização e baseada no

conceito de "estabilidade sem estagnação", a transição entre as versões 2.9 e 2.10
pode ser feita de maneira suave.
Além dos problemas de performance, essa atualização também diminuiu

significativamente o tamanho dos assets gerados no processo de build. Para se
aprofundar nisso é só dar uma pesquisada que vai achar benchmarks bem
interessantes!
Até a versão 2.9, a integração entre o Ember e o Handlebars era feito pelo
[**HTMLBars**], posteriormente, a partir da versão 2.10, esse motor de renderização
foi trocado por um novo, chamado de [Glimmer], ele se denomina como uma biblioteca
de componentes gráficos rápida e leve feita pela equipe do Ember e apesar dele ser
composto de vários projetos nos referiremos a ele de maneira singular.
O Glimmer pode ser usado de maneira independente do Ember, porém parece não fazer
sentido termos apenas o motor sem as rodas e chassi.
## Resumindo...
Em resumo, poderíamos dizer que o Glimmer 2 - assim nomeado em seu [anúncio] - foi
uma evolução do HTMLBars(Glimmer 1), em que o processamento dos templates era feito
utilizando a API do DOM, revitalizado como um novo projeto, utilizando várias
técnicas de engenharia onde o processamento dos templates é feito de maneira
incremental.
Agora pode surgir outra pergunta:
> _"É possível usar o Glimmer sem o Ember?"_
A resposta seria sim, mas lembre-se, ele é apenas uma biblioteca de componentes. Um
fato para ainda utilizar o Ember seria o sistema de roteamento de endereços e
templates.
Esperamos que com o tempo surjam mais e mais atualizações como essa, podendo
melhorar nossas aplicações sem necessidade de reescrevê-las completa ou
parcialmente.
Quer conhecer mais sobre o Ember, [**veja nosso livro em português pela Casa do
Código!**] Acompanhe também as novidades da [Casa do Código] no [Facebook] e
[Twitter]! ;)
Durante o desenvolvimento de um projeto web, nosso cliente pediu que no cadastro de

endereço criássemos um recurso para busca de CEP automática facilitando o processo
para o usuário, mas como podermos fazer isso?
Inicialmente, poderíamos adicionar algum tipo de botão ou listener que ficasse

responsável em fazer uma requisição HTTP enviando o CEP, e então, recarregasse o
formulário automaticamente.
Porém, quando estamos em formulários de cadastro de endereço, como por exemplo em

sites de e-commerce, é muito comum adicionarmos apenas o CEP e as informações já
aparecerem sem ao menos recarregar a página, certo?
Da nossa forma inicial, ou seja, recarregando a página, não entregaríamos essa

experiência para o usuário... E agora?
## Entendendo o AJAX
Através do Javascript conseguimos enviar requisições para determinadas URLs e obter

suas respostas sem que as páginas sejam recarregadas, em outras palavras, quando o
usuário sair do campo do CEP ou clicar em um botão, a busca do mesmo será efetuada
e as informações serão preenchidas para usuário sem que a página recarregue.
Esse método de requisição no Javascript é conhecido como [AJAX]. Legal, mas como
poderíamos aplicar esse tal de AJAX? Em um primeiro momento podemos pensar em
simplesmente realizar o download de uma biblioteca contendo a funcionalidade que
precisamos, talvez a mais famosa seja o [JQuery].
Porém não parece ser uma boa idéia incorporar uma biblioteca em nosso projeto
apenas para realizar um AJAX, pois estaríamos utilizando cerca de 10% do que a
mesma pode nos oferecer.
Então como devemos solucionar o problema sem criar uma dependência com terceiros?
Criaremos nossa própria funcionalidade para buscar os CEPs para atingir o resultado
desejado.
## Pegando o formulário HTML
Nosso primeiro passo será de fato pegar o nosso formulário HTML para aplicarmos o
AJAX. Para este exemplo farei uso [deste formulário] que está no meu Github, ou
seja, se você quiser seguir o passo a passo, pode baixar também! ;)
![]
Com o HTML pronto, precisamos começar a implementação da busca de CEP conforme

nosso cliente havia solicitado, para tal recurso iremos utilizar o [web service] do
[viacep], um serviço gratuito na web que nos permite recuperar informações
referente a determinados CEP's.
## Criando requisições com XMLHttpRequest
O Javascript nativo possui um objeto responsável por realizar requisições AJAX

conhecido como [`XMLHttpRequest`], ou seja, por meio dele podemos recuperar dados
de uma determinada URL. Apesar do nome, ele pode ser usado para recuperar qualquer
tipo de dado e fornece suporte aos protocólos _HTTP, FILE e FTP_.
Vamos então criar uma instância do objeto para começarmos a utilizá-lo:
javascript
Com o objeto criado, vamos utilizar o método [òpen`] para começarmos a criar a
nossa requisição:
javascript
O método open recebe três parâmetros, sendo eles:
1. O [verbo HTTP] a ser utilizado para realizar a requisição, o mesmo deve seguir o
[padrão REST].
2. A URL que pretendemos obter os dados.
3. Um argumento booleano informando se a requisição deve ser assíncrona ou
síncrona.
Agora precisamos implementar a propriedade [ònreadystatechange`] que é disparada

sempre que nossa requisição sofre alguma alteração durante seu processamento:
javascript
Repare que passamos uma função de _callback_, ou seja, uma função que sempre será
executada assim que a requisição sofrer alguma alteração. Quando implementamos essa
função precisamos tomar alguns cuidados, o primeiro é verificar se a mesma foi
finalizada, mas como fazer essa verificação? Fazemos isso através do
[`xhr.readyState`]:
javascript
O código 4 nos informa que a requisição foi finalizada, porém ainda não é
suficiente, afinal, f**inalizada não significa que foi bem sucedida**, portanto, é
necessário verificar se ela foi realizada com sucesso também! Portanto, faremos uso
do [`xhr.status`] pra isso:
javascript
O código 200 nos informa que a requisição obteve sucesso durante seu processamento.
Isso significa que agora podemos acessar a resposta que o servidor nos enviou e
realizar alguma função desejada.
## Preenchendo os campos no formulário
Até o momento já devemos ser capazes de obter as informações do nosso serviço de

CEP, começaremos então a criar uma função que será invocada a cada clique em um
botão:
javascript
O primeiro passo será pegar a referência do campo CEP para obtermos seu valor:
javascript
Feito isso já podemos começar construir nossa URL:
javascript
Com nossa URL pronta, podemos começar a implementar o `XMLHttpRequest` conforme

visto anteriormente:
javascript
Tudo pronto, certo? Entretanto nosso web service exige que o CEP venha apenas com
números, em outras palavras, se deixarmos apenas os dados que estamos pegando do
campo referente ao CEP, podemos enviar, por exemplo, um CEP com o seguinte formato
`"12345-123"`, que é uma forma comum em formulários na web.
Caso isso aconteça nossa requisição irá falhar e não conseguiremos obter as
informações... Como podemos resolver o problema? Precisamos de fato retirar a
formatação do CEP antes de enviá-lo da seguinte maneira:
javascript
Realizamos um replace para retirar o `-` do CEP, agora para testar nosso serviço
podemos informar o CEP 13845-373 em nosso formulário e clicar no botão, onde iremos
ver a resposta do servidor:
javascript
Como podemos ver, através do [`responseText`] conseguimos obter a resposta do nosso

servidor, porém o JSON está em formato de string, sendo assim, precisamos convertê-
lo para um objeto JSON em Javascript, podemos fazer isso através do [`JSON.parse`]:
javascript
Ao mandar nosso formulário buscar o CEP novamente, iremos notar a mudança da saída
em nosso console que agora passou a ser um objeto e não uma string:
javascript
Para finalizar, precisamos pegar os dados do objeto e passar para nossos inputs,
para isso vamos criar uma função que recebe o JSON como parâmetro e popula nossos
campos:
javascript
Nossa função completa fica da seguinte maneira:
javascript
Ao realizarmos a busca novamente iremos notar que nossos inputs serão preenchidos
com a resposta do servidor:
![]
Veja que agora já somos capazes de realizar requisições AJAX do tipo GET com
Javascript puro. Dessa forma evitamos a necessidade de depender de uma biblioteca
para um simples recurso e conseguimos entregar a funcionalidade nova para nosso
cliente.
imagem
Já parou pra pensar no trabalho que o computador tem para mostrar, em tempo real o
que está acontecendo dentro de um jogo?
Pense, por exemplo, no jogo "Desafio nas alturas" que criamos no curso **[Unity 2D
parte 1]**. Nesse jogo, temos um avião sendo desenhado no meio da tela, junto com o
cenário.
![]
Acontece que isso não é uma imagem estática e, quando clicarmos na tela, queremos
que o avião vá para cima.
Mas o que é preciso para isso funcionar?
Vamos por partes, se antes eu tinha um avião 10 unidades para baixo do que ele está
agora, a pessoa que está jogando precisa ver essa diferença na posição assim que
mudarmos. Ou seja, precisamos desenhar um avião na posição nova.
![]
csharp
Me parece que só desenhar um avião na posição nova não ajudou muito. Agora temos
dois aviões na tela e fica até confuso saber qual é o avião real.
Uma forma resolver isso é apagar o pedaço da tela onde estava o avião anteriormente
e depois desenhar um novo avião na posição correta.
![]
csharp
Melhorou, mas agora apagamos parte do nosso cenário junto com o avião antigo. E
olha que difícil vai ser para ver exatamente quais pixels estão brancos para depois
desenhar a parte correta da imagem do céu nesses pixels.
Mas espera, quem faz esse trabalho todo é o computador. Por que não apagamos a cena
inteira de depois redesenhamos cada um dos elementos do nosso jogo?
Fazendo isso nós vamos ter uma tela completamente branca e nela vamos desenhar o
céu, o piso e o avião nessa sequência.
![]
csharp
Dessa forma, conseguimos desenhar o avião e o fundo do jogo juntos. E é exatamente

isso que o nosso computador faz quando estamos jogando, toda vez que ele precisa
mudar a posição de alguma coisa na tela, ele apaga ela inteira e redesenha todos os
elementos.
Mas isso é só parte do que precisamos fazer para nosso jogo funcionar, como é que
nós verificamos se nosso avião precisa ou não se movimentar?
Nesse curso, utilizamos a Unity e nela podemos criar comportamentos para nossos
objetos e assim podemos verificar se o mouse está ou não sendo pressionado. Isso é
comumente feito dentro do método \`**Update´.**
csharp
Esse código verifica quando o mouse foi pressionado e faz o avião subir 10 unidades
dentro da nossa tela. E como já vimos, quando isso acontecer, precisamos desenhar a
tela inteira novamente para que quem estiver jogando veja essas alterações em tempo
real.
Acontece que um jogo tem muitas peças que precisam ser atualizadas e redesenhadas o
tempo todo. Nesse caso do jogo "Desafio nas alturas", precisamos saber quando o
mouse está pressionado e para ter certeza que não iremos perder nenhum clique, o
computador está executando o método Ùpdate` o tempo todo.
Mas o que significa "o tempo todo"?
Significa que, sempre que possível, o computador vai executar a função ùpdate`
dentro do script do avião e mover ele se for necessário. Importante ressaltar que é
exatamente isso, **sempre que possível** ele vai atualizar o estado do jogo. Isso
porque, se algumas dessas tarefas demorar para ser executada, vamos sentir nosso
jogo lento e travando.
Essas duas tarefas - atualizar as informações dos objetos que estão na cena e
redesenhar a tela - formam o que chamamos de **Game loop**
![]
Dentro da fase de atualização, o computador pega cada um dos elementos do seu jogo
e verifica nas "regras do jogo" se algo precisa ser mudado de posição, destruído,
começar uma animação, etc.Na fase de desenho, ele seleciona todos os elementos que
podem ser desenhados e redesenha a cena inteira.
Legal, nosso jogo então roda em loop mas, quão rápido é isso?
Atualmente, os jogos tem uma taxa de atualização de 30 a 60 quadros por segundo,

isso significa que nosso computador deve executar esse loop inteiro de 30 a 60
vezes por segundo.
Cada volta nesse loop demora algo entre 16 e 33 milissegundos. Se nós temos muitas
verificações para fazer, ou muitos objetos para serem desenhados essa volta pode
demorar mais e aí sentimos o jogo travando.
No caso que vimos aqui, o desafio nas alturas, estamos utilizando a Unity, uma game
engine que facilita nosso trabalho porque não precisamos nos preocupar em desenhar
a cena, só precisamos atualizar as informações de cada objeto e a própria unity
cuida do resto. Essa mesma abordagem é encontrada em outras \*engines \*como a
Cocos Creator, Construct, Scratch, etc…
Em outros casos, como no P5JS ou na própria API do canvas, o responsável por apagar
e desenhar a tela somos nós mesmos. O que é uma experiência interessante de se
fazer e ajuda a entender um pouco melhor como o computador funciona.
Falando em diferentes _engines_, aqui na Alura temos cursos de [**Unity**],

[**Unreal**] engine e [**CocosCreator**] e, se você quiser conhecer o
[**Construct**] ou o [**P5JS**], pode ver os cursos da Alura Start.
Se você é usuário Linux, quais tipos de extensão, para arquivos compactados, você
costuma lidar? Será que é zip? Provavelmente não. Geralmente, encontramos arquivos
com a **extensão `.tar.gz`**.
Mas por que `.tar.gz`? O que isso significa? Quando nos deparamos com arquivos do
tipo `.tar.gz`, significa que dois processos ocorreram. O primeiro é o
**empacotamento** dos arquivos no formato **`.tar`**. O segundo processo é a
**compactação** no formato [**gzip**].
O `tar` apenas une todos os arquivos em um só. Mas o `tar` não aplica algoritmos de
compactação para que o arquivo resultante fique menor. Para isso utilizamos um
outro formato, como o `gzip`.
A vantagem é que o `tar` consegue manter as permissões dos arquivos, bem como links
diretos e simbólicos, sendo interessante por exemplo para realizar **backups**.
Utilizamos o comando `tar` para realizar as compactações. A compactação do

diretório `Projetos/` ficaria da seguinte forma.
sql
A primera coisa que você deve ter notado é que, diferente do zip, o comando `tar`
não necessita do **`-r`**. Ele age de forma recursiva por padrão. **O `-c` é de
create**, ou seja, para indicar que desejamos criar um arquivo. O **`-z` indica que
queremos compactar com `gzip`**. Utilizamos o **`-f` (_file_), para que o comando
crie o arquivo compactado**.
Para descompactar, basta utilizar o `-x` de extract no lugar do `-c`.
sql
O comando `tar`, ao contrário do `zip`, é silencioso (**quiet**) por padrão. Se

quisermos que ele imprima os detalhes do que está fazendo, basta utilizar o
argumento **`-v` (**verbose)**.
Se compararmos os tamanhos do arquivo `.zip` e do `.tar.gz` vamos perceber que
nesse caso o `.tar.gz` ficou menor, mas isso não necessariamente irá sempre
ocorrer.
[![comparacao_targz_zip]
Você pode aprender mais sobre esse e outro assunto [**na nossa formação Linux
Essentials**].
É bem possível que você já tenha se deparado com pequenos erros de precisão com
números float, isso aconteceu comigo
imagem
quando trabalhei em uma aplicação em **Python** para controle de gastos e ganhos da

empresa onde trabalho.
A princípio, é simples, só guardo os valores em variáveis para depois passá-los

para um banco de dados próprio. No mês de julho, tivemos 5 vendas de `R$ 99.91` e
compramos 3 equipamentos de `R$ 110.10`:
python
A partir disso, os especialistas em finanças da empresa fazem análises para tentar

melhorar nossos resultados.
Meu código é bem simples, mas tem uma lógica clara que deveria funcionar bem.
Apesar disso, no final do mês a chefia acabou me dando uma bronca. Isso porque
alguns cálculos não bateram com os resultados reais que tivemos. Fiquei confuso, e
fui testar meu código para conferir se tudo está como deveria:
python
Olha os resultados que obtive:
python
Espera… o quê? Fazendo as contas manualmente, ou na calculadora, os resultados são

outros: `499.55` e `330.3`. Por que o Python me entregou esses números compridos e,
principalmente, **imprecisos**?
## O problema do float
A lógica das nossas contas está correta, o problema, como vimos, está nos próprios
resultados que o Python nos dá. O Python não sabe fazer conta direito, é isso?
Bem, a resposta pode ser sim… e não! Em primeiro lugar, essa questão não é
exclusiva do Python, mas sim da computação e de como ela lida com números de
**ponto flutuante (nosso querido float)**. Além disso, não é exatamente um
problema; vamos entender!
No mais baixo nível, computadores funcionam com a diferença de **dois** estados

elétricos - baixa e alta voltagem, ligado e desligado, verdadeiro e falso. Daí
temos o **binário**, o famoso **0 e 1**, e é por conta desse sistema que os
computadores conseguem ser tão rápidos com algumas coisas.
Entretanto, utilizando o formato binário para os números de ponto flutuante, os

computadores não conseguem representar com precisão exata algumas frações (como
`0.98` e `0.1`). Desse modo, esses números são automaticamente arredondados para o
mais próximo que se encaixe na possibilidade do binário, o que resulta em um
pequeno erro de precisão.
No geral, esse erro é muito pequeno para ser considerado relevante, mas há
situações em que não podemos desconsiderá-lo, como agora!
No nosso caso, como estamos lidando com dinheiro, precisamos de uma **precisão
maior**. Já vimos [**como arredondar e formatar valores monetários**] antes, mas
mesmo essa forma pode resultar em alguns pequenos erros de arredondamento que
queremos evitar. E agora?
## Trabalhando com inteiros
Como estamos trabalhando com dinheiro, podemos rapidamente pensar numa alternativa
que evitaria o problema dos números de ponto flutuante - trabalhar apenas com
**números inteiros**. Mas como? Sabemos que **1 real equivale a 100 centavos**,
então podemos, simplesmente, trabalhar com essa subunidade e evitar números
quebrados.
No nosso caso, tínhamos `R$ 188.98` e `R$ 13.10` que também podem ser
representados, respectivamente, por `18898¢` e `1310¢` - dois números inteiros!
Por estarmos trabalhando com o Python, ainda evitamos (a princípio) o problema de

[**overflow de número inteiro**] padrão, que é muito limitado em algumas linguagens
(como em Java, que só chega a **2.147.483.647**).
Como o banco de dados está guardando inteiros, agora, podemos simplesmente dividir
por **100** no momento de imprimir os valores, o que resolveria os problemas. Olha:
python
E a resposta:
python
Legal! Com o código arrumado, fui compartilhar com as filiais internacionais de

minha empresa. Entretanto, rapidamente recebi diversas reclamações mostrando erros
nos cálculos. Mas por quê?
A primeira reclamação veio direto de nossa filial na Tunísia. O programa estava

apresentando cálculos claramente errados para eles - o banco de dados armazenava
**10000 milim** e o valor impresso era de **100 [dinares tunisianos]**, quando
deveria ser **10**. Isso é porque, na Tunísia (e em diversos outros países) a
subunidade de moeda principal não vem do centésimo (**1/100**), mas do milésimo
(**1/1000**) - **1 dinar tunisiano equivale a 1000 milim**.
Desse jeito, temos um grande problema em potencial com a internacionalização do

código. Na verdade, mesmo que trabalhemos com apenas um local, o perigo continua.
No mundo financeiro, subunidades mudam com o tempo, devido à inflação e deflação.
Se armazenarmos números inteiros, teremos que migrar os valores armazenados toda

vez que houver uma mudança, o que pode atrapalhar bastante a manutenção de todo o
sistema.
O ideal ainda seria conseguir trabalhar com a unidade principal da moeda, com
números quebrados, **mas com exatidão**. Será que tem como?
## Trabalhando com precisão com o tipo `Decimal`
Por conta dessa necessidade recorrente de lidarmos com números não-inteiros exatos,
a maioria das linguagens de programação nos disponibiliza tipos específicos para
lidar com isso.
No caso do Java, por exemplo, temos o [**BigDecimal**]. No Python, temos todo o

módulo [**decimal**] e, mais especificamente, o tipo **Decimal**. Importando-o, seu
uso é direto:
python
Dessa vez, olha o resultado:
python
Exatamente como na calculadora! Os analistas da empresa não terão mais nenhum

problema com os cálculos.
## Usando a precisão exata quando precisamos
Começamos com um problema o tipo **float**, do Python, não conseguia nos devolver
um resultado exato de um cálculo. Logo entendemos que o problema não estava no
Python, em si, mas no float e em como o computador lida com ele.
Como estávamos lidando com dinheiro, a precisão nos cálculos era fundamental.
Assim, precisávamos de alguma solução. Demos uma olhada em como podemos transformar
tudo em números inteiros (por exemplo, transformando o valor monetário de Real para
centavos), o que, algumas vezes, pode ser uma boa saída.
Tratar todos os números como inteiros, entretanto, tem suas consequências

negativas, como um possível overflow e problemas de manutenção de código. Queríamos
uma solução melhor e… conseguimos!
Aprendemos que a maioria das linguagens de programação tem algum tipo numérico
exato para evitar esse problema. No caso do Python, esse tipo é o **Decimal**, com
[**precisão arbitrária**]. Com ele, nossos cálculos ganharam a precisão necessária
e acabamos com todo o problema inicial.
Uma intuição natural depois de se conhecer os tipos numéricos exatos nas linguagens
de programação, como o **Decimal**, é querer usá-los para tudo. Apesar disso, é
importante sempre analisarmos se vale a pena - tipos exatos demandam mais tempo de
processamento.
Normalmente, um pequeno erro na 10ª casa decimal de um número é irrelevante, e a

precisão exata desnecessária. Por isso, temos sempre que analisar o contexto de
nosso próprio programa antes de aplicar uma decisão.
Já conhecia o tipo **Decimal** antes? E toda essa confusão com o float? Escreva um
comentário com sua opinião sobre o post e, se se interessar mais por Python, não
deixe de dar uma olhada em nossa [**formação Python para web**]!
imagem
A carreira de designer [está em alta no mercado], mas o esfriamento da economia e o
grande número de profissionais na área tornam mais difícil encontrar emprego. Para
contornar esse problema e conseguir uma vaga, assim como para evoluir em muitos
outros pontos, investir na atualização profissional e em novos conhecimentos é a
solução ideal.
Para contornar esse problema e conseguir uma vaga, assim como para evoluir em
muitos outros pontos, investir na atualização profissional e em novos conhecimentos
é a solução ideal.
## Melhores habilidades e técnicas
Uma das características marcantes da área de design é sua constante transformação

técnica. Diariamente surgem novos softwares, atualizações dos já existentes,
técnicas de aplicação ou mesmo novas disciplinas de design, como o [**UX/UI**] ou o
motion design.
O profissional que se mantém antenado e busca atualizar seus conhecimentos ganha

uma enorme vantagem sobre parte da concorrência, que não sai da zona de conforto e
permanece com conhecimentos e conceitos datados.
Pense, por exemplo, no Photoshop. Não é difícil encontrar designers que aprenderam
a usar o software em sua versão CS5, lançada há sete anos, e que não buscaram mais
nada sobre o programa, que já sofreu duas grandes remodelações desde então.
Profissionais assim estão ultrapassados e terão sérias dificuldades para encontrar

colocação no mercado, ao contrário daqueles que investiram no aprendizado dos
softwares mais recentes.
## Destaque em meio à multidão
Como dito acima, ter um diferencial é um ponto essencial para o designer que deseja
alçar altos voos em sua profissão: grandes empresas e agências procuram por
profissionais que tenham algo a mais para oferecer, e não apenas o básico aprendido
em universidades e colégios.
Um dos benefícios de estudar continuamente em busca de atualização profissional é

justamente a aquisição de vários desses diferenciais, que certamente farão de você
um designer único e desejado pelo mercado.
## Especialização
Outro aspecto notável no mercado de design é sua fragmentação. Com o surgimento de

novas divisões além dos tradicionais design gráfico e industrial, demandas por
profissionais especialistas em áreas como [**web design**], design automotivo e
design de games começaram a aparecer.
Buscar uma especialização, tanto na área acadêmica, com mestrados e doutorados,

quanto em cursos livres, inclusive cursos online, enriquece seu currículo, agrega
novas experiências e traz mais vantagens na busca por um emprego ou na evolução na
hierarquia da empresa.
É possível encontrar uma infinidade de cursos online e a distância, com materiais e

professores de qualidade e que oferecem certificados que podem ser adicionados a
seu histórico profissional.
## Melhores salários
Da mesma forma que profissionais graduados recebem mais do que aqueles que têm
apenas o ensino médio, designers com uma vasta gama de conhecimentos e habilidades
são mais valiosos e recebem consideravelmente mais ([até quase 20%]) do que aqueles
sem tais atualizações.
Além dos salários mais atrativos, é por meio de pós-graduações e especializações

que você pode ganhar posições dentro da empresa, chegando, por exemplo, a diretor
de arte ou gerenciador de design da companhia.
## Reforço do networking
Participar de novos cursos e eventos da área facilita a aquisição de novos contatos

profissionais e ajuda a expor seu nome de forma positiva, aumentando seu networking
e suas chances de obter boas recomendações e colocação no mercado de emprego.
Invista também na publicação de seus trabalhos e no contato com outros

profissionais da área em redes sociais especializadas, como o [**Behance**] ou o
[**Dribbble**], em que a troca de conhecimentos e contatos é mais eficiente do que
nas redes tradicionais, facilitando a criação de parcerias profissionais de
sucesso.
## Maiores e melhores conhecimentos
Quando se fala em aquisição de conhecimentos, não é preciso restringir-se apenas ao

design. Todo conhecimento é válido, desde saber os acontecimentos recentes da
política mundial até os novos lançamentos da música pop. Um bom designer precisa
ter seu repertório de referências e inspirações amplo — e manter-se informado é
essencial para conseguir isso.
Procurar aprender ou melhorar a prática em idiomas estrangeiros também é uma boa

ideia: além de um diferencial em um mercado em que profissionais fluentes em inglês
ganham até [61% mais], dominar outras línguas permite o acesso a outras culturas e
vivências, o que aumenta seu repertório cultural.
## Flexibilidade e controle de imprevistos
O design tem cada vez mais interligações com áreas como o marketing, a programação
e a [**tecnologia**] da informação, e nada é feito sem a ajuda, mesmo que pequena,
dos profissionais desses campos.
Sendo assim, torna-se extremamente importante que o designer moderno e atualizado

procure saber mais sobre cada uma das áreas com as quais entra em contato no dia a
dia de trabalho, desde noções de marketing digital até pequenos conhecimentos em
linguagens de programação, como o PHP ou Ruby.
Além de proporcionar novas visões e ideias sobre seu trabalho, esses conhecimentos
podem ser úteis em pequenos imprevistos cotidianos, como uma falha na programação
de um site ou a necessidade de ajudar o pessoal do marketing a desenvolver uma nova
estratégia de mídias sociais.
Desse modo, você ganha novas experiências e aprende novos meios de solucionar
problemas, tornando-se um profissional mais completo, respeitado e altamente
desejado no mercado de trabalho.
## Abertura a novas ideias e desafios
O processo de procurar cursos de especialização é, por si só, um grande desafio,

que demanda tempo e investimento.
Além disso, continuar a estudar abre sua mente para novas ideias e modos de agir,
estimulando o pensar fora da caixa, a procura de soluções que desafiem o comum e
tragam algo de novo.
São designers com esse perfil que fazem a diferença no mundo profissional,
oferecendo resultados que agradam aos clientes e dão bons retornos quando postos em
prática.
**Neste artigo, você viu como a atualização profissional é importante para os

profissionais da área de design, além de motivos pelos quais vale a pena se
esforçar para sair da zona de conforto e buscar atualizar e ampliar seus
conhecimentos. Com essas vantagens em mente, comece agora mesmo a procurar por
cursos de especialização e a tornar-se um designer ainda mais competitivo!**
Gostou do artigo? Está animado a aprender cada vez mais? Então compartilhe nosso
texto com os seus amigos pelas redes sociais!
imagem
Você também já se pegou pensando em como encontrar soluções objetivas, elegantes e

[**centradas no usuário**] como faz a empresa californiana? Entender o design da
Apple é um estudo essencial sobre como transformar ideias em produtos que facilitam
e encantam o usuário ao primeiro clique, ao primeiro toque.
Foi para te ajudar que criamos este artigo completo, com tudo o que você precisa
saber sobre o design da Apple — desde seu início até se tornar uma referência de
design para o mundo. Vamos lá?
## Apple: uma empresa de tecnologia com vocação para o design
O ano era 1973. Steven Paul Jobs, um estudante que havia largado a faculdade depois
de um semestre, ainda perambulava de vez em quando pelo campus da Reed College, no
Oregon. Depois de ter experimentado o ensino formal, achou que aproveitaria melhor
as ideias que ferviam em sua cabeça se buscasse classes que fossem realmente
significativas para ele.
Jobs queria aproveitar melhor o seu tempo, sem saber exatamente o que faria com
todo esse conhecimento. O que ele queria era ter novas experiências.
Foi nesse período que o estudante por vocação buscou cursos dentro da faculdade que
não o prendessem na rigidez do ensino superior. Uma dessas, a mais famosa de todas,
foi a aula de caligrafia ensinada por um monge trapista.
Isso mesmo, caligrafia feita à mão. Naquela época, computadores ainda eram grandes
armários cheios de válvulas que só empresas gigantes podiam se dar ao luxo de ter.
Mas, como o próprio Jobs explica em seu famoso discurso de formatura em Stanford,
ele só veria o valor dessas aulas, até então um interesse pessoal, dez anos mais
tarde, quando o primeiro Macintosh estava sendo desenvolvido.
Jobs bateu de frente com os desenvolvedores da Apple por uma questão que parecia
boba: ele queria que o novo sistema operacional tivesse fontes com curvas que se
assemelhassem à caligrafia. Até então, todas as letras dos computadores eram
pixeladas e monoespaçadas tinham todas a mesma aparência.
Por mais que pareça um detalhe, essa pequena característica definiu o que seria a
Apple no futuro. As fontes em curva pareciam um luxo dispensável para muitos, mas
para Jobs era uma visão de design: quanto mais a sua interface se aproximasse da
realidade do usuário, se tornasse familiar, intuitiva e elegante, mais prazer ele
teria de usar o computador e mais facilidade a empresa traria para a vida das
pessoas.
### Pensando em design desde a concepção
Essa fixação por design e por uma boa experiência do usuário acompanha a Apple
desde seus primeiros dias de existência, quando a empresa que hoje tem o maior
valor de mercado no mundo era apenas uma garagem de subúrbio americano ocupada por
dois apaixonados por tecnologia.
Steve Jobs e Steve Wozniak se destacaram por vender computadores fechados (o

lendário Apple I), enquanto a cultura dessas pequenas empresas na época era vender
as peças para que o seu público-alvo, entusiastas de computadores, tivessem o
prazer de montá-los em casa.
Até hoje, a Apple recebe críticas por ter sistemas muito fechados, mas essa foi a
grande sacada que popularizou os computadores no fim do século passado. Os dois
Steves apostaram que, um dia, cada pessoa comum teria o seu próprio PC e eles não
teriam esse interesse por aprender a montar e instalar uma máquina.
Os designers de produto, de sistema e de interface teriam que ser pensados em

conjunto para que qualquer pessoa tirasse o computador da caixa e começasse a usar
imediatamente.
### Usando design para fugir da falência e se tornar a empresa de maior valor no
mundo
E, desde então, a Apple é uma empresa movida por design. Esse é o legado de Steve
Jobs, de Steve Wozniak e de tantos outros profissionais com esse perfil que
passaram pela empresa.
Um grande exemplo disso é a contribuição do designer Jonathan Ive para o

ressurgimento da Apple na década de 1990. Sim, a Apple já esteve à beira da
falência. Desde 1992, quando ele foi contratado, até 1998, quando Steve Jobs voltou
à empresa e se uniu a ele para mudar a imagem da companhia, Jony Ive reconstruiu a
fundação de produto aliado à experiência que tornaria a Apple uma referência no
futuro.
Essa é uma forma de olhar para a história da empresa de uma forma única. O valor da
maçã foi construído pelo design. OSX, iPod, iPhone, iPad, iMac, Macbook, Apple
TV... Todos esses dispositivos têm uma coisa em comum: eles unem ideias, conceitos,
tecnologias e materiais existentes de uma forma inovadora para encantar e facilitar
a vida do usuário.
E, se você parar para pensar, essa é exatamente a definição de design.
## Design da Apple: os conceitos que tornam essa empresa única
Então, se é para falar no assunto, vamos definir o que torna o design da Apple tão
destacado dos concorrentes. Afinal, não é por falta de dinheiro, de talento
profissional ou pesquisa tecnológica que outras empresas não alcançam o nível de
refinamento e experiência da empresa californiana.
A diferença, na verdade, tem a ver com a [**cultura de UX**]. Quando a usabilidade

rege seu pensamento criativo, coisas incríveis podem acontecer. Veja quais são
esses conceitos cravados fundo no coração de todos os funcionários da Apple:
### Buscando a perfeição
O caso das fontes em curva no primeiro Macintosh são um exemplo da busca pela
excelência em design que move cada novo desenvolvimento de produto dentro da
empresa. Não se trata de supervalorizar seu aparelho ou usar o design como
estratégia de venda, mas é uma forma de sempre pensar em como melhorar a
experiência do usuário mesmo nos menores detalhes.
Steve Jobs era conhecido como um chefe implacável, insistente e até teimoso para
incluir as funções que ele desejava ver em seus produtos. Embora sua conduta fosse
questionável em alguns pontos, não dá para negar que essa busca obsessiva pela
perfeição contribuiu para o desenvolvimento do design como ferramenta de UX em
todas as áreas tecnológicas.
Não existe fórmula para uma boa usabilidade em smartphones, um software de

computador ou um site na internet. **A experiência do usuário sempre vai ser o
resultado de teoria de design com um toque de subjetividade para surpreender e
encantar.**
Para conseguir esse objetivo, só existe uma forma: conceituar, testar, analisar
seus resultados e repetir. Esse é o trabalho de um designer em busca do sucesso e o
legado que a Apple deixa para a profissão.
É claro, ninguém consegue um trabalho perfeito, mas é a busca por sempre melhorar
que destaca um profissional da média do mercado em que ele está inserido.
### Cultuando o pensamento fora da caixa
Quando Steve Jobs e outros funcionários da Apple entraram no escritório da Xerox no

início dos anos 1980, eles foram apresentados a um protótipo que a própria empresa
e outras gigantes como a IBM tinham descartado por não terem visto muita utilidade
prática naquela tecnologia.
Qual era esse dispositivo inovador? Uma caixinha de plástico com um botão, com a
qual o usuário podia controlar uma seta na tela do computador. Aquele retângulo
bege ligado por um fio lembrava muito um ratinho de estimação e por isso ele ganhou
o apelido de mouse.
**O mouse foi o dispositivo que permitiu a criação das interfaces gráficas, ou
GUIs, que resultaram na criação do MacOS e do Windows e modelaram o Design Gráfico
como conhecemos hoje. Mas por que algo tão revolucionário foi descartado por tantas
empresas?**
A resposta a essa pergunta define o que é design e define o que se tornou o slogan
da Apple por muito tempo: Think Different, ou pense diferente, em português.
Você já deve ter percebido que em todo lançamento de um novo iPhone os comentários
são muito parecidos. A maioria fica indignada pela empresa apresentar como novidade
tecnologias que já existem há mais tempo em outros celulares.
Mas a ideia que a Apple quer passar não é exatamente essa. **Criar e implementar
uma tecnologia não é suficiente, ela precisa estar ali em função do usuário final,
de uma experiência coerente e satisfatória**.
O design é e sempre foi a capacidade de aliar forma e função em torno de um

objetivo: seja facilitar a vida das pessoas, criar formas de consumir conteúdo ou
[**passar uma mensagem**].
Voltando ao mouse, onde a Xerox enxergou uma tecnologia curiosa sem valor de
mercado, a Apple viu uma oportunidade de tornar o acesso e uso dos computadores
universal, independentemente da familiaridade do usuário com a tecnologia.
Isso é pensar diferente, é praticar o design. Juntar referências de uma nova forma,
que surpreenda o público, crie uma reação emocional e uma resposta imediata.
### Tirando da caixa pronto para usar
E por fim, de todos os objetivos da prática de design, o que torna a Apple única
quando falamos em [**usabilidade**] é a busca por simplicidade, intuição e uma
experiência controlada.
Falando outra vez de uma característica muito controversa da empresa — de

dispositivos fechados, com pouca customização e possibilidade de intervenção do
usuário na experiência, ela deve ser enxergada por designers não como um defeito,
mas a fórmula para tornar a UX consistente e entregar ao público sua visão da forma
mais completa possível.
Você já percebeu que as empresas com identidade mais forte no mundo são aquelas que
controlam mais a sua experiência? Disney e Nintendo são exemplos de grandes
companhias que preferem limitar suas interfaces e dispositivos (ou parques) para
garantir que todos os usuários terão o mesmo encantamento quando entrarem em
contato com a marca.
O design anda sempre em uma linha tênue entre ser um guia e ser interativo. Os
dispositivos da Apple podem ser mais engessados, mas qualquer pessoa consegue usá-
los sem muita dificuldade em 5 minutos depois de ligá-los pela primeira vez.
Ou seja, o design da Apple é conceituado em volta da usabilidade e praticidade, a

essência dessa profissão. E a prova de que esse tipo de pensamento funciona e cria
uma conexão emocional com o público é o quanto o mercado tenta reproduzir essas
características a cada novo produto.
## Efeito Apple: como a empresa mudou o mercado e o consumo no mundo inteiro
Pode parecer estranho agora, mas houve um tempo em que a ideia de um ter um
computador pessoal em casa parecia um absurdo. Houve um tempo também em que levar
mais de quinze músicas para ouvir durante a caminhada era impensável e que
smartphones eram coisa de executivos de Wall Street.
Uma a uma, a Apple vem nas últimas décadas quebrando teorias de mercado e mudando a
forma como nós consumimos tecnologia. Veja como ela fez e ainda faz isso, usando
seus principais sucessos como exemplo:
### Macintosh e o foco total no usuário
Antes da Apple, PCs eram feitos para entusiastas e profissionais da computação.

Para conseguir um simples acesso à pasta onde estavam seus documentos, era preciso
conhecer a linha de comando certa para chegar aonde queria.
O exemplo do mouse, que tornou a interface gráfica possível, é um exemplo de como a

empresa muda o mercado a cada nova revolução. **Ao criar ainda no Apple II e depois
aprimorar no Macintosh a usabilidade com foco no usuário, Steve Jobs e Steve
Wozniak quebraram a barreira que existia entre a tecnologia e o público comum.**
Foi a partir daí que computadores puderam tomar conta do mundo, o que,
consequentemente, tornou a internet possível anos depois. O consumidor não
precisava mais de conhecimento técnico para manipular a ferramenta, logo os PCs
puderam se tornar peças vendidas em supermercados, lojas de departamento e
catálogos.
Desde então, a busca das empresas do ramo é por facilitar a vida das pessoas. Até
hoje, esse é o argumento de venda de fabricantes de smartphones, computadores e
wearables. O design voltado para a experiência do usuário tornou possível a era
tecnológica em que vivemos.
### iPod e a vontade de mudar o mundo
Durante os anos 1990, a Apple caiu no ostracismo e quase foi à falência exatamente
por perder sua essência: a vocação para tornar o design uma ferramenta de
transformação.
Não é como se todas as peças de design que você cria precisassem ser significativas
a ponto de mudar a vida das pessoas, mas o objetivo deve ser esse. **Facilitar,
encantar, resolver, reinterpretar, são os verbos que movem a humanidade.**
O iPod é um grande exemplo de como boas ideias de design podem transformar o

mercado e o consumo de uma mídia apenas por buscar solucionar problemas realmente
relevantes para o público.
**A Sony já havia revolucionado o mercado ao criar o Walkman, primeiro dispositivo

portátil para ouvir música.** Mas, pelas limitações da época, havia uma falha grave
em seu design: as fitas cassete tinham uma qualidade baixa de som e cada uma
suportava no máximo algumas poucas faixas. O Discman resolveu o problema da
qualidade usando CDs, mas eles eram péssimos para a portabilidade, pelo tamanho e
por interromperem a música a qualquer impacto.
A ideia da Apple, renovada pela volta de Steve Jobs no fim dos anos 1990, era usar
design de produto para resolver o problema de uma vez por todas. E foi isso que
aconteceu. Com a chamada atrativa de mil músicas no seu bolso, o iPod não só
solucionou a portabilidade da música como mudou a forma de consumir a mídia em todo
o mundo. O iPod foi a semente que possibilitou os aplicativos de streaming hoje em
dia.
### iPhone e a experiência em primeiro lugar
E todas essas transformações podem ser resumidas nisto: **a preocupação com
experiência do usuário é o que possibilita que a tecnologia esteja tão presente em
nossas vidas**.
**A interface entre humano e máquina caminha para ser cada vez mais direta e
simplificada. Hoje em dia, podemos fazer uma pergunta para a Siri ou o Google Now e
receber uma resposta em um segundo.** Nossos dispositivos nos levam pelo melhor
caminho entre casa e trabalho, nos ajudam a nos comunicar com parentes e amigos
distantes e nos permitem assistir a um episódio de Game of Thrones junto a milhões
de pessoas.
O iPhone original, se não foi o primeiro smartphone ou o mais capaz da sua época,
com certeza foi o ponto de virada para a era mobile em que vivemos atualmente.
Nenhuma tecnologia nele era nova, nenhum material exclusivo ou função que já não
existia em outros aparelhos.
Mas a forma como a empresa criou o iPhone é emblemática para definir o que
significa ser designer. Todas essas ideias estavam espalhadas pelo ar, mesmo que
ninguém soubesse exatamente o que queriam de um smartphone para o futuro.
O que a Apple fez foi entender como juntar todas essas peças em um produto
inovador, que facilitasse a vida das pessoas, encantasse com a sua experiência e
que oferecesse um valor real para as suas vidas. Gostando ou não desses produtos, o
design da Apple é um estudo fundamental para o profissional que deseja fazer a
diferença no mercado e no mundo.
## Referência em design: por que a Apple continua sendo a empresa a ser batida
O ano de 2017 marca os dez anos do lançamento do primeiro iPhone e até hoje o
aparelho é a referência tecnológica no [setor mobile]. Como isso é possível? Se
tornar referência no mercado não se refere apenas à qualidade de um produto, mas
também à sua relação com o consumidor e como sua marca é percebida pelo grande
público.
Portanto, para terminar este artigo, é bom definir os elementos de design que
possibilitam um reinado tão extenso em uma indústria que muda tão rápido:
### A criação de um paradigma
Quando se pensa em smartphone, se pensa em Apple. A grande vantagem de utilizar o

design para resolver problemas de experiência é que sua solução se torna uma
percepção de **exclusividade, inovação e satisfação**. Não importa muito quais são
os novos recursos do aparelho ou as novas funções da interface; quem se apaixona
pelo iPhone já foi convencido a comprar o próximo modelo.
O design significativo é aquele que muda paradigmas.
Para quebrar o status do mercado, é preciso usar o que existe de referência para
[**apresentar um trabalho inovador**], que apresente um novo caminho de usabilidade
ao público.
### O Design de Produto
Esse paradigma que tornou a Apple uma referência existe em duas pontas: o Design de
Produto e o Design Gráfico. Mesmo que um complemente o outro, é possível separar os
dois, começando pelo primeiro.
Um grande momento da conferência em que Steve Jobs apresentou o primeiro iPhone é

quando ele mostra os smartphones líderes da época e separa a tela pequena do enorme
teclado que eles possuíam embaixo. Nesse momento ele afirma que esse espaço todo
está sendo perdido.
Design se trata de otimizar usabilidade, fazer mais com menos elementos. A forma
como o iPhone implementou essa solução da tela de toque ainda está dando forma ao
mercado dez anos depois.
A busca por experiência do usuário, por facilitar a vida de uma pessoa ao máximo
com o mínimo de recursos é não apenas uma referência, mas um legado da empresa para
o mundo.
### O Design Gráfico
Mas não é só nos aparelhos que essa filosofia criou paradigmas; a forma como a
Apple enxerga a interface gráfica desde os anos 1970 é a prova de que o design pode
e deve ser usado como uma fagulha para a transformação tecnológica e cultural.
**A filosofia de UX voltada à praticidade, elegância e objetividade está em todos

os produtos da Apple e dita os rumos da área no mercado.** Desde a implementação
das GUIs nos anos 1980, a facilidade com que se gerenciava suas músicas no iPod
original até cada nova implementação do iOS no iPhone, a empresa se mantém uma
referência no mercado porque sempre sugere formas mais intuitivas de passar
mensagens, guiar o usuário e entregar uma experiência satisfatória.
Ao contrário do que muitas pessoas podem imaginar, **o design não se trata de
beleza em sua essência, mas de** [comunicar com eficiência], criar conexões
emocionais e guiar as pessoas para que elas consigam atingir seus objetivos por
conta própria. Uma boa experiência dá poder ao usuário e é assim que se sente
qualquer pessoa que utilize um dispositivo da empresa.
O design da Apple é uma compilação de todos esses conceitos de produto, interface e

comunicação e é por isso que, gostando ou não de sua filosofia e de seus aparelhos,
entender como seus funcionários pensam é uma forma de aprimorar a sua relação com
uma profissão tão incrível.
Você curte a identidade visual da Apple? Que tal aprender a criar uma identidade
visual de uma marca? Aqui na alura temos um [**curso de identidade visual**]. Nele
você aprenderá a criar um logo de uma marca a partir de um briefing, a escolher a
melhor tipografia e muito mais.
Promoção com viagem internacional por 5 reais? Ou ainda -5 reais? Tem campos que
deveriam ser validados declarativamente, como o preço de um produto:
`sql `
MySQL ainda não suporta checks, bora [**aprender a usar Oracle**]? Postgre, SQL
Server e outros também suportam :)
Seus dados possuem restrições que quer garantir a integridade no banco? **Use o
CHECK constraint**.
Desafio: quero todos os livros ativos que estão baratos ou caros. Que caca eu fiz
na query a seguir? Discutimos no próximo artigo!
sql
imagem
Já imaginou ter que realizar um cadastro de informações suas e acabasse enviando as

informações assim:
imagem e uma **mensagem de erro** que permanece visível enquanto não adicionarmos
um e-mail válido, com o "@" e o domínio.
Mas ainda poderíamos deixar essa mensagem de erro ainda melhor!
Por padrão, temos uma mensagem bastante objetiva, em inglês, dizendo que "deve ser
um e-mail válido". Porém, e se mudássemos essa mensagem para português (ou o idioma
que fosse mais conveniente para a situação) e adicionássemos uma mensagem
personalizada?
imagem, retornamos ao mesmo formulário vazio. Assim damos margem para o usuário se
questionar: “Será que enviou mesmo? Ou devo preencher novamente?”.
E que tal se adicionarmos uma mensagem de confirmação de envio?
imagem, poderíamos deixar explícito também que existe um caminho ainda a ser
percorrido, do tipo:
imagem
Tenho uma lista com todos os livros que comprei e quero saber quanto eu gastei no
total:
java
Agora vou varrer minha lista e somar o preço de cada livro usando um for:
java
Agora eu sei quanto gastei! Porém, olha o tanto de parâmetro e código que tive que
escrever...será que não tem uma forma mais simples de resolver? A partir do Java
1.5 foi disponibilizado o **enhanced-for** ou mais conhecido como **foreach**:
java
Veja que temos o mesmo resultado! Mas o que está acontecendo nesse código?
Basicamente estamos pegando cada objeto(livro) contido na lista, ou seja, para cada
(for each) livro some o seu preço com o total. Bem intuitivo e simples! Poderíamos
até imprimir todos os livros usando o foreach:
java
A partir do Java 8 foi introduzido o método `forEach()` capaz de fazer iterações em

lista de forma similar ao enhanced-for:
java
Bem mais simples! E tudo em uma única linha!
**E aí, gostou dessa nova implementação do Java 8? Quer conhecer mais sobre as
novidades do Java 8? O criador da Caelum, Paulo Silveira, criou o [curso de Java 8]
e suas bibliotecas com mais 1500 alunos e 99% recomendação.**
Você já deve ter lido, aqui no blog, depoimentos de alguns de nossos alunos. No
post de hoje, vamos contar um pouco da trajetória de um membro do time Alura. Vamos
conhecê-lo?
imagem profissional seria em uma empresa cuja atmosfera ronda a programação.
Meu lance sempre foi criar, me envolver de alguma forma com arte e me expressar
através dela.
Minhas tarefas diárias no início eram bastantes mecâncias: escrever posts para
nossas redes sociais ([Twitter], [LinkedIn] e [Facebook] ), montar newsletters que
são enviadas semanalmente aos nossos alunos, além de responder dúvidas que chegam
via chat e tweets.
## Mudança de área
Com o tempo, meu chefe direto notou que minha praia era mais a parte de
arte/criação. Eis que ele me propôs cuidar da parte do design de social. Na hora
meus olhos brilharam. Apesar de eu já criar conteúdo (redigir textos e produzir
algumas imagens que ilustram os posts), eu queria mais! Criar mais!
## O que aprendi
Comecei então a fazer os cursos de [Photoshop] e [Illustrator] aqui da nossa

plataforma. Devo dizer que eles contribuíram bastante para minhas habilidades nos
softwares. Além disso, eu mal sabia abrir uma imagem no Ai, e hoje faço todas as
imagens que vão pro nosso [Instagram].
## Saindo da caixa
Enfim, sou muito feliz com o trabalho que faço e sinto que cresço a cada dia,
principalmente por ter saído de uma zona de conforto que eu nem sequer sabia que
vivia. Se tem uma moral nessa história, é que toda experiência é válida contanto
que você se sinta confortável naquilo que lhe é estipulado. Às vezes, pensar fora
da caixa pode trazer mais sucesso do que você imagina!
Não poderia estar mais feliz em escrever este post (e logo depois já compartilhar
nas nossas redes!) e saber que estou propagando uma mensagem de entusiasmo aos que
– como eu,meses atrás estão a procura do tão sonhado estágio.
Aliás, tá procurando emprego? Já se cadastrou no [Hipsters.Jobs]? Tá cheio de vagas

por lá! Se quiser anunciar oportunidades de emprego, lá é o lugar também! ;-)
Eu tenho uma lista de livros os quais já comprei:
java
Resultado:
```
[TDD - Maurício Aniche, Java 8 - Paulo Silveira, C# - Everton Coimbra, REST -
Alexandre Saudate, Android - João Bosco]
```
Agora testarei minha lista e verificarei se ela sabe conferir se um livro que já

comprei está na lista:
java
Resultado:
```
não contém
```
**Opa! Eu já comprei esse livro de TDD! Essa lista está doida? Ela não conseguiu
verificar a existência desse livro, pois cada objeto possui um código chamado
[hashcode] e é por meio desse código que qualquer objeto é identificado, por
padrão. Vamos, por exemplo, imprimir dois objetos aparentemente "iguais" sem um
`toString()` personalizado, ou seja, o padrão:**
java
Resultado:
```
model.Livro@2a139a55 model.Livro@15db9742
```
Veja que, mesmo tendo as mesmas informações, as impressões foram diferentes! Por
isso a lista informou que o livro de TDD não existia. Para personalizar a
comparação de um objeto precisamos sobrescrever o método èquals()` herdado da
classe `[Object]`:
java
Agora iremos implementar o método èquals()` informando que os livros são iguais

desde que os nomes sejam iguais:
java
Testando a nossa lista novamente:
java
Resultado:
```
contém
```
Maravilha! A nossa lista está conseguindo verificar se um determinado livro existe!

Mas e se o autor for diferente? Ela vai informar que existe... Da mesma forma que
informamos que queríamos a comparação do livro por meio do nome, podemos informar
que queremos que o livro seja comparado pelo nome e autor, ao mesmo tempo:
java
Vamos testar nossa lista novamente:
java
Resultado
```
não contém
```
Agora todos os objetos do tipo `Livro` são corretamente comparados e, assim, eu

posso sempre pedir para a minha lista de livros verificar se eu já tenho um
determinado livro antes de comprá-lo! Todas as vezes que precisarmos fazer
comparação entre objetos, será necessário **sobrescrever** o método èquals()`
herdado da classe Òbject` e **implementar** qual é o tipo de comparação que você
precisa, seja por 1 atributo específico, ou por 2, ou por todos.
E aí, gostou da forma que comparamos objetos em Java? Que tal aprofundar mais nos
detalhes dessa linguagem? Pensando nisso o instrutor Guilherme Silveira, criou a
[**Formação Java**] na **Alura**.
Porém, para conseguir evoluir na sua área é fundamental investir em capacitação e

se manter atualizado para atender as demandas do mercado de trabalho. Essa
recomendação é válida, especialmente, para quem atua com tecnologia.
Esse setor está em constante evolução e acompanhar essas transformações é

obrigatório para oferecer um bom trabalho e conseguir as melhores oportunidades.
Para atingir a qualificação necessária, podemos destacar a importância da educação

a distância, que é um meio para adquirir conhecimento por cursos feitos pela
internet.
Essa é uma proposta arrojada, que tem métodos avançados, alta tecnologia envolvida
e muito conteúdo de qualidade. Cada vez mais pessoas aderem ao EAD para fazer
cursos com objetivo de atualizar e aprimorar seus conhecimentos em áreas como
[**programação**], [**design e UX**].
Ficou curioso para saber mais? A seguir contamos todos os motivos pelos quais você
deve investir em um curso a distância!
## 1\. É um modelo inovador e democrático
Imagine a possibilidade de acompanhar uma aula um dia no seu quarto, no outro em

uma biblioteca e no outro durante um intervalo no trabalho? Incrível, não é? E é
isso o que os cursos a distância favorecem: a mobilidade e a flexibilidade para
acompanhar o conteúdo.
Essas características tornam esse modelo inovador para transmitir conteúdo e

conhecimento. Além disso, contribui para uma maior democratização do acesso à
educação.
Isso porque, existem profissionais que desejam aprender e se atualizar, mas que
moram em regiões onde não há instituições de ensino com boa qualidade ou mesmo com
variedade de cursos. Assim, a educação a distância apresenta-se como a melhor
solução para adquirir conhecimento e capacitação para atender as demandas do
mercado de trabalho.
Por esse motivo o ensino a distância é inovador, pois se vale de alta tecnologia
para produzir e distribuir conteúdo, que exige apenas conexão à internet para que o
aluno usufrua do conteúdo.
## 2\. Trabalha a autonomia e a responsabilidade do estudante
Outra vantagem de fazer um curso a distância é o desenvolvimento de duas

habilidades muito valorizadas por gestores e empresas: a autonomia e a
responsabilidade. Esse aperfeiçoamento se dá pelas características do próprio
sistema de ensino.
No EAD quem dita o ritmo de estudos, ou seja, quem escolhe os horários para
acompanhar as aulas ou decide a frequência é o próprio estudante. Com isso, terá
que desenvolver sua capacidade de tomar decisões por conta própria, uma vez que não
há lista de chamadas.
**Além disso, se não houver dedicação durante o período estipulado, o curso vai
expirar e assim o estudante não poderá concluí-lo. Um curso a distância exigirá
grande responsabilidade para não acumular materiais e aulas ou perder provas. Ou
seja, o estudante amadurecerá muito nesse processo, algo que impactará
positivamente na sua carreira e dia a dia no trabalho.**
## 3\. Favorece a conciliação entre trabalho e estudo
Você trabalha e estuda? Então, tenha muita atenção a esse tópico! Se estiver no
começo de carreira, é bem provável que ainda esteja na graduação. Mas, mesmo
aqueles que já têm alguns anos de estrada, também vivem essa rotina dupla, em busca
de mais conhecimento.
Vamos falar a verdade, conciliar as duas obrigações de forma produtiva, às vezes,

pode ser bem complicado. Por exemplo, quando precisa se deslocar até a escola para
estudar, mas também necessita fazer hora extra no trabalho. E aí, como faz? Nesse
caso, o desempenho em um deles vai ser prejudicado.
Esse é mais um ponto em que a importância da educação a distância se destaca, pois,

a possibilidade de estudar em horários, locais e dias determinados pelo próprio
aluno permite que ele escolha os momentos em que está mais descansado e com mais
disposição para acompanhar as aulas.
**Assim, ganha-se em qualidade e produtividade em ambas áreas, devido ao estresse

ser menor, além de ser menos cansativo.**
## 4\. Possibilita que o conteúdo seja acessado a qualquer momento
Sabe aquela história de perder o exemplo ou explicação que o professor passou? No

EAD isso não existe. O conteúdo estará 24 horas por dia disponível no ambiente
virtual.
No momento em que desejar acompanhar uma aula ou revisar algo, todo o material
estará organizado para que você acesse quantas vezes precisar. Prático, não?
## 5\. Ajuda a economizar tempo e dinheiro
Quem não gosta de economizar tempo e dinheiro, não é mesmo? Seguramente todos!
Então, essa é outra vantagem dos cursos a distância. A economia financeira se dá
devido as mensalidades que geralmente são mais em conta quando comparadas com as
dos cursos presenciais.
Além disso, não há custos com transporte, estacionamento, lanches e outros gastos
que normalmente temos quando precisamos nos deslocar para fora de casa.
Outra grande vantagem é não perder tempo parado em congestionamento ou dentro de

ônibus cheios —algo que vamos combinar, é muito chato! Assim, ganha-se mais
momentos com a família e amigos, que é o que todos desejam.
## 6\. Permite interação em cursos online
Tem muita gente que fica com receio de cursos online por acreditar que não há
interação entre alunos e professores. Esse é o seu caso? Temos uma boa notícia, a
realidade é bem diferente!
Primeiro, os alunos podem sim enviar suas dúvidas para os professores, existem
maneiras de interagir com a turma e tudo isso acontece dentro da própria plataforma
de estudos.
Outra forma é por meio de [**fórum de discussão**], que acabam virando grandes
comunidades para troca e compartilhamento de informações.
Além dessas, há outras maneiras de interação, como as redes sociais. É muito comum
que as turmas criem grupos exclusivos para trocar ideias, dicas, dúvidas e também
fazer amizades.
Então, pode ficar despreocupado, há muitas possibilidades de interação, que

inclusive podem gerar grandes amizades fora da tela do computador!
## 7\. É muito positivo para o profissional de TI
Os [**profissionais de TI**] precisam ter muita intimidade com o mundo digital.

Isto é, saber lidar de forma fluída com programas, linguagens e internet.
Ao escolher estudar por meio da internet, o aluno consegue adquirir mais

desenvoltura para lidar com ferramentas tecnológicas, ou seja, aprenderá em um
ambiente similar àquele que vai desenvolver seu trabalho.
Fora isso, como a área de TI exige diversos tipos de atualizações e conhecimento,

geralmente, os profissionais emendam um curso na sequência do outro. Isso demanda
agilidade no método escolhido para estudar. Nesse quesito o ensino a distância é
imbatível!
imagem
Olhe um screenshot do começo de 2016:
imagem
Obviamente o principal é ter a sua dúvida respondida. Nos últimos tempos isso
melhorou bastante e continuamos implementando features internas para que possamos
saber o mais rápido possível da sua dúvida, direcionar a pessoa certa e poder
analisar da maneira mais satisfatória possível. A equipe está crescendo também,
você vai ver caras novas cada vez mais frequente por lá.
**São milhares de mensagens trocadas todas as semanas. O que você está esperando?**
imagem
No nosso jogo, **desenvolvido na engine Unity**, o Zumbi precisa perseguir a

heroína, como fazer isso?
Como podemos observar na imagem abaixo, a heroína está na posição x = 100, y = 30 e

o zumbi, na posição x = 200, y = 120.
imagem para a posição (100,30), precisamos alterar a posição do inimigo em dois

eixos - horizontal e vertical. Vamos mover o inimigo apenas na horizontal, para
depois mover ele no outro eixo.
Se eu estou na posição 200 e quero chegar na posição 100, qual a distância que eu
preciso andar?
imagem. Por isso, na hora de atribuirmos a nova posição ao zumbi, utilizamos um

`Vector3`.
csharp
O que acontece agora se testarmos nosso código?
imagem ou negativo(-).
Quando desenhamos o eixo horizontal, utilizamos uma seta (preta) para representá-
lo. Ao mesmo tempo que usamos outra seta (laranja) para representar a distância que
devemos andar.
imagem do eixo.
A seta que representa o caminho a percorrer aponta no sentido contrário do eixo,

isso indica que queremos andar no sentido negativo (-) desse eixo. Como podemos
mudar a conta que estamos fazendo para refletir isso?
A conta atual é:
csharp
colocando os valores ficaria:
csharp
O valor numérico dessa conta está correto, mas queremos o sinal contrário. Como a
ordem dos valores de uma subtração importa, podemos inverter os valores da nossa
conta para termos o resultado desejado.
csharp
Se voltarmos no nosso código, precisamos trocar somente a linha onde fazemos essa
subtração.
csharp
Será que essa abordagem funciona também para o eixo vertical?
Vamos testar. No caso do eixo Y, a heroína está na posição 120 e o zumbi na posição
30.
Colocando esses valores na conta:
csharp
Chegamos ao número -90 e ele faz sentido, pois o zumbi tem que andar 90 unidades na
direção oposta a direção de crescimento do próprio eixo Y.
Podemos então generalizar, ou seja, sempre que precisamos calcular o sentido e a

distância entre dois pontos, precisamos subtrair a posição X e Y do nosso destino
pelo X e Y da nossa origem.
Voltando ao nosso código da classe zumbi, adicionamos o cálculo da \*distânciaY \
*para que o zumbi vá atrás da heroína.
csharp
Será que agora chegamos no comportamento desejado?
![]
Parece que não, agora o zumbi está se teleportando para a posição da heroína.
Resumindo: sempre que temos um comportamento de perseguição precisamos subtrair a

posição do destino da posição da origem para achar a direção que temos que seguir e
a distância que estamos do alvo.
Ao somar o resultado da subtração na posição do inimigo ele se moverá

instantâneamente para o destino.
Como esse texto está ficando longo, resolver apenas esse problemas do perseguidor
teleportar para a posição de destino em um outro post.Você conhece alguma outra
situação onde podemos usar essa mesma lógica? Qual outro problema relacionado a
jogos você gostaria de ver explicado aqui no blog? Deixa nos comentários!
Aproveita e olha lá no site da alura os [**cursos que temos sobre jogos**], tenho
certeza que você vai encontrar algo interessante para aprender.
Vou iniciar com um questionamento. Você já parou para se perguntar qual é o tipo de
**carreira em IA** que você deseja iniciar e o que irá fazer nela, seria coordenar?
Programar? Inovar? Considero que todas essas coisas são possíveis.
Na primeira, você gerenciaria um time de IA, na segunda faria parte desse time e na
terceira trabalharia em um laboratório de inovação ou com pesquisa.
Antes de qualquer coisa, gostaria de dedicar este post ao Flávio Andre Virgilio,
meu aluno da Alura e inspirador da resposta, à Mayra Oliveira, minha revisora, que
me incentivou a fazer o post, e a todos aqueles que querem começar na área de IA,
mas não enxergam uma direção clara.
Partindo disso e da minha experiência, é uma boa que você:
- **goste de lógica**. Algoritmos são a base da IA, quanto mais desenvolvido for o
seu raciocínio lógico, melhor.
- **tenha interesse em questões filosóficas, de neurociência, matemática, física e

até de psicologia**. Na Filosofia, além da área de Lógica, a de Teoria do
Conhecimento propõe pensar como definir o que é conhecer algo, e isso é importante
para IA.
- **saiba uma linguagem de programação**. Assim pode aplicar os algoritmos, a

lógica e as teorias usando um computador. Aconselho **Node (para as APIs de
serviços)**, **Python e Java (para os códigos e bibliotecas)**. **C ou C++** são
uma boa também. Teste programar em algumas dessas linguagens e veja com a qual
sente maior afinidade.
Considero esses 3 pontos básicos, até para saber se esse é o caminho. Ainda falando
de modo pessoal, caso você seja apaixonado pelas coisas acima, continue. IA pode
ter um mercado em expansão agora, **mas sempre seremos bons naquilo que amamos e
somos felizes fazendo**.
## Agora vamos lá para as referências mais práticas.
Você já pensou sobre os pontos acima e sabe que tem um super interesse. Agora
pratique. Procure pegar um problema simples e resolva-o até o final. E então pegue
um próximo, outro, e assim por diante.
Isso é importante para que você sinta como é desenvolver uma solução.
## E como fazer isso?
- com a formação da Alura de [**Machine Learning**], e o de [Estatística].
- com os exemplos ou competições do [Kaggle] (em inglês).
- executando os exemplos da [Google AI] (em inglês).
- fazendo o curso de [Inteligência Artificial] do MIT (em inglês).
- também pelos cursos de Machine Learning e IA do [Andrew Ng] (em inglês).
- lendo e seguindo os exemplos do livro de [Inteligência Artificial] do Russell e

Norvig (em português) ou free em inglês nesse site da [Universidade de Berkeley].
- estudando as apostilas do [Silvio do Lago Pereira] do IME-USP.
- explorando esse mapa mental do [Sci-kit learn] (em inglês).
Além disso, incentivo você a não parar por aí. Depois de ter concluído o primeiro
projeto, compartilhe. Mostre para pessoas próximas, faça um blog, mande um link no
twitter, participe de Meetups de IA na sua cidade.
Independentemente de como você classifique esse conhecimento que adquiriu,

iniciante, intermediário ou avançado, é sempre bom que ele seja compartilhado e se
multiplique.
Eu poderia adicionar referências a esse post eternamente, mas espero que tenha te
dado algum norte para colocar as mãos na massa e começar.
Bora mandar bala em uns algoritmos!
Se você editor de vídeo, já acostumado com o a interface e o workflow que o **Adobe

Premiere** te oferecia há anos pode ter tomado um susto na sua última atualização,
a _11.1.0_.
Além das melhoriais comuns, relacionadas a performance, trabalhos de mídias 4K e o

refinamento do [**Dynamic Link**], o Premiere mudou a forma de interagir com
elementos gráficos e texto dentro da sua edição.
## O Title agora chama-se TYPE TOOL
![]
A mudança vai diretamente ao comportamento que o recurso terá, onde anteriormente
tinhamos a opção de **Title** sendo entendido como um painel, agora ele visa o uso
a partir de uma ferramenta.
Notem que agora na sua **Tool Box**, temos a ferramenta de **Type Tool**, fazendo
com que o trabalho de texto esteja diretamente ligado com o material que vem sendo
editado.
![]
A ideia da _"nova ferramenta"_ é fazer com que o editor já insira as informações de

texto sem sair da Timeline de edição, fazendo com o que o mesmo ganhe tempo em
relação ao posicionamento do elemento no projeto.
> OK, entendi que virou ferramenta, mas cadê as propriedades de formatação?
## Propriedades de formatação
Seguindo a mesma linha de edição das propriedades de vídeo e áudio, a edição do

**Title** irá depender do **_Effect Control_**.
![]
Notem na imagem acima, que ao ter selecionado o **Objeto Title**, o **_Effect

Control_** nos mostra as propriedades de formatação e até mesmo os recursos
relacionados a trabalhar com as formas básicas e o uso da _Pen Tool_.
Então para quem se assustou por não ter encontrado o **Title**, está ai o que
aconteceu!
No curso de [**Android II Integração com apps e recursos do device**] desenvolvi a

App Agenda para cadastrar alunos com o seguinte visual:
imagem
imagem` do ÀlunoAdapter` modificamos a referência da ÌmageView` para

`CircleImageView`:
java
Se executarmos a App neste instante temos este resultado:
imagem
## Cuidados com o rotacionamento
Entretanto, se rotacionarmos a nossa App nesse exato instante, o que será que
acontece? Vamos testar!
java
Ops, recebemos uma exception! Por que será que aconteceu isso?
No curso, criamos dois layouts para o `list_item.xml`, isto é , o _portrait_

(retrato) e o _land_ (paisagem). Ou seja, se olharmos o XML para o modo land temos
o seguinte conteúdo:
xml
Note que ainda estamos usando a ÌmageView`, portanto, vamos modificar para a
`CircleImageView` no layout land da mesma forma como fizemos no layout portrait:
xml
Agora se rodarmos a nossa App em modo land:
![]
Agora tanto o nosso layout portrait como land estão com as imagens circulares! :D
## Firulas da CircleImageView
Uma das coisas legais da lib `CircleImageView`, é que podemos chamar alguns
atributos da View para ajustar mais ainda o design da nossa imagem, como por
exemplo, adicionar uma borda. Vamos então adicionar uma borda para ver o resultado:
xml
Neste exemplo fiz uso dos atributos àpp:civ_border_width` para adicionar a largura
da borda e àpp:civ_border_color` para colocar a cor. Por fim, rodando a App, temos
a seguinte imagem circular:
![]
Neste post aprendemos como podemos fazer, de uma maneira fácil, para que nossas
imagens fiquem circulares, bacana né?
imagem
Estamos felizes em anunciar a chegada de uma série de novidades na plataforma de

aulas da Alura. Isso mesmo: agora temos features para você extrair ainda mais dos
seus estudos na Alura!
## Alura+
- imagem e outros conteúdos como artigos, podcasts e vídeos de uma forma que irá
facilitar a organização dos seus estudos.
Gostou?
Pode usar os Planos de Estudo apenas para você mesmo ou compartilhar com o mundo
inteiro, como uma recomendação sua, divulgando dessa forma o que você acha
interessante de estudar dentro de uma determinada área.
Por exemplo, eu publiquei um [plano de estudos sobre performance de front-end] com

coisas que acho bacana de estudar (segue lá!). Também, lançamos o [plano de estudos
do(a) programador(a) iniciante], do William Oliveira.
[Crie já o seu plano de estudos na Alura.]

## Cursos e categorias novas
- imagem
imagem
No blog da Caelum temos alguns posts bem longos sobre determinados assuntos que
demandam muito conteúdo, mas isso deixa a rolagem da página gigantesca.
Isso é o que aconteceu, por exemplo, com o post que o Sérgio Lopes escreveu de
**[Por uma Web mais rápida: 26 técnicas de otimização de Sites]**:
imagem para este elemento.
html
Neste caso foi adicionado o ìd` como referência `habilite-gzip`, por exemplo. Cada
caso irá pedir uma especificidade diferente.
Ok, definido isso, precisamos agora criar um link para o tópico dentro do texto, a
partir do índice lá em cima.
Nos itens do índice adicionamos exatamente isso: links!
html
Note que não temos nenhum link para inserir em nossa referência de **link
(`href`)**... Mas então o que entra na (`href`)?
Lembra que adicionamos uma identificação (ìd`), específica para aquele tópico, na
tag `h3`, que o envolvia? É exatamente essa referência que indicaremos no `href`.
html
Ou seja, para indicar que queremos pular dentro da página diretamente para a ìd`
indicada, foi adicionado um "#" antes da indicação (ìd`).. Com isto, o link que
criamos cria uma âncora dentro da própria página, varrendo toda a página até
encontrar a ìd` correspondente ao indicado na `href`. :)
Ao final, o índice ficará mais ou menos assim:
imagem
## Outros usos
Além desse índice de tópicos, encontramos por aí outras formas de utilizar a

ancoragem, como em botões "Voltar para o topo". Algo como:
![]
Nesses casos, temos uma ancoragem também, porém que nos envia de volta para a
origem.
Independente do caso de uso, é importante ressaltar que **esse tipo de recurso só é

relevante em páginas com muito conteúdo**, isto é, páginas em que a rolagem é tão
grande que o usuário poderá se perder no meio do caminho e, consequentemente,
prejudicar a usabilidade do nosso site.
## Melhorando a navegabilidade
Se considerarmos que hoje os [**usuários são leitores com pouco engajamento na

leitura de textos completos**], considerar a ancoragem de elementos dentro da
própria página é algo muito interessante para conseguirmos uma melhor
navegabilidade.
Desse modo, facilitamos a busca pelo que realmente interessa ao usuário, dentro da
nossa página e aumentamos as chances de mantê-lo interessado no que consideramos
importante para sua conversão.
Lógico que, apesar de ser um recurso interessante, é importante utilizá-lo com

cautela, buscando analisar bem o contexto para validar se é, de fato, necessário
utilizar esse mecanismo.
Para deixar suas páginas ainda mais completas, aprenda as diferentes

especificidades que podemos encontrar em HTML, suas vantagens e desvantagens e
muitas outras coisas legais na [**Formação FrontEnd**] da **Alura**!
Diz a lenda que o Mark Zuckerberg, fundador do Facebook, tem seu almoço definido
por outra pessoa pois ele não quer gastar energia decidindo o que vai comer.
Eu ainda tenho muito prazer escolhendo meu prato ou sobremesa, mas extremos como
este trazem a tona as dificuldades que enfrentamos na hora de escolher algo.
## Costumes do dia a dia
Se tenho três abas do navegador abertas e fecho uma pois terminei uma tarefa me
pergunto: qual fazer agora? Tenho que analisar se vale a pena ir para uma ou a
outra.
Tenho que mudar meu contexto de uma para a outra e, pior ainda, pode ser que no
meio de uma tarefa eu vá para a outra e depois volte. Quanto mais escolhas, mais
tempo gasto pulando entre uma e outra.
Por muito tempo tive a ilusão de ser multitarefa, até aprender que essa
característica não funciona bem como imaginamos.
## Uma coisa de cada vez
O cérebro está trabalhando o tempo todo, mas não parece funcionar como um
processador de computador: se o seu tem 8, ele faz 8 contas matemáticas diferentes
ao mesmo tempo.
Eu mal consigo fazer uma conta de soma. Se fizer uma conta de mais ao mesmo tempo
que tomo banho eu já não lembro se passei o shampoo ou não. Sempre bato na tecla de
manter uma única aba aberta: feche todo o resto.
## Distrações do dia a dia
Mas mesmo assim ainda temos um momento de escolha muito duro no dia a dia. Quando
abrimos uma nova aba podemos entrar no site do trabalho, ou digitar "face", enter.
Ai abre outra aba depois...
O facebook está a quatro cliques de distância, como resistir? Se o seu vício não é
o facebook, que seja o instagram, o twitter, o jornal, a revista científica online,
o blog. Como resistir abrir ele no meio do período que quer focar em outra coisa?
## Aprenda a limitar suas distrações
O plugin [**StayFocusd**] para o Chrome permite configurarmos a URI de diversos

sites, como `www.blogquesouviciado.com.br` e `www.sitequesouviciado.com.br`, e o
tempo máximo que podemos passar neles por dia. Comecei com 15 minutos para meu
facebook e jornais - para o dia inteiro!
Já no primeiro dia estourei o limite dos 15 minutos. Poderia ter configurado

somente 15 minutos para o horário de trabalho, mas percebi que esses sites também
afetavam minha vida pessoal em casa. Portanto são 15 minutos no máximo o dia todo.
Foi uma longa semana de adaptação, já durante a segunda semana não estourei o
limite nenhuma vez. Na terceira percebi que alguns sites eu acessava somente para
"matar o tempo"...
Exatamente aquele tempo que eu reclamava que eu não tinha. Eu devia estar gastando
mais de 30 minutos por dia nesses sites, são 11 horas por mês, basicamente um dia e
meio de crescimento na minha carreira e produtividade gasto completamente no
facebook e sites para matar o tempo.
## Qual foi o resultado disso tudo?
**Hoje mantenho um uso mais saudável do site do facebook, menos de 10 minutos por
dia. E os sites de matar o tempo foram completamente bloqueados em dia de semana.
Tudo feito através do plugin.**
E no celular, quando estou numa fila, ou elevador? Tenho só duas opções: se vou
ficar muito tempo em uma fila, estudo algo no site do Alura ou leio um livro
através da Casa do Codigo ou do Kindle. Se é algo rápido, envio mensagem para minha
família ou amigos.
Não tenho opções, eu fiz minha escolha meses atrás. Agora não gasto nem energia nem
meu tempo. Não mato mais o meu tempo com pequenos vicios. Faço algo que me dá
prazer e ao mesmo tempo enriquece minha vida.
**Claro, comece simples. Bloqueie os sites para 15 minutos diários (tenha

coragem!), matenha o celular virado para baixo e sinta a diferença. Viva a vida,
seu estudo e seu trabalho.**
Nos momentos entre focos, de transito ou de espera, pode usar o celular :)
Junte-se a mim, ao grupo que escolheu aproveitar o tempo com o que quer, e não
matar o tempo com qualquer coisa.
**Como eu e meu irmão (o Paulo, fundador do [GUJ] e da [Casa do Código]), ele

começou com aplicativos de locadora. A seguir ele nos conta um pouco da história
dele. Vamos lá?**
# Me conta um pouquinho sobre sua história na programação?
_Comecei a programar com 13 anos por volta de 1993 com um amigo de infância.
Fizemos um curso de Clipper Summer, depois um de clipper 5.2 usando com DBase III
Plus. Criamos alguns aplicativos para video locadora e pizzarias do bairro._
_Depois trabalhei com VB 3 e 5 e com ASP clássico. Desenvolvi alguns projetos para
Editora de lista telefonica, outro interno para o Santander e dei aula de VB 5 em
uma escola chamada Sequencial. Depois resolvi ir para luz e desde que entrei no
mundo Java X OpenSource, nem penso em trabalhar ou atuar fora desse mundo!_
_Trabalhei com java 5, 6 e agora com 7 e 8. Trabalhei com Spring 2.5 em uma
consultoria que desenvolvia para o Banco do Brasil o Office Bank e outros
aplicativos internos. Nos ultimos 4 anos estou atuando em um projeto na Prodesp
como terceiro. Durante esse tempo passei por 5 consultorias e vou ficar até
finalizar esse projeto._
_Estamos usando nesse projeto Java 8, Jsf 2, WilfFly 8 (vamos atualizar para o 10),
BootStrap, DB2, Oracle 10G, SqlServer, Redis, Python, Rest, WebService, JMS,
WebSphere, entre outras tecnologias necessaria para manter a parte legada._
(nota do Alex: Das 13 tecnologias citadas no projeto atual, só não temos curso no
Alura de 2...ainda! :P )
# Como conheceu o Alura?
_Conheci o Alura através da Caelum._
_Sempre busco algo dinâmico bem explicado e sem enrolação. **Todos** os cursos que
fiz no Alura dou nota 10 para conteúdo, explicação e professor. O estudo online é
rápido e objetivo!_
_Como atualmente estou trabalhando em um projeto que mistura legado com codigo
novo, muitas vezes não temos muito tempo para resolução de um problema. Por
exemplo, tive que criar um robozinho para processar arquivos de log. Comecei
fazendo em Java 8 mas não ficou muito performático! Como fiz o curso de Python do
Alura, arrisquei a criar essa funcionalidade utilizando-o e no final os ganhos em
performance foram notaveis._
_Além do Python o mesmo aconteceu com o Redis. Ao terminar de fazer o curso no

Alura, me deparei com um problema no sistema e resolvi utilizando o Redis._
# Qual seu plano de crescimento para o próximo ano?
_Vou me esforçar ao máximo para adquirir mais conhecimento técnico. Isso é

fundamental para tomar decisões sobre qual melhor tecnologia utilizar no projeto
alem de definir pontos de falha e pontos que de atenção._ 3\. O que você sugere
para alguém que quer se tornar um aluno de destaque como você?
_Estudar deve ser como uma religião: seja fiel a ela a recompensa virá com certeza!
Estudar, participar de foruns, estudar, ajudar outros alunos ou companheiros de TI,

estudar, participar de projetos OpenSource, estudar, estudar..._
E ai, gostou da história do Cristiano? Também tem uma história bacana pra contar
pra gente?
Você pode ver cursos das várias tecnologias que o Cristiano citou [**aqui na
Alura**] :)
Pode parecer um clichê usar aquela máxima do pensador Confúcio, de que “uma imagem
vale mais do que mil palavras”, mas nesse meio é uma grande verdade. O poder da
imagem no marketing é forte.
As imagens têm um impacto bastante significativo por atingir um amplo número de

pessoas e ter a sua “leitura” muito mais rápida, além de facilitar a assimilação do
conteúdo. De fato, as pessoas se lembram de [**80% do que veem e apenas de 20% se
elas somente leem**] uma informação. Com isso, o uso de recursos visuais é uma
forma de fixar elementos, inclusive a sua marca.
Para saber mais sobre marketing, com foco no [**marketing digital**] e de conteúdo,
e o poder da imagem dentro dessa área, acompanhe o post com a gente!
## Como o marketing funciona
O marketing e a comunicação abrangem áreas diversas, com o objetivo de tornar seus

produtos, serviços ou mesmo a empresa mais conhecidos. O marketing ajuda a
construir a imagem de uma marca, funcionando como uma espécie de elo entre ela e os
clientes e sendo capaz de fortalecer essa relação.
### O marketing digital
Toda ação de marketing realizada online pode ser chamada de [marketing digital]. A
internet traz vantagens como a interatividade, o alcance global em um curto espaço
de tempo e as métricas, através do controle de acessos e compartilhamentos.
### O marketing de conteúdo
O [**marketing de conteúdo**] é responsável pelo maior engajamento entre as pessoas

e uma empresa, pois gera conteúdos relevantes que atraem e agregam valor à marca.
Isso porque o marketing de conteúdo pode trabalhar com dicas, soluções de problemas
do cotidiano e outros tipos de informações que não necessariamente têm ligação com
o que a empresa vende, o que gera maior confiança.
## Entenda o poder da imagem no marketing
Para atingir seus objetivos, o marketing utiliza diversos recursos, inclusive as

imagens, para se comunicar diretamente com o público de interesse. É uma forma de
complementar o que foi dito ou, como é mais comum, de chamar a atenção das pessoas.
Além do mais, nem todo mundo tem tempo de dedicar-se a uma leitura mais extensa de
uma informação nos dias corridos de hoje. A rotina puxada exige uma comunicação
rápida, de forma que chame a atenção para o conteúdo da maneira mais objetiva
possível.
Como o cérebro processa as informações em imagens [**60 mil vezes mais

rapidamente**], é uma forma de conseguir a melhor transmissão da informação, em
muitos casos.
### O estímulo visual
Como 90% das informações transmitidas ao cérebro são visuais, as pessoas tendem a
ser mais estimuladas visualmente.
Quem visualiza uma imagem que apresenta um conteúdo mais extenso, por exemplo,
pode, diante dela, decidir se acessa o conteúdo e continua a leitura ou não.
Ou seja, no chamado marketing visual, a imagem se responsabiliza por transmitir uma

prévia de tudo que a ação deseja comunicar. Além disso, ativa a curiosidade de quem
visualiza e estimula a criatividade.
### A fotografia nas redes sociais
Se uma postagem tem uma foto, a interação com ela tende a ser maior. Por exemplo,
[**em uma rede social**] como o Facebook, o engajamento dos posts cresce com a
existência de uma foto, aumentando as curtidas e também os comentários. De fato, o
envolvimento em posts com imagens [**aumenta em cerca de 230%**].
O mesmo acontece no Twitter, já que um tweet com foto recebe, em média, até [**35%
a mais de RTs**]. Diante disso, é possível entender o sucesso de outra rede
conhecida: o Instagram.
Se você deseja anunciar algo na rede, entenda que um dos pontos principais deve ser
promover a identificação com o público. E, em geral, a imagem é uma ótima forma de
conseguir isso.
## Boas práticas no uso das imagens no marketing digital
Para ter bons resultados, o uso de imagens não deve ser aleatório. Como toda
informação a ser compartilhada com o seu público, ela também deve ser bem
planejada. Além disso, é importante saber que a prática de utilizar imagens é
relevante, mas pode não ser essencial em todas as áreas.
Com isso, é preciso ponderar e conhecer as boas práticas dessa possibilidade. Entre
as questões mais destacáveis estão:
### Cuidado com o direito de imagem
Para evitar problemas, utilize apenas imagens próprias ou que tenham permissão para
uso. Você pode pagar por imagens de qualidade em [**bancos de imagem**] na
internet, por exemplo.
O importante é ter atenção à licença de atribuição. Algumas permitem o uso gratuito

e livre, inclusive com modificação e para fins comerciais — e são estas que devem
ser empregadas.
Também vale considerar fazer uma conta em um banco de imagens e pagar para ter o
direito delas. Os planos são acessíveis e garantem que você possa utilizar os
elementos dentro das regras.
### Atente para a edição
Para garantir o potencial dessa abordagem, não se esqueça de ter uma edição de
imagem de alta qualidade. Se possível, conte com a ajuda de um profissional para
conseguir resultados melhores.
Como a qualidade faz toda a diferença para a sua peça, tenha cuidado com a
[**resolução**], com os elementos utilizados e até com o redimensionamento para que
não fique desproporcional.
Além de tudo, busque a originalidade, de modo a imprimir a personalidade da sua

marca no uso desses recursos.
### Dê um propósito útil às imagens
Estudos revelaram que as pessoas [**prestam mais atenção em imagens**],

especialmente se elas carregam informações. Infográficos, por exemplo, possuem [**3
vezes mais engajamento**] do que qualquer outro tipo de conteúdo.
Com isso, também vale a pena pensar em dar um propósito útil e diferenciado para as
imagens. Crie tutoriais, apresente dados e faça considerações importantes
utilizando os recursos visuais.
Isso enriquece a sua estratégia de marketing e garante melhores resultados de

alcance e de engajamento. Porém, é necessário usar isso pontualmente, quando
realmente fizer sentido e não somente em busca de resultados.
### Pense na relação direta
Uma imagem que não seja convergente com o conteúdo ou com a identidade do seu
produto ou serviço pode fazer com que o seu público se decepcione e deixe a página
antes mesmo de saber mais. Por isso, desperte a curiosidade e cumpra com o que
propõe.
Não use as imagens para ludibriar, como ao usar fotos que não correspondem ao
assunto tratado ou, pior, que não são do seu produto. Aposte, acima de tudo, na
confiança como um fator para o sucesso.
Para relacionar-se melhor com o consumidor um bom trabalho de marketing é

fundamental. Utilizando o poder da imagem em suas ações, essa atuação pode ser
ampliada.
Gostou do post? Aproveite para seguir a gente em nossas redes sociais: [Facebook],
[Twitter], [LinkedIn]e [YouTube].
Se você tem um projeto ou um negócio, é provável que já tenha pensado em divulgá-lo

usando algum meio digital. Quando pensamos em anúncios online, muitas vezes o que
vem em nossa cabeça são as propagandas que vemos no **Facebook, Instagram ou Google
Adwords**. Porém, atualmente, os anúncios no LinkedIn Ads têm ganhado força entre
os profissionais de marketing digital.
## Alguns números sobre o LinkedIn
- Mais de 545 milhões de usuários do mundo inteiro;

- Mais de 26 milhões de brasileiros cadastrados;
- Cerca de 7 milhões de empresas presentes na plataforma.
Além dos números impressionantes, o LinkedIn é uma mídia social voltada aos
negócios. Diferentemente do Facebook ou Instagram, em que as pessoas estão
conectadas para se distrair ou ver as atualizações dos amigos, no LinkedIn estão
presentes aqueles que procuram uma oportunidade de emprego, desejam fazer
**networking** e, claro, conhecer soluções e negócios inovadores.
## LinkedIn para anúncios B2B (Business to Business)
Os anúncios do LinkedIn são grandes aliados para empresas que trabalham vendendo
produtos ou serviços diretamente para outras empresas. Como a mídia social é
voltada aos negócios, profissionais de diversas áreas estão sempre acessando ao
**feed** de notícias.
Sendo assim, é possível que você encontre a diretora de RH que está precisando
adquirir uma solução para organizar seu quadro de funcionários, ou a gerente de
marketing que precisa de uma agência especializada para realizar um evento da
empresa. Isto é: é muito provável que você encontre alguém que precise exatamente
do que você vende, dentro do LinkedIn!
Aqui na Alura e na Caelum, utilizamos bastante o LinkedIn para anunciar [**nossos

materiais gratuitos para empresas**], pois os conteúdos são voltados a gestores dos
mais variados negócios e áreas.
## LinkedIn para anúncios B2C (Business to Consumers)
Mas se engana quem pensa que o LinkedIn serve apenas para anúncios B2B. Empresas
que trabalham com consumidores finais também podem se beneficiar com a publicidade
na plataforma, como é o caso da Amazon, que utiliza os anúncios para [**divulgar
novos serviços e promoções de livros**].
O LinkedIn possui diferentes opções de divulgação que se adequam a várias

necessidades apresentadas pelas empresas anunciantes. Para as empresas B2C, que
desejam anunciar nessa plataforma, é muito interessante entender qual tipo funciona
melhor com seu público para ter uma maior garantia de sucesso.
## O sucesso dos anúncios no LinkedIn
É preciso estudar onde está o seu público e realizar testes para descobrir qual
mídia social funcionará melhor para o seu negócio. Também é essencial que, ao
escolher uma plataforma para divulgação, você entenda corretamente como utilizá-la.
Se você ficou com vontade de conhecer mais sobre o LinkedIn Ads e quer descobrir se
é uma boa opção para seu negócio, recentemente lançamos o [**Curso LinkedIn Ads:
Novos clientes com anúncios otimizados e e-mails patrocinados**] na Alura. Você
aprenderá quais são os tipos de anúncios possíveis e o passo a passo, desde a
criação de uma **company page** até como realizar a otimização dos anúncios criados
na plataforma.
Mesmo com um plano de internet rápido, a rede está instável e cai constantemente.
O que pode estar deixando a rede assim?
Bem, vamos dar uma olhada na rede para tentar identificar o problema:
imagem chega a ele, este tenta entregá-lo para todos os dispositivos conectados a
ele.
Aquele que for o destinatário fica com a mensagem, porém quem não for recebe a
mensagem da mesma maneira, apenas não responde:
imagem.
Quando dois pacotes chegam ao switch ele forma uma fila de pacotes. Esse tempo que
o pacote espera na fila, causa atraso na sua entrega e, por consequência, a rede
fica mais lenta.
Outro motivo que causa problemas na rede é a quantidade de dados que conseguem
passar por segundo em um meio de transmissão.
Se em uma rede com uma internet de 10 Mbps algumas pessoas estiverem assistindo um
curso da Alura em HD, outra estiver ouvindo um podcast do [**hipsters.tech**] e
outra conversando via Skype. A rede ficaria mais lenta do que se tivessem 50 Mbps
de internet, não?
Vamos entender o motivo disso ocorrer:
Pensemos o seguinte, uma pista com quatro faixas e outra com duas faixa.
imagem em inglês. A pista seria o meio de transmissão, enquanto os carros seriam os

pacotes.
No caso da internet de 10 Mbps, o tamanho da "pista" seria mais estreito para

passar esses dados, enquanto que em 50 Mbps, teríamos cinco vezes mais largura de
banda para os dados trafegarem. O que deixa a rede mais fluída
## Para saber mais
Esses são alguns motivos que deixam a rede lenta, porém existem [outros] como:
- Interferência de sinal em redes sem fio;
- O cabeamento interno e a [impedância];
- Hardware de rede desatualizado;
- Tempo de resposta de outros hosts, como servidores.
Existem também outras diferenças entre os hubs e os switches. O primeiro trabalha

na camada 1 (física) do [modelo OSI], enquanto o segundo funciona na camada 2
(enlace), alguns na [camada 3] (rede), ou seja trabalham com alguns protocolos dos
roteadores.
O switch, ao contrário do hub, pode ser configurado da forma que melhor atender a
rede. Uma configuração muito utilizada é a VLan, já que garante segurança e
performance na rede, entre outras coisas.
## Conclusão
Nós tínhamos o problema da instabilidade da rede. Percebemos que os hubs causavam

isso já que sempre encaminham os pacotes a todos os hosts na rede, além dos dados
sofrerem danos.
Ao substituí-los por switches, notamos uma melhoria no desempenho na rede, já que

os pacotes não sofrem tantos danos e não existe a necessidade de muitos broadcasts
na rede.
Vimos também que alguns problemas nas redes estão associados a seus ativos, porém
esse não é o único motivo. Tamanhos de pacotes, cabeamento, tempo de resposta,
entre outros podem fazer com que a rede fique mais lenta e, ou, apresente
instabilidade.
Curtiu essa parte de redes? Essa é apenas uma pequena introdução sobre o assunto.
Aqui na Alura, temos uma [**formação em redes**] para você que quer se aventurar
nesse vasto mundo.
Nesta formação, você aprenderá sobre os conceitos, como montar uma rede até um
provedor de acesso, sobre lista de acessos, IPv6 e sobre segurança para defender
sua rede de possíveis ameaças.
Estamos em um formulário de uma app Android e já preenchemos praticamente todas as
informações, porém assim que viramos a tela do dispositivo acabamos perdendo tudo.
Por que isso acontece? Vejamos o [**ciclo de vida**] da Àctivity`:
Ao iniciarmos a aplicação é chamado o método ònCreate()`, responsável por

construir toda a aplicação. Depois desse método, é chamado outro, o ònStart()`,
que de fato inicia a aplicação. Depois de iniciada, o Android chama o ònResume()`
que vai interagindo com o usuário, atualizando a aplicação na medida que é
necessário.
Quando **viramos a tela** é chamado o ònPause()` que pausa a aplicação e em

seguida o ònStop()` que pára tudo. Depois nossa activity é destruída através do
método ònDestroy()` e em seguida é criada novamente, chamando o ònCreate()`.
Então podemos concluir que nosso formulário ao ser virado, perde todas informações
pelo fato dele ser destruído. Mas como podemos resolver isso? Será que da pra
salvar as informações contidas nele antes de virarmos?
Poderíamos simplesmente colocar no momento que ela é pausada, mas ainda não o seria
adequado, pois a qualquer instante a aplicação poderia ser matada e assim nada
seria salvo. Temos um método que poderá nos ajudar neste momento que é o
ònSaveInstanceState()`, pois ele é chamado antes da Àctivity` ser parada. O que
faz dele ser tão poderoso?
O ònSaveInstanceState` recebe como parâmetro um `[Bundle]`. E como este `Bundle`

pode nos ajudar? Podemos passar para dentro dele todas as informações que queremos
salvar, e é exatamente isso que estávamos buscando! Mas como fazer isso?
java
Nesse caso nosso `Bundle outState` está usando o `putSerializable()` que funciona
como um `Map`, passamos nossa chave e em seguida o valor. O bacana disto é que para
nosso formulário teríamos vários `putSerializable`, para cada campo uma chave e
valor.
Testando a nossa app, vamos girar a tela para ver o que ocorre. Usaremos o `Log`
para verificar o que ele está salvando, no LogCat vemos o seguinte:
```
02-03 12:49:30.338 2930-2930/br.com.caelum.app I/Salvando: Matheus 02-03

12:49:30.338 2930-2930/br.com.caelum.app I/Salvando: 12345678
```
Estamos com todos nossos campos salvos agora, se rodarmos nossa app nesse instante
e girarmos a tela veremos que nada aconteceu, ou seja, ainda estamos perdendo as
informações! Por quê? Como apenas salvamos os campos, em momento algum os
restauramos. Há um jeito de pegarmos essas informações ?
Existe um outro método que é chamado assim que iniciamos o ciclo, que é o
ònRestoreInstanceState()`. Certo, como esse método funciona? É recebido como
parâmetro um `Bundle` e da mesma forma que salvamos algo nele conseguimos retirar.
Podemos pensar da seguinte forma: O `Bundle` é uma lavanderia, nossos campos são as
roupas. Ao deixamos nossas roupas na lavanderia, deixamos algo que possa nos
identificar quando formos retirá-las, por exemplo um telefone, cpf ou rg.
java
Aqui estamos usando essa ideia da lavanderia: assim como nós deixamos nossas
informações na lavanderia no método ònSavedInstanceState()`, aqui estamos pegando
o `savedInstanceState`, que é o nosso `Bundle`, e pedimos nossas informações de
volta, passando para cada uma delas nossa identificação. Isto acontece quando
usamos o método `getSerializable()`, que recebe nosso identificador.
Se rodarmos novamente nossa app, preenchermos o formulário e tentarmos rodar a

tela, nenhum dado se perde:
```
02-03 12:49:30.338 2930-2930/br.com.caelum.app I/Restaurando: Matheus 02-03

12:49:30.338 2930-2930/br.com.caelum.app I/Restaurando: 12345678
```
Excelente! Agora podemos deixar nosso usuario rodar a tela infinitas vezes e não
precisamos mais nos preocupar em perder os dados que ele já havia inserido!
Vimos então que quando nossa activity muda a orientação ela é destruída. Quando
estamos tratando de formulários, temos dados que nosso usuario não gostaria de
perder e vimos que para solucionar esse problema existem dois métodos:
ònSaveInstanceState` e o ònRestoreInstanceStace`, que nos auxiliam a persistir o
dados antes de nossa activity ser destruida e resgatarmos quando for reconstruida,
respectivamente.
**Quer saber mais sobre Android e mobile? Aqui na Alura, dê uma olhada nos nossos
[cursos mobile], que tem cursos que abordam esses e muitos outros assuntos para que
você construa sua primeira app completa! Também, na **Caelum**, temos 2 cursos
presenciais do básico ao avançando!**
A gestão colaborativa é um estilo de liderança, no qual todo mundo na empresa

participa das decisões e do sucesso do negócio. Parece perfeito, não é mesmo?
Bom, mas… Como colocar isso na prática? Primeiro, vamos entender de onde apareceu a
Gestão 3.0 e quais são os princípios deste estilo de gerenciamento das equipes.
## O que é Management 3.0
“_A gestão é importante demais para ser deixada apenas para os gerentes_.”
A citação acima é de Jurgen Appelo. Ele é um gerente, escritor, palestrante e faz-

um-monte-de-outras-coisas holandês, que provavelmente estava muito cansado de ver
as empresas falharem no gerenciamento de equipes ao repetir os mesmos padrões de
sempre. Daí, ele criou um conceito que começou a chamar de Management 3.0.
Mas o que o Management 3.0 pode fazer para a sua empresa? Segundo Jurgen, o
conceito traz uma gestão mais humanizada para a empresa, em que as pessoas devem
ser o ativo mais importante da organização.
Um dos objetivos da Gestão 3.0 é engajar os/as colaboradores, e assim alavancar o

crescimento do negócio, com todo mundo na empresa focado em um objetivo comum:
entregas rápidas, eficazes e ágeis para a criação de produtos incríveis. Com isso,
diminui também a rotatividade de pessoal e aumenta a satisfação.
Jim Highsmith, consultor executivo da Thoughtworks, diz que “_Management 3.0 serve
aos líderes envolvidos na transformação Agile e Lean como um guia provocativo para
que eles mesmos e elas mesmas tornem-se ‘ágeis’_”.
imagem, Appelo contextualiza as formas de administração de pessoas da seguinte

maneira:
**Management 1.0**
Orientado por comandos, com baixa liberdade nas decisões e criações. O poder está
nas mãos de poucas pessoas, a estrutura de decisões é de cima para baixo.
**Management 2.0**
Um estilo que procura trazer melhorias na gestão e desenvolve algumas novas

técnicas mais eficazes de gestão, como a metodologia Six Sigma, Gestão de Qualidade
Total (TQM) e outros. Mesmo assim, a estrutura de decisões ainda é muito vertical.
**Management 3.0**
Busca valorizar pessoas e times. O foco é criar um ambiente onde todo mundo é
responsável pelo sucesso do negócio e cabe às equipes a forma como as tarefas são
realizadas, tirando a verticalidade do sistema de gestão.
## 6 princípios do Management 3.0
Jurgen Appelo enxerga as empresas como redes e sugere aplicar 6 visões para o
sucesso na gestão de equipes. Já que o holandês é famoso por seu senso de humor
durante as palestras e workshops, no seu livro sobre o Management 3.0, ele ilustra
este conceito de seis visões com este lindo desenho de um marciano:
imagem.
Na **Pixar**, sempre após um novo filme ser lançado, faz se uma apresentação sobre
o que deu certo e o que deu errado neste projeto (_Melhorar tudo_).
A **Zappos** executa a visão 2 (_Empoderar pessoas_) com a não existência de um

script para realizar atendimentos por telefone. Assim, as pessoas no call center
lideram as chamadas de clientes com uma maior autonomia e têm confiança da gestão
para fazer isso, precisando seguir apenas uma regra: servir bem ao cliente. Em
2018, a Zappos foi [premiada] como a marca com “melhor atendimento ao cliente” dos
EUA.
imagem, mas ela também segue a visão de _Aumentar as estruturas_ ao concentrar seu
maior foco para a excelência em softwares e ao sempre prezar por um crescimento
sustentável do negócio.
## Por onde começar agora: ideias e cursos
Para ganhar _insights_ interessantes de quem trabalha com Management 3.0, escute o
episódio sobre o tema no podcast [Hipsters.tech] com André Faria da Bluesoft e a
Simone Pittner da Adaptworks.
Inclusive, André criou um curso para a Alura sobre Empreendedorismo, que não é só
para quem quer ter o seu próprio negócio. Ele ensina também como se tornar um
agente de inovação e mudança como colaborador(a) de uma empresa. Veja o conteúdo do
curso [Empreendedorismo: da ideia ao plano de negócios] aqui!
Você se interessa por Métodos Ágeis e Scrum ou quer melhorar a gestão dos times na
sua empresa? Confira a formação [**Agilista**] que contém vários cursos para te
guiar no processo de se tornar especialista no Agile e Scrum!
Estamos configurando um novo servidor de banco de dados aqui na Alura para

armazenar os dados dos alunos, vamos como configurar o IPTables no nosso servidor,
bloqueando protocolos, portas e permitindo acesso de uma máquina. Na reunião ficou
decidido, por questões de segurança que:
- Para que usuários maliciosos, ou vírus, não encontrem nossa máquina, não será
possível realizar [**ping**];
- Para prevenir de hackers , ou vírus, tentar acessar nosso banco vamos **bloqueá-
lo de acessos remotos**.
Legal, já que temos essas duas tarefas, começaremos pelo **ping**. Antes de
tentarmos bloquear o ping, vamos verificar se o mesmo funciona, fazendo nossa
máquina pingar (`ping`) o nosso servidor (`192.168.0.1`):
imagem que entrará (ÌNPUT`) no servidor , no topo da nossa tabela de regras, isto
é, na posição `1`:
`# iptables -I INPUT 1`
Agora que indicamos a nossa ação de bloqueio, precisamos adicionar mais algumas
informações para especificar o nosso objetivo, isto é, bloquear o ping.
Como o ping funciona pelo protocolo [**ICMP**], é ele que vamos indicar. Sendo
assim, vamos bloquear o protocolo (`-p`) ICMP (ìcmp`):
`# iptables -I INPUT 1 -p icmp`
Temos também que informar o tipo que queremos bloquear no protocolo, que no caso é
a resposta do servidor `--icmp-type echo-request`, após isso, definimos a ação (`-
j`) para bloquear (`DROP`) os pacotes :
`# iptables -I INPUT 1 -p icmp --icmp-type echo-request -j DROP`
Note que o nosso comando é um pouco grande, será que funciona? Vamos testar:
imagem a tabela que queremos, no nosso caso é a tabela de entrada (ÌNPUT`).
`# iptables -L INPUT`
imagem, que no nosso caso é o **localhost**, ou seja, o `127.0.0.1`. Lembrando que

ao invés de bloquear (`DROP`), precisamos aceitar requisições, portanto ÀCCEPT`.
Novamente, o comando completo fica assim:
`# iptables -I INPUT 1 -p tcp --destination-port 3306 -s 127.0.0.1 -j ACCEPT`
![]
> _Mas se eu colocar INPUT 1, não vai sobrescrever a outra regra?_

O comando `-I` insere uma nova regra, logo, quando digitarmos o comando acima, ele
ficará na primeira posição de nossa tabela de regras, enquanto o que estava nessa
posição irá para a segunda.
Vamos listar nossa tabela novamente para ter certeza disso:
`# iptables -L INPUT`
![]
Viram? Nossas três regras estão na tabela do firewall.
Bom agora que já temos todas as regras criadas podemos falar para o iptables salvá-
las. Então ìptables-save` para salvá-las.
Agora todas as nossas regras estão salvas no servidor.
## Pontos de atenção
Vale lembrar que o **Linux** é um sistema **case sensitive**, isto é, letras

maiúsculas e minúsculas são diferenciadas. Mudar um parâmetro pode fazer o comando
não funcionar como esperado.
Também temos que lembrar que todos os comando acima são feitos como
**superusuário**, ou seja, precisamos utilizar o `sudo` ou estar logados como root
para funcionar.
Vale lembrar também que é preciso cuidado ao executar comandos como superusuário
para não comprometer o sistema.
## Conclusão
Nesse artigo vimos como configurar um firewall no Linux utilizando o iptables.

Bloqueando tanto um protocolo, quanto uma porta. Também vimos como aceitar a
requisição de um endereço IP.
Gostou do IPTables? Esse é apenas o começo quando falamos de segurança. Existem

muitas coisas mais.
Aqui na Alura temos um curso de [**segurança de redes com iptables e pfSense**]!
Nele você vai aprender a configurar um firewall para proteger seu servidor de
possíveis ataques e ameaças, como trabalhar com virtualização, proteger sua
instância na Amazon EC2 e muito mais.
Nesse artigo vou mostrar como trabalhar com gerenciador de dependência no

ecosistema PHP.
Outro dia estava programando um site com PHP e fiz uma página de contato, e
precisava de uma maneira que os dados do formulário fossem enviados para o meu e-
mail depois de preenchidos.
Depois de uma pesquisa no Google, vi que uma das bibliotecas mais populares é a
SwiftMailer, que é um dos componentes do **framework Symfony**.
Entrando no site da **SwiftMailer**, fui para a documentação e vi que a maneira de
instalar ela é usando um tal de Composer, com o seguinte comando:
php
No entanto, se eu abrir a linha de comando do meu computador e digitar, ele não

encontra esse comando com o nome de “composer”, o que é isso afinal?
# Apresentando o Composer
O Composer é um gerenciador de dependências. Ele cuida de baixar e gerenciar as

bibliotecas que o seu programa PHP precisa para executar.
Ele é uma das ferramentas principais do PHP moderno, quase todas as bibliotecas e
frameworks mais populares fazem uso dele.
O Composer é diferente de um gerenciador de pacotes como o **APT ou o Yum do

Linux**, apesar de ambos tratarem com pacotes o Composer faz isso em um nível de
projeto, instalando em um diretório.
Por padrão o Composer não instala nada em nível global no sistema, mas possibilita
essa opção caso necessite.
# Instalação
O Composer é um arquivo PHAR, que contém todo o programa em um único arquivo. Para
quem veio do Java, é um equivalente ao Jar.
Para utilizar o Composer então, só é necessário baixar esse arquivo PHAR que se
encontra na página de download do site oficial do Composer.
Você pode seguir as instruções para o seu sistema operacional específico ou

simplesmente baixar o arquivo **PHAR** da versão mais recente que se encontra no
final da página.
Legal! agora para executarmos o Composer, basta irmos no diretório onde baixamos
ele, abrirmos a linha de comando, que no Mac e no Linux é acessada a partir de um
programa chamado Terminal, e no Windows através do PowerShell, e digitar o seguinte
comando:
php
E se tiver tudo certinho, serão exibidas os argumentos que o comando do Composer

aceita! agora estamos prontos para usá-lo.
imagem
# Criando projetos com o Composer
Um uso bem comum do Composer vai ser para instalar **frameworks como o Symfony,
Laravel e o Zend**, e para isso o composer oferece o argumento create-project, o
que torna muito fácil a criação de um projeto.
Para criar um projeto Laravel usando o Composer:
php
Para criar um projeto Symfony usando o Composer:

php
Para criar um projeto Zend usando o Composer:
php
Você deve ter se perguntado “mas de onde ele tira estes arquivos?” E o Composer
possui um repositório central de pacotes chamado **Packagist**.
É dele onde o Composer baixa os seus pacotes, e toda a comunidade PHP adotou o
Packagist como um lugar padrão para disponibilizar as versões novas das bibliotecas
e frameworks.
O Composer também disponibiliza a opção de você utilizar o seu próprio repositório

e armazenar o código no Git ao invés do Packagist.
# Instalando bibliotecas com o Composer
Se o seu projeto não usa o Composer ainda, você pode inicializá-lo com o comando
init.
php
Ele fará umas perguntas, como qual o nome do seu projeto, se ele é uma biblioteca
ou um projeto, e no final, gerará os arquivos necessários para a utilização do
Composer!
É interessante lembrar que frameworks como o Laravel, Symfony, Zend, e Slim já vem
com o Composer habilitado.
Quando estamos em um projeto que faz uso do Composer e precisamos instalar uma nova
dependência como o SwiftMailer, utilizamos o comando require:
php
Assim que adicionamos uma dependência, o composer cria um arquivo com o nome de
composer.json onde ele adiciona todas as dependências dentro de uma propriedade
chamada require.
O Composer possui também uma propriedade chamada require-dev, responsável somente

pelas dependências requeridas no ambiente de desenvolvimento, como o phpunit,
phpspec, phpcs, que não devem ir para o servidor de produção.
Você pode também, ao invés de utilizar o comando require, alterar esse arquivo
composer.json, adicionar a sua dependência e executar o comando:
php
O comando install baixará todas as dependências em uma pasta criada no **mesmo

nível do composer.json chamada vendor**. Esta pasta vendor vai conter todos os
arquivos baixados pelo Composer, as dependências de fato.
Se precisarmos de uma versão específica de uma dependência, por exemplo, se eu

quiser utilizar uma versão do Laravel que tem LTS (Long Term Support), sendo que
ela não é a versão mais recente, podemos especificar a versão logo depois do nome
da biblioteca:
php
Isso serve tanto para o comando create-project quanto para o require, o asterisco
significa que se for lançada uma nova versão que comece com 5.5 (como por exemplo:
5.5.1 ou 5.5.2), ela deve ser utilizada.
Se você usa o controle de versão Git no seu projeto com Composer, é muito
importante que você coloque a pasta vendor para ser ignorada no arquivo .gitignore,
esta pasta pode ficar bem grande e é uma boa prática não incluir ela no
repositório.
Agora imagine o seguinte, especificamos que podemos utilizar todas as versões 5.5.*
do Laravel, imagine que utilizamos a versão 5.5.2 para desenvolver na nossa
máquina, um tempo se passou e quando o próximo desenvolvedor for clonar o
repositório Git para desenvolver e executar o composer install, saiu a versão
5.5.3.
Isso seria muito ruim, e poderia causar vários tipos de erros no nosso programa.
Para isso, o composer tem um arquivo que chama **composer.lock**, esse arquivo tem
a finalidade de travar as dependências em uma versão específica.
Quando instalamos uma dependência, precisamos com que todos os outros

desenvolvedores tenham a mesma versão, independente se a dependência teve uma
atualização.
Com isso, podemos até remover a pasta vendor do nosso projeto e executar o comando
composer install, que temos certeza que as dependências baixadas serão as mesmas
versões que tínhamos antes.
Mas se precisarmos atualizar uma versão de dependência, é necessário um outro

comando:
php
Este comando vai atualizar todas as dependências do projeto para a versão mais
recente disponível no Packagist e reescrever o arquivo composer.lock.
No entanto, tome cuidado! se o seu programa não estiver preparado para lidar com as
versões novas das dependências,ele pode causar erros.
É possível também fazer o update de uma dependência só adicionando o nome dela

depois do comando
php
E se precisarmos remover uma dependência, usamos o comando remove:
php
Acessando arquivos executáveis pelo Composer.
Em uma **aplicação real**, é muito comum precisarmos desenvolver testes para que a
nossa aplicação não sofra com regressão de funcionalidade ou bugs que podem ser
criados conforme vamos desenvolvendo.
Uma biblioteca que auxilia com isso no PHP é o PHPUnit, e podemos instalar no nosso
projeto utilizando o Composer.
php
Observe o --dev utilizado logo depois do require, isso é desejável nessa situação
pois o PHPUnit é uma dependência que só faz sentido enquanto estamos no ambiente de
desenvolvimento e ela não deve ser instalada no ambiente de produção.
No ambiente de produção, o comando a ser digitado para instalar as dependências é:
php
O que instalará somente as dependências que podem ser instaladas em um ambiente de

produção, excluindo as dependências de desenvolvimento e deixando o ambiente de
produção mais enxuto.
Depois de instalarmos dependências que possuem arquivos executáveis instaladas pelo

Composer, elas ficam acessíveis no diretório vendor dentro da pasta bin.
Para executarmos o PHPUnit, faremos o seguinte:
php
imagem
Gostou deste post? você pode descobrir mais sobre o Composer olhando a
[documentação oficial] e se você quiser conhecer mais sobre desenvolvimento de PHP
moderno, acesse os [**cursos de PHP da Alura**].
É por meio de uma comunicação clara com o cliente que você terá ferramentas para
fazer um bom trabalho, construir um bom portfólio, [**atrair freelas**] e ganhar
mais experiência e [**credibilidade no mercado**].
Mas qual a diferença entre um briefing para design e um briefing para publicidade?
Apesar de serem setores bem próximos um do outro, essas áreas possuem
especificidades. Está preparado para conhecê-las? Vamos lá!
## Briefing para design
O briefing de design delimita os detalhes de um projeto que tem o papel de realizar

uma comunicação estética específica. O design é uma ferramenta de resolução de
problemas e é isso que faz com que o briefing de design seja tão importante. É ele
que vai garantir que a mensagem correta seja passada e que o problema seja, de
fato, resolvido.
Você, como designer, sabe bem que o nível de envolvimento do profissional dessa
área com seus projetos, precisa ser grande. Afinal, é um trabalho de empatia. É
preciso se colocar na pele do seu cliente e saber que, para pensar em soluções,
você também precisa se colocar na pele do público-alvo.
Isso explica a importância do design na estratégia do cliente. Mais do que um

simples prestador de serviços, o designer é um verdadeiro parceiro. Designer e
cliente têm papéis relevantes para o sucesso do projeto.
Veja a seguir quais sãos os itens técnicos de um bom briefing de design e a

importância de cada um deles.
### Questões básicas
- Informações base sobre a empresa contratante;

- Posicionamento de mercado da empresa;
- Informações sobre o consumidor ideal da empresa;
- Informações sobre concorrentes.
Essas informações são o ponto de partida de qualquer projeto de design. Para

desenvolver uma arte, você precisa saber transmitir o DNA da empresa em sua
criação, atingir o público correto, garantir que a peça esteja alinhada com o
mercado da marca e, ainda, com vantagem competitiva em relação aos seus
concorrentes.
Caso seu cliente envie qualquer uma dessas informações de maneira muito rasa,
encoraje sempre que ele se aprofunde e atualize todos os aspectos. Dessa forma,
será possível realizar um projeto coeso com o histórico da empresa.
### Detalhes estratégicos
- Especificações sobre a estratégia da qual o projeto de design fará parte;

- Os objetivos do projeto dentro da estratégia;
- Os meios a serem usados para alcançar os objetivos.
O escopo do projeto é o item protagonista do briefing como um todo. Sua definição

deve ser feita com cuidado, pois todos as próximas etapas do projeto vão depender
dele.
### Tópicos práticos
- Orçamento, custos e materiais;

- Plano de ação com prazos e prioridades;
- Definição dos responsáveis por cada etapa do plano;
- Identificação e prevenção de possíveis riscos.
É importante que o orçamento seja especificado pela empresa, para que o designer
possa adequar o projeto à realidade. Isso nunca deve influenciar na [**qualidade do
seu trabalho**] como designer — todo job deve ser feito da melhor maneira possível.
A partir disso, é possível definir prazos realistas, que atendam às necessidades do

cliente. Você pode precisar priorizar jobs mais complexos e de maior custo, por
exemplo, sem pecar na qualidade de um projeto mais simples. Por isso, é importante
alinhar essas questões desde o princípio, para consolidar uma boa parceria com
todos os tipos de cliente.
Além disso, um bom planejamento de prazos evita que o processo de produção de peças
gráficas, por exemplo, sejam um empecilho. Leve em conta que alguns tipos de arte
dependem de testes para serem aprovadas.
### Informações referenciais
- Referências;
- Especificações;
- Objeções.
Seu briefing deve possuir referências muito bem selecionadas e essa pesquisa deve
ser feita, principalmente, pelo seu cliente. Ainda que você apresente referências
como proposta, as referências do seu cliente são a melhor maneira de ele transmitir
a ideia central do que espera do projeto. Afinal, nem sempre descrições por escrito
são o suficiente.
Você deve solicitar tanto referências de projetos já realizados pela empresa,

quanto referências externas que possuam algum aspecto do conceito do projeto a ser
desenvolvido. Qualquer detalhe específico que deva ser especialmente evitado ou que
seja pré-requisito para a aprovação do projeto, como algum elemento gráfico ou
cartela de cores, deve ser explicitado no briefing de design também.
## Briefing para publicidade
O briefing para publicidade deve ser um guia para toda a estruturação e realização
de uma estratégia de marketing de uma empresa. Peças de design, como dissemos,
entram como uma ferramenta dessa estratégia.
Já deu para perceber que o briefing para publicidade precisará de informações

adicionais, se comparado ao briefing para design. Veja a seguir quais seriam as
principais delas.
### Questões básicas
Todas as informações básicas que citamos como necessárias no briefing para design
também entram aqui. Porém, nesse caso, é preciso aprofundar mais. Solicite que seu
cliente aborde questões sobre a história da empresa, sua fundação, sócios,
conflitos, sucessos e mudanças.
A empresa também deve fornecer mais aspectos subjetivos e conceituais da marca.

Isso deve ser levado em conta também na etapa de detalhes referenciais.
### Detalhes estratégicos
**Ao solicitar uma delimitação de público-alvo, busque saber quem é o cliente

ideal. Quais são os seus problemas e quais são as soluções que a marca pretende
solucionar por meio de seus produtos?** As respostas a essas perguntas não devem,
de forma alguma, ser generalizadas.
Aqui, devem entrar todas as pesquisas de mercado recentes realizadas pela empresa e
que tenham envolvido a participação de clientes reais. Dados de mídias sociais e
informações valiosas dadas pelo time de vendas da empresa, por exemplo, também são
boas fontes de informação.
Além disso, os concorrentes devem ser avaliados de acordo com exemplos de

[**benchmaking**] que possam ser seguidos a aprimorados. Garanta que o seu cliente
seja imparcial e verdadeiro sobre essas questões.
### Tópicos práticos
Esses são os aspectos que menos mudam de um tipo de briefing para o outro. Budgets,
prazos e prioridades devem ser colocados na ponta do lápis de forma bastante
realista, para evitar surpresas ao longo da realização do cronograma de ação.
### Informações referenciais
No caso do briefing para publicidade, as referências solicitadas ao cliente devem

se estender um pouco mais. O padrão de publicidade da empresa ao longo dos anos
deve ser levado em conta e revisado com cuidado, para que qualquer inovação seja
feita de forma consciente e assertiva.
Agora que você já entendeu as diferenças entre briefing de design e briefing de

publicidade, compartilhe esse post em suas redes sociais para que seus colegas
também saibam essas informações valiosas!
Existe um programa chamado [**Samba**] que consegue realizar o compartilhamento de
arquivos e impressoras entre **redes Linux e Windows.** Realiza isso por meio do
protocolo [**SMB**].
imagem
De conhecimento do Samba, quando uma empresa me contratou para resolver um problema

com seu servidor de arquivos. o cenário era o seguinte:
Toda a rede da empresa utiliza Linux, desde os servidores até as máquinas clientes.
Contudo um sócio começou a trabalhar alguns dias da semana na empresa com seu
notebook particular, que utiliza Windows como sistema operacional.
Ele precisa acessar alguns arquivos do servidor para realizar seu trabalho. Então
vamos conectá-lo na rede e falar para tentar acessar o servidor via seu endereço:
imagem usados são diferentes. Logo lembrei do **Samba.**
Enquanto redes Windows utilizam o [**NetBIOS**] (**Network Basic Input/Output

System**) para compartilhar os arquivos na rede, sistemas Linux utilizam o
[**NFS**] (**Network File System**). Esses dois protocolos, por padrão, não
conseguem se comunicar.
Sistemas Windows, por padrão, não conseguem se comunicar com sistemas Linux.
Esse protocolo permite a comunicação e compartilhamento de arquivos e impressoras

na rede.
Mas, antes de mais nada, precisamos adicionar o samba em nossa máquina!
## Instalando o Samba
Para instalar o Samba basta abrir o terminal e falar para seu gerenciador de
pacotes instalá-lo. No meu caso, o sistema do servidor é um Linux [**CentOs**] que
utiliza o [**YUM**]. Portanto:
`yum install samba`
imagem do computador.
Podemos dizer isso para o Samba, especificando qual o grupo de trabalho do

compartilhamento.
Mas temos que configurar esse grupo de trabalho em todas as pastas que forem
compartilhadas?
Não, esses tipos de configurações globais podemos configurá-las uma única vez. Para
isso abrimos uma seção global (`[global]`).
Neste caso, o nome do grupo de trabalho será o caminho do servidor no domínio:
sql
Como as máquinas Windows saberão quem é o servidor rede? Ele precisa de um nome
certo?
O Windows utiliza uma [**API**] chamada [**NetBIOS**] para nomear as máquinas em

sua rede. Como queremos dizer o nome do servidor, podemos usar o `netbios name`:
sql
Acabamos nossas configurações globais. Hum… mas ainda não especificamos qual será o
compartilhamento… Como podemos fazer isso?
Para especificar o compartilhamento, basta abrir outra seção, como abrimos em

`[global]` , só que agora com o nome do compartilhamento.
No meu caso, eu quero compartilhar a pasta pública, logo, vou chamar meu
compartilhamento assim.
sql
Mas não basta dizer qual o nome do compartilhamento, temos que dizer onde o
diretório compartilhado se encontra no servidor. Ou seja, precisamos dizer o
caminho (`path`) até a pasta.
Neste caso, a pasta se chama `publica`, e está dentro de outra pasta chamada
`compartilhamento`:
sql
E como o computador Windows conseguirá achar essa pasta? Precisamos falar que esse
diretório poderá ser encontrado (`browseable`):
sql
O sócio da empresa precisa salvar e alterar alguns arquivos que estão contidos
nesta pasta. Logo ela precisa escrever (`writable`) essas mudanças, isto é, salvá-
las de fato.
Ou seja, se ela consegue escrever essas informações, o diretório não é apenas para
a leitura dos arquivos (`read only`).
sql
Configurações terminadas! Mas como o Samba vai saber que esta é a configuração para
ser utilizada?
Nós podemos reiniciar o serviços que fazem parte do Samba, dessa forma ele já passa
a usar a nossa configuração. O Samba usa dois serviços para realizar o
compartilhamento. Um já vimos, é o **smb**, o outro é chamado de **[nmb]**.
O nmb é o serviço que entende as requisições feitas pela API NetBIOS.
Então vamos falar para o sistema (`systemctl`) reiniciar (`restart`) esses dois
serviços (`smb.service` e `nmb.service`):
**`systemctl restart smb.service`**
**`systemctl restart nmb.service`**
imagem, que será permanente (`--permanent`) na zona pública (`--zone=public`) que

adiciona o serviço do Samba (–add-service=samba):
**`firewall-cmd --permanent --zone=public --add-service=samba`**
Feito isso, temos que reiniciar nosso firewall:

**`firewall-cmd --reload`**
imagem:
`\\192.168.0.10`
imagem , do nosso serviço do tipo (`-t`) compartilhamento utilizando o Samba

(`samba_share_t`) na nossa pasta pública (`/compartilhamento/publica`):
`chcon -t samba_share_t /compartilhamento/publica`
imagem, poderá receber membros fora do domínio, desde que estejam autenticados.
Bem para isso podemos usar a opção `Bad User`:
sql
A opção `Bad User` permite que um usuário acesse o compartilhamento depois de

realizar uma autenticação.
Mas como o Samba realizará essa autenticação?
Nós podemos adicionar esse novo usuário no sistema e no Samba. Assim, quando o
Samba exigir uma autenticação esse novo usuário poderá ser usado.
Vamos adicionar esse novo usuário no sistema (àdduser`). No meu caso, vou chamá-lo
de **user**.
àdduser user`
imagem ele adiciona um novo usuário já cadastrado no sistema.
Assim, podemos adicionar o usuário que acabamos de inserir.
`smbpasswd -a user`
imagem com o parâmetro `-l` (lista longa).
`ls -l /compartilhamento`
imagem, as demais nos mostram as permissões. Essas são divididas em três partes, as
do usuário dono, as do grupo dono e as dos demais usuários.
Cada letra significa um tipo de permissão:
- **r** → Leitura (read);

- **w →** Escrita (write);
- **x →** Execução (execute).
Caso não tenha essa permissão é apresentado como um traço (`-`) no lugar da letra.
Se analisarmos essas informações vamos perceber que nem o grupo dono do arquivo, ou
os demais usuários conseguem escrever na pasta, isto é, criar diretórios ou
arquivos. Para resolver esse problema, podemos utilizar um programa chamado
**`chmod`(change mode)**.
Com esse programa, podemos falar que o usuário dono tem todas as permissões,
escrever, ler e executar (u=rwx), o mesmo para o grupo dono (`g=rwx`) e para os
outros usuários. (ò=rwx`):
imagem para todos os usuários, até a usuários desconhecidos no sistema. Por isso,
por questões de segurança esse tipo de configurações devem ser evitadas.
Neste caso, nós utilizamos o `chmod` com suas opções simbólicas (`rwx`), porém
poderíamos ter utilizado o modo octal (`0`, `1`, `2`, `4`).
Para evitar esse tipo de configuração, pode-se criar um grupo e colocá-lo como
grupo dono da pasta compartilhada.
Esse exemplo é apenas um simples exemplo de compartilhamento. Podemos fazer muito

mais como:
- Restringir o acesso a um diretório ou arquivo a um usuário ou grupo de usuários

específicos;
- Criar pastas únicas para cada usuário no sistema;
- Bloquear alguns tipos de arquivos de serem salvos no sistema.
Além de compartilhar arquivos e diretórios, o Samba consegue fazer o papel de

[**Active Directory**] nas redes Windows.
Veja que realizamos essa configuração como superusuário (**root**), logo, cuidado!
Neste caso, nossa pasta está apenas no servidor, porém conseguimos sincronizá-la
com algum serviço na nuvem. Dessa forma podemos sempre acessar seus arquivos, ou
pela rede local, ou pela nuvem.
## Compartilhando com todos os sistemas
Nosso problema era o compartilhamento de arquivos entre diferentes sistemas

operacionais (Windows e Linux). Entendendo que o problema são os diferentes
protocolos usados por esses sistemas, encontramos como solução o Samba.
Com ele conseguimos compartilhar arquivos e diretórios, além de impressoras. Isso

porque o Samba utiliza o protocolo SMB para realizar o compartilhamento. Dessa
forma, as máquinas Windows conseguem acessar os diretórios compartilhados no Linux.
Gosta de administração de servidores? Essa é uma parte muito importante se você

quiser trabalhar como DevOps. Aqui na Alura temos uma [**formação DevOps**]. Nela
você aprenderá sobre Linux, Git, Vagrant, entrega contínua e sobre cloud com a
Amazon EC2.
imagem
Nos dias de hoje é cada vez mais comum vermos brasileiros morando e trabalhando no
exterior. Essa emigração pode ter diversas razões, como intercâmbio para aprender
uma língua, ser enviado pela empresa, ou mesmo simplesmente o desejo de viver novas
experiências.
Porém, ao começar a pensar sobre isso é comum surgirem muitas dúvidas: "**Como
criar o meu currículo?**", "**Quais idiomas precisarei saber?**", "**Vale a pena
morar fora?**", entre outras. Neste artigo vamos dar cinco dicas (e mais uma bonus)
que certamente te ajudarão muito nesse processo.
# 1 - Saiba muito bem porquê você quer ir

É comum ouvir histórias de brasileiros que se mudaram para um outro país e não
muito tempo depois voltaram ao Brasil decepcionados.
Para que isso não ocorra com você, **é essencial entender bem as razões que te
fizeram tomar essa decisão**.
Seria melhores oportunidades de trabalho para você? Vale ponderar que você vai
estar longe de boa parte da sua família e amigos. Seria o desejo de adquirir um
novo idioma? Considere também as dificuldades que o fato de não saber se comunicar
muito bem pode trazer. Tudo isso tem que estar muito claro para você.
Algo que ajuda nesse processo é fazer uma listinha dos pontos positivos e
negativos, e analisá-los profundamente um a um. Se no final dessa análise você
ainda achar que vale a pena, será menor a probabilidade de que você se decepcione
ao encontrar essas dificuldades.
# 2 - Pesquise o máximo possível sobre o país de destino
Hoje em dia é fácil diminuir consideravelmente as surpresas negativas que um país

novo pode oferecer. Existem milhares de sites, blogs e canais de Youtube de
**brasileiros que já saíram do país no passado** e hoje contam como é a vida no
país, dão dicas de como lidar com a burocracia e facilitam muito a vida dos futuros
expats.
Está pensando em ir pra Irlanda? O site [E-Dublin] tem todas as dicas que você
precisa.
Quer morar na Holanda? O site [Ducs Amsterdam] vai te ajudar a se preparar para
essa aventura.
Assim como todos os outros que você pode encontrar por aí. Largue essa preguiça e
pesquise bastante, assim a sua vida será muito mais fácil ao chegar no novo país.
# 3 - Aprenda pelo menos um pouco do idioma antes de ir
Todos sabem que, em muitos casos, o inglês funciona internacionalmente como a

língua franca dos negócios. Por isso, **é essencial [aprender inglês] a um bom
nível para ter uma boa posição no exterior**.
Porém, se o seu destino for um país cuja língua oficial não seja o inglês, vale
muito a pena aprender também o idioma local, seja para tornar o seu currículo mais
atrativo para recrutadores de lá, seja para ter menos dificuldades ao chegar no
novo país.
Isso é algo que também vale bastante a pena pesquisar antes de se jogar de cabeça
em uma aventura tão grande. Existem países como a Holanda, Suécia, Finlândia ou
Singapura nos quais o inglês pode bastar para interações do dia a dia em
restaurantes ou escritórios governamentais; porém, em lugares como Espanha, Itália,
França ou Alemanha, isso muitas vezes não se aplicará. Por isso, a recomendação é
**aprender pelo menos o básico do idioma do país** antes de chegar ao mesmo.
# 4 - Pesquise sobre o mercado de trabalho na sua área no país
Além de pesquisar sobre a parte burocrática e cultural do país, conforme mencionado

no ponto #2, é muito importante também buscar mais sobre como funciona o mercado na
sua área por lá.
Existem países que estão saturados com determinados profissionais; já em outros

existe escassez desses mesmos - um exemplo são profissionais TI e programadores,
que são escassos na maioria dos países ao redor do mundo, mas não na Finlândia.
Em outro exemplo, existem países nos quais o mercado está aquecido para tecnologias
como Java; já outros que, no geral, buscam mais [programadores Python].
O podcast [Carreira Sem Fronteiras] é uma excelente fonte para buscar mais sobre
isso, que toda semana **entrevista brasileiros que foram tentar a vida profissional
em diferentes países ao redor do mundo**.
Existem outros sites que também dão dicas específicas, como o [Skills Panorama] da
União Europeia, que destaca os setores que possuem maior escassez de profissionais
ao redor da Europa.
# 5 - Otimize o seu currículo
Depois de pesquisar mais sobre todos os pontos acima, vai faltar a coisa mais
importante: criar o seu novo currículo.
Se você estiver aplicando para uma vaga em uma empresa internacional, é comum que
você tenha que **criar um currículo em inglês**. A Alura tem um curso fantástico de
[como criar o seu currículo em inglês] para se aplicar a vagas no exterior - que
também vai te ensinar como se comportar durante o processo, como funcionam as
entrevistas, além de outros fatores que irão te ajudar nessa meta.
Outra coisa importantíssima e normalmente requerida é a famosa **Cover Letter**.

Não sabe o que é? Esse artigo explica para que serve e [como criar a sua própria
cover letter em inglês].
Vale também ressaltar que, em determinados países, um currículo e cover letter na

língua dos mesmos será necessário. Todos esses dados ficarão mais claros depois da
sua pesquisa sobre o mercado, mencionada anteriormente.
# Dica bônus - Conheça e demonstre interesse pela empresa
Não basta fazer tudo acima e simplesmente enviar currículos a esmo. Uma dica de
ouro é **pesquisar também um pouco mais a fundo sobre as empresas para as quais
você se aplicar**. Onde ficam os escritórios da empresa? Que tecnologias usam? Qual
é a cultura da mesma?
Isso é algo que pode ser usado ao seu favor tanto na Cover Letter quanto em uma
entrevista com seus futuros chefes, que certamente ficarão deliciados em conversar
com um candidato que sabe do que está falando e conhece as tecnologias e cultura
vigentes na empresa.
# Conclusão
Sair do país é definitivamente um grande desafio para qualquer pessoa. Porém, com
essas dicas visamos tornar esse processo de procura de emprego e de adaptação ao
novo país mais fáceis para você que se interessa por isso.
Boa sorte na sua busca! :)
imagem
Estou com um cliente novo na minha empresa e iremos editar seus vídeos para serem
publicados no Youtube. O pedido dele é que o resultado final do vídeo tenha entre 5
a 7 minutos no máximo.
Este foram os arquivos brutos (sem edição alguma) que recebemos e iremos utilizar
na edição:
imagem, realiza a sincronização de áudio, caso tenha um arquivo de áudio que foi
gravado separado do vídeo original, entre outras coisas.
Nosso primeiro passo é arrumar os dois arquivos de áudio (chamadas de track ou

faixa de áudio), **sincronizá-las**, e decidir qual iremos utilizar, pois as duas
são sobre o mesmo vídeo.
Mas uma foi gravado pela própria câmera (que normalmente não é muito boa, pois o
foco da câmera é a imagem) e a outra em um gravador de áudio específico, que tem
uma qualidade muito superior.
## Sincronizando os áudios do projeto
Agora que os arquivos já foram adicionados na timeline, conseguimos reparar que o

áudio que gravamos separados está um pouco atrasado do áudio original em relação ao
que foi gravado pela câmera:
<iframe src="https://streamable.com/s/4cc8x/eazstb" frameborder="0" width="100%"

height="100%" allowfullscreen
style="width:100%;height:100%;position:absolute;left:0px;top:0px;overflow:hidden;">
</iframe>
Elas estão fora de sincronia e, como só vamos utilizar a segunda faixa (que é o
áudio do gravador específico e, consequentemente, um áudio de melhor qualidade),
podemos sincronizar ambos áudios e, após isso, descartar o áudio original que não
será mais necessário.
Podemos utilizar uma funcionalidade já existente no Adobe Premiere, que é a opção

[**sincronizar**], uma ferramenta precisa e que funciona na maior parte das vezes.
> Mas tome cuidado, o recomendável para ter uma melhor apuração com essa
ferramenta, é utilizar no máximo duas faixas de áudio por vez para sincronizar.
Mais do que isso pode ocorrer falhas ou até mesmo não funcionar.
Para aplicar a sincronização, podemos selecionar as duas faixas e apertar com o

botão direito, escolher a opção de sincronizar. E o Premiere faz o trabalho para
gente.
<iframe src="https://giphy.com/embed/4cUCFvwICarHq" width="100%" height="100%"

style="position:absolute" frameborder="0" class="giphy-embed"
allowfullscreen></iframe>
[via GIPHY]
Agora temos ambos áudios sincronizados com os vídeos:
imagem e arrastar para a layer de cima e tirar esse espaço em branco, facilitando
na hora de visualizar com o que estamos trabalhando.
imagem com a ferramenta de corte **C** selecionada. O mesmo vale para selecionar
mais de um pedaço que foi recortado. Com a ferramenta de seleção **V** , segura o
**CTRL** e selecione os pedaços que quiser.
Após fazer todo esse recorte e selecionar as partes em branco, podemos dar um
**DELETE** .
Mas ficaram vários espaços em branco….E agora?!
imagem. Ou simplesmente clicar na parte vazia e dar um **delete** .
Podemos fazer isso para todo o restante do arquivo.
> Mas ainda há espaços "em brancos", pedaços que não contém nenhum conteúdo
relevante, que podem ser retirados, por que não fizemos isso?
imagem
E se você tiver interesse em aprender ainda mais sobre os [**processos de edição de

um vídeo**], com o pacote Adobe (After Effects, Premiere), você pode aprender com
os cursos da Alura!
imagem
Recentemente eu desenvolvi uma aplicação para descobrir qual seria o novo salário
de um funcionário baseado na porcentagem de aumento que ele recebeu.
js
A resposta para o novo salário foi `3001500`! Esse resultado aconteceu porque os
dados vieram de um formulário HTML e, em razão disso, a variável `salario` é uma
**string**.
Apesar de o JavaScript ser uma linguagem fracamente tipada e conseguir fazer

operações de subtração, divisão e multiplicação envolvendo strings, ele não entende
uma operação de soma envolvendo strings. O que ele faz é **concatenar**, ou seja
ele junta essas duas strings.
## As funções parseInt() e parseFloat()
Para que a lógica da aplicação funcione, a variável `salario` precisa ser

transformada em um número.
Em JavaScript temos uma função chamada **parseInt()**, que vai, em outras palavras,
analisar a string e retornar um número inteiro. Agora, com o uso da função, o
código da aplicação ficou assim:
js
Como cálculos envolvendo salário geralmente utilizam representação de pontos

flutuantes, isto é, contém casas decimais, podemos utilizar a função
**parseFloat()** que vai justamente analisar a string e retornar um número com
representação decimal, ou seja, com ponto flutuante.
js
## Conclusão
Podemos perceber que dependendo do tipo de entrada que a função recebe ela pode
mudar de comportamento e afetar a nossa lógica dentro do sistema.
Tendo em vista que em algumas vezes iremos capturar dados dos usuários para
realizar alguma operação de adição, temos que lembrar que em muitas dessas vezes
esses inputs virão em formato de string.
Portanto, para não correr o risco de acabar concatenando esses dados ao invés de
realizar uma soma, é sempre importante lembrar de utilizar as funções `parseInt()`
ou `parseFloat()` dependendo do tipo de número que será utilizado para realizar as
operações.
Se ficou interessado em como o JavaScript funciona e como você pode utilizá-lo

melhor, aqui na Alura temos uma [**formação em desenvolvimento JavaScript**]. Nela,
você verá como programar em JavaScript, utilizar expressões regulares, entre outras
coisas.
Estou desenvolvendo um app para cadastrar todos os cursos do Alura que eu fiz ou
estou fazendo, para que eu possa verificar quais são os cursos que eu já terminei
ou se ainda precisa finalizar. Então inicialmente eu criei uma classe para
representar meus cursos:
java
E um **ÈNUM`** pra representar o estado atual do curso, ou seja, se ele está

finalizado ou se está sendo feito:
java
## Adicionando a ListView no layout
Como fazemos para criar a nossa tela? Precisamos criar um **`XML`** para
representá-la, certo? Então vamos criar esse `XML` na pasta `res/layout` com o nome
àctivity_lista_de_cursos.xml`:
xml
Muito bom, temos o nosso **layout**, porém precisamos associar esse layout a uma
**activity**, como podemos fazer isso?
Bom, primeiro nós precisamos de uma activity, então vamos criar a

`ListaDeCursosActivity` que estende a classe Àctivity` ou uma de suas filhas,
nesse caso, usarei a classe ÀppCompatActivity` por questão de compatibilidade:
java
## Buscando a referência da lista
Agora que temos a nossa activity, podemos implementar o método ònCreate()` que irá
**settar** o nosso layout e vai pegar a referência da `ListView`:
java
Settamos o nosso layout e pegamos a referência para a nossa `ListView` e agora nós
precisamos pegar a nossa lista de cursos:
java
Temos a nossa `List` e a nossa `ListView`, porém, não existe um método da classe
`ListView` capaz de adicionar uma `List`, uma pena... E agora? O que podemos fazer?
## Criando o Adapter da lista
No **Android**, existe um especialista em lidar com listas chamado **adapter** e,

para nossa felicidade, a `ListView` consegue adicionar esse adapter! E como podemos
criar um adapter? Por meio da **classe ÀrrayAdapter`**:
java
Ops, há um detalhe na instância do ÀrrayAdapter`, todos os construtores dele

exigem pelo menos um **`Context`** que será a nossa activity e um ìnt` que será o
recurso que representará cada item da lista.
### Inserindo um layout simples para cada item da lista
O Android disponibiliza para nós alguns recursos para utilizarmos, nesse caso,
utilizaremos o recurso àndroid.R.layout.simple_list_item_1` que é uma
representação bem básica para cada item da lista:
java
## Adicionando o Adapter da ListView
Certo, instanciamos o nosso ÀrrayAdapter` só que ainda não informamos em momento

algum que queremos que ele adapte a nossa lista de cursos! Como podemos passar a
nossa lista para ele?
O ÀrrayAdapter` possui diversos construtores e, para a nossa alegria, um deles

recebe uma `List` que é justamente o que precisamos:
java
Certo, criamos nosso adapter, o que precisamos fazer agora? De alguma forma, nós
precisamos fazer com o que a nossa `ListView` utilize esse adapter, mas como
podemos fazer isso?
Sabemos que a classse `ListView` não é capaz de adicionar uma `List`, porém ela
pode settar um adapter por meio do método `setAdapter()`:
java
Vamos testar a nossa app:
imagem`**?
Vamos então implementar o nosso `toString()` para que seja impresso as informações
de um curso:
java
Agora se testamos a nossa app novamente:
imagem
## Resumo
Vimos que, para criarmos uma lista no android nós precisamos definir uma `ListView`
no nosso `XML` que representará a nossa tela e referenciá-la na nossa activity.
Além disso, vimos que apenas a `ListView` não é o suficiente para que possamos
adicionarmos a nossa `List` e por isso precisamos de um adapter que é especialista
em lidar com `List` e informar para a `ListView` quais serão os valores de cada
item da lista.
Vimos também que, quando passamos uma lista de objetos nossos, como por exemplo a
classe `Curso`, por padrão será impresso o próprio objeto, ou seja, o `toString()`
padrão e, se quisermos uma informação diferente, precisamos implementá-lo de acordo
com a nossa necessidade.
## Código fonte
Caso tiver dúvidas ou simplesmente quiser consultar o código fonte do projeto

utilizado como exemplo, fique à vontade de dar uma olhada no [**github**].
Quer aprender mais sobre Android? Que tal dar uma olhada na [**formação de
Android**]? Neles ensinamos desde os conceitos mais básicos a avançados para que
você construa a sua primeira App e inicie sua carreira como desenvolvedor Android!
Provavelmente não, mas saiba que houve um tempo em que isso acontecia. No lugar de
notebooks e smartphones, as pessoas usavam enormes computadores e pen-drives do
tamanho de um mouse pad. **O avanço tecnológico mudou a maneira como nós nos
relacionamos com a tecnologia.**
Vivemos na era mobile e esse novo tempo transformou a experiência que cada uma das
pessoas tem com as marcas e os produtos. O e-commerce que funcionava corretamente
em um desktop, talvez já não seja mais capaz de ser acessado perfeitamente por meio
de um dispositivo móvel, como o smartphone e o tablet.
A experiência do consumidor ao usar produtos e serviços mudou e é por isso que

precisamos conversar sobre design e UX.
Vamos juntos saber mais sobre essa relação?
## 1\. O papel do UX para o consumidor
UX é uma sigla, em inglês, que significa User Experience (experiência do usuário,

em português). Trata-se da experiência que cada consumidor tem ao usar produtos e
serviços. O papel do UX, no contexto da atualidade, é tão importante que até mesmo
os profissionais de marketing estão se esforçando para entender o seu
funcionamento.
**Isso ocorre porque o UX está diretamente relacionado tanto com as questões

funcionais e práticas quanto o lado emocional da experiência.**
Antigamente, na hora de colocar um site na internet, os designers pensavam naquelas

pessoas que precisavam sentar na frente de um computador, com mouse e teclado. A
partir do momento em que a população passou a acessar conteúdo por meio de
smartphones e tablets, esse pensamento mudou. Ao desplugar o usuário da frente do
computador, o contexto passa a ser outro.
Agora, mais do que nunca, precisamos fazer alguns questionamentos em relação a quem
está do outro lado da tela:
- Quem é essa pessoa?

- O que ela quer?
- Será que ela conseguiu resolver o problema dela?
- Se ela não resolveu, será que o problema está na navegação do site?
- Como foi a experiência de compra dela?
- Ela usaria o produto ou serviço novamente?
- Onde ela se encontra?
- Ela tem tempo para procurar bastante no site?
A experiência do usuário pode, muitas vezes, ser a diferença entre o sucesso e o

fracasso do seu projeto. Na era mobile, além de considerar os questionamentos
feitos acima, é necessário levar em conta todas as tecnologias que ajudam o usuário
a ter uma experiência melhor.
**Estamos nos referindo a pontos como geolocalização, acelerômetro, bluetooth,

câmera e até notificações. O contexto entre a tecnologia e as informações de cada
usuário leva você a criar boas experiências.**
Imagine-se em casa, deitado no sofá e com uma tremenda vontade de comer uma pizza.
Você provavelmente vai pegar o smartphone, abrir algum aplicativo de delivery e
selecionar a pizzaria que mais prendeu sua atenção. Ao efetuar o pagamento e o
estabelecimento realizar a entrega da pizza, sua necessidade foi suprida. A partir
do momento em que a situação é diferente, sua necessidade passa a ser outra também.
Agora imagine-se na rua, dirigindo e com uma tremenda vontade de comer pizza. Ao
invés de efetuar o pedido pelo smartphone, sua necessidade passa a ser a de
encontrar o endereço da pizzaria.
Você busca no Google e encontra o site do estabelecimento, mas percebe que ele está
em Flash, uma tecnologia antiga que não funciona nos navegadores dos smartphones e
tablets. Nós sabemos que será impossível acessá-lo a partir do seu smartphone,
portanto a sua necessidade não foi suprida. Percebeu a diferença?
Se, atualmente, há uma gama maior de dispositivos que acessam sites na internet,
por que não há também uma gama maior de otimização para que cada um deles seja
visto da maneira correta? Isso significa que um site que pode ser acessado por um
smartphone precisa estar otimizado para mobile. Entre outras coisas, esse site
precisa carregar muito rápido e estar de acordo com a média de velocidade de um
telefone celular.
Coloque-se no lugar do consumidor. Você teria a paciência de esperar longos

segundos (até minutos) para que uma página carregue no seu smartphone apenas para
ver as ofertas de uma loja virtual? Com certeza não!
Os consumidores, assim como você, preferem comprar produtos em lojas online que são
fáceis de acessar, de navegar. Ao invés de mais problemas, como esperar, os
consumidores desejam soluções que entendam o contexto no qual estão inseridos.
Enquanto uma marca ainda insiste em não se modernizar, suas concorrentes aproveitam
a brecha para crescerem cada vez mais. Antes, para encontrar um concorrente, o
consumidor precisava ir atrás, sair de casa e até pedir indicações para amigos.
Hoje basta dar um ou dois cliques no mouse. O UX design significa o meio mais fácil
que o cliente tem à disposição para simplificar seu dia e resolver problemas.
## 2\. Diferenças entre UI e UX design
É muito comum confundir UI com UX design. A incrível quantidade de nomenclaturas e

termos existentes atualmente para definir as áreas que compõem o design, faz com
que tenhamos certa dificuldade na hora de determinar cada coisa.
Em primeiro lugar, precisamos frisar que sim, existem diferenças entre os dois. Em
segundo lugar, é importante ressaltar que eles se complementam. Por fim, em
terceiro lugar, eles são fundamentais para um bom design.
### O que é UI design?
UI design, também conhecido como User Interface design, é um termo em inglês que
significa Design de Interface de Usuário. Esse design é o meio pelo qual o
consumidor ou o usuário interage e controla um software, um aplicativo ou até mesmo
um dispositivo. O controle pode ser feito por meio de botões, menus e qualquer
outro elemento que permita a interação entre o usuário e o software, o aplicativo
ou dispositivo.
O projeto que tem como base um bom UI design consegue antecipar as necessidades do
usuário, garantindo que a interface contenha todos os elementos que forneçam um
acesso fácil e uma utilização intuitiva.
É o que conhecemos como user-friendly, ou seja, uma experiência amigável e que não
cause frustração ao usuário. Lembra do exemplo do site da pizzaria em flash? É
isso! Se ele fosse mobile, com botões grandes e fáceis de identificar, seria user-
friendly.
### Mais sobre a diferença entre eles
A experiência do usuário é uma forma de englobar todos os aspectos que envolvem a

interação dele com uma empresa, marca, produto ou serviço. Ela é a responsável por
buscar e fornecer as melhores maneiras de atender as necessidades desse usuário,
deixando-o satisfeito com todos os processos.
Uma verdadeira experiência do usuário vai além do fornecimento do que os clientes

dizem querer. Ela deve proporcionar também o sentimento de realização.
Isso significa que, por meio da experiência do usuário, o consumidor deve se sentir
feliz, contente por ter conseguido adquirir um produto ou serviço. Por isso que é
necessário que o designer estude e avalie o comportamento dos usuários em relação a
um sistema, site ou aplicativo.
Ele precisa levar em consideração uma série de aspectos, como a facilidade de uso,
a percepção de valor em relação ao ambiente em que se está navegando, a utilidade,
a eficiência na execução das tarefas e todas as outras características que dão os
indícios necessários para que se encontre a melhor solução para os problemas dele.
## 3\. Impactos na experiência do usuário
Conforme vimos anteriormente, o [**UX design**] revoluciona a maneira como os

consumidores são impactados por qualquer meio ou peça de comunicação.
Antigamente, a agência de comunicação era a responsável por determinar os rumos da

criação, com base em seus estudos, crenças e experiência. Além disso, o cliente
tinha um poder de decisão muito forte, direcionando as peças e o meio para aquilo
que ele acreditava ser o melhor.
O cenário, agora, é outro, ok? Agências de comunicação, profissionais e clientes

que ainda têm esse pensamento atrasado, precisam urgentemente de uma reciclagem de
ideias. A evolução das metodologias e dos materiais de comunicação foi
imprescindível.
Hoje, existem consumidores conectados que buscam por simplicidade, produtos e

soluções personalizadas, rapidez e respostas que rompem as barreiras da
globalização.
Esses usuários conectados fizeram com que o design passasse por uma transformação,
precisando ganhar:
- [estratégias omnichannel];
- sites otimizados para diferentes dispositivos;
- conteúdo que resolva problemas; e
- capacidade de medir resultados.
Os quatro pontos listados acima significam uma melhoria na experiência dos

usuários. Quando eles obtêm uma experiência positiva, o resultado pode ser um
grande impulso nas vendas. O raciocínio é simples: em uma loja física, você se
sente à vontade para adquirir produtos que estão trancados em vitrines ao mesmo
tempo em que nenhum vendedor se encontra por perto para lhe ajudar?
### A mesma linguagem
Você explicaria para uma senhora de 70 anos como funciona o aplicativo Instagram da
mesma maneira que faria com o seu colega de classe? Não, né?! O primeiro impacto do
UX design se dá quando a sua proposta de comunicação fala a mesma linguagem que o
seu público-alvo utiliza. É dessa forma que você passa a conhecê-lo melhor e
descobre quais são os seus problemas e necessidades.
### Estratégia digital
A partir do momento em que você conhece o seu target e sabe quais são os seus
problemas e necessidades, torna-se possível criar uma estratégia digital. Quais são
os objetivos do negócio para o qual você está trabalhando? Quais são as ferramentas
que você tem disponíveis para alcançar esses objetivos? Qual será a metodologia
mais adequada para tornar isso possível? Basta unir as respostas deste e do tópico
anterior para dar início a sua estratégia.
### Arquitetura da informação
Por meio da arquitetura da informação, que é a responsável por estruturar,

organizar e classificar todos os elementos que fazem parte de uma peça de
comunicação, é possível direcionar sua estratégia digital para o sucesso. O foco,
aqui, deixa de ser somente o layout e passa a ser na experiência que os usuários
terão. Para isso, vale a pena colocar em prática uma série de testes A/B. Por eles,
é possível identificar falhas e acertos.
### Design que promove a confiança
Quando o layout é concreto, limpo e claro, ele transmite confiança ao usuário.

Existe uma pequena diferença que separa o layout que serve como apoio para chamar a
atenção do consumidor daquele que serve como distração. O esquema visual, a paleta
de cores, o menu de navegação, as imagens e o correto posicionamento dos call-to-
actions são fatores decisivos para que o usuário consiga navegar e se interessar
pela informação que está sendo oferecida.
## 4\. Importância do UX design para os negócios
Aprendemos, até aqui, que uma boa experiência serve para deixar as pessoas mais
felizes, satisfeitas e motivadas para comprar mais. O UX Design ajuda no dia a dia
dos negócios, fazendo com que as empresas faturem e lucrem mais, entregando com
sucesso suas soluções, serviços e produtos para os consumidores. Os clientes
precisam de soluções inteligentes e, ao mesmo tempo, experiências memoráveis.
Há quem encare o UX como um gasto, possível apenas para grandes corporações. Esse
tipo de pensamento é equivocado. O UX deve ser visto como um investimento.
Independentemente do tamanho de um negócio, o UX design tem a capacidade de levá-lo
ao sucesso. Trata-se do momento em que o retorno de investimento (ROI) se faz
presente. A ideia de que o design entra apenas como a camada final do processo se
foi.
### Por que citamos aqui o ROI?
Em 2002, Aaron Marcus, diretor da revista User Experience, publicou [um artigo]
falando sobre o ROI para a usabilidade do design da interface do usuário. Nele, o
autor aponta quais são os tipos de retorno em cima do investimento que é feito em
projetos que envolvam usabilidade e UX.
Veja quais são os indicadores de ROI interno:
- aumento na produtividade dos usuários;

- diminuição na quantidade e frequência de erros entre os usuários;
- diminuição do valor destinado para treinamentos;
- economia de dinheiro com alterações que evitam erros; e
- diminuição do valor destinado para suporte a clientes e usuários.
Ele também apontou os indicadores de ROI externo. São eles:
- aumento no total de vendas;

- redução de custos entre equipes de suporte e serviço de atendimento ao cliente;
- aumento na vida útil do produto; e
- redução do valor destinado para treinamentos de vendedores externos e
implementação de sistemas.
Note que a palavra redução é citada algumas vezes entre esses indicadores. Essa
economia de dinheiro significa mais verba no bolso do cliente, ou seja, ele tem
como investir em outros pontos que, dependendo de sua situação, acabam sendo
menosprezados. Conseguir gastar menos e ao mesmo tempo oferecer uma excelente
experiência aos usuários é o sonho de qualquer dono de empresa. Só resta dar o
primeiro passo dessa iniciativa.
Quando falamos sobre UX, estamos pensando em modos sobre como satisfazer as
necessidades dos consumidores de uma forma agradável e, ao mesmo tempo, fluida. As
metodologias que dão corpo ao UX design conseguem aumentar o grau de assertividade
das soluções que uma companhia oferece. Para que você entenda a importância do UX
design nos negócios, coloque-se no lugar do empreendedor.
A partir deste momento, você é o diretor de uma empresa e tem a necessidade de

inaugurar o site que servirá de base para a comemoração dos 10 anos de sua
companhia. Você contrata profissionais, ou uma agência, gasta uma grande quantidade
de dinheiro e leva bastante tempo estruturando a ideia.
Quando o site está finalizado e vai ao ar, a quantidade de vendas despenca. Apesar
de tecnicamente incrível, você descobre que ele não está perfeito aos olhos dos
clientes. Você sabe o que significa isso? Um provável problema de usabilidade.
Talvez, em algum momento, você e sua equipe tenham ignorado o contexto dos usuários
que compram seus produtos e serviços. Os feedbacks e as reclamações começam a
chegar e você não entende, afinal, o site está incrivelmente perfeito!
Tempo e dinheiro são destinados para corrigir a rota, explicando aos usuários como
ocorre a navegação no site de sua empresa. Os desenvolvedores e a equipe de design
precisam de mais verba para corrigir a rota traçada e reconstruir os pontos que
estão gerando entrave.
Você notou como o jeito certo de se começar impacta diretamente na quantidade de

verba que será gasta e no tempo levado para colocar um projeto no ar?
Vamos para outro exemplo. Ao comprar um smartphone, você costuma ler o manual do
aparelho antes de ligar?
Aposto que não! Os aparelhos fabricados e vendidos atualmente são tão fáceis de
mexer que dispensam o manual do usuário que, diga-se de passagem, se transformou em
um folheto chamado “Guia de Início Rápido”, apresentando basicamente as portas de
conexão e a localização dos botões de cada telefone.
A facilidade em pegar um dispositivo novo na mão e sair mexendo significa que ele é
intuitivo. Quando algo precisa de treinamento ou manual, isso significa que as
chances de ele ser difícil e pouco intuitivo são grandes. Implementação,
treinamento e criação de sistemas que fazem o papel de um manual significa gasto de
dinheiro. É nesse ponto que o UX design também ajuda o empreendedor.
Alguns sites são tão complicados de se navegar que é preciso recorrer a tutorais na
internet! Muitos empresários enxergam isso como uma mentira e alegam que “saber” é
um dever do consumidor. Saiba que não é. A culpa pela falta de empatia com a
navegação de um site, de um sistema ou de um aplicativo é, na maioria absoluta das
vezes, da falta de uma boa experiência do usuário, ou seja, de quem fez.
O mesmo ocorre com os produtos. Já notou que alguns se vendem praticamente

sozinhos? O UX design tem o poder de fazer uma validação social do produto ou
serviço que o empreendedor tem. É algo tão positivo que aumenta a recomendação boca
a boca, facilita a rotina dos vendedores e aumenta as vendas. Trata-se de uma
[oportunidade única] para que essa marca consiga aumentar seu potencial de crescer
diante do público.
## 5\. Tendências do UX design
Depois dos avanços significativos que o UX design teve nos últimos anos, em que
pequenas e grandes empresas apostaram na melhoria da qualidade da experiência de
seus usuários com foco em fidelização e satisfação, chegamos a 2017 com ainda mais
foco no usuário. Para que você, designer, saiba os pontos importantes desse avanço
contínuo, listamos abaixo [as tendências do UX design].
### UX design como parte fundamental do produto
A constante evolução tecnológica e o avanço das ferramentas de pesquisa que nos

permitem conhecer cada vez mais os usuários fazem com que o UX design deixe de ser
somente uma forma de melhorar seu produto ou serviço. Agora ele faz parte dele! A
melhora da experiência do usuário passa a se dar desde o primeiro contato do
cliente com a marca. Presente desde o projeto inicial, agora o UX o acompanhará por
toda sua vida útil.
### Interface com cards, scrolling e parallax
Ao clicar para saber mais sobre um produto, o consumidor pode ter acesso ao
[**card**]. Nele, informações mais detalhadas podem aparecer para que a leitura e a
identificação do produto sejam mais precisas. Já o [**scrolling**].
Quando o site fica concentrado em uma só janela, permanecerá neste ano por causa do
aumento do conteúdo produzido em vídeo. Por fim, o [**parallax**] trará mais
inteligência às interfaces, deixando-as mais atrativas e dinâmicas. Esses recursos,
quando bem implementados, se transformam em um forte elemento visual.
### Microinterações
As microinterações são interações diretamente com a interface. Elas são

responsáveis em resolver tarefas simples e únicas: curtir uma rede social,
responder uma enquete ou abrir uma galeria de fotos. Esta é uma tendência de UX
Design, pois as animações e gestos mais humanizados, como as reações dos status do
Facebook, fazem com que as interações ocorram com uma frequência cada vez maior.
### Aumento do design responsivo
A massificação do smartphone resulta no aumento da necessidade de designs mais

responsivos. Ninguém mais tem paciência para visualizar, em uma tela de 5 ou 5,5
polegadas, a versão para desktop de um site. É horrível ter que dar zoom com a
ponta dos dedos e tentar acertar a mira em botões minúsculos.
### Tempo de carregamento cada vez menor
A presença do smartphone em nossas vidas gerou outra tendência no UX design: um

tempo de carregamento de páginas, sistemas e aplicativos cada vez menor. Além de um
melhor posicionamento nas buscas do Google, o tempo de carregamento impacta
diretamente na boa experiência do usuário. Quem, atualmente, tem tempo para ficar
esperando que uma página carregue completamente por alguns minutos?
### Imagens e vídeos com peso maior na entrega de conteúdo
Eternas aliadas do design visual, [**as imagens**] abriram caminho para outro tipo
de mídia: os vídeos. Com o aumento da velocidade de conexão à internet e uma maior
oferta de planos com muitos dados, os vídeos trarão uma experiência cada vez mais
dinâmica aos usuários. Eles ajudarão a transmitir a mensagem das marcas com mais
sucesso na entrega de conteúdo.
Ao longo deste texto, mostramos um panorama sobre a relação entre design e UX. Você
viu como ambos andam juntos em benefício da transformação e otimização da
experiência do usuário, tornando os processos mais eficientes para o consumidor.
Lançar-se no mercado de trabalho é uma etapa da vida recheada de desafios e no

[**ramo de design**] não é algo diferente. Porém, a trilha entre o início de
carreira e a tão sonhada estabilidade profissional pode ser mais curta e simples se
você tomar algumas atitudes. Nesse sentido, é interessante conhecer algumas
estratégias para ditar seu próprio trabalho e ser um excelente freelancer de
sucesso.
Portanto, se você quer investir nessa possibilidade, não perca este post! Continue
a leitura e descubra o passo a passo para se dar bem na profissão e garantir seu
espaço no mercado de trabalho. Preparado?
## 1\. Organize seu horário
Tudo bem que um freelancer geralmente não tem um horário fixo de trabalho, tem
flexibilidade com o tempo e pode até trabalhar em casa, usando chinelo e bermuda.
Mas isso não significa ele deve ter a agenda completamente desorganizada.
Para ter um bom resultado, é preciso se comprometer a trabalhar por um mínimo de

horas semanais. Você já tem o direito de fazer sua agenda, certo? Então, não há
desculpas para não cumpri-la.
**Se, por acaso, não tiver aparecido nenhum job para aquele período, não o trate
como horário de folga. Aproveite para caprichar na elaboração do seu portfólio ou
captar novos clientes. Você é o seu próprio patrão, mas se não for um chefe
exigente, os resultados provavelmente ficarão abaixo das suas expectativas.**
## 2\. Crie um portfólio atraente
E por falar em portfólio, você já tem um? Principalmente para atuar como design,
ele é completamente essencial. Lembre-se que seu trabalho é visual. Por mais que
consiga explicar os detalhes de um projeto, será muito mais fácil fechar um
contrato depois que o cliente visualizar o que você é capaz de fazer.
Procure elaborar layouts de estilos diferentes, pois existem mais chances de ele se

identificar com algum deles. Também crie [**harmonia entre as cores**] e abra
espaços para esboços e testes. Ah, e não se esqueça de se preparar para explicar
como cada uma dessas funcionalidades ajuda a converter visitantes em consumidores!
## 3\. Capacite-se para ser um freelancer de design
Obviamente, quem está começando ainda não tem todo o conhecimento esperado para a
área. Portanto, é fundamental investir em capacitação. Conhecer as melhores
técnicas e utilizar os programas mais eficientes podem ser diferenciais para o seu
trabalho. Esse cuidado é o que garante destaque no mercado e rende muitas propostas
de trabalho.
**Essa prática não vale apenas para o início da carreira. A área de informática
evolui rapidamente, e um profissional pode se tornar obsoleto em pouco tempo. Com
isso, ele perde espaço para seus concorrentes. Portanto, comece sua vida
profissional estudando e jamais entre na zona de conforto.**
A atualização pode vir através de cursos, mas também existem outros meios de se
manter antenado às técnicas e tendências do mercado: seguir designers bem sucedidos
em redes sociais, inscrever-se em blogs de tecnologia
## 4\. Tenha controle financeiro
Em alguns momentos, você terá muito trabalho e uma renda significativa. Mas é
provável que, também, passe por alguns períodos de menor procura. Isso é normal,
mesmo para um freelancer mais conceituado.
**Por isso, é importante ter um controle financeiro e não gastar todo o dinheiro
que chega nos períodos das “vacas gordas”. Faça uma previsão dos seus gastos
mensais, coloque uma margem maior e procure guardar o restante. Essa reserva vai
garantir o cumprimento de compromissos financeiros nas épocas de menor procura,
evitando as temidas dívidas.**
## 5\. Cobre o valor justo pelo seu trabalho
Já que tocamos no assunto do dinheiro, é importante cobrar um valor justo pelo seu
trabalho. Como iniciante, ele pode até ser menor (quando comparado ao valor cobrado
pelos profissionais mais experientes do mercado), mas nunca muito inferior à média
praticada.
Cobrar baratinho só para conseguir o job, além de não pagar suas contas e não
valorizar seu trabalho, é uma prática desleal em relação aos outros profissionais.
A tentação, quando ainda não surgem contratos, é a de falar sim para qualquer valor
mínimo, mas essa não é a forma mais eficiente de ser aceito e valorizado no
mercado.
## 6\. Adquira as ferramentas necessárias
Para fazer um bom trabalho, é importante ter as melhores [ferramentas] em mãos. Por
isso, não adianta tentar progredir sem investir em programas ou equipamentos
necessários.
**Antes de comprar algo, certifique-se de que aquela é a melhor possível — quanto a

qualidade ou a durabilidade do equipamento. Para isso, evite realizar compras por
impulso e baseie-se em avaliações.**
Nós já falamos que você deve se atualizar em outro tópico, certo? Então, diversos
blogs relacionados a tecnologia falam dessas ferramentas e produzem resenhas sobre
os equipamentos. Não é difícil encontrar descrições, configurações e materiais
recomendados.
Para acertar na escolha, compare essas avaliações e, se possível, procure

informações diretamente com quem usa a ferramenta em seu círculo profissional.
## 7\. Ouça o cliente
Antes de ter um projeto em mente, ouça o cliente e tente realmente entender suas
necessidades. Essa é a única forma de garantir a satisfação dele. Então, por mais
que suas ideias sejam incríveis, é importante não tentar forçar a barra para que o
cliente assuma algo que não tem interesse. Por isso, mesmo que o cliente queira
algo muito simples e o seu potencial permita fazer algo extraordinário, é a
satisfação dele que importa, ok?
## 8\. Legalize seu negócio
Por questões contábeis, várias empresas só contratam os profissionais que podem

oferecer uma nota fiscal. Por isso, não perca tempo e legalize o seu negócio. Um
CNPJ garante mais credibilidade, permite a emissão de notas fiscais. Hoje em dia é
muito fácil conseguir um registro como [Microempreendedor Individual (MEI)], por
exemplo.
## 9\. Forneça um atendimento impecável
Como freelancer de design, lembre-se que você é a sua empresa! Então, para encantar
o cliente, não basta desenvolver um trabalho maravilhoso. É preciso caprichar no
atendimento e em todas as etapas.
Desde o primeiro contato, da conversa inicial para conhecer as expectativas do

contratante, o fornecimento de um orçamento detalhado, esclarecimento de dúvidas
até a entrega do produto final, a experiência do cliente com você precisa ser
realmente satisfatória.
Seja acessível, responda às mensagens prontamente, ofereça soluções em curto prazo

e tenha paciência para lidar com o seu público — mesmo que às vezes tenha que
gerenciar situações complexas. Em algumas situações, o cliente procura suporte
mesmo que o serviço funcione bem. Você vai descobrir que, na verdade, atenção neste
ponto faz toda a diferença.
## 10\. Cumpra prazos
**Nunca é demais falar: você é a sua empresa! E sabe do que uma empresa precisa
diante do mercado? De credibilidade. Isso significa que você precisa cumprir o que
prometeu, seja na qualidade do serviço prestado ou no prazo que foi fixado para a
entrega. Então, não deixe o cliente esperando! Organize-se para realizar as tarefas
no tempo programado.**
Um ponto muito importante que precisa ser entendido é que o seu serviço pode ser
uma pequena parte de todo um projeto ou estratégia do cliente. Se você atrasar a
entrega, todo o processo dele fica comprometido. No mundo dos negócios, meu amigo,
atraso é prejuízo!
Aliás, se você conseguir surpreender o cliente e terminar o projeto antes da data,

será perfeito! Essa sim é uma quebra de prazo que vale a pena! Pode ter certeza que
vai ganhar muitos pontos e isso vai te render diversas indicações.
Quer ser um excelente freelancer de design? Então, coloque essas dicas em prática e
prepare-se para garantir bons resultados.
Mas sabe o que é mais legal disso tudo? Eles compartilharam conosco como foi a
experiência sobre o treinamento utilizando a nossa [plataforma]. Bacana, né? Então
vamos dar uma olhada e ver o que aconteceu durante todo esse processo! Bora lá :)
## O jogo
O pessoal que participou do treinamento da Alura se reuniu para bater um papo e

comer uma pizza. Para quebrar o gelo, eles fizeram uma dinâmica Jokenpô, em que os
vencedores jogavam com outros vencedores até ter o último ganhador, que foi a
Jacqueline Silva. Quem perdia tinha de gritar o nome de quem ganhava.
Em seguida, cada um recebeu um cartão com uma pergunta a ser feita para outra
pessoa. Todo mundo perguntou e respondeu. Depois, foi só saborear a pizza e
conhecer mais cada um. Valeu pelo apoio, Emerson Vieira. Valeu, Alureiros!!!
Edson Braga, Como você aplicou os conhecimentos nos projetos que participa?,
> Na criação e manutenção de código, sempre procurando aplicar os conhecimentos

obtidos nos cursos, principalmente dos cursos de design patterns que ajudam a
melhorar a qualidade do código.
Claudinei Carlos Bonilha, Jacqueline Silva, O que você faria para melhorar os
treinamentos na nossa área?
> O treinamento atualmente está muito bom, com uma mistura de cursos e participação
nos projetos, não há o que acrescentar, é um treinamento dinâmico.
Jacqueline Silva, Gustavo Silva
> Qual foi o curso com melhor conteúdo?, Design Patterns 1.
Vinicius Rodrigues Justo, Felipe Santos
> Como você se organizava para estudar na Alura?, No princípio, eu estudava e fazia
as atividades dos cursos durante todo o período na 7COMm (das 9h às 18h) e, quando
passei a realizar atividades dos projetos, separei o período da manhã para estudar
(das 9h às12h) e o restante do dia dedicava a outras tarefas.
Marco Cauê Rodrigues, Matheus Cavalieri
> Quem foi o melhor instrutor?, Guilherme Silveira, um dos fundadores da Alura, se
não me engano. Ele passa uma impressão de que conhece tudo sobre o que está dando
aula. Em segundo lugar, o Maurício Aniche.
Matheus Cavalieri, Claudinei Carlos Bonilha
> Quais problemas você teve para fazer os cursos?, Tive problemas para visualizar
as vídeo-aulas.
Emerson Vieira, Renan Ribeiro Silva
> Você acredita que o treinamento vai agregar conhecimento para suas atividades
diárias?,Sim, pois todo recurso de conhecimento é bom para ajudar a me aprimorar em
minhas atividades diárias e acredito que a Alura seja muito bom nesse aspecto.
Edson Braga, Vinicius Rodrigues Justo
> Qual foi o curso com pior conteúdo?, Na época em que fiz a Alura, o curso de
Enterprise Java Beans não fornecia bons exercícios para fixar o conteúdo.
Felipe Santos Marco, Cauê Rodrigues
> O que tem feito para aprender depois que deixou a Alura?, Nas horas vagas,
enquanto me desloco para o serviço ou faculdade, procuro sempre estar aprendendo de
alguma forma, lendo livros, vendo alguma matéria em blogs, ouvindo podcast. Neste
momento, estou lendo o livro "Como Mudar o Mundo: Gestão de Mudanças 3.0" e
escutando podcats no Hipsters.tech e Nerdcast.
## Feedback do time
Sabendo dessa dinâmica superbacana que os estagiários participaram, aproveitamos

também e fizemos algumas perguntas para entender a impressão de cada estagiário com
a Alura. Então tivemos os seguintes resultados:
Quais cursos fizeram um grande diferencial na aprendizagem?

Para quem está começando, quais cursos vocês acreditam que sejam imprescindíveis?,
Quais técnicas vocês utilizam para estudar?, Em relação ao que vocês já conheciam e
ao que aprenderam conosco, quanto vocês evoluíram?
Gustavo Henrique da Silva
> Primeiros passos com Java, Design Patterns, Toda a trilha de certificação., Toda
a trilha de Java., Acompanhar o código enquanto vejo o vídeo. Dependendo do curso,
evoluir o projeto por conta própria., Tudo em relação a boas práticas, além de
conhecimento mais detalhado sobre vários assuntos.
Matheus Cavalieri
> Os cursos de Design Patterns e SOLID me ajudaram bastante a pensar em abstrações.

Também gostei dos cursos de MEAN Stack/Angular/Node.js, que me ajudaram a trabalhar
com os projetos aqui., Não recordo o nome agora, mas os cursos introdutórios de
Banco de Dados e OO são bastante necessários., Gosto de ouvir música enquanto leio
a explicação., Saber programar eu sabia, mas algo que melhorou muito com a Alura
foi o uso de melhores práticas.
Claudinei Carlos Bonilha
> Java., Lógica de programação., Praticar e sempre usar GUJ., 80% a 90%.
Jacqueline Cristina Silva
> JAVA II - Orientação a objetos., Lógica de programação., Assistir às vídeo-aulas,

ler o conteúdo e, logo em sequência, treinar o que foi aprendido, além de sempre
relembrar alguns tópicos importantes nos próximos dias., Como possuo pouco tempo de
estudo na Alura, evoluí pouco, porém, já consegui aprender muitas coisas que ainda
não sabia, além de aprimorar o meu conhecimento anterior.
Felipe Gonçalves dos Santos
> Os dois cursos de Design Patterns e SOLID., HTML/CSS, Javascript, Java I e II.,
Focar o máximo possível, fazer uma pausa sempre que for preciso para não tornar o
estudo algo cansativo e maçante, e não deixar dúvidas para depois. Você pode pausar
a aula e esclarecer pontos que não ficaram claros evitando que se tornem uma "bola
de neve". E também praticar o máximo que puder., Posso afirmar que aprimorei todo o
meu conhecimento com as aulas e exercícios além do conteúdo novo, que foi passado
de uma ótima maneira.
Marco Cauê Borges Rodrigues
> Toda carreira Desenvolvedor Java Júnior., Lógica de programação, feito isso,
cursos da trilha Júnior, independente da linguagem., Creio que estudar todos os
dias, em um curto espaço de tempo e resolvendo exercício, seja eficaz., A evolução
foi grande. Se antes tinha uma noção básica de Java, hoje já tenho conhecimentos
que me possibilitam um maior raio de ação dentro da linguagem.
Lucas de Almeida Fernandes
> Design Patterns Java I: Boas práticas de programação, SOLID com Java: Orientação
a Objetos com Java., Java I: Primeiros passos., Assisto às vídeo-aulas, respondo as
questões e trabalho em um projeto pessoal ou no trabalho os conceitos vistos no
curso para fixar o aprendizado., Aprendi toda a parte de boas praticas e técnicas
mais avançadas de Java.
## Feedback do gerente
Além dos estagiários, o gerente também não fugiu! Em outras palavras, também
ficamos bem curiosos em saber suas impressões sobre nós. Então, fizemos algumas
perguntas para compreender como era a sua experiência ao utilizar a Alura como meio
de treinamento. Veja só o feedback que ele nos deu:
### Por que preferiu a Alura como meio de treinamento para o time?
Precisávamos de uma forma, economicamente viável, para treinar os estagiários que

chegam das universidades cada vez menos preparados para o trabalho. Algumas pessoas
do nosso time tinham experimentado a plataforma (trial da alura) e pareceu
promissor. Então, decidimos experimentá-la.
### Quais foram os resultados obtidos após o treinamento na Alura?
- Somaria mais de 300 cursos assistidos.

- Presença do colaborador na empresa 100% do tempo.
- Devido a essa presença, torna-se fácil preencher o tempo sem atividades de
projetos.
São estudados cerca de 30 cursos em 3 meses. Não conseguiríamos passar tanta

informação em tão pouco tempo apenas com treinamentos internos.
### Como gerencia o progresso dos estagiários?

Temos uma sequência de treinamentos que os estagiários devem seguir. São cerca de
30 cursos que devem ser concluídos aproximadamente em 3 meses. Toda segunda-feira,
cada um compartilha no canal do Slack quais treinamentos serão feitos durante a
semana. Também são feitas retrospectivas para levantarmos os pontos fortes e fracos
do treinamento.
### Quais tipos de cursos os estagiários fazem mais? Programação? Front-end?

Mobile? Ou outros?
A nossa principal stack é Java e, em segundo, Nodejs.
O que achou dessa experiência que a galera da 7COMm compartilhou? Bem legal, né?
Você, gestor, líder e desenvolvedor, que quer levar os treinamentos da Alura para
dentro da sua empresa e ter as mesmas experiências e resultados que o pessoal da
7COMm, não deixe de entrar em [contato com a gente por aqui].
Olá, se vocês não viram o primeiro post da série clica [**aqui**] e dá uma lida
nesse antes.
Bom, agora vamos resolver o problema dos **nomes das classes de CSS**, vamos
recapitular o componente .box que eu criei:
css
Imagina agora que o nosso componente navbar tem seu próprio elemento título também,
qual nome daríamos pra classe desse título?
css
O problema de usar nomes tão genéricos é que nomes de classe assim vão conflitar
uns com os outros, veja que tanto o componente `box` quanto `navbar` tem um
`.title` declarado. Como podemos fazer pra resolver isso?
Gente pensa comigo, o titulo da navbar pertence a qual componente? A própria

navbar!
O título do box pertence a qual componente? O próprio box!
css
Agora sim! Os estilos vão ser específicos pros seus elementos!
Apesar da gente ter melhorado o código agora, esse código novo ainda vai
entristecer muita gente, principalmente quem for dar manutenção no futuro.
Olha, vamos pensar o seguinte, lembra do nosso item ativo da navbar? Então, vamos
pensar que o CSS do nosso modificador ativo tem de ser escrito por uma outra pessoa
nova no projeto e que nós não fazemos mais parte desse projeto. A pessoa
provavelmente vai escrever algo do tipo:
css
Quando ela inserir esse modificador no elemento da navbar o que vai acontecer?
html
Não acontece NADA.
EITA, como assim nada?
Pois é, no CSS existe uma coisa chamada especificidade, quanto mais específico for
o CSS mais prioridade ele vai ter pra estilizar o elemento. Veja só isso:
html
Quais são os seletores CSS que temos que estão estilizando o nosso link courses?
css
Qual desses seletores você acha que é mais específico e vai ter mais prioridade?
css
Pois é, um seletor com duas classes é mais específico do que um seletor com apenas
uma!
O que vai acontecer é que a pessoa que criou o estilo do .active vai ter que deixar
esse seletor igualmente ou até mais espeficífico que o seletor acima. Resultando
em:
css
E se depois disso outra pessoa quiser estilizar? Vai ter que ir ficando cada vez
mais específico até chegar no.
.. 1 minuto de silêncio ..
**!important**
Isso é horrivel porque o **!important** é um curinga para burlar a especificidade,

ou seja, se alguém quiser estilizar ainda mais o elemento vai ter problemas!
Se um dia você mexer com temas prontos do Wordpress e tentar customizar eles você
vai sentir na pele todos esses problemas, confia em mim!
Bom, ok, mas como resolver esse problema ? Simples, deixando menos específicas as
classes! Vamos tentar deixar apenas o NOME do seletor mais específico:
css
Repare que agora temos uma classe só com nome composto! Agora .navbar-active
sobrescreve .navbar-title!
Existe já um padrão pra isso e é o famoso Block Element Modifier, [**BEM**].
Explicando as siglas do BEM temos:
**(B)lock** - Esse seria basicamente o que o **SMACSS** chama de Módulo e o que

chamamos aqui de componente também, isso seria qualquer componente que criamos que
possa ser reutilizado em várias páginas, como o caso do nosso box ou da navbar.
De agora em diante quando eu me referir a block ou bloco vou estar falando de algum
componente.
**(E)lement** - Esse seria um elemento que está dentro do nosso bloco, por exemplo
tanto os nossos itens dentro da nossa navbar, quanto o title e a image dentro do
box, lembra?
html
css
html
css
**(M)odifier** - Esse seria o nosso modificador, lembra do active? navbar-

itemActive.
O que o BEM propõe é organizar esses nomes, que nomes vamos dar para os elementos?
E os modifiers? E os blocks? Ele ajuda a gente a seguir um padrão. Para o BEM esse
padrão seria:
`block__element--modifier`
Ou seja, refatorando nosso código a gente teria:
Para o block box:
css
Veja que no exemplo do box não temos modifier, apenas o block box e os _elements_
`title` e ìmage`!
Vamos para o nosso block navbar agora:
css
Lembra que active é o nosso modifier? Voilà!
BEMerizamos o nosso CSS! É assim que a gente faz na Alura hoje em dia, usando tanto
as técnicas descritas nesse post como as técnicas descritas no post anterior de
organização de arquivos do front!
Pessoal nesses dois posts falamos apenas de HTML e CSS, pro javascript já são
outros quinhentos, quem sabe eu não escrevo um post falando um pouco do JS também
no futuro!
Só vou complementar com algumas últimas informações:
O BEM não é restritivo, ou seja, se você separar os seus blocks dos elements e dos
modifiers você já está seguindo um padrão BEM! Olha só, na Alura antes a gente
seguia o padrão:
`Block-element--modifier`
Esse padrão funcionou durante um tempo mas conforme o código cresceu a gente
começou a achar ele confuso, o element do modifier a diferença é 1 hífen só.
Isso começou a dar problema. Se vocês derem inspect em algumas páginas da Alura
hoje ainda vão achar código assim!
Obrigado por lerem e forte abraço!
imagem
A Olimpíada Brasileira de Informática traz diversos desafios de lógicas. Mas como

podemos resolvê-los? Veja como se preparar para os desafios
Quando eu era mais novo, na época do segundo ano do ensino médio, estava decidido a
fazer um curso técnico. Na época, estava indeciso entre dois cursos técnicos:
química ou informática. Acabei optando por informática e gostei muito do curso.
A parte que mais chamou minha atenção foi a parte de programação. Criar códigos,
resolver problemas. Até hoje eu adoro resolver problemas com os algoritmos que
aprendi!
Na época eu não sabia, mas existem alguns campeonatosde informática, como a

[**Olimpíada Brasileira de Informática**] (OBI). Nessa competição, alunos do ensino
fundamental, médio e que cursam o primeiro ano de um curso superior competem com
desafios de lógica e programação, cada um em sua respectiva categoria.
Na OBI existem duas modalidades: a de **iniciação**, onde as provas são feitas no

papel, e a de **programação**, na qual as provas são feitas no computador.
Em ambas as modalidades resolvemos problemas que envolvem lógica. A diferença é

que, na modalidade de programação, a gente pode utilizar linguagens como C, Java,
C++, entre outras, para criar nossa solução. Mas como será a prova? Como devemos
resolver os problemas?
Só temos acesso a prova no dia da competição, mas podemos ir praticando. No site da

maratona tem uma [**seção com alguns problemas**] que podemos resolver. Vamos ver
como é um desses problemas!
## O álbum da copa
Nos problemas de nível júnior, vamos escolher um problema de 2018 da primeira fase,
[o Álbum da copa].
Temos um álbum de figurinhas da copa do mundo. O álbum possui um número total de

figurinhas, que é a primeira entrada no programa. Nós podemos comprar figurinhas
para esse álbum - a quantidade comprada é representada na segunda entrada.
Cada figurinha que compramos representa um espaço no álbum. Esse espaço é mostrado
pelas próximas entradas.
A cada nova figurinha, completamos um espaço no álbum. Logo, faltam menos

figurinhas para completar o álbum. Nossa meta nesse problema é **achar justamente
quantas figurinhas faltam**:
```
Entrada:
10 ← quantidade de figurinhas no álbum
3 ← número de figurinhas que compramos
5 ←número da figurinha no álbum 8 3
Saida: 7 ← figurinhas que restam para completar o álbum

```
Podemos comprar quantas figurinhas quisermos, mas elas podem vir repetidas:
Nesse caso compramos seis figurinhas mas quatro eram iguais, ou seja, conseguimos
preencher duas figurinhas no álbum.
Como podemos começar a resolver o nosso problema?
Bem, estou utilizando a linguagem C para resolver esse problema, que é padrão nesse
tipo de campeonato. Já que nosso programa terá entrada de dados, a primeira coisa
que temos que fazer é incluir (**include**) a biblioteca padrão de entrada e saída
(**stdio.h**):
Agora, temos que começar a escrever o código da solução. Todo programa em C começa
a rodar a partir da função principal, a **função main()**. Então, vamos declará-la
para conseguir executar o código:
Essa função deve retornar um número inteiro. Por padrão, no sistema operacional,
quando um programa finaliza corretamente, isso é, sem erros, é retornado
(**return**) o valor zero:
Bacana! Já temos a estrutura do projeto definida, agora vamos começar a escrever a

solução.
## Começando com o álbum
Nós sabemos que receberemos três informações no começo:
- A quantidade de figurinhas no álbum;

- A quantidade de figurinhas compradas e
- O número dessas figurinhas.
Já sabemos que precisa armazenar essas informações, logo, podemos falar para o C
guardá-las para a gente:
Para guardar as informações das quantidades de figurinhas, só precisamos declarar

duas variáveis inteiras. Mas e para guardar o número das figurinhas que foram
compradas?
Uma? Dez? Cem? Não temos como saber realmente quantas figurinhas foram compradas,
então como podemos armazená-las?
O que nós podemos fazer é utilizar uma **coleção** que guarda as figurinhas que
compramos. Essa figurinha terá, justamente, o tamanho do número de figurinhas que
compramos. Mas quantas figurinhas foram compradas?
Antes de declarar essa coleção, precisamos captar o número de figurinhas compradas.

Além desse número, precisamos também saber quantas figurinhas temos no álbum:
Dizemos para o C que **queremos escanear (`scanf`) valores numéricos (`&d`,

decimal), que devem ser guardados (`&`) nas nossas variáveis**.
Bacana! Agora nós podemos declarar a coleção com o tamanho de figurinhas compradas.
Para declarar essa coleção, que no nosso caso é um vetor, utilizamos uma sintaxe
parecida com a de variáveis. Porém, passamos entre colchetes (`[ ]`) o tamanho do
vetor. Agora, podemos ler quais foram as figurinhas que compramos.
Isto é, para um índice, que começa em `0`, e enquanto esse índice for menor que o
número de figurinhas compradas, vamos fazer alguma coisa. Depois disso, somamos 1
ao valor do índice, dessa forma vamos caminhando pelo vetor:
As figurinhas ficarão guardadas em um álbum, logo, podemos declarar um vetor para o

álbum também:
No começo, não existe nenhuma figurinha no álbum, logo, podemos dizer que o valor
de cada posição do álbum vale `0`, ou seja, nenhuma figurinha naquela posição.
Neste caso, também usamos a variável índice e, da mesma forma que fizemos com o
outro vetor, iniciamos ela com o valor zero.
Só falta agora colocar as figurinhas no álbum. Como não precisamos contar as

figurinhas repetidas, podemos simplesmente passar por cada figurinha que compramos
e "colá-la" no álbum, ou seja, atribuir àquela posição do álbum o valor da
figurinha.
Uma característica importante é que os vetores, no C, **começam na posição 0**. Ou

seja, se a figurinha tem o valor cinco, no vetor ela deve ocupar a posição quatro,
a quinta posição no vetor. Por isso, antes de atribuir a figurinha na variável,
subtraímos 1 de seu valor :
Com esse código, estamos atribuindo o valor 1 para cada posição no álbum, isto é,
estamos "colando uma figurinha" naquela posição. Ou seja, significa que completamos
mais um espaço no álbum. Podemos declarar uma variável para contar quantas
figurinhas diferentes temos e, a cada atribuição no **loop**, incrementamos 1 nela:
O que vai acontecer quando rodar esse último loop? Vamos incrementar o número de
figurinhas diferentes para todas as figurinhas que compramos. Ou seja, até mesmo as
figurinhas repetidas serão contadas!
Mas não precisamos contar as figurinhas repetidas, precisamos contar apenas as

figurinhas únicas, como podemos fazer isso? Uma das formas é colocar uma condição
antes de atribuir os valores nas nossas variáveis, isto é, se (**if**) aquela
posição do álbum estiver vazia (seu valor for 0) atribuímos e incrementamos nossas
variáveis:
Bacana! Aparentemente já conseguimos colar as figurinhas no álbum e contar quantas

são diferentes. Sabendo quantas figurinhas são diferentes, podemos calcular quantas
faltam para completar o álbum.
Agora, basta calcular a quantidade de figurinhas no álbum **menos** as figurinhas

diferentes. Como o problema pede, vamos escrever na tela (`printf`) esse valor, que
é um número inteiro:
Como podemos saber se o nosso sistema está funcionando? Testando! No site que
apresenta o desafio tem alguns testes de como o algoritmo deve funcionar. Vamos nos
basear nesses testes e ver se nosso programa apresenta o resultado esperado.
Antes de executar o código, precisamos compilá-lo, isso significa que estamos

passando o código para uma linguagem que a máquina entende. No meu caso, estou
utilizando um Linux, porém os passos no Mac e no Windows são parecidos.
Vou utilizar o **gcc** para compilar o meu código, que está no arquivo àlbum-da-
copa.c`, e vou falar para ele criar o programa com o nome de àlbum-da-copa`:
imagem vem de algum desses arquivos:
![]
Legal! Nosso algoritmo passou nos testes. Mas esses testes são básicos, no [site do
desafio] podemos submeter a solução. Basta informar a linguagem que utilizamos e o
arquivo:
![]
Quando clicamos em submeter, somos levados a tela de resultados, o ponto significa

que o resultado foi correto. No final podemos ver a pontuação:
![]
## Para saber mais
Olimpíadas de programação são muito legais. Elas nos ajudam a pensar em algoritmos
eficientes, que resolvam de maneira simples e rápidas os problemas. Muitos
programadores gostam de participar desses tipos de competição para praticar seu
código.
Para quem gostou de resolver um problema da olimpíada de programação, no site deles

existem diversos outros problemas de vários níveis diferentes.
Para quem quiser ir praticando e não sabe por onde começar, na [**Alura Start temos
diversos cursos sobre a olimpíada de programação**] nos quais você pode ver os
problemas, ver as possíveis soluções, além de praticar a parte da programação.
Se você se interessou por esse tipo de competição, mas não pode participar porque
não está estudando ou já está em anos mais avançados da faculdade, existe a
[**Maratona de Programação**], na qual cada equipe de diversas faculdades competem
criando algoritmos.
Aqui na Alura existe um [**curso sobre a maratona de programação**]. Nele, você

verá como se preparar para a prova, além de técnicas sobre como resolver alguns
problemas.
imagem
Programando em **Python** (ou, na verdade, em qualquer linguagem de programação!)

você já deve ter se deparado com algumas mensagens de **erros e exceções**. Como
podemos fazer nosso programa lidar com isso da melhor maneira?
Aqui na empresa, temos um programa em cada computador que registra, em um arquivo,

as datas e os horários em que o computador foi ligado.
Recentemente, alteramos todo o registro de datas no padrão brasileiro (`DD/MM/AAAA

HH:mm`) para o padrão ANSI (ÀAAA-MM-DD HH:mm:SS`). Essa conversão de padrão foi
feita utilizando [**geradores no Python**].
Entretanto, começamos a usar um novo programa que exige o registro no padrão

brasileiro, porque foi desenvolvido por uma empresa nacional. Nossa solução, então,
foi ter dois registros com padrões diferentes para os programas diferentes que
usamos, em vez de salvar em um padrão ou outro.
Dessa forma, antes de tudo precisávamos de um outro arquivo `registros_br.txt` com

todos os registros já salvos no `registros.txt`, mas convertidos ao padrão
brasileiro. Por enquanto, temos um arquivo `registros.txt` assim:
Já sabemos [**como fazer esse tipo de conversão**] usando um gerador e a função

`strptime()` do tipo `datetime`:
python
Legal! Mas dessa vez não queremos imprimir as conversões, não é verdade? Queremos
apenas passá-las para nosso novo arquivo `registros_br.txt'`. E agora?
## Escrevendo em nosso arquivo
Para gravarmos os dados em nosso arquivo, temos que abri-lo com um modo diferente
de `'r'`, para leitura, o `'w'`, para escrita! Dessa forma, podemos usar o método
`write()` para adicionarmos texto nele.
Pensando nisso, podemos, também, usar uma função comum em vez de um gerador, para
converter tudo de uma vez e passar para o novo arquivo:
python
Certo! Fui rodar esse código e olha o resultado:
python
Uma exceção gigante! Ela é do tipo **ValueError** e indica que a string `'Dia do
Trabalho - FERIADO\n'` não bate com a formatação que a gente passou `'%Y-%m-%d %H:
%M:%S\n'`. Realmente não bate, não tem nada a ver… De alguma forma precisamos
arrumar isso.
## O problema do fechamento do arquivo
Antes de cuidar desse problema, porém, vamos checar como ficou o arquivo
`registros_br.txt`, já que deu esse erro. Dei dois cliques no arquivo para abrir
com o bloco de notas e olha o que aconteceu:
imagem`, e o problema é justamente esse - a função não foi finalizada.
> "Isso significa que a função ainda está sendo executada?"
Na verdade… não. A função foi encerrada, mas antes de chegar no final do código
dela. E por quê? Por causa da exceção `ValueError` que tivemos! O Python não sabe
como lidar com esse erro e simplesmente interrompe toda a execução do programa.
E agora? Bem, podemos pensar em alguma forma de evitar essa exceção, impedindo que
isso acontecesse. Mas e se outro erro aparecesse? Novamente os arquivos ficariam
abertos!
Seria bom se houvesse uma forma de garantir que as linhas que fecham os arquivos
executassem, não importa o que aconteça… Mas como?
## Garantindo a execução de um código com um bloco **try**/**finally**
Por enquanto, temos uma linha do código que é suscetível a erros, como já vimos:
python
Repare que o que queremos é tentar (**try**) executar essa linha e, independente do
que aconteça, executar, finalmente (**finally**), as linhas de fechamento dos
arquivos. No Python (e em diversas linguagens de programação), temos uma maneira
especial de cuidar das coisas dessa forma - com o bloco **try/finally**. Sua
estrutura é a seguinte:
python
Vamos tentar executar nosso programa agora e ver o resultado:
python
Ok, o erro continua aparecendo, afinal não mexemos nisso, queríamos apenas garantir
que os arquivos fossem fechados ao final. Fui tentar abrir o arquivo
`registros_br.txt` e dessa vez… deu certo! Deu certo? Bem, conseguimos abrir, mas
olha o conteúdo dele:
Ué! Só salvou a primeira linha! Vamos analisar mais um pouco a mensagem de erro que
recebemos:
python
Repare que o erro indicado ocorreu com a string `'Dia do Trabalho - FERIADO\n'`.
Voltando lá em nosso arquivo `registros.txt`, vemos que essa linha era justamente a
segunda!
Assim, a primeira linha passa pelo loop da maneira como queremos, mas logo a
segunda já falha e interrompe todo o código, só executando o que vem no `finally`.
Precisamos, dessa vez, encontrar alguma maneira de contornar esse problema. Não
quero remover essa linha do meu registro, pois nos ajuda a controlar as datas por
aqui. Mantendo ela, o que podemos fazer?
Uma abordagem seria fazer uma verificação com ìf`, checando se a linha é essa. Se
for, queremos que ela fique igual no `registros_br.txt`. Vamos lá, então:
python
Certo! Vamos executar novamente o nosso programa e ver o resultado:
python
Outro `ValueError`, mas dessa vez com a linha `'SÁBADO\n'`. Esquecemos de

considerá-la na verificação. Olha como ficou nosso `registros_br.txt`:
```
30/04/2018 10:05
Dia do Trabalho - FERIADO
02/05/2018 12:30
03/05/2018 11:00
04/05/2018 15:00
```
Ainda incompleto… Podemos adicionar `'SÁBADO\n'` em nossa verificação, também. Mas

aí teríamos que adicionar `'DOMINGO\n'`. E não poderíamos esquecer dos próximos
feriados, como Corpus Christi, Independência do Brasil, e até o Natal!
Ficaria completamente inviável cobrir tudo isso com uma (ou mesmo várias)
instruções ìf`! Precisamos de uma maneira mais eficiente. Qual poderia ser a
solução?
## Tratando exceções com o bloco **try**/**except**
Uma outra abordagem que poderíamos seguir seria nos basear pela exceção, não pela
linha. Ou seja, em vez de "se a linha for x, faça y", tratar como "se uma exceção
acontecer, faça y". Quem já é mais familiarizado com programação, talvez saiba que
isso tem um nome - **[tratamento de exceção**] ou **exception handling**.
Com base no que fizemos antes com o **try/finally**, vamos pensar no que de fato
queremos que aconteça.
Em primeiro lugar, queremos tentar (**try**) executar aquela parte do código,

exceto (**except**) nos casos em que ocorra um erro, em que queremos mandar direto
a linha para o `registros.txt`. No nosso caso, depois de tudo (**finally**) ainda
queremos fechar os dois arquivos que abrimos.
Assim, temos a estrutura básica do tratamento de exceções com o Python um bloco

**try/except**, ou, no nosso caso, **try/except/finally**. Olha como montamos o
código:
python
Legal! O único problema é que o **except**, da forma que está, vai capturar toda e
qualquer exceção que aparecer.
> "Mas, ué, não é isso que queremos?"
Será? Veja, as exceções que nos deparamos foram todas do tipo `ValueError`,
indicando um problema na parte de formatação da data. Sabemos, então, que estamos
falando, na verdade, desse único tipo de exceção, que é o esperado.
Da forma como está agora, erros mais graves, como a tentativa de fechamento do
programa (**KeyboardInterrupt**) ou um problema na memória (**MemoryError**),
passariam silenciosamente, sem sequer ficarmos sabendo. Como melhorar isso?
## Capturando exceções específicas com èxcept`
No Python, ainda podemos, então, especificar a exceção que queremos tratar, mudando
o èxcept:` para:
python
Vamos rodar nosso programa e ver o que acontece. O código rodou sem erros e
finalizou sua execução. Será que é um bom sinal? Vamos ver como ficou nosso arquivo
`registros_br.txt`:
```
30/04/2018 10:05
Dia do Trabalho - FERIADO
02/05/2018 12:30
03/05/2018 11:00
04/05/2018 15:00
SÁBADO
DOMINGO
07/05/2018 09:20
...
```
Deu certo! Exatamente como queríamos, agora! O problema foi resolvido com sucesso,
mas ainda há uma última coisa que me incomoda um pouco em nosso código…
Faz tempo que sabemos exatamente qual linha que estava resultando na exceção
`ValueError`:
python
Ou seja, é apenas nessa linha que esperamos uma possibilidade de exceção.

Entretanto, estamos englobando mais outras duas linhas, de formatação da data em
uma string e de escrita no arquivo, no `try`.
Assim, o èxcept` vai procurar por um `ValueError` em qualquer uma dessas três
linhas, quando na verdade só queremos na primeira, que é o que esperamos!
O ideal, então, seria deixar dentro do `try` apenas o trecho que sabemos que pode
gerar uma exceção - a primeira linha. Mas se for assim, onde colocamos o resto do
código?
## "E se tudo der certo?" com a cláusula èlse`
Vamos novamente organizar, então, o nosso objetivo geral. Queremos tentar (**try**)
transformar uma string em `datetime`, exceto (**except**) ocorra um ValueError, em
que queremos que a string seja simplesmente gravada no arquivo `registros_br.txt`.
Caso não (**else**) ocorra esse `ValueError`, queremos formatar a data no padrão
brasileiro e então mandá-la para o arquivo de registro. Finalmente (**finally**),
precisamos fechar os dois arquivos que abrimos.
Assim, podemos completar nosso bloco de tratamento de exceção com a cláusula èlse`
(sim, igual aquela do **if**/**else**!), no qual o código dentro dela será
executado apenas se o èxcept` não capturar nenhuma exceção:
python
E nosso código está ainda mais efetivo e prático!
## Para saber mais: Gerenciadores de contexto
O tratamento de exceções se mostrou uma solução muito boa para os nossos problemas,
mas sabia que há uma maneira mais simples de lidarmos com fechamentos de arquivos
no Python? Com a palavra-chave `with`, podemos criar o que chamamos de
**gerenciador de contexto**, que manterá o arquivo aberto apenas até o fim do
determinado contexto criado:
python
E olha o resultado quando rodamos o código:
python
Os dois arquivos foram fechados automaticamente, sem a necessidade da chamada do

método `close()` por nossa parte!
## Conclusão: Tratando erros com elegância
Nesse post, aprendemos sobre tratamento de exceções no Python, vendo como essa
técnica pode resolver e simplificar muitos de nossos problemas, transformando erros
em coisas menos assustadoras para nós, desenvolvedores!
Aprendemos que há diversas formas de estruturar esse tratamento, com blocos como
**_try_**/**_finally_**, **_try_**/**_except_**,
**_try_**/**_except_**/**_finally_** e ainda o mais completo -
**_try_**/**_except_**/**_else_**/**_finally_**, em que conseguimos especificar com
elegância o comportamento que queremos que nosso código tenha frente a uma exceção.
E aí, o que achou do tratamento de exceções no Python? Se gostou do conteúdo, que

tal dar uma olhada também em nossos [cursos de Python] lá na Alura?
Onde eu trabalho, todos os links acessados por qualquer computador da empresa são
armazenados em um mesmo arquivo de registro na rede, o àcessos.log`, para maior
controle do que os funcionários andam acessando durante o horário de trabalho. O
log está organizado desta forma:
python
Uma vez por semana, checamos todo esse registro. Uma das verificações consiste em
ver quais sites foram acessados sem o [**protocolo de segurança HTTPS**].
Para facilitar isso, criamos um _script_ em Python utilizando nossos conhecimentos
sobre [compreensão de lista], [leitura de arquivos] e o método de string
**[startswith()]**, que verifica se uma string começa com uma determinada substring
passada no parâmetro:
python
Podemos agora checar o primeiro link:
python
E temos como resposta:
python
Ok! Apareceu o primeiro site que foi acessado apenas com HTTP. Se quiséssemos saber
os próximos resultados, poderíamos, também, fazer um laço sobre toda a lista.
## O problema da memória
Tudo certo, até que, por desorganização, ficamos algumas semanas sem fazer a
checagem. Quando fomos verificar, o arquivo àcessos.log` já tinha mais de 5 GB!
Tentamos rodar nosso código e olha o que aconteceu:
python
Recebemos uma exceção de tipo `MemoryError`! O Python não conseguiu fazer o que
queríamos. Mas por que esse problema ocorreu?
Isso é porque a compreensão de lista armazena todos os valores de uma vez, ao mesmo
tempo. Assim, se todos os links acessados fossem sem HTTPS, por exemplo, a memória
RAM de nossa máquina ficaria ocupada de mais 5 GB, lentificando (e muito) nosso
computador.
Como podemos solucionar todo esse problema, então?
## Imaginando uma solução com _lazy evaluation_
Por enquanto, lemos nosso arquivo de registro linha por linha e armazenamos as
linhas em uma lista. Estamos, então, **iterando** sobre nosso arquivo, isto é,
repetindo o mesmo procedimento sobre ele para se obter cada linha.
Conseguimos fazer isso porque nosso arquivo aberto no Python é um **iterável**, um

tipo de objeto que possibilita a ação de repetição sobre seus elementos, como
listas e strings.
No Python, um objeto é considerado iterável se ele implementa o método `__iter__`,

permitindo, por exemplo, que um loop `for` seja executado sobre ele.
Sabendo disso e considerando nosso problema com a memória do computador, uma

solução hipotética seria ter um iterável que nos permitisse gerar uma URL por vez a
cada iteração, **à medida do necessário**.
Esse tipo de lógica, na computação, tem nome - **[avaliação preguiçosa]**, ou, em

inglês, _lazy evaluation_.
A avaliação preguiçosa, como já indica o nome, atrasa o processamento de uma

expressão até que o resultado seja de fato necessário. Então como podemos utilizar
dessa técnica no Python?
## Implementando iteradores no Python
No Python (e, na verdade, em diversas outras linguagens), temos o conceito de

**iterador**. **Um iterador é sempre um iterável**, mas que produz um valor a cada
vez que é usado como argumento da função nativa `next()`.
Um iterador deve sempre implementar o método `next()`, no Python 2, ou

`__next__()`, no Python 3. Esse método deve retornar a exceção `StopIteration`
quando não há mais valores para o iterador produzir.
imagem`.
Mas como podemos criar um iterador que faça o que queremos, então? Temos que criar
uma classe que contenha um método `__iter()__` para ser um iterável, e o método
`__next()__` para ser um iterador.
Como o método `__iter__()` serve para retornar um iterador e nossa classe será, de
fato, um iterador, faremos com que ele retorne o próprio objeto. No caso do método
`__next()__`, implementaremos o código que devolverá uma linha que queremos por
vez:
python
Assim, podemos ir pegando (e, na verdade, gerando) URL por URL com a função
`next()`:
python
E o resultado é:
python
Certo! Mas o que acontece se tentarmos dar `next()` em um iterador que já acabou de
produzir seus valores? Vamos ver:
python
E o resultado:
python
Recebemos uma exceção do tipo `StopIteration`, nos indicando que já não há mais o
que ser gerado pelo iterador, como previsto. Podemos evitar essa exceção passando
um segundo parâmetro à função `next()`, que substituirá a impressão do
`StopIteration`:
python
Dessa vez:
python
Como esperado!
Como um iterador também é um iterável, podemos passar pelos elementos dele com um
`for`, de forma que esse problema da exceção já é automaticamente resolvido:
python
O resultado:
python
Deu certo! O que acontece é que o próprio `for` usa a função `next()` para ir
pegando os valores, mas para de iterar quando não há mais valores para gerar.
Para entender de fato a diferença entre a iteração que fazíamos antes e a que
estamos fazendo agora, vamos fazer uma simulação:
imagem que consegue poupar memória, trabalhando de outro jeito. Podemos até
concluir que **é boa prática usar iteradores em leitura de arquivos**, por
garantia.
Além disso, entendemos o que são iteráveis e iteradores, e até demos uma espiada
nos geradores!
Quer aprender mais sobre conjuntos e listas no Python? Se se interessou pelo

assunto e gostaria de entender mais sobre tópicos similares, dê uma olhada em
nossos posts no blog sobre **[operações básicas com listas]**, **[como adicionar
elementos em uma lista]**, **[ordenação de lista]** e **[compreensão de lista]**.
E aí? Gostou de conhecer essa funcionalidade no Python? Quer se aprofundar mais na

linguagem? Na Alura, temos **[diversos cursos sobre Python]** que você pode
aproveitar muito, confira!
Em um cenário como o atual, os cursos de capacitação têm se destacado em razão da

sua qualidade de ensino e período de duração, que costuma ser curto.
Manter-se competitivo e atualizado é, hoje em dia, um pré-requisito para qualquer

profissional em busca do primeiro emprego ou de uma posição melhor na organização
em que já trabalha.
Isso não se deve apenas à crise econômica que enfrentamos no momento, mas também à
rápida evolução de ramos como a tecnologia, por exemplo.
Ainda assim, uma dificuldade frequente das pessoas que buscam essa opção para se
destacar no mercado de trabalho é organizar o tempo. Como buscar cursos extras,
fazer faculdade e trabalhar, se dedicando a todas as atividades?
## 1\. Monte um calendário de estudos
Ter um [**cronograma de estudos**] é essencial para garantir que você aproveite seu
tempo da melhor maneira possível. Na correria do dia a dia, é fácil se esquecer das
prioridades ou perder a noção de quanto tempo é gasto com bobagens.
Por isso, todos os compromissos fixos devem ser anotados no seu calendário:
academia, faculdade e, é claro, a hora de se dedicar ao curso. Em seguida, adapte
os compromissos flexíveis, como festas ou compras no supermercado, aos horários que
sobrarem.
Além disso, estabeleça metas diárias a serem cumpridas. Além de te deixarem mais
motivado, as metas ajudam a quantificar com precisão como está sendo sua evolução.
Lembre-se de que, para esse método funcionar, é necessário ter disciplina para
consultar e seguir à risca suas anotações.
## 2\. Escolha um bom local de estudo
Você provavelmente já passou pela seguinte situação: ao se sentar para estudar,

começa a perceber todos os barulhos à sua volta. Pode ser a TV ligada com som alto
na sala ou até mesmo uma obra próxima à sua casa.
Você tenta ignorar e começa a estudar, mas percebe que está lendo a mesma página
pela terceira vez porque não consegue se concentrar.
O fato é que a grande maioria das pessoas não consegue focar nos estudos em
ambientes barulhentos.
**Por isso, ter um lugar tranquilo para estudar, longe de qualquer tipo de
distração, é essencial não só para conseguir focar na atividade, mas também para
tornar seu escasso tempo de estudo mais produtivo.**
Ter uma mesa organizada e limpa, com todos os materiais necessários à disposição,
também é muito importante nesse momento.
Caso não tenha um lugar assim em casa, uma boa alternativa é encontrar locais
públicos silenciosos, como uma biblioteca municipal.
## 3\. Evite a procrastinação
Segundo especialistas, a melhor tática para conseguir motivação e evitar a

procrastinação se baseia em três elementos: gatilho, rotina e recompensa.
- Gatilho é o elemento que faz com que seu cérebro perceba que é hora de iniciar
determinada rotina ou tarefa. Para a maioria das pessoas, por exemplo, tomar café
ao acordar é o gatilho.
- Rotina é o conjunto de tarefas que você precisa fazer com certa frequência, mas
acaba adiando. Nesse contexto, a revisão do conteúdo de um curso de capacitação é a
rotina.
- Recompensa é o benefício que você obterá ao conseguir cumprir sua rotina
corretamente. No caso de se dedicar a um curso de capacitação, a vantagem em longo
prazo é conquistar uma posição melhor no [**mercado de trabalho**].
Para ajudar na motivação, você pode estabelecer outras pequenas recompensas diárias
cada vez que conseguir cumprir seu cronograma, também.
Quanto mais óbvia for a recompensa, mais fácil será vencer a procrastinação.
## 4\. Elimine as distrações
Depois de montar seu calendário com as metas estabelecidas e encontrar o lugar

ideal para estudar, é hora de garantir que sua atenção está completamente voltada à
atividade.
Por isso, nada de ficar com o celular na mão ou o Facebook aberto enquanto estuda,
ok? Fazer isso pode parecer inofensivo, mas a verdade é que, toda vez que o cérebro
desvia a atenção de uma atividade para outra, ele perde o foco.
Ao retornar à primeira atividade, você não vai continuar exatamente de onde parou,
podendo levar alguns minutos para que isso aconteça. Somados, esses minutos podem
representar um tempo precioso desperdiçado.
## 5\. Aproveite todos os recursos disponíveis

Você, melhor que ninguém, deve saber que a evolução da tecnologia trouxe diversas
vantagens quando se trata de [**aumentar a produtividade**].
Existem aplicativos mobile, por exemplo, que podem ajudar a organizar melhor sua
rotina. Abaixo, separamos 3 exemplos:
### 1\. inClass
Feito especialmente para estudantes, o aplicativo permite a criação de listas de

tarefas, visualizador de horários e alarmes, garantindo que o usuário não se
esqueça de nenhum prazo ou deixe alguma tarefa para a última hora.
O inClass ainda pode ser útil no momento de estudar para provas, pois permite
anotações sobre a matéria e a inserção de fotos, áudios e até vídeos relacionados a
determinado conteúdo. Disponível apenas para [iOS].
### 2\. RescueTime
O RescueTime vai te ajudar a seguir nossa dica sobre eliminar distrações: o

aplicativo elabora um relatório semanal que analisa quantas horas você gasta
online, com listas que especificam o tempo de navegação em sites e redes sociais.
Tendo essa visão, fica mais fácil descobrir como você está gastando seu tempo, com
foco em aprender a se conectar de maneira mais produtiva. Disponível apenas
para [Android].
### 3\. Audible
Quem precisa percorrer uma distância considerável até a faculdade ou o trabalho

sabe como é sentir que está perdendo um tempo precioso que poderia estar sendo
dedicado aos estudos.
Com a ajuda do Audible, é possível ouvir livros e artigos no trânsito — ou enquanto

realiza várias outras tarefas —, otimizando seu tempo. O aplicativo está disponível
para [iOS] e [Android].
Além do uso de aplicativos como esses, aproveitar todos os recursos disponíveis

envolve explorar opções como os [**cursos de capacitação online**] na sua área.
Práticos e acessíveis, eles podem tornar seu currículo ainda mais impressionante.
Considere mais essa vantagem que a tecnologia oferece para impulsionar sua
carreira.
## 6\. Descanse
Reserve um tempo no seu planejamento semanal para descansar e se distrair. Essa

pausa deve ser usada para relaxar, reunir-se com a família ou sair com amigos.
Não pense nesse tempo como “perdido”. Pelo contrário: ele é muito importante para
que o cérebro e o corpo tenham energia para a próxima carga de estudos.
Além disso, não deixe de dormir pelo menos 6 horas por dia. Uma boa noite de sono é
indispensável para um bom desempenho nos estudos, já que contribui para o processo
de memorização sua principal aliada para se sair bem em avaliações.
O cansaço pode ainda comprometer a sua capacidade de raciocínio e causar um mau

humor desnecessário.
Sabemos que organizar trabalho, faculdade e [**cursos de capacitação**] pode ser um
desafio. Mas com as ferramentas certas, bastante disciplina e organização, você
consegue conciliar todos seus compromissos e garantir que estará bem preparado para
o mercado de trabalho.
Comecei a estudar [**Java**] recentemente na **Alura** e conforme o tempo foi

passando descobri o que são IDE’s e para que servem. Depois de testar algumas delas
como [IntelliJ] e [Netbeans], optei por utilizar o [**Eclipse**] como minha IDE
principal, porque me senti mais confortável com ela.
Depois de algum tempo clicando nos ícones para salvar arquivos, gerar classes, e
mais algumas outras operações, comecei a pensar se o Eclipse teria atalhos para
fazer esses tipos de tarefa para mim, pois eu não estava me sentindo muito
produtivo durante o desenvolvimento.
Então comecei a pesquisar sobre os atalhos do Eclipse e me deparei com um

[**keysmap**], ou mapa de teclas, onde se encontram todos os atalhos do Eclipse.O
que vamos fazer agora é criar uma pequena aplicação onde vamos testar alguns dos
atalhos mais utilizados no dia a dia.
Criando getter e setters
A primeira coisa que precisamos fazer é criar nossa classe `Desenvolvedor` que
contém os atributos: nome, endereco, idade.
java
Com a classe já feita então temos que fazer os **Getters e Setters**.
Essa é a maneira com que eu normalmente faço, porém quanto mais atributos nossa
classe possui, mais tempo eu demoro digitando os Getters e Setters. Imagina se a
nossa classe `Desenvolvedor` tivesse 10 atributos o tanto de tempo que gastaríamos
para fazer a mão.
Com isso vamos usar uma das keysmaps para fazer isto iremos apertar **CTRL + 3** e
vamos digitar **ggas** para gerar os Getters e Setters ter o seguinte:
imagem.
Para não ter que digitar tudo, o eclipse nos oferece a opção de autocomplete,
quando digitamos `main` uma caixa com algumas opções vai se abrir, vamos escolher a
primeira e apertar ènter`.
O Main é ele que determina o ponto de início de execução da nossa classe.
![]
Com isto vai ser gerado nosso método main e vamos instanciar o desenvolvedor
passando o nome e o endereço e vamos mostrar o nome do desenvolvedor.
java
![]
# Para saber mais

As vezes esquecemos quais são os parâmetros que devemos passar no construtor, então
vamos navegar para a classe Desenvolvedor com o atalho **ctrl + shift + t** e vamos
digitar o nome da classe.
![]
Aparentemente parece ser um exemplo bem bobo, mas quando estamos em grandes
projetos pode ser de muita ajuda e com isso conseguimos ver os parâmetros que
devemos passar no construtor
# Conclusão
Como vimos o eclipse tem uma série de atalhos para nós ajudar durante o processo de
criação de software.
Se ficou interessado em como o **Eclipse** funciona e como você pode utilizá-lo

melhor, aqui na Alura [**temos um curso falando sobre o aumento da sua
produtividade**] com o eclipse onde vamos aprender vários atalhos que irão
facilitar sua maneira de trabalhar com o eclipse.
Tive a chance de conversar com a Paula Nakayama, Analista de SEO e instrutora do

curso de acompanhamento de métricas em SEO do Alura. Ela nos deu algumas dicas que
fazem toda a diferença para quem está começando e quer seguir carreira como
analista SEO.
http://www.youtube.com/watch?v=wtE4-wonI9E
- Quais dicas você tem para quem começa agora e quer se especializar como analista
SEO?
A primeira coisa que você precisa fazer para trabalhar com SEO, para ser um
analista, é realmente encontrar um curso básico, no mínimo, que irá [**ensinar
desde rastreamento dos robôs de busca ao trabalho**]. Hoje existem vários no
mercado, não é difícil de achar algum que tenha a sua cara.
- É importante para o analista SEO entender de programação e design?
O trabalho de um analista SEO está muito envolvido com outras áreas. Para você
conseguir ter uma boa atuação é importante saber um pouco de HTML e CSS, pois essas
linguagens impactam diretamente no trabalho que estamos fazendo. O modo como elas
são implementadas pode fazer total diferença no trabalho de SEO. Também existe a
integração com trabalhos de UX, uma área que nos ajuda a tomar várias decisões
ligadas à melhoria de usabilidade para atendermos melhor o usuário e deixar um
pouco de lado o motor de busca.
- Então entramos num conflito, pois um mesmo recurso deve atender tanto o robô
quanto o usuário.
No geral, o trabalho de SEO precisa estar focado no usuário, nunca será somente
para um motor de busca. Porém, no melhor dos cenários, conseguimos atender os dois
públicos.
- A primeira coisa que vem na minha cabeça quando penso em SEO é uma busca orgânica
e aquilo que apresentamos para o usuário é muito importante. Isso influencia o
trabalho do analista SEO?
Sim, influencia. E um do pontos ligados a isso é o conhecimento que o analista SEO
deve ter de marketing, é saber falar com o público-alvo e conhecer o negócio da
empresa em que estamos atuando para ter maior probabilidade de conversão.
Para quem quer se tornar um analista SEO, o diferencial, então, é fazer um curso,
mesmo que básico, entender **HTML e CSS**, para saber como nossas ideias estão
sendo implementadas. Precisamos nos preocupar também com a usabilidade e conhecer
muito bem o mercado e o produto.
Pensando nesses detalhes a Paula criou junto conosco um curso sobre [**métricas e

relatórios SEO**].
Tudo pode virar um verdadeiro caos se não souber se dividir entre criar, vender,
entregar, testar e até gerir as atividades financeiras.
Se você se identificou com essa situação, deve saber que a proposta certa aumenta
significativamente as chances de conquistar novos clientes e melhora sua
credibilidade, já que evidencia o verdadeiro valor do seu trabalho.
Por isso, não deixe de conferir estas dicas que preparamos para você se destacar na
sua próxima proposta de design!
## 1\. Converse com o cliente
Antes de mais nada, você deve conhecer as expectativas do cliente e do que ele
precisa para aquele momento. Por isso, agende um encontro, seja no próprio
escritório do cliente, em um café ou por [**videoconferência**], se necessário.
Ao consultar o site ou o blog da empresa, reúna um [**briefing**] com informações

relevantes para a conversa, como missão, valores e área de atuação. Identifique
também seus concorrentes, pois isso é importante para levantar os diferenciais
competitivos.
## 2\. Identifique o público-alvo
Para elaborar uma proposta de melhoria, é preciso conhecer o estilo de vida do

usuário final, observando pontos como faixa etária, gênero, trabalho, hábitos de
consumo, etc. Considere também questões como suas preocupações, dúvidas e
aspirações diárias.
Isso te ajudará a identificar quais são as características desejáveis para o seu

projeto de design, como qual material a ser utilizado, a textura, formas, cores,
etc. Esse apelo emocional permite [**criar uma experiência**] única, marcante e
duradoura.
## 3\. Defina os requisitos
Para facilitar o direcionamento da sua proposta, entenda a dimensão do projeto

solicitado pelo cliente. Por exemplo, um projeto de redesign pode ser inteiramente
novo ou com ajustes mínimos. Isso inclui avaliar o porte da empresa e o impacto do
projeto no ramo de atuação dela.
De acordo com a [**ênfase do projeto**], liste preliminarmente quais materiais e

recursos estão disponíveis e quais serão necessários para atingir o objetivo final
da proposta. No caso de uma identidade visual, deve-se considerar logotipo, cartão
de visita, folders, entre outros itens.
## 4\. Estabeleça os prazos
O cronograma é essencial para organizar as tarefas necessárias à concretização da

proposta, assim como para manter o cliente informado sobre o trabalho. Depois de
descobrir os prazos disponíveis, o ideal é sempre acrescentar um tempo para
prevenir qualquer imprevisto.
Além disso, o calendário também ajuda a determinar o valor do seu orçamento de

design.
Projetos de maior impacto requerem planejamento e dedicação completa em etapas

específicas. Logo, seu custo será mais alto. Estabeleça também um prazo de validade
para a proposta, pois essas metas foram baseadas somente nas necessidades daquele
momento em específico.
## 5\. Elabore o repertório visual
Os [painéis semânticos (mood boards)] organizam visualmente toda a pesquisa

informacional, servindo de [inspiração para o desenvolvimento criativo] de uma nova
proposta. Eles podem ser agrupados em: estilo de vida do público-alvo, expressão do
produto, materiais, cores, produtos similares, entre outros.
Esses painéis também são uma ótima pedida para explicar didaticamente o conceito da
sua proposta ao cliente. Você pode utilizar plataformas simples de colagens como
[Canva], [Google Fotos], e [Pinterest].
## 6\. Apresente a solução ideal
A solução deve focar nas aplicações práticas, com ambientações de uso e projeções
futuras. Reforce suas vantagens apontando estatísticas e cases de sucesso.
Para expor sua ideia ao cliente, vale desde apresentações bombásticas até um
miniportfólio por escrito.
O objetivo aqui não é a complexidade: às vezes, para conquistar um cliente, basta

uma capa simples com dados de contato e sua marca pessoal, mostrando que mesmo uma
documentação pode parecer personalizada e profissional.
Existem [algumas plataformas] que você pode utilizar para criar sua apresentação.
Avalie o perfil de cada cliente e trace estratégias compatíveis. Recomendamos que
inclua além dessas informações: descrição breve do seu currículo, [**principais
trabalhos**] naquele segmento e até o seu [**processo criativo**].
## 7\. Defina um orçamento adequado
O orçamento de design deve considerar aspectos como segmento da empresa, dimensão

do projeto e prazos disponíveis. Reserve essa etapa para o final. Dessa forma, o
cliente absorve primeiro o valor do seu trabalho em vez de ater-se somente aos
preços.
Isso também evita que, durante a pressa, você se esqueça de considerar alguns
detalhes importantes: despesas com materiais e recursos, custos adicionais com o
tempo de pesquisa e até mesmo a assinatura de um [**banco de imagens**].
[Calcule a sua hora de trabalho] a partir da sua carga horária disponível. Inclua
também o seu próprio nível de experiência com aquele tipo de projeto, pois isso
determina a dificuldade em desenvolvê-lo. Depois de considerar esses itens, é só
fazer um orçamento com base no tempo médio que você levará para concluir o projeto
solicitado.
Sempre que possível, separe os valores de cada item solicitado pelo cliente, pois
isso o ajudará a entender a base do cálculo final do orçamento. Para facilitar a
sua organização, você pode separar também pacotes de serviços que oferece, por
exemplo, identidade visual ou desenvolvimento de site.
## 8\. Determine um roteiro próprio
Cada designer tem a liberdade de construir uma proposta conforme suas exigências e
foco do projeto, seja ele de produto, seja de interface ou gráfico. Por esse
motivo, não há um roteiro universal para elaborá-la: é preciso realizar um trabalho
colaborativo entre você e o seu cliente.
Saiba que passar o orçamento de design logo na primeira conversa não é uma
estratégia recomendada. Isso porque, na ansiedade de fechar o negócio, você pode se
esquecer de detalhes que posteriormente te deixarão em desvantagem.
Considerando que o cliente sempre tentará pechinchar ao máximo, cabe a você manter
o orçamento consistente.
Procure não negociar preços abaixo da sua [própria tabela], pois eles podem te
render trabalhos no curto prazo, mas podem também desvalorizar o seu esforço. Não
se esqueça: parte da sua motivação vem da quantia que você vai receber.
O **jQuery** já foi tão utilizado, que algumas pessoas achavam que ele era uma
linguagem diferente do **JavaScript** que rodava na web. Hoje em dia apesar de
**frameworks como Angular, React, Vue** e outros estejam em alta, ainda existam
muitos projetos que utilizam essa ferramenta e é bem provável que na empresa onde
você trabalha, você possa precisar mexer em algum projeto que esteja usando essa
biblioteca.
Nesse artigo vamos fazer um tour por alguns dos recursos mais importantes que o
jQuery possui e que podem economizar muito tempo de [**stackoverflow**].
[imagem do jQuery
Se quisermos selecionar todos os **links** de um site, via jQuery precisamos

somente escrever o seguinte código:
js
imagem** no jQuery possui vários super poderes, mas os mais utilizados no dia a dia
são os de **selecionar** elementos e o de criar estruturas HTML.
js
imagem basicamente diz que queremos pegar o primeiro item dentro do **"objeto
jquery"** que estamos trabalhando.
Sempre que fazemos o uso do `$()` para criar ou selecionar um elemento o resultado
da função parece um array, mas na verdade o jQuery sempre retorna um objeto com
vários itens em uma estrutura que chamamos de **array-like**, pois ele parece um
array mas não possui recursos como **.map, .filter** e outras funções comuns para
um array de verdade.
Caso queira percorrer uma lista de elementos com jQuery, o correto é utilizar a
**função `.each`** como no exemplo abaixo:
js
### Adicionando eventos com jQuery
Para adicionar um **evento de click** ou qualquer outro tipo para uma tag HTML,
tudo o que precisamos fazer é um dos códigos abaixo:
js
Por padrão o código anterior vai adicionar o evento para todos os elementos da
página, por isso já deixo aqui que também [é possível trabalhar com o conceito de
**event delegation**] que é mais performático que o mostrado no exemplo anterior, e
vai funcionar perfeitamente em casos onde você tenha elementos que sejam
adicionados dinamicamente na página.
Um outro tópico, importante de tomar cuidado é que como todas as alterações são
feitas de forma global, é importante criar "escopos" prefixando seletores por
página, seja trabalhando via módulos ou alguma outra estratégia que julgar
interessante. Eu particularmente acho bem interessante o formato que o [pessoal do
BootStrap criou os componentes jQuery dele na versão 3 da biblioteca sempre
utilizando data atributos] para não ficar preso nas classes do CSS.
## Como trabalhar com "componentes jQuery" no estilo React?
Hoje em dia com recursos mais modernos na linguagem JavaScript como a **`template
string`**, é possível criarmos elementos dinamicamente de forma bem similar a como
é feito no **React**:
<iframe height="265" style="width: 100%;" scrolling="no" title="jQuery: React Like"

src="https://codepen.io/omariosouto/embed/oNNaLym?height=265&theme-
id=default&default-tab=js,result" frameborder="no" allowtransparency="true"
allowfullscreen="true">
</iframe>
O array que usamos poderia ser a **resposta de uma API** qualquer e tudo
funcionaria normalmente.
### Selecionando elementos antes e depois de ter um previammente um selecionado
Se a partir de um elemento você quiser fazer um **filtro** mais específico se

aprofundando nos elentos filhos, basta utilizar a função **`.find()`**:
js
Já se a partir de um elemento filho você quiser **selecionar o elemento pai com um

nível voltando para cima no html**, você pode utilizar o `.parent()` ou se quiser
selecionar todos os anteriores, basta utilizar `.parents()`
js
Caso você queira procurar a partir de um filho o pai mais próximo subindo até a tag
html na raíz de tudo, você pode utilizar o .closest();
js
### Alterando atributos de uma tag
Como disse anteriormente, o jQuery é simplesmente uma casca em volta das

funcionalidades padrão do DOM e para alterar atributos, ao invés de
utilizarmos .getAttribute ou setAttribute, utilizamos a função .attr()
js
> Existem diversas funções específicas para lidar com atributos que podem ser super
úteis como [**addClass**] e [**removeClass**], mas no geral o attr vai resolver boa
parte dos problemas.
## Como fazer AJAX com jQuery?
### $.getJSON
Hoje em dia é super comum trabalharmos com APIs para pegarmos dados de diversos
serviços e só então mostrar algo para o usuário, muito antes da [**Fetch API**] ser
muito usada ou o próprio [**axios**], o próprio jQuery já possuía uma alternativa
embutida com a lib que facilitava trabalhar com as requisições entre browsers. Se
quisermos só pegar dados de algum serviço podemos executar o código abaixo
js
### $.ajax
js
> Se você já teve problema com [**CORS**] o jQuery possui uma forma bem legal de
resolver isso somente passando no objeto que o $.ajax recebe essa combinação de
chave valor `dataType: 'jsonp'`
## Solucionando problemas comuns com jQuery
Históricamente o jQuery possui diversas soluções para problemas comuns da web,

segue abaixo uma listinha com alguns dos mais comuns que ele resolveu com libs que
funcionam muito bem até os dias de hoje.
### Trabalhando com mascaras de campos com jQuery Mask:
Para trabalhar com **máscaras** no jQuery, sem precisar de **regex** ou algo do

tipo, tudo o que precisamos fazer é adicionar a lib **jQuery Mask** e executá-las
ao carregar de uma página web um ou mais dos códigos abaixo:
js
Os **patterns** aqui ficaram super bem abstraídos e você pode [ver como usar melhor
acessando a documentação da lib aqui]
### Outras bibliotecas úteis
- [**SlickJS**]: Sem dúvidas é uma das bibliotecas mais completas quando o assunto
é criar aquele famoso componente amado por vários clientes e não tão puplar assim
com o pessoal de UX para fazer os Carrosseis tanto com imagens como com elementos.
- [**SweetAlert**]: Eu tenho certezae que várias vezes você já pensou "Como colorir
o alert do navegador?" essa lib sem dúvidas é uma resposta para essa pergunta,
relativamente leve e super completa é uma alternativa quando você precisa dar um
feedback mais bonitnho para o usuário e por algum motivo isso não foi inicialmente
planejado no sistema (já passei por vários casos assim).
- [**FitText**]: Essa lib eu recomendo para alguns casos específicos, mas no geral
ela pode ser uma boa saída quando você está fazendo alguma página que tem um layout
muito específico e cada elemento texto precisa ocupar exatamente a quantidade de
linhas especificadas no layout, não recomendo como solução para todo caso, mas é
sempre bom saber que existe algo para ajudar.
- [**ScrollMe**]: Sabe aqueles sites que enquanto você da scroll vão fazendo uma
série de mágicas e vários elementos pipocam na tela? Essa lib ajuda justamente a
fazer isso.
- [**Parallax.JS**]: Quem já trabalhou em agência sabe que esse é o top 1 efeito
solicitado e que da arrepios na espinha quando você vê alguém discutindo sobre ele,
o tal do parallax. Essa lib tem uma solução bem legal e usei em vários projetos no
passado
- [**ScrollMagic**]: Já acessou sites tipo o de campanhas de produtos novos da
apple com diversas coisas surgindo como se fossem um filme e se perguntou como
aquilo é possível de ser feito via Scroll? O scroll magic é uma lib que resolve
justamente esse tipo de site e usa o jQuery. E caso você queira uma outra
referência deixo a lib [**Skrollr**] que também resolve legal esse tipo de site.
## Conclusão
Mesmo com o uso da biblioteca não sendo mais tão popular assim em projetos novos, o
jQuery possui um pacotão de soluções para facilitar a vida em diversos casos, seja
para trabalhar com manipulação de elementos, ajax e até mesmo resolver diversos
problemas comuns da web relacionados a **validação e componentes interativos**.
Ainda me arrisco a falar que em diversos casos onde você só precisa fazer uma coisa
simples ele pode ser uma boa saída, ao invés de utilizar um framework JavaScript do
momento. E caso você queira mais dicas sobre o mundo do Front End, da uma olhada na
minha série aqui na Alura [**Fronteiras do Front End**]
E ai quer conhecer mais sobre o jQuery ?? Aqui na **Alura** temos uma [**Formação
Front-end**] onde além de aprender HTML, CSS e JavaScript, você ainda vai aprender
muito mais sobre o [**jQuery**]
Por hoje é isso, espero que tenha gostado, em breve trarei mais dicas sobre
diversos outros tópicos relacionados a Front End, não deixe de me seguir nas
[minhas redes sociais] e acompanhar meus outros artigos em meu site pessoal
[https://mariosouto.com].
imagem
Vamos imaginar uma empresa como o [Nubank], seu nome é ByteBank. A primeira vista
ela vende cartões de crédito e possui uma estratégia de marketing de conteúdo para
seus clientes (Business to Consumer, B2C).
Agora ela está lançando um novo cartão focado em empresas e quer criar uma
estratégia de marketing de conteúdo para outras empresas (business to business,
B2B).
Como eles podem criar essa estratégia? É possível utilizar ideias e ferramentas do
marketing de conteúdo B2C para o B2B?
No marketing de conteúdo criado para B2C da ByteBank é muito enfatizado que as

principais vantagens da empresa são:
- saber o limite na hora;

- não pagar qualquer tarifa e
- não ter que lidar com burocracia na hora de fazer o cartão.
Então, todo o plano é focado em criar conteúdos sobre questões relacionadas ao

mundo financeiro, para mostrar que a empresa é especialista no assunto,
transmitindo uma confiança aos clientes.
A equipe de marketing escreveu um texto no qual foram explicadas todas as taxas do

cartão de crédito. Depois de explicar com detalhes o que é cada taxa, foi mostrado
o porquê do cartão dessa empresa não cobrar nenhuma delas.
Para mostrar na prática o quanto o consumidor economizaria, eles deram como um

exemplo que mostram o que pode ser comprado com o dinheiro economizado em tarifas
do cartão. Veja como ficou o texto:
> Se a tarifa é de 30 reais por mês, depois de um ano: 30 (tarifa) \* 12 (meses) =

360, você gasta R$ 360,00 só em tarifas! Não seria muito melhor comprar um Kindle
ou dois jogos para Playstation 4 ou, até mesmo, ir uma vez por mês ao cinema (e
pagando inteira) com esse dinheiro em vez de pagá-lo em tarifas?
Será que se pode fazer a mesma coisa para o B2B, já que não existem tarifas para
empresas também?
As empresas que querem comprar um produto precisam avaliar muito bem toda a compra,
sempre se perguntando se aquele produto realmente compensa para ela, principalmente
a longo prazo.
Então, e se fosse dito coisas que a empresa poderia fazer com o dinheiro que também
vão trazer um retorno financeiro, ao contrário das taxas dos bancos? Como fazer
pesquisas com usuários, desenvolver novos produtos, treinar pessoas para marketing,
entre outras coisas?
Pensando nessas diferenças, utilizamos o mesmo exemplo: quanto seria economizado

por ano pela empresa cliente. Porém, no texto inteiro, queremos também mostrar
dicas de como ela pode poupar, de diversas maneiras, mesmo usando um cartão de
crédito. Então, o exemplo de economia no texto ficou assim:
> Pensando que a tarifa para empresas é mais barata que para pessoas físicas, ou
seja, de 30 reais, passa a ser 10 reais por cartão para cada colaborador, e dez
cartões serão feitos, cada um pertencendo a colaborador, depois de um ano, serão
pagos: 10 (de tarifa) \* 10 (quantidade de cartões) \* 12 (meses do ano) = 1200.
>
> Assim, a organização gastaria R$ 1.200,00 para manter os cartões durante esse
período. Agora, se os cartões não possuem tarifa nenhuma, em vez de pagar esse
valor, a empresa economizará R$1.200,00.
>
> Agora, com essa economia, você poderia investir em treinamentos ou eventos, que,
após um tempo, poderiam aumentar ainda mais o retorno da empresa.
Foi usada uma linguagem mais formal do que a B2C porque quando estamos lidando com
empresas temos que ser mais práticos e mostrar exatamente o que a empresa ganha, e,
no caso, até como poderia ganhar mais depois.
Além dessa mudança na linguagem, tivemos ideias diferentes de conteúdo. No B2C

foram apresentados conhecimentos a respeito de cada taxa, para que a pessoa entenda
o que está pagando e confie em empresas que não cobra as taxas.
Agora para B2B foram apresentadas formas para economizar no cartão, pois, muitas
vezes, os empresários sabem o que é cada taxa do cartão e tem que utilizá-lo mesmo
assim. Então, mostramos como ele pode economizar e, uma dessas formas, é usar o
cartão da ByteBank.
Nesse mesmo texto para B2B também acrescentamos o conteúdo de outra vantagem do
cartão: poder determinar um limite de gastos para cada categoria nos cartões dos
funcionários da empresa.
Dessa forma, os funcionários não podem gastar mais do que o determinado e, assim, a
empresa consegue economizar e planejar os gastos e não extrapolar com compras dos
funcionários.
O foco da comunicação B2B que utilizamos foi dar dicas para não cometer erros e
economizar mais, para que a empresa perceba que utilizar o cartão é vantagem.
E caso a sua empresa seja diferente da ByteBank, seja só B2B e não tenha nenhum
plano de comunicação focado para B2C para se basear?
Existem diversas empresas B2B:
- as que vendem tanto para B2B quanto para B2C, como a ByteBank;
- as que vendem para ambos os consumidores, mas possuem um foco maior no B2B, como
a [Marmotex], que tem como serviço entrega de marmitas e entregam tanto para
consumidores quanto empresas, mas possuem um foco maior em organizações e
[catering] [] para eventos, ou seja, B2B
- as empresas somente B2B, como as de agências de publicidade.
Cada uma das empresas que são B2B possui um produto e um serviço para mostrar.
Então, caso você trabalhe em uma empresa que não possui um plano de marketing de
conteúdo para B2C para se basear, [é só seguir a ideia do marketing de conteúdo],
de passar informações relacionados a sua empresa, tornando-a uma autoridade no
assunto. E, além disso, mostrar maneiras que o seu produto e/ou serviço pode ajudar
a empresa em determinado tema.
No B2B, como no marketing de conteúdo focado no B2C, é importante frisar a

importância e a relevância do produto e/ou serviço para o cliente. E, melhor, a
longo prazo.
A empresa cliente precisa entender e saber que a vantagem trazida pelo produto será
duradoura. Pois o processo de compra B2B é mais longo justamente porque há muito em
jogo e muitas pessoas envolvidas.
Mudar de produto ou serviço é trabalhoso e pode causar prejuízo para a empresa,

assim, eles buscam e precisam de garantias de que a solução funcionará por muito
tempo.
Assim, como no marketing B2C, os tipos de conteúdo devem se atentar aos clientes em
[cada fase do funil de marketing de conteúdo] para trazer o conteúdo certo para a
empresa em cada momento da obtenção do cartão.
Para isso, a Bytebank utilizou dados, números, infográficos e mostrou com exemplos
práticos maneiras de ajudar a contratante. Também escreveu conteúdos com histórias
de empresas - os chamados _cases_ de sucesso - que obtiveram lucro ou sucesso com o
produto/serviço.
Além disso, apresentou novidades e dicas tanto da sua empresa, que passou a
fornecer uma conta para pessoas físicas e jurídicas, quanto do segmento dela, com
informações que podem ser úteis ao cliente do setor financeiro.
Como vimos, as principais diferenças entre os conteúdos B2C para o B2B são a
linguagem, que deve ser mais formal se for B2B e apelar para o emocional se for
B2C.
No B2B você estará lidando com pessoas que tomam decisões nas empresas, então
deverá mostrar como o produto pode ajudar a empresa, de preferência a longo prazo.
Fora isso, o tipo de conteúdo pode ser o mesmo do marketing de conteúdo B2C.
Passando desde textos sobre novidades, inovações e dicas na área, até infográficos
com dados de pesquisas, vídeos, áudios de podcast, imagens e publicações nas redes
sociais.
Também, para conteúdo B2B, é muito comum encontrar whitepapers, grupos de usuários,
meetups, cases de sucesso, trial gratuito, e até mesmo vídeos ou campanhas e posts
de marketing com influenciadores.
Agora, se você quiser saber mais sobre marketing de conteúdo, pode fazer nosso
[**curso de Marketing de Conteúdo**] e, também, conferir mais informações no livro
da Casa do Código, [**Marketing de Conteúdo: Estratégias para entregar o que seu
público quer consumir**].
imagem
Se você é um **desenvolvedor Android experiente**, não é novidade que o SDK do

Android não opera com as versões mais recentes do Java, em específico, atualmente
temos 100% de compatibilidade com a versão 7 do Java.
Isso significa que [**as features legais que temos no Java 8**] ou mais, por
padrão, não estão disponíveis!
Como uma alternativa, a própria comunidade desenvolveu libs capazes de trazer um

pouco da experiência do Java 8 no Android, como é o caso do [**Retrolamba**] que
permite o uso de expressão lambda para interfaces funcionais (Single Abstraction
Method).
## Jack toolchain e o desugar
Com base no interesse da comunidade, a própria equipe da Google disponibilizou o

_[**Jack**]_ (Java Android Compiler Kit), também conhecida como _Jack toolchain_,
como uma alternativa experimental, para possibilitar algumas features do Java 8
'nativamente'.
Mesmo tendo uma proposta boa, a configuração via _Jack toolchain_ não era das
melhores, como também, haviam outros [**impactos**] que o depreciaram :(
Então, a partir da versão 3.0 do Android Studio, a Google otimizou essa solução
adicionando uma etapa a mais na transformação de bytecode chamada _desugar_:
![]
O desugar opera logo depois do código ser compilado pelo próprio compilador do
Java, possibilitando o uso das features do Java 8 mesmo tendo a limitação de
versão.
## Habilitando o Java 8 de maneira

Para habilitar as features do Java 8 com o desugar, precisamos apenas adicionar o
seguinte script no arquivo de build do módulo:
java
Pronto, somos capazes de usar as features do Java 8 disponibilizadas.
> "Legal, mas em quais situações posso usufruir das features do Java 8?"
A mais comum está relacionada às interfaces funcionais, como é o caso de listeners,

por exemplo, um listener de clique com expressão lambda fica da seguinte maneira:
java
Comparando com a maneira 'tradicional':
java
Bem mais simple, né?
## Limitações com o uso do Java 8
Entretanto, nem todas as features estão acessíveis para qualquer versão de SDK do
Android, mas não fique triste, abaixo estão as features disponíveis em quaisquer
versões:
- [Expressões lambda];
- [Referências de método];
- [Anotações de tipo];
- [Métodos de interface padrão e estáticos];
- [Repetição de anotações].
Da mesma forma, existem outras APIs, como é caso da classe [**Stream**], que só são
suportadas quando utilizamos a versão 24 como SDK mínimo. Outro caso são as classes
do pacote [**java.time**] que exige a API 26.
De qualquer forma, é possível verificar os pacotes acessíveis [**diretamente pela

documentação do Android**]. Agora vem a questão:
## Vale a pena habilitar o uso do Java 8 no ambiente Android?
Caso o seu objetivo são features são suportadas por todas versões de SDK do seu
projeto, faz muito sentido usufruir do Java 8.
Agora, se tiver que modificar o suporte mínimo, não é recomendável a mudança,

afinal, você **vai deixar de atender mais usuários por algo que não trás tanto
valor para o produto final**.
> "Puts, eu queria muito ter acesso à API do `Stream` ou `LocalDate`, mas não posso
aumentar o suporte mínimo do SDK, e agora?"
Existem algumas libs que podem ser adicionadas, como é o caso da [**Lightweight-
Stream-API**] e a [**joda-time**]. É importante ressaltar que elas possuem uma
interface similar às do Java, mas a implementação pode ter diferenças, como a
ausência de processamento paralelo.
## Abrindo portas para o Kotlin

Muito provavelmente, você já ouviu falar sobre a [**linguagem Kotlin**] para
desenvolver Apps Android.
A partir dela, temos suporte a expressão lambda, métodos padrões de interfaces

entre outras features que não existem na própria linguagem Java, como é o caso de
extensão de função, funções de alta ordem entre outras que vemos [**formação
desenvolvimento mobile**].
imagem
Imagine que você está tentando fazer o download de um arquivo e se depara com esta
situação:
imagem, deixa claro que você efetivamente realizou a ação de se inscrever e foi
incluído na lista, assim como os 255 inscritos antes.
Tanto em Apps quanto em sites, existem detalhes que poderiam facilitar muito a
compreensão das funcionalidades de nossos sistemas. Porém, costumamos negligenciá-
los acreditando que são pontos tão pequenos que não demandam tanta atenção.
**Grande erro!**
Pensar em como extrair dos nossos Apps ou sites elementos para uma melhor
experiência de usuário é muito importante. Ao criar uma boa experiência, teremos
chances muito maiores de [**engajar nossos usuários**].
Mas quais os limites para as microinterações? O que posso considerar como um

detalhe relevante de ser trabalhado?
## Criando microinterações
As microinterações podem acontecer desde o botão que liga ou desliga uma

funcionalidade até um som de mudança de estado, como no caso do botão "curtir" do
Facebook, apontado anteriormente.
É importante alinhar bem quais as funcionalidades (ou **regras**) do seu sistema,

antes de mais nada, verificando quais as interações já existentes e como melhorá-
las.
Com tudo isso alinhado, podemos definir quais serão os **gatilhos** para cada
microinteração, se são cliques, gestos ou qualquer outro tipo de ação.
Depois de ativada, a microinteração gera **respostas** (sejam de confirmação ou

erro), notificando o usuário do que aconteceu. Esta é uma boa prática para evitar
que o usuário se sinta desorientado enquanto utiliza o aplicativo, reforçando que
cada ação foi acionada.
E, por fim, temos que considerar os momentos em que o usuário será notificado para
realizar uma ação, criando **ciclos de interação** e evitando que fique muito tempo
sem utilizar nosso App (ou site).
Ou seja, seguimos algo como:
imagem
Quer também entender um pouco mais de práticas e conceitos de usabilidade? Na Alura
temos um curso bem legal de [**UX Usability**] falando um pouco de prototipação e
conceitos da [**Heurística de Nielsen**] de usabilidade.
Recentemente alteramos o Design da **seção interna** (onde os alunos fazem os

cursos) da [Alura], sem criar novas funcionalidades. Mas infelizmente acabamos nos
esquecendo de colocar o botão de editar um post no fórum do Alura.
imagem
Esquecemos do botão editar no fórum da Alura.
Esquecer do botão de editar não foi um erro só nosso.

Eu não me esqueço quando eu estava utilizando o app do Facebook e adicionava um
comentário com algum erro. Eu tinha que correr pra versão desktop pra conseguir
editar o comentário (tristeza no coração).
Se a gente for pensar, é um erro bem simples de resolver e também de esquecer de

implementar. Pensando nesses problemas o **grande pai da usabilidade**, [Mr. Jakob
Nielsen] criou o que chamamos de **10 heurísticas de Nielsen**, algo que vemos
bastante no [curso de UX presencial da Caelum]. Bora entender cada uma delas pra
ver se a gente consegue errar um pouco menos. 🙂
* Visibilidade de qual estado estamos no sistema

* Correspondência entre o sistema e o mundo real
* Liberdade de controle fácil pro usuário
* Consistência e padrões
* Prevenções de erros
* Reconhecimento em vez de memorização
* Flexibilidade e eficiência de uso
* Estética e design minimalista
* Ajude os usuários a reconhecerem, diagnosticarem e recuperarem-se de erros
* Ajuda e documentação
# 1. Visibilidade de qual estado estamos no sistema

É responsabilidade do sistema informar o que está acontecendo em real time pro
usuário.
Quando estamos assistindo/ouvindo uma playlist do Youtube, do lado direito fica bem
claro: qual vídeo estamos assistindo; qual é próximo; quais assistimos ou não.
imagem
# 2. Correspondência entre o sistema e o mundo real

Em relação ao **mundo real** podemos considerar: sons, visual e o tom de escrita
que usuário utiliza para se comunicar. Implementamos bastante esta heurística
quando utilizamos uma seta, ícones e utilizamos a cor vermelha para elementos
negativos.
Um software que usa essa heurística é o Photoshop em sua barra de ferramentas.
imagem
# 3. Liberdade de controle fácil pro usuário

Essa foi a heurística que me motivou a fazer esse post. Nesta heurística, a
preocupação é de passar pro usuário a liberdade de ele fazer o que quiser dentro do
sistema com exceção das regras que vão contra o negócio ou interferem em outra
funcionalidade.
Por exemplo quando criamos um tweet é bacana poder deletá-lo se estivermos afim.
Mas não dá pra editar um tweet. Imagina se você dá um retweet e depois o usuário
que fez o tweet muda o texto pra uma coisa que você não acha legal. Sacanagem né!
imagem
# 4. Consistência e padrões
É importante manter a consistência e padrão visual (texto, cor, desenho do
elemento, som e etc).
Por exemplo, no fórum [GUJ](Grupo de usuários Java), quando vamos responder um

post, o botão para enviar a resposta sempre é da mesma cor, tamanho e texto. O
elemento para cancelar a resposta sempre tem seus padrões:
imagem
# 5. Prevenções de erros
Não é uma boa ideia deixar seu usuário errar sem explicar previamente o motivo do
erro. Melhor do que isso, tente criar um interface que permite o usuário não errar.
A busca do Google faz isso de uma forma muito inteligente. No momento que começamos
escrever nossa busca ele já te entrega algumas sugestões, mesmo se a gente escrever
a busca com uma ortografia errada ele realiza a busca e pergunta se estamos
procurando outra informação com a ortografia correta.
Realizando uma busca no Google:
imagem
Resultado da busca com erro de ortográfica:
imagem
# 6. Reconhecimento em vez de memorização

O usuário não tem obrigação de decorar qual foi o caminho que ele fez pra chegar
até a página.
Por exemplo, quando você entra em um produto do site da Locaweb é disponibilizado o

caminho que você fez pra chegar até ele. Nós chamamos isso de *breadcrumb*.
imagem
# 7. Flexibilidade e eficiência de uso

É importante deixar uma experiência boa com seu sistema desde o usuário mais leigo
até o mais avançado.
Por exemplo, dentro do Trello (kanban de tarefas online com base em colunas free)
quando você está com o foco em um cartão você pode utilizar o mouse para navegar em
outros cartões, as teclas direcionais (setas pra cima e pra baixo) ou as letras j
(para baixo) e k (para cima). Teclas que são por sua vez utilizadas no VIM, editor
de texto famoso entre os desenvolvedores.
imagem
# 8. Estética e design minimalista

Por favor não encha linguiça. Toda informação extra que você deixar pro seu usuário
pode na verdade adicionar mais uma dúvida, ou seja, deixe o seu layout e o conteúdo
o mais simples e direto possível.
Um app que gosta muito dessa heurística é o da Nubank. Pra gerar o boleto de
pagamento da sua fatura só são necessárias duas telas e elas são bem simples e
realmente objetivas.
imagem
imagem
# 9. Ajude os usuários a reconhecerem, diagnosticarem e recuperarem-se de erros

As mensagens de erros tem que ser claras e próximas do conteúdo ou ação que causou
o erro.
No formulário de cadastro do Spotify, caso você não preencha os dados necessários

ele deixa bem claro quais campos estão faltando, com um mensagem clara e objetiva.
imagem
# 10. Ajuda e documentação

É uma boa não precisar dessa heurística. Implementar documentação e sistema de
ajuda sempre é chato e muitos usuários têm o costume de ignorar ambos mas, se for
realmente necessário, deixe a documentação próxima do usuário e do elemento ou ação
que tenha necessidade de uma explicação mais detalhada.
Por exemplo, no formulário de pagamento do Walmart tem um campo pra preencher o

código de segurança do cartão. Como não é algo muito óbvio, tem uma imagem próxima
ao campo mostrando onde fica o código de segurança do cartão. Essa é uma boa forma
de fazer uma documentação feliz.
imagem
Com o erro que cometemos no novo layout do Alura vimos que é uma boa passar pelas
10 heurísticas de Nielsen antes de subir um novo layout. Em que momento você acha
bacana utilizar as heurísticas no seu projeto?
imagem
Uma editora de livros possui em seu site uma página de fale conosco para melhor
atender os seus cliente. Nesta página foi criado um formulário com nome, endereço e
telefone.
O problema é que o campo de telefone está sem formatação permitindo que o cliente
digite quantos números quiser. Com isso o campo pode receber um número como:
imagem, retornando somente aquele trecho que escolhemos.
Como vamos dividir a sequência de números em duas partes, criamos duas variáveis
que vão receber essas partes e uma outra que será responsável por formatar os
números:
- const parte1, que vai pegar a primeira posição até a posição 5

- const parte2, que vai pegar da posição 5 até a última posição
- textoAjustado, que vai interpolar o resultado das duas variáveis com o traço
js
Com o código pronto temos o seguinte resultado : ![]
Ótimo! Conseguimos fazer a formatação que queríamos. Agora, com lógica pronta
precisamos encontrar uma maneira de disparar essa função toda vez que o cliente
tiver digitado o telefone no campo.
## O evento onblur
O [**evento blur**] é acionado quando um elemento perde foco, ou seja logo após o
cliente ter digitado o telefone e clicar em outro campo, o evento ònblur` é
disparado chamando nossa função e realizando a formatação do telefone.
Passamos o `this` como parâmetro da função, para dizer que o parâmetro está dentro
do contexto da nossa função.
html
## O evento onfocus
Com a função pronta, vamos uni-la ao [**evento onfocus**], que será responsável por
disparar nossa função enquanto o campo do ìnput` estiver em foco.
html
Como vimos as validações são sempre problemas complexos devido as inúmeras

possibilidade de interação do usuário.
## Para saber mais
Outra possibilidade de fazer nossa formatação seria através das [**expressões

regulares**], que nada mais são que combinações de caracteres que utilizamos para
selecionar outros caracteres em strings.
No nosso caso poderiamos utilizar a seguinte expressão regular para formatar o

número do celular por exemplo:
js

melhor, aqui na **Alura** temos uma [**formação em Javascript**]. Nela, você verá
como programar em Javascript, utilizar expressões regulares, dentre outras muitas
coisas.
Quero o nome, o preço e a categoria de um produto:
sql
Executo a **query** e por muitas semanas ela funciona lindamente em produção. Até
que um dia o site começa a ficar lerdo... lerdo... lerdo... Mas local, funciona que
é uma beleza.
Mas calma lá, eu disse que queria nome, preço e categoria, e eu - de maldade -
abreviei a resposta lá em cima:
sql
O que eu fiz? Só quero nome, preço e categoria, mas estou trazendo tudo! Antes o
produto não tinha campo descrição, e agora ele tem!
Imagine que tenho um banco pequeno, com 20 mil produtos. Cada produto tem um nome
de 100 caracteres assim como a categoria. Isso quer dizer que eu queria transferir
do HD do meu banco para a minha máquina cerca de 20000 \* 200 = 4 megas.
Mas na verdade eu fiz um `select *`!
Selecionei todos os campos! Se cada descrição completa de um produto tem 10 mil

caracteres por causa do sumário do livro, temos então 20 mil produtos, cerca de 10
mil caracteres em cada um: 200 megas!
Boa sorte tirar tudo isso do seu HD. Boa sorte levar tudo isso pela rede de uma
máquina para outra. Boa sorte construir as Strings em memória que representam estes
valores.
`select *` é perigoso por diversos motivos. O consumo de memória e banda é só um

deles... pense a longo prazo: se o banco mudar você vai trazer mais coisa do que
queria, e esse mais coisa talvez seja demais.
sql
Novamente, com poucos caracteres, em determinados cenários, você muda completamente

a eficiência de um banco de dados!
Gostou dessas práticas e dicas de [**SQL**]
Precisei entender as diferentes formas de arredondar e formatar números no

**JavaScript**, prestei serviço a uma empresa que gostaria de saber quanto está
pagando por hora de salário. Para isso, existe uma função que pega o salário do mês
e calcula o custo hora:
js
Resultado da função:
js
O valor por hora do salário seria: `17.045454545454547`. Mas, como estamos falando
de um valor monetário, esse número deveria ter apenas duas casas decimais. Isto é,
o que queremos é arredondar esse resultado para reduzir as casas decimais.
Como estamos utilizando o JavaScript, já existe um método da classe `Math` que

arredonda os números, a **Math.round()**.
## Usando Math.round()
js
Resultado da função, agora utilizando `Math.round()`
js
O valor da resposta foi 17, já resolvemos o problema das várias casas decimais ,
mas ainda não está muito preciso.
Isso ocorre porque o método `Math.round()` retorna o valor de um número arredondado

para o inteiro mais próximo.
## Formatando o resultado com ajuda do método toFixed()
Como estamos trabalhando com dinheiro é importante saber também os centavos, com o
auxílio do método **.toFixed()** eu consigo controlar o número de casas decimais
após a vírgula, de forma mais simples, indicando o número de casas que eu quero
como parâmetro.
Como queremos deixar a resposta com duas casas decimais após a vírgula
utilizamos`toFixed(2)`, um ponto importante de se observar é que o método
`.toFixed()` arredonda o **número para cima**, isto é, se temos, por exemplo
`11.123`, o valor fica `11.12`, já se temos `20.555`, o valor fica `20.56`. Outro
ponto importante de se observar é que seu retorno será uma **string** representando
o número.
js
Agora que deixamos o resultado da função com duas casas decimais, que tal deixar o
resultado formatado na nossa moeda, o real ?
## Formatando o resultado para Real
No JavaScript temos um método chamado `toLocaleString()` que converte um número

para uma string, já tratando a questão do arredondamento e convertendo para a moeda
do país que queremos, no nosso caso, o real, tornando a tarefa do programador muito
mais simples.
O método **toLocaleString()** recebe alguns argumento - um objeto literal com as

propriedades -, no meu caso eu utilizei:
- `style` : Que é o estilo do formato a ser utilizado, aqui é permitido usar:
- `decimal` para representar números simples.
- `currency` que diz respeito ao formato monetário e que vai indicar a moeda
que vai ser utilizada.
- `percent` para formato percentual.
- `currency`: A moeda para usar na formatação monetária
js
Utilizando a formatação do `toLocaleString` o resultado ficaria assim:
js
## Para saber mais
No JavaScript temos outros métodos que podem ser utilizadas para o arredondamento
como:
- **Math.ceil()** que retorna o maior número inteiro que é maior que o número
passado, por exemplo `Math.ceil(11.123`), o valor fica `12`
- **Math.floor()** que retorna o menor número inteiro que é menor que o número
passado, por exemplo `Math.floor(11.789)`, o valor fica `11`

melhor, aqui na Alura temos uma [**Formacao Front-end**]. Nela, você verá como
imagem
Um cliente pede a produção de um layout para blog e, na entrega final, as áreas de

textos ficaram assim:
imagem
Repare que quando olhamos para este resultado temos um desconforto na leitura dos
textos. Por que será que isso acontece?
A **fonte** muito clara em fundo branco, os buracos ao longo do texto, e mesmo as

entrelinhas muito estreitas, geram uma dificuldade de leitura e, consequentemente,
não nos sentimos motivados a ler o conteúdo da página.
Então, o que poderíamos fazer para melhorar essa página, pensando em usabilidade e
legibilidade? Confira algumas dicas essenciais para fazer essas mudanças.
# 1. As cores e fontes corretas

O primeiro passo a considerar é se os textos estão **legíveis**, considerando
alguns fatores como:
- Contraste de cores entre plano de fundo e texto;
- Tamanho da fonte;
- Tipo de fonte utilizada.
No layout anterior temos um texto com fonte **muito clara** sobre um plano de fundo
igualmente claro. Isso gera um baixo contraste entre os dois elementos e torna
difícil a distinção dos caracteres e palavras, comprometendo a leitura, como
podemos notar neste fragmento do layout:
imagem
Ao passo que, a simples alteração da cor para uma outra um pouco mais escura, ou
mais contrastante, seria o suficiente:
imagem
Outra questão é o **tipo de fonte** . Em qual das opções abaixo você acredita ser
mais confortável a leitura?
imagem
imagem
No segundo exemplo, onde temos uma fonte mais básica, **sem serifa**, a leitura
fica muito mais fácil. Isso porque, a menos que sejam frases curtas, utilizar
fontes mais trabalhadas (com muitos detalhes, cursivas, etc) nos gera um maior
esforço para ler grandes blocos de texto.
Devemos ter cuidado no momento da [**escolha da fonte**], pensando sempre na forma

com a qual ela será aplicada, ou seja, se será utilizada em grandes blocos de
texto, em títulos, com plano de fundo claro ou escuro, etc.
# 2. Espaços em branco
Um erro comum e que faz muita diferença no resultado final é pensar nos espaços em
branco do layout.
imagem
imagem
Perceba que no primeiro exemplo quase não temos espaço entre os elementos e, no
segundo, ao inserir os espaços, temos um respiro maior que gera também uma melhor
compreensão.
Sem estes espaços, podemos dificultar a visualização geral do conteúdo, que não
terá priorização. Separando adequadamente cada elemento, diminuimos o ruído visual
e tornamos mais fácil a leitura.
Estes espaços não são simplesmente adicionandos como vazios aleatórios para
distanciar um elemento do outro. Mais do que isso, os **espaços em branco são parte
integrante do layout**.
Essa dica vale também, no caso dos textos, quando pensamos em entrelinhas.
Entrelinhas muito espaçadas ou muito estreitas, como no exemplo apresentado no

post, causam uma sensação desagradável para a leitura.
imagem
Note que, no segundo exemplo, a leitura fica muito mais fluida.
Contudo, mesmo com essa mudança, percebemos que ainda há alguns espaços no texto
que causam um desconforto na leitura. Estes são os espaços em braco indesejáveis,
que ao invés de auxiliar na usabilidade, acabam deixando tudo mais complicado. E
como resolver essa questão?
# 3. Alinhamento de texto
Existem 4 tipos de alinhamento possíveis para a web: **à esquerda, centralizado, à
direita** ou **justificado**.
No layout que analisamos, o alinhamento está como justificado, isto é, busca-se

preencher todas as linhas de texto de uma ponta a outra.
imagem
Porém, note que este **alinhamento** cria diversas lacunas ao longo do texto, já
que, diferente dos textos impressos, os textos na web não se ajustam muito bem ao
formato das caixas de texto, portanto, podem não ser uma boa escolha para
utilizarmos.
Quanto ao alinhamento à direita e centralizado, temos novamente um problema na

leitura de textos mais longos, já que nestes dois casos temos mais dificuldade de
identificar o início e fim das linhas, tornando a leitura mais cansativa.
imagem
O ideal para estes dois casos é que sejam usados principalmente em pequenos textos.
Por fim, temos o alinhamento à esquerda:
imagem
Note que, além deste ser o alinhamento mais comumente utilizado, baseado no nosso
sistema ocidental de leitura, da esquerda para a direita, o texto fica muito mais
fácil de ser lido e não causa um desconforto para o usuário que lerá longos blocos
de texto na página.
# 4. Tamanho das caixas de texto

Outro ponto importante a ser observado no layout é o tamanho que atribuímos às
áreas de texto.
Caixas de texto muito largas, por exemplo, dificultam a leitura, uma vez que a
orientação do olhar se perde mais facilmente ao percorrer linhas muito longas.
Da mesma forma, caixas muito estreitas causam um estranhamento ao quebrar os textos

em pequenas frases, que tornam a leitura muito menos fluida.
imagem
Para não cair neste problema, evite caixas muito largas ou muito estreitas,
distribuindo o texto em larguras mais confortáveis de ler e variando o tamanho dos
elementos de texto, para criar um layout mais limpo e agradável de ler.
imagem
Ao adaptar nosso exemplo anterior, conseguimos agora uma aparência muito mais
convidativa para leitura e, consequentemente, fomos mais eficientes quanto a
usabilidade.
# 5. Hierarquia de informações
Até então, as dicas apresentadas foram basicamente para melhorar a usabilidade, no
sentido de deixar a apresentação visual mais confortável para leitura, ou seja,
trabalhamos com as questões de legibilidade.
Agora vamos fazer com que as informações contidas em nossos textos estejam
adaptadas para, ao escanear uma página, o usuário ter o olhar guiado segundo uma
ordem de priorizações que criaremos com a utilização de recursos simples:
**tamanhos e cores de fonte**.
imagem
Veja que, inserindo cores para diferenciar links de texto e alterando o tamanho das
fontes como **título, subtítulo e o corpo do texto** conseguimos diferenciar com
mais facilidade cada campo.
Portanto, orientamos a leitura do usuário, deixando claro o que queremos indicar em

cada parte do nosso **layout**.
# Conclusão
Ao aplicar as dicas apresentadas neste post você facilita ao usuário a leitura das
suas páginas, eliminando alguns dos problemas mais comuns de usabilidade em textos
da web.
Devemos, então, encarar o texto não apenas como o conteúdo da página, mas como uma
interface de usuário, que influenciará, e muito, na usabilidade e legibilidade.
Para entender um pouco mais de textos e fontes para a web, a **Alura** tem um
[**curso muito legal de Tipografia para web**], que além de tudo fala um pouco dos
erros comuns neste tema e como podemos evitá-los. 😉
A tendência natural de um potencial comprador é visitar as primeiras páginas que

surgem nas pesquisas que faz. Elas estão lá por algum motivo e, naturalmente,
inspiram credibilidade.
Um bom **posicionamento em buscas tem o potencial de atrair um número muito maior

de pessoas interessadas naquilo que está sendo oferecido**. Mais oportunidades de
negócio são geradas a partir da aproximação que as diversas ações de marketing de
conteúdo proporcionam.
Marketing de conteúdo e SEO andam de forma muito próxima, e uma estratégia digital
assertiva jamais pode descuidar de otimizar o site da empresa.
No post de hoje vamos falar sobre essa relação inevitável e extremamente

importante, mostrando como um contribui para o outro, e como um bom SEO é o caminho
certo para sua empresa conquistar espaço no ambiente digital. Confira!
## O que é SEO e qual sua importância?
Podemos definir **SEO (Search Engine Optimization)** como uma série de

aprimoramentos no código e no conteúdo de um site visando que ele seja encontrado
mais facilmente e melhor avaliado por algoritmos de mecanismos de busca.
Uma otimização eficiente posiciona o objeto de análise no topo das páginas de

resultado (um bom ranqueamento), podendo chegar até mesmo na primeira colocação.
Quanto melhor for o ranqueamento, maior a chance de conquistar o clique do usuário.
## Por que otimizar um site para mecanismos de busca?
O marketing é um campo de trabalho que deve estar sempre atento às mudanças nas
relações entre empresas e mercado consumidor. A mais relevante dos últimos tempos
teve a internet como responsável e criou todo o segmento digital, já em estágios
muito desenvolvidos.
A disseminação intensa de informações mudou parte da dinâmica do marketing. Além de

serem valorizadas abordagens mais sutis de aproximação ao usuário, uma das grandes
prioridades de uma estratégia passou a ser o destaque: seja o que se dá a um
negócio ou a seu conteúdo, em meio a uma infinidade de informações em toda a web.
Os atuais consumidores priorizam a pesquisa online antes de tomar uma decisão de

compra. É por isso que, posicionar bem um negócio em uma pesquisa, influencia
diretamente na tendência do cliente em potencial de decidir contratá-lo. Estar bem
ranqueado é um argumento positivo a ser levado em consideração.
## Como integrar SEO e marketing de conteúdo?

Vamos mostrar agora como o SEO e a produção de conteúdo relevante caminham juntas
para promover uma empresa no ambiente digital. você perceberá que a otimização não
gira em torno apenas de códigos **HTML**, mas também depende de como o conteúdo é
produzido e promovido.
### Autoridade da empresa
Em termos de **marketing digital**, podemos definir a autoridade de uma empresa de

duas formas, a depender do ponto de vista:
- do ponto de vista do cliente, é o know-how que a empresa demonstra ter, ou seja,

a capacidade que mostra de constatar problemas pelos quais seu público passa e
resolvê-los;
- do ponto de vista dos algoritmos de pesquisa, autoridade de página é uma espécie
de avaliação que se dá por vários critérios, como quantidade e qualidade de cliques
e links externos que direcionam para a página.
A autoridade para o cliente é construída por meio de produção consistente de

conteúdo relevante, que atenda aos problemas de sua persona, e, consequentemente,
do público que se aproxime de seu perfil. Fazer material de qualidade tende a gerar
engajamento e, assim, visibilidade e credibilidade.
**Por outro lado, a autoridade para os mecanismos de busca depende da construção do

tipo anterior, uma vez que o tráfego e as menções externas como em redes sociais ou
outros blogs são fatores levados em consideração.**
Conteúdo relevante tende a ser um incentivo bem convincente para a conversão, a

criação de vínculos ainda mais fortes entre o usuário e a empresa, motivada pela
busca de mais informações.
Portanto, além de questões técnicas e menos diretas como o tempo de permanência na

página, a relevância do material produzido atrai visitas de qualidade, beneficiando
a empresa com [**um bom índice de conversões**].
## Qual a importância de utilizar palavras-chave relevantes?
Uma pesquisa de palavras-chave relevantes ao segmento de seu negócio em ferramentas

como o Google Trends ajuda a planejar qual conteúdo será útil para seu público em
determinado momento. Esse é um fator que contribui para construção da autoridade
que citamos anteriormente.
Por outro lado, o que mais importa para o SEO é a presença das palavras-chave
certas no conteúdo ao longo das páginas de seu site. Isso ajuda os algoritmos de
busca a identificarem de que assunto ela trata e exibi-la como resultado de
pesquisas por temas similares, buscando diretamente pelo termo ou por sinônimos.
Aliar a distribuição de palavras-chave úteis ao longo do texto a outros critérios

técnicos de SEO são questões essenciais para construir a autoridade da empresa,
posicionando-a bem em pesquisas.
## E onde entra a experiência de usuário?
Essa é a parte mais técnica do SEO, mas que também impacta uma estratégia de
marketing de conteúdo de modo geral. A experiência do usuário, ou UX, é um fator
determinante para que as pessoas que encontraram a página continuem navegando nela.
Esse cuidado passa por um [**web design amigável**] e funcional e, ainda mais
importante, pela adaptação do site para acesso em dispositivos móveis: o chamado
[**site responsivo ou mobile**].
De um lado, sites que oferecem uma experiência de usuário desfavorável acabam
espantando novos acesso em potencial, seja por carregamento lento, tamanho de fonte
ou layout de texto incompatível com seu dispositivo, áreas de toque muito próximas,
etc.
Com isso, o conteúdo deixa de atingir seu destinatário e o processo de aproximação

do visitante com a empresa é interrompido.
Do ponto de vista do SEO, sites adaptados para exibição em dispositivos móveis

recebem avaliações mais favoráveis. E, se a página apresenta um conteúdo relevante,
outro índice importante para melhorar o ranqueamento nos mecanismos de busca também
é garantido: o tempo de permanência na página.
Portanto, ao se falar da importância do SEO em uma estratégia de marketing de

conteúdo, percebe-se que otimizar um site é essencial para garantir uma presença
digital efetiva. São esses fatores somados que vão atrair mais visitantes por meio
de pesquisas, para conhecerem mais a respeito de sua empresa, construindo sua
autoridade.
Esperamos que tenha curtido nossas dicas!
Seja no cinema, na publicidade, nos jogos digitais ou até em projetos

arquitetônicos, o uso do fotorrealismo e da animação em três dimensões é cada vez
mais presente em diversos tipos de mídias. E não é para menos: os softwares 3D
ganharam versões com melhor usabilidade e, consequentemente, conquistaram mais
usuários.
Não são apenas os publicitários, designers, programadores, arquitetos e diretores

de arte que utilizam esses recursos. Hoje, qualquer estudante competente é capaz de
tirar seus desenhos do papel e começar uma [**carreira na área de 3D**].
## Conheça as tendências do mercado
Nos últimos anos, podemos notar o surgimento de novos caminhos no cenário do design
digital, em que o minimalismo toma conta dos projetos. E a [**tecnologia 3D**]
acompanha essa temática.
Nesse sentido, com a evolução tecnológica, é recomendado explorar abordagens que

mesclam várias técnicas, como a programação e, principalmente, a impressão. Tais
[**tendências do mercado de design**] podem servir como um guia de trabalho para os
profissionais de criação que querem se manter atualizados e produtivos.
Por isso, não deixe de conversar sobre o assunto com os professores do curso de 3D
que está pensando em fazer.
Dessa forma, você conseguirá saber se eles estão acompanhando as demandas do

mercado de trabalho, e terá mais segurança para começar a exercer o ofício depois
da finalização dos seus estudos.
## Defina qual é a área em que deseja atuar
Um profissional com especialização em animação e modelagem 3D pode desenvolver uma

infinidade de trabalhos com objetivos diferentes, que vão desde a criação de
anúncios publicitários até a confecção de projetos e desenhos industriais.
Sendo assim, a escolha do software — e, consequentemente, do seu curso — dependerá

dos seus objetivos como especialista. Se a sua paixão são os games, por exemplo, um
[**curso de 3ds max**] pode ser o mais indicado para sua formação. Engenheiros e
projetistas, por outro lado, já vão preferir trabalhar com o [AutoCAD].
Os iniciantes que ainda não estão certos sobre qual caminho seguir podem investir
em um [curso de 3D básico], que inclua conceitos de modelagem, texturização e
iluminação a partir de esboços simples. Assim, será possível conhecer suas
preferências e definir suas áreas de atuação com mais clareza.
## Valorize o ensino na prática
Dispense o curso de 3D que só te oferece uma apostila, e nada mais. Por ser um
trabalho pouco teórico e muito prático, o método mais interessante para
materializar seus projetos consiste mesmo em colocar a mão na massa, e incentivar o
aprendizado por meio de tentativa e erro.
Além disso, essa metodologia também é vantajosa porque permite que você já construa
um [**portfolio**] aos poucos, enquanto estuda.
Nesse sentido, o interessante é procurar um curso de capacitação online ou

presencial de boa reputação, no qual você tenha acesso a instruções e tutoriais
diretamente no software que pretende aprender a usar.
## Busque referências
Conhece alguém que já fez o curso em que você está pensando em se matricular? A
instituição de ensino tem reconhecimento, ou algum prêmio na área de design? As
avaliações e depoimentos nas redes sociais da escola são positivos?
Poste suas dúvidas em fóruns online, converse com profissionais, procure por
recomendações, descubra quem são os coordenadores e professores do curso — e se
eles atuam no mercado —, peça para assistir uma aula experimental.
Há espaços mais gerais, comunidades criativas intersetoriais que abrangem diversos

softwares e áreas de conhecimento como o [Graphic Design Stack Exchange] e o
[Creative Cow], mas também vale pesquisar se a própria equipe de desenvolvimento do
software disponibiliza um espaço de discussão, como fazem o [Rhinoceros] e a
[Autodesk].
Com certeza, com essas práticas você terá informações suficientes para saber quais
opções valem a pena. E, por meio das referências positivas, você poderá construir
confiança no curso antes de começar a estudar.
## Descubra o que combina mais com o seu perfil
Para quem deseja se graduar, de modo geral, os cursos mais indicados para iniciar
uma carreira na área de 3D são: design gráfico, artes digitais, produção
multimídia, audiovisual e jogos digitais. Contudo, é importante ressaltar, essas
opções são mais abrangentes, e podem não focar nos assuntos que você deseja.
Se você tem a intenção de se inserir rapidamente no mercado ou já se graduou, uma

boa opção é a pós-graduação em animação ou computação gráfica 3D. Apesar dos preços
geralmente elevados e da alta demanda de tempo, essa especialização acrescenta
muito valor ao currículo.
Outra opção interessante são os cursos livres e técnicos. Eles preparam o aluno
para o mercado de trabalho de forma bastante objetiva, em um período otimizado e
com um custo relativamente menor do que aqueles cobrados pelas faculdades.
Além disso, você tem mais [**flexibilidade de horários**] e conteúdo, além de não
precisar frequentar aulas durantes todos os dias da semana. E, se o curso de 3D for
online, as vantagens são ainda maiores, já que será possível montar a sua própria
rotina de estudos sem sequer sair de casa.
## Verifique a qualidade da certificação
Na prática, o que vai contar mesmo para os seus futuros clientes ou empregadores é
a sua competência, seu domínio de softwares e sua [**criatividade**]. No entanto,
se você tem a intenção de se candidatar para empregos mais formais — sejam eles
públicos ou privados —, a certificação também é importante.
Portanto, procure por cursos que ofereçam certificados com autenticidade garantida
após a sua conclusão. Isso te permitirá provar que possui os conhecimentos
requeridos para a vaga, além de fortalecer sua imagem profissional.
Mas é interessante que esse documento seja emitido por uma instituição reconhecida,
e nele conste o número de horas/aulas do curso, bem como índice de aproveitamento e
data de conclusão.
Nessa hora, vale ainda conferir a estrutura dos certificados de pessoas que
passaram pelo mesmo programa que você quer realizar.
Enfim, a escolha do curso de 3D ideal para seguir uma carreira promissora pode
mesmo não ser nada fácil. Mas, seguindo essas dicas com um pouco de persistência,
você vai, com certeza, se deparar com muitas oportunidades de aprender bastante!
imagem
Neste episódio do Alura Live, nossa co-host Giovana Delfino recebeu Vanessa Tonini,
instrutora e desenvolvedora na Caelum e Jana Paradiso, desenvolvedora do time da
Alura para falarem um pouco mais sobre esse assunto sobre fundamental de inclusão
digital, que é acessibilidade na web.
Quer entender melhor como ajudar pessoas com deficiências? Assista e deixe suas
dúvidas!
https://www.youtube.com/watch?v=vrLx1yJjsXU
Ainda ficou afim de saber ainda mais sobre esse tema? Assista a [live completa].
Saiba como seu site e outros da web estão quanto a acessibilidade [acessando aqui].
Conheça sites que foram premiados com o [Prêmio Nacional de Acessibilidade].
Extensão de leitura de texto para pessoas com deficiência visual: - [Chrome]. -

[Firefox].
Vídeo com conteúdo impactante sobre acessibilidade na web: [Custo ou Benefício?]
Não deixe de nos seguir twitter: Giovana Delfino - Nossa diva da live não tem
Twitter :’(, [Vanessa Tonini], [Jana Paradiso] e a [Alurinha]! :D
imagem
Mais do que nunca, as empresas estão muito exigentes em seus processos seletivos.
Sendo assim, estudantes e recém-formados buscam cursos complementares com o
objetivo de se preparar para o mercado. Nesse cenário, as certificações de
marketing digital ganharam destaque.
**Quer conhecer mais sobre a importância de ter uma certificação na área de

marketing digital? Continue lendo e confira!**
## Por que trabalhar com marketing digital?
As empresas já se deram conta de que [**estar presente nas mídias digitais é

fundamental**] para o crescimento. Nesta era em que os consumidores utilizam a
internet para pesquisar sobre qualquer coisa, quem estiver de fora dificilmente
sobreviverá nesse mercado competitivo.
No entanto, ainda temos um segundo problema: não basta estar inserido no ambiente
digital, é preciso ser estratégico! Muitos ainda cometem erros terríveis por não se
capacitarem ou não contarem com [**profissionais do ramo de marketing**].
É comum observarmos diversas empresas abrindo uma fanpage no Facebook e acharem que
é o suficiente. Mas não é bem assim que as coisas funcionam. Além de não ser o
bastante, poucos conhecem as melhores práticas para conseguir os resultados
desejados nas mídias sociais.
Com a popularização dos dispositivos móveis, a contratação de especialistas para

elaborar as estratégias de marketing digital se tornou ainda mais necessária. [**De
acordo com uma pesquisa**], mais da metade dos brasileiros acessam a internet pelo
smartphone. Ou seja, toda a forma de produzir conteúdos e anúncios precisou ser
repensada para esse enorme público — e isso abriu novas oportunidades na área.
## Com que áreas o Marketing Digital se relaciona?
### Design
O designer é o responsável em cuidar da identidade visual da empresa nos meios

digitais. As marcas precisam transparecer sua personalidade nas peças
publicitárias, ilustrações publicadas nas mídias sociais, banners etc.
Sendo assim, o profissional deve ser qualificado para garantir essa uniformidade e
empregar as melhores técnicas. Além do designer gráfico, a profissão de webdesigner
também é bastante requisitada por agências de marketing e demais empresas.
### UX (User Experience)
O Analista de UX é quem se preocupa com a experiência do usuário que acessa as

plataformas digitais da empresa, como o site e aplicativos. Isso garante que os
visitantes e frequentadores consigam navegar com facilidade em suas páginas e,
dessa forma, passem mais tempo nelas. Caso a experiência seja negativa, objetivos
como a conversão e a fidelização vão por água abaixo.
### Redação
O marketing de conteúdo é atualmente uma das estratégias mais utilizadas para as

empresas gerarem tráfego para seus canais e criarem engajamento. Logo, um bom
redator é indispensável.
Como o volume das produções costuma ser grande, há bastante demanda para essa área.
Porém, existem algumas técnicas específicas para a redação web, fazendo com que a
especialização para produzir esses conteúdos seja tão importante quanto as demais.
### Social Media
Como dito anteriormente, não basta criar uma fanpage no Facebook, publicar o que
vier à cabeça e esperar os resultados. Os [**analistas de mídias sociais**] estudam
e fazem testes constantemente para garantir que as empresas tenham retorno com as
ações.
Portanto, além de conhecer quais práticas trazem resultados, é preciso monitorar e

analisar as páginas.
### Programação
Quem trabalha com marketing digital está habituado a usar diversas ferramentas para
executar diferentes projetos. É possível até mesmo criar um site por meio de um CMS
(sistema de gerenciamento de conteúdo) em pouco tempo.
Entretanto, devemos lembrar que cada projeto tem suas peculiaridades. O que
funciona para um, pode não funcionar para outro. A presença de um programador é
crucial para atender às exigências dos clientes.
### SEO
O [**SEO**] (Search Engine Optimization) pode ser descrito como um conjunto de

técnicas que tem por finalidade deixar o seu site bem posicionado nos motores de
busca como o Google e o Bing.
A vantagem em utilizar essa estratégia é ficar visível nos resultados orgânicos, e

desse modo, diminuir o custo com os anúncios patrocinados. O Analista de SEO é quem
vai analisar e implementar as ações para que isso aconteça.
## Por que as certificações de marketing digital são essenciais?
**O marketing digital** é uma área relativamente nova, e não há um curso de

graduação específico para quem deseja ingressar nesse ramo. Podemos encontrar
trabalhando em agências profissionais que cursaram publicidade, marketing, design,
sistemas de informação, entre outros cursos. É necessário se especializar em algum
dos segmentos para exercer a profissão.
Algumas especialidades são mais novas que outras, e sempre surgirão outras funções
que hoje não existem. Como as tecnologias estão sempre sendo aprimoradas, é comum
que isso ocorra. **Para isso, uma plataforma reconhecida de cursos online pode
suprir essa necessidade de renovação, capacitando cada vez mais pessoas a prestarem
esses serviços.**
**Não são apenas os recursos tecnológicos que sofrem modificações ao longo dos
anos, mas também os hábitos dos consumidores.** Não é difícil perceber que, após
sua popularização, os usuários puderam resolver inúmeras questões com alguns toques
nas telas de seus aparelhos. Com essa comodidade em mãos, não há como voltar atrás,
e as empresas precisam se adaptar à nova realidade.
**O certificado reforça que determinada pessoa está apta a desempenhar aquela

função e, em um mercado altamente competitivo, estar atualizado das melhores
práticas colocará você em uma posição privilegiada.** O arroz com feijão já não é
mais o suficiente; se você deseja se destacar deve ter em mente que o estudo
precisa ser constante!
Com tantas opções disponíveis, pode ser que você fique em dúvida de qual é mais
vantajosa. **O ideal é estudar um pouco sobre cada área de atuação antes de decidir
qual caminho seguir.** Agora que você já sabe qual a importância das certificações
de marketing digital, busque aquelas que possam ajudá-lo a expandir seus
conhecimentos.
E para ficar por dentro de todas as nossas novidades, assine nossa newsletter e
receba tudo por e-mail!
Quantos usuários do Alura já compraram livros na Casa do Código e quantos não?

Fácil, executa duas queries, cria uma stored procedure (aiiiiiii meu coração),
devolve um divido pelo outro:
sql
sql
E uma stored equivalente a:
sql
Como diz minha sobrinha de 2 anos: -Uxi! E sai correndo, fugindo de medo.
Poderia agrupar, e fazer a divisão:
sql
E usar a mesma fórmula em procedure ou programação: uxi.
Podemos só contar o total :)
sql
Se o seu banco usa 0 ou 1 para marcar quem comprou, soma todo mundo:
sql
Calma lá, é só dividir quem comprou pelo total. Uma unica query:
sql
Tá lá, sem subquery, sem procedure, sem temporary table, doidice.
Desafio: e se o campo não fosse 0 e 1? Como você transformaria uma string 'S' e 'N'
para a query acima funcionar? \*CASO\* você tenha uma sugestão, [compartilhe]!
Gostou do post? Quer aprender mais? Que tal dar uma olhada em nossos [**cursos de
Banco de Dados?**]
ps: Essa boa prática é a primeira parte de uma super prática animal sugerida pelo
aluno do Alura, [Silvio Silva]!
Inicio este post com o seguinte encontro:
> "Fernanda e Gustavo conheceram-se em uma conferência. Fernanda disse para Gustavo
que era programadora front-end. Gustavo disse que tinha vontade de ingressar nessa
carreira e não sabia por onde começar."
Apesar desse encontro nunca ter existido, Gustavo personifica bem com sua dúvida
aqueles que .
## Passo 1: HTML5 e CSS3
O HTML é uma linguagem de marcação responsável pela estrutura de páginas web, dando
significado para cada parte que a compõe, já o CSS é aquela tecnologia que aplica
um atrativo estético na estrutura da página criada.
[**Aprender HTML5 e CSS3 criando uma página de barbearia**] é um bom começo, pois
além de aprender os fundamentos, você terá algo prático já criado.
Depois de consolidar seus conhecimentos, poderá [avançar e aplicar novas técnicas]

para aprimorar ainda mais esta parte.
Além do que vimos, saber criar um [web site responsivo], aquele com páginas que se
adaptam do mobile ao desktop, é prática do mercado, não mais um plus.
Preparados para o passo seguinte?
## Passo 2: lógica de programação e JavaScript
A profissão programador front-end além de envolver os conhecimentos de HTML5 e CSS3

demanda também conhecimento da linguagem JavaScript.
Ela é a única linguagem efetivamente de programação (podemos declarar variáveis,

loops, funções...) suportada pelos navegadores do mercado, inclusive este é um dos
motivos de boa parte dos programadores, sejam de front-end ou não, terem algum
conhecimento desta linguagem.
Contudo, sendo JavaScript uma linguagem de programação, é necessário conhecimento

de lógica de programação, aquele que uma vez aprendido pode ser aplicado nas mais
diversas linguages do mercado.
Para quem nunca programou na vida, [aprender e praticar lógica de programação]

desde o fundamental até a [criação de animações e um jogo], o prepará ainda melhor
para a linguagem JavaScript.
Com a parte da lógica de programação em dia, aprender [a linguagem JavaScript]

completa a tríade de tecnologias mínimas que um programador front-end precisa ter.
Contudo, a jornada não para por aqui. É preciso ir além!
## Passo 3: bibliotecas
O mercado de trabalho adora padronização e nós, desenvolvedores, queremos escrever

cada vez menos.
Neste sentido, ter contato com bibliotecas e frameworks populares do mercado

aumentará o seu índice de empregabilidade, além de dar subsídios para criar mais
facilmente aplicações. No caso, focarei por enquanto nas bibliotecas.
O [Bootstrap] é sem dúvidas o framework HTML, CSS e JavaScript mais popular para
criação de projetos _mobile first_, aquele no qual primeiro pensamos em nossas
páginas em dispositivos móveis para depois adaptá-la em dispositivos maiores, como
computadores Desktop ou até mesmo smart TVs gigantes.
[Criar um site com Bootstrap a partir de um layout já existente] é uma prática bem
comum no mercado. Porém, ele faz uso de outra biblioteca que está no coletivo
imaginário dos desenvolvedores, o [jQuery].
O jQuery é uma biblioteca que permite o programador front-end realizar mais

facilmente modificações na página através das ações do usuário, como o clique de um
botão que oculpa uma barra lateral ou até mesmo aquele banner rotativo lindão que
dá vida à sua página.
Existem diversas maneiras de aprendemos jQuery, [inclusive criando jogos], dessa

forma, tornando ainda mais divertida a aprendizagem. Independente do seu uso pelo
Bootstrap, há muito código escrito no mercado com esta biblioteca.
## Passo 4: mais JavaScript
Hoje vivemos no [reino encantado do JavaScript]. A versão ES2015 (ES6) do

JavaScript se popularizou rapidamente devido a introdução de novos recursos da
linguagem que visam ajudar o desenvolvedor a resolver problemas do dia a dia.
[Criar um projeto do zero e ir aplicando gradativamente os novos recursos da

linguagem] é uma forma de absorver as mudanças. Inclusive, o ES2015 é pré-requisto
para aprender alguns dos mais famosos frameworks do mercado.
## Passo 5: frameworks
Uma biblioteca resolve um problema bem específico, já um framework pode ser

considerado um conjunto de bibliotecas que visam resolver um problema maior.
Hoje no mercado há uma explosão de [Single Page Applications], páginas que não
recarregam durante seu uso (parecem aplicações nativas como aquelas que rodam em
seu smartphone) e que fazem uso pesado de JavaScript.
Frameworks como [Angular 1], [Angular 2] (hoje, chamado de Angular!) e [React] são
os que invadem o coletivo imaginário dos desenvolvedores e das empresas
## Passo 6: (desejável): pré-processador
Aprender a utilizar pré-processadores CSS como [SASS] ou [LESS].
> Um pré-processador nada mais é do que um compilador que traduz uma sintaxe
rebuscada que pode trabalhar com varíaveis e funções para um código CSS, aquele
compreendido pelo navegador. Em suma, a ideia é darmos ao CSS poder semelhante das
linguagens de programação como o próprio JavaScript que vimos.
Dependendo do escopo do projeto e da cultura da equipe, pré-processadores podem ser

utilizados para tornar o trabalho mais produtivo.
## Passo 7: (desejável): ferramenta de build
Por exemplo, sabemos que um site depois de pronto precisa ainda passar por uma
[série de otimizações]. Nesse sentido, dominar alguma ferramente de build como
[Gulp] pode ser um diferencial na hora de concorrer por uma vaga de estágio ou
emprego. A boa notícia é que essas ferramentas utilizam a linguagem JavaScript,
aliás, uma linguagem bem onipresente no universo do desenvolvimento.
## Passo 8: (desejável): noção de como funciona um back-end
Ter uma noção de como funciona um back-end e como o seu trabalho de programador
front-end se integra com ele o ajudará a ter mais confiança ao trabalhar dentro de
uma equipe.
Nesse sentido, começar pelo [PHP criando um projeto web que se integre com o banco
de dados] é um bom começo.
## Conclusão
Saber o essencial que é HTML5, CSS3 e JavaScript abre oportunidades tanto para
estágio, como também, para ofertas de emprego. Além disso, nada o impede de
trabalhar por conta própria como um freelancer.
Contudo, completar seu conhecimento com bibliotecas e frameworks populares do

mercado ampliam ainda mais essas oportunidades.
Por fim, segundo [Rogers], o processo de aprendizagem ocorre de maneira particular

em cada individuo e o papel dos educadores é facilitar a aprendizagem do aluno.
A sequência de passos aqui aprensentada é apenas uma proposta que pode facilitar
sua aprendizagem, mas sinta-se à vontade de adequá-la ao seu _modus operandi_ de
aprender.
Fui chamada por um amigo meu que trabalha em uma biblioteca para criar um sistema
para que os funcionários tivessem controle do estoque de livros, quais eram
emprestados, quantos haviam disponíveis, quando um novo livro fosse acrescentado ao
inventário, entre outras coisas.
Sugeri de fazer um sistema no banco de dados, pois assim eles podiam fazer isso
facilmente e teriam um sistema somente deles, no qual pudessem ter esse controle.
Comecei baixando o MySQL, configurei um servidor e criei **CREATE** uma `database

biblioteca`, com o comando:
sql
Agora que a database, que é um banco de dados próprio da biblioteca, foi criado,
devemos adicionar os dados dos livros. E como podemos fazer isso?
No SQL os dados são inseridos em tabelas, na qual cada coluna representa um dado e
cada linha, um livro cadastrado.
# Criando tabelas com MySQL
Comecei a pensar o que teria que ter na tabela. Cheguei aos seguintes tópicos:
- Título
- Autor
- ISBN
- Edição
- Editora
- Ano publicação
- Páginas
- Gênero literário
- Idioma
- Quantidade de livros desta edição
- Quantidade de livros desta edição disponível na biblioteca
Porém, lembrei que antes de começar a criar qualquer coisa no banco de dados,
devemos **informar qual database queremos usar**. Para isso, usamos o comando
**USE** e o nome da database sempre que formos mexer nessa database. Então,
escrevi:
sql
A partir daí, comecei a escrever o código para criar `CREATE` a tabela `TABLE` e o
nome da tabela, que será livros. Ficando:
sql
Para colocar as colunas, devemos abrir e fechar um parênteses e escrever as colunas

entre eles, colocando o que é cada um.
Na frente do nome da coluna, precisamos colocar o tipo de informação que ela

receberá.
Para começar, na coluna título e autor, como serão textos, e muitas vezes podem ser
grandes, coloquei a categoria **text** que não precisa estipular um limite de
caracteres. Aí ficou:
sql
Porém, nas colunas ISBN, edição e editora, que são informações que podem conter
algum número ou caractere especial, coloquei na categoria **varchar**, e como não
podemos deixar uma possibilidade enorme, coloquei um limite de 50 caracteres cada
um. Ficando:
sql
Então, criei a coluna ano para indicar a data em que ano o livro foi publicado,
sendo a categoria **year**, que aceita somente o ano e, assim não precisamos
incluir a data inteira:
sql
Para a coluna de páginas, como essa informação sempre será um número inteiro,
coloquei a categoria **int** que indica que ali só serão acrescentando números
inteiros.
sql
Já na coluna de gênero, como sempre inserimos os mesmos tipos, coloquei a categoria

**enum**, que só permite inserir um valor que está entre alguns que foram definidos
na criação da tabela.
Assim, também podemos saber quantos livros de determinado gênero temos no estoque.
E o como ficou como a seguir:
sql
Na categoria de idioma, também coloquei varchar porque podemos receber livros de

diversas linguagens. Ficando:
sql
Por fim, coloquei as colunas da quantidade total de exemplares daquele livro estão
disponíveis na biblioteca e a quantidade que está disponível, que deve ser
atualizada sempre que um livro for emprestado.
sql
## Mais colunas e chave-primária
A biblioteca quer uma coluna para a quantidade total e para a quantidade disponível
para uma ser sempre atualizada, enquanto outra permanece com o mesmo valor desde
que recebermos um livro, para termos um controle de quanto livros deveríamos ter -
e saber se algum deles foi perdido.
Como só podem ser números inteiros também, já que não podemos ter meio livro,
coloquei na categoria int:
sql
Além disso, no fim do insert, depois de fechar o parênteses, devemos finalizar o

comando com ponto e vírgula (`;`), como devemos fazer no fim de todo comando em
SQL.
O código inteiro para criar a tabela ficou assim:
sql
Antes de executar, pensei em criar uma coluna que na primeira linha ela tivesse o
valor “1” e fosse aumentando os valores automaticamente para que, assim, esse
número indicasse quantos livros a biblioteca tinha ao todo.
Pensando em como fazer isso, lembrei que na [**Apostila de SQL da Alura**] era
criada uma coluna "id" que seria auto-incrementada com o comando auto_increment e
ela seria uma **chave primária ou PRIMARY KEY**, que é uma coluna que possui um
valor único em cada linha, o que as identifica.
sql
E pronto! A minha tabela foi criada!
Agora com a tabela criada temos que adicionar dados nela! E como podemos fazer
isso?
# Inserindo dados na tabela com INSERT
Para isso, eu usei o comando **INSERT**
Para usar o ÌNSERT` devemos escrever **INSERT INTO** e o nome da tabela. Depois
colocar em parênteses as colunas que terão um valor inseridos, escrever **VALUES**
e escrever em outro parênteses os valores que serão inseridos nas colunas.
Como a coluna id será auto-incrementada automaticamente, sempre que uma linha for
adicionada, não precisamos inserir um valor nela.
Assim, iremos adicionar uma linha, que são os dados que terão na tabela:
sql
Porém, apareceu o seguinte erro:
sql
Quando procurei para saber mais, descobri que este erro acontece quando colocamos
valores a colunas que não existem. Porém, todas essas colunas existem na minha
tabela. Qual será o problema?
Analisando o comando, notei que não havia inserido nenhum valor na coluna idioma,
mesmo tendo informado no comando que ela receberia um valor. Tentando novamente:
sql
E deu certo! Assim, comecei a adicionar os as outras matérias daquele mês.
Porém, como eu podia fazer para mostrar a tabela na tela? Pensei que eu deveria
selecionar a tabela inteira ou uma parte dela para mostrar, então, o comando é
**SELECT**:
sql
Porém, apresentou o seguinte erro:
sql
Isso significa que eu errei a sintaxe do SQL, ou seja, que o comando ou uma parte
dele foi escrita errado. Foi então que eu procurei e descobri que no SQL o comando
para selecionar todos é \*, então, coloquei:
sql
E apareceu todas as coisas que eu cadastrei no banco de dados!
- ![]
# Deletando linhas de tabelas com DELETE
Porém, observando a lista, notei que havia adicionado duas vezes uma mesma edição
em capa de Orgulho e Preconceito.
Como a questão é controlarmos a quantidade de título que temos, não tem necessidade
de tê-lo duas vezes, quando a quantidade de livros está na tabela, certo? E como eu
poderia apagar uma das linhas duplicadas?
Para deletar no computador usamos o **DELETE**, então, podemos usar o mesmo

comando:
sql
Porém, percebi que não tinha indicado qual linha deveria ser deletada e utilizando
o comando assim eu **poderia deletar toda a tabela**, ou seja, todos os dados que
eu havia inserido nela.
Então, pensei em especificar qual linha era com ao menos um valor de uma das
colunas. Na minha tabela, existe alguma coluna que possui um valor único para cada
linha?
Lembra que quando criamos a tabela criamos a coluna id que teria um número que se
auto-incrementaria e era a chave primária da tabela?
Essa é a coluna que devemos usar como parâmetro! Pois, se usássemos a coluna de
nome, as duas linhas seriam excluídas e teríamos que incluir mais uma vez. Usando a
coluna id, que tem um número diferente para cada linha, só a linha errada é
excluída.
Então, usei mais uma vez o `SELECT * FROM livros` e vi na tabela o id da linha
duplicada.
- ![]
Que no caso, o id é o 2.
Mudando o comando para deletar a linha da tabela, onde o id era 2, ficou:
sql
E funcionou! Vendo a tabela novamente, não existe mais a linha 2 e há somente uma
linha para esta edição do Orgulho e Preconceito.
- ![]
E pronto! Agora a biblioteca começou a funcionar!
# Mudando dados da tabela com UPDATE
Os livros já estão sendo emprestados e como posso fazer para atualizar a quantidade
de livros disponíveis na biblioteca?
Para mudar dados de uma coluna de uma linha de uma tabela em SQL utiliza o comando
**UPDATE**. Porém, assim como `DELETE`, deve ser especificado para que não sejam
alteradas todas as linhas.
Fui escrevendo o comando para atualizar a linha da coluna, utilizando como

parâmetro o nome do livro.
sql
Porém, temos diversas edições deste mesmo livro e, utilizando este comando, iríamos
alterar a quantidade de livros disponíveis para todas as edições. Então, precisamos
de uma informação da tabela que seja única em cada linha. Qual seria essa?
Sim! O id da linha, que é auto incrementado e tem um número específico para cada
linha, permitindo que saibamos exatamente qual linha queremos alterar.
Assim, comecei a mudar os comandos, colocando como parâmetro de verificação da

linha é o id, que é a chave primária da tabela, de cada um. Como aqui:
sql
- ![]
Deu certo! E assim podemos atualizar a quantidade de livros disponíveis para aquela
edição sempre que um for emprestado e devolvido!
# Mostrando dados da tabela com SELECT
Passado algum tempo com a biblioteca funcionando, uma pessoa veio questionar
quantos livros de poesia a biblioteca possui, que tinham edições disponíveis para
serem emprestadas. E como poderíamos saber esses dados para respondê-la?
Vimos anteriormente como mostrar todos os dados da tabela, que é com o `SELECT *
from livros`.
Mas como podemos utilizar este comando para mostrar somente os títulos que são
poesia e não todos os livros que a biblioteca possui, como o comando fará se o
executarmos assim?
Para isso, precisamos utilizar o título do livro como parâmetro para que possamos
selecionar somente as edições deste mesmo título.
Então, seguindo a ideia dos comandos de `DELETE` e ÙPDATE`, onde devemos mostrar
quais são as linhas que devem ser afetadas, vamos fazer o mesmo com o `SELECT`.
sql
E funcionou! Aparecem somente os títulos de poesia E que possuem edições

disponíveis para serem emprestadas.
![]
Porém, assim, aparecem todas as informações do livro e quero saber somente o

título, o autor, o gênero e a quantidade disponível, certo? Como posso utilizar o
comando SELECT para mostrar apenas essas colunas?
Tentei o seguinte comando:
E deu certo! Apareceram somente essas colunas das linhas que são do gênero poesia.
- ![]
Agora que sabemos como criar uma tabela, inserir, deletar, mudar e selecionar dados
dela,qual tabela você pode criar com o banco de dados? Acesse os nossos [**cursos
de SQL**] e descubra o que mais você pode fazer com banco de dados!
Continuando o bate-papo com a especialista e analista SEO Paula Nakayama, corremos

atrás agora de uma outra fase na vida de um analista SEO: já aprendi alguma coisas,
já estou praticando a análise de SEO, talvez já tenha feito um curso ou outro...e
agora? Quais práticas podem fazer uma grande diferença na minha carreira?
http://www.youtube.com/watch?v=ciNWdfVPh3s
- Agora eu já sei como implementar algumas técnicas de SEO para o meu site. Corri
atrás de outras informações, aprendi HTML e CSS, dediquei-me a conhecer meu produto
e meu mercado. Quero, agora, dar um segundo passo e me destacar ainda mais como
analista SEO. O que posso fazer?
O importante, depois de implementar o site, é acompanhá-lo para ver se o que você

fez agregou valor. Por meio de um relatório de acompanhamento, verificando se houve
melhoras, se houve conversões, fazemos um monitoramento do crescimento de cada um
desses pontos. Inclusive, se for o caso, o seu trabalho pode virar um _case_ de
sucesso para sua carreira.
- Então o importante é medir o antes e o depois e poder compará-los, para termos

uma referência?
Isso mesmo! É muito importante também se atualizar. Pois, a partir do momento em

que você começou a se preparar para ser um analista SEO, os algoritmos dos motores
de busca passaram por alterações (_updates_). Você precisa saber dessas mudanças o
quanto antes para tomar ações e melhorar algo no seu site. Acompanhe as comunidades
- [**The Moz Blog**], [**Search Engine land**], [**Search Engine Journal**],
[**Search Engine Roundtable**], etc - de SEO e veja o que estão falando sobre as
novidades para estar sempre atualizado em relação ao mercado de SEO. O aprendizado
do analista de SEO é sempre constante. Todas as semanas aparecem novos lançamentos
e novidades.
- Como posso ficar sabendo dessas novidades do Google e de outras engines?
O próprio Google possui diversos blogs. Lá eles anunciam as mudanças de algoritmos

e as melhorias que serão implementadas. Alguns deles são: [**Google Inside
Search**], [**Google Webmaster Central Blog**] e o [**Google Analytics Blog**].
- Você utiliza alguma ferramenta para acompanhar os blogs ou acessa os blogs de

tempo em tempo?
A maneira que achei mais fácil foi seguir todos esses canais pelo Twitter e
praticamente todos os dias eu leio as novas informações desses sites para ver se
existe alguma novidade que eu possa aplicar no meu site. Um outro muito bom é o
[**Feedly**]!
Então, resumindo: agora que já dei o primeiro passo na minha carreira(fui além),

entendendo um pouco mais do meu produto e do meu mercado e da parte do
desenvolvimento em HTML e CSS, agora é hora de correr atrás da análise de tudo o
que já fiz e do resultado que trouxe para a minha empresa. Outro ponto é estar
sempre antenado a tudo que está acontecendo nesse meio tempo, seja através dos
canais oficiais ou blogs não oficiais, os quais aglomeram diversas novidades acerca
do SEO.
Pensando nesses detalhes a Paula criou junto conosco um curso sobre [**métricas e

relatórios SEO**].
Vamos a um exemplo concreto de **datas** e **horários** para poder programar em

Python e com o módulo `datetime`: Uma empresa nos contratou para implementar o
sistema de pontos deles, controlando quando um funcionário chega e sai. O sistema
deve exibir a data e a hora a cada registro, como confirmação para o funcionário.
# date do datetime
Conhecemos o módulo **[datetime]** da biblioteca nativa do **Python**, então até

sabemos pegar a data atual através da classe **[date]**, basta a importarmos e
chamarmos o método **`today()`**:
python
Como esperado:
python
Mas calma… como esperado? Seria legal se conseguíssemos imprimir a data no formato
brasileiro **`DD/MM/AAAA`** para evitar confusões! O problema é que o **`date`**
automaticamente força o padrão ANSI sempre que tentamos imprimir.
# Formatando nossa data em uma string
Como a classe `date` consegue nos fornecer separadamente cada seção da data,
podemos resolver esse problema com uma simples **formatação de string**:
python
Que resulta em:
python
Já melhorou bastante, mas ainda não é exatamente o que queríamos. Repare que tanto
o dia como o mês estão sem o prefixo **0**, saindo do padrão pretendido. Nesse caso
poderíamos até contornar isso simplesmente adicionando um **0** antes:
python
O que daria certo, mas traria problemas caso o dia ou o mês fossem maiores ou
iguais a 10:
python
São problemas e funcionalidades comuns que passamos durante nossos cursos da

formação [Python para web] na Alura!
# Formatando datas em strings usando o método strftime()
Para evitar maiores complicações, a classe `date` soluciona isso com um único
método - o **`strftime()`**, que toma como parâmetro a formatação que queremos em
nossa string de data e, desse modo, nos dá maior liberdade para decidirmos como
queremos exibir a data.
Esta formatação usa códigos melhor explicados na [documentação]. Ao final do texto,

também damos uma explicação breve neles. No nosso caso fica assim:
python
E agora sim:
python
Ou, no caso do nosso exemplo que resultou em `010/010/2018`:
python
Agora só precisamos dar um jeito de armazenar o horário também. Quem será que pode
cuidar disso? Como você deve ter imaginado, o mesmo módulo `datetime` do qual
importamos a classe `date` também possui classes que facilitam a manipulação de
horários.
# O tipo datetime para cuidar de datas e horários juntos
Enquanto podemos sim usar o tipo **[time]**, destinado exclusivamente para

horários, o módulo nos dá uma solução muito mais apropriada para o nosso problema
com o tipo **[datetime]** - **sim, tem o mesmo nome do módulo, cuidado com a
confusão!**
Uma das vantagens da classe `datetime` é que ela consegue cuidar da data e do
horário ao mesmo tempo. A única diferença em nosso uso é que, em vez do método
`today()`, usaremos o método **`now()`**:
python
O resultado é como o anterior:
python
Opa! Apesar de já estarmos usando a classe `datetime`, que incorpora o horário,

precisamos declarar na formatação que passamos como parâmetro para o `strftime()`
que queremos mostrar a hora e o minuto, também:
python
e agora sim:
python
Perfeito! Até agora aprendemos a pegar a data atual com a classe `date`, `datetime`
e até aprendemos a **formatar datas**, transformando-as em strings. Mas e se
precisássemos fazer o caminho contrário?
# Convertendo uma string em datetime
Se tivéssemos uma string de data e quiséssemos transformar em `datetime`, o que

faríamos?Novamente, um simples método resolve tudo, dessa vez o **strptime()**, da
própria classe `datetime`:
python
E tudo certo! Entretanto, o chefe da empresa foi testar o programa em outros

computadores e alguns imprimiam horários diferentes. Por quê?
# O problema do fuso horário
Chequei as configurações de um desses computadores e descobri que o relógio dele

estava com um fuso horário diferente do daqui de São Paulo, onde está a empresa.
Não podemos deixar que o **tempo no nosso programa dependa de cada máquina**,
porque não temos como garantir que todas as máquinas que rodarem esse programa
estarão com o fuso horário que queremos. O ideal, então, seria forçar o fuso
horário de São Paulo.
# Fuso horário com a classe timezone
A partir do **Python 3**, temos a classe **[timezone]**, também do módulo

`datetime`:
python
Vamos ver o que é impresso na tela:
python
A exceção **`TypeError`** que recebemos indica que o argumento **òffset`**,

esperado no construtor `timezone`, não foi encontrado. Realmente, não colocamos
esse argumento. Mas o que ele significa?
O parâmetro òffset` representa a diferença entre o fuso horário que queremos criar
e o [Tempo Universal Coordenado] (UTC). No nosso caso, em São Paulo, temos uma
diferença de -3 horas, mais conhecida como **UTC-3**. Sabendo disso, vamos tentar
novamente:
python
Agora que configuramos o parâmetro òffset`, vamos ver o que aparece na tela:
python
Dessa vez a mensagem da exceção é diferente, indicando que o argumento passado para
o construtor `timezone` deve ser do tipo **`datetime.timedelta`**, não um número
inteiro, que foi o que passamos.
# Calcular a diferença de horários com a classe timedelta
A classe **[timedelta]** tem a finalidade de representar uma duração e, no nosso

caso, uma diferença entre horários. Vamos, agora, instanciá-la em uma variável e
tentar imprimir, para ver o que acontece:
python
Olha o que apareceu:
python
Tudo bem, 0 dias, 0 horas e 0 minutos. Mas precisamos que nosso objeto `timedelta`
corresponda à diferença do **UTC**, as -3 horas:
python
E agora, o que aparece?
python
Mas o quê? -3 dias? A gente queria -3 horas! O problema é que o construtor

`timedelta` recebe vários outros argumentos além da hora, nessa ordem:
- **_days_** (dias)
- **_seconds_** (segundos)
- **_microseconds_** (microsegundos)
- **_milliseconds_** (milisegundos)
- **_minutes_** (minutos)
- **_hours_** (horas)
- **_weeks_** (semanas)
Então se a gente só manda um **\-3** para ele, esse número é interpretado como se
fosse em dias. Podemos passar **0** para os primeiros 5 parâmetros e **\-3** para
as horas, mas isso é um pouco estranho, considerando que, de fato, **queremos
definir apenas as horas**.
Usando a funcionalidade que o Python tem dos **parâmetros nomeados**, é possível

especificar que estamos definindo o parâmetro de horas (_hours_), da seguinte
forma:
python
E dessa vez:
python
Ué, se a gente colocou `-3`, por que apareceu tudo isso? Acontece que o `timedelta`
entende **\-3 horas** como **0 dias, 0 horas e 0 minutos - 3 horas**, ou seja, **\-
1 dia,21 horas**.
# Resolvendo o problema do fuso horário
Vamos, agora, criar um objeto timezone correspondente ao **UTC-3**, indicando essa

diferença do **UTC** como parâmetro do construtor:
python
Temos justamente o que queríamos:
python
Finalmente, podemos converter o tempo da máquina para o de São Paulo, usando o

método **àstimezone()`**:
python
Agora está tudo padronizado:
python
Temos tudo resolvido com o fuso horário agora, mas e se fossemos mostrar nosso
código para outro programador, ele entenderia o que significa o `-3`? Não fica
muito fácil, né?
Aliás, para todo fuso horário teríamos que pesquisar qual a sua diferença do UTC, o
que é um problema chato. Será que não há uma maneira mais simples e elegante para
resolver essa questão?
# Resolvendo o problema dos fusos horários com o pytz
A comunidade Python, frente a essa necessidade, criou diversas bibliotecas para

facilitar a manipulação de _timezones_, como a **[pytz]**. Para instalar a `pytz`,
você pode usar o **[pip]** pelo terminal:
python
> A instalação em sistemas baseados em UNIX provavelmente necessitará de permissão

`sudo`.
Instalada, podemos importar sua classe `timezone` e fica fácil de pegarmos o fuso
horário que queremos:
python
Repare que nós colocamos o `timezone` como Àmerica/Sao_Paulo`. Mas e se quisermos

saber outras possibilidades? É possível ver a lista de fusos horários suportados
pelo `pytz` iterando sobre o **`pytz.all_timezones`**:
python
Trabalhar com datas pra gente não será mais um problema!
## Mais Python e Datas
Ao longo desse post, usamos diversas vezes alguns códigos de formatação de datas,
como por exemplo o padrão `%d/%m/%Y %H:%M`. Mas o que significa isso?
Esses códigos são definidos pela **[documentação do strftime(3)]**. Os usados em

nossos exemplos são:
- **`%d`** - O dia do mês representado por um número decimal (de 01 a 31)

- **`%m`** - O mês representado por um número decimal (de 01 a 12)
- **`%Y`** - O ano representado por um número decimal incluindo o século
- **`%H`** - A hora representada por um número decimal usando um relógio de 24
horas (de 00 a 23)
- **`%M`** - O minuto representado por um número decimal (de 00 a 59)
## Conclusão
Começamos o post com a necessidade de manipular datas com o Python e vimos como
fazer isso utilizando o tipo `date`. Aprendemos a juntar nossa data a um horário
através da classe `datetime`, e como formatar essas informações em uma string de
fácil leitura para nós.
Acabamos tendo um problema com o fuso horário e vimos como resolver com a classe
`timezone` no Python 3. Também vimos uma maneira mais simples de solucionar esse
problema com a biblioteca `pytz`, feita pela comunidade Python.
E aí? Vai ser mais fácil lidar com datas usando o Python a partir de agora, não
acha? Gostou? Quer aprender mais? Confira a formação de **[Python para web] na
Alura!**
Para todo programa que faremos na vida de programador, precisaremos declarar

variáveis e isso é tão comum que fazemos sem pensar. Em `Java` por exemplo, fazemos
a declaração da seguinte maneira:
java
Mas, e na linguagem GO, com é feita essa declaração?
# Declarando variáveis em GO
Utilizamos a palavra **var**, o nome da variável que queremos referenciar e seu

tipo.
go
Um ponto interessante é que podemos estar no nível do pacote ou da função.
Mas que isso quer significa?
# Escopo de variáveis
Uma variável declarada dentro de uma estrutura de repetição como o **if, for,
switch** ou qualquer outro bloco, não poderá ser acessada fora desse escopo, ou
seja, só poderá ser acessadas apenas por escopos mais internos.
Já uma variável ou função criada fora de um bloco é atribuída ao escopo do
**Package** ou Pacote, que nada mais é que uma unidade composta por diversos
arquivos que juntos servem a um objetivo comum, e pode ser acessada de qualquer
arquivo dentro do mesmo pacote.
Como no exemplo a seguir:
go
Ao executar esses códigos, temos o resultado esperado, porém, recebemos uma
notificação:
go
Isso significa que devemos omitir o **tipo da variável int(inteiro)**, pois isso já
será inferido. Ou seja, temos o mesmo resultado com este código:
go
Se o tipo da variável é inferido pelo compilador eu posso usar a mesma variável

para tipos de dados diferentes? Por exemplo `nome :="guilherme"` e depois `nome
=10` ?
**Mesmo o Go sendo uma linguagem compilada rápida**, de tipagem estática, ou seja,

o compilador verifica os tipos usados em dados e variáveis para garantir que sempre
está sendo usado um tipo que é esperado em todas as situações, não é aconselhável
que isso aconteça.
Mesmo em linguagens que possuem tipagem dinâmica ao invés de estática, ou seja, a

verificação de tipo é feita em cima do dado em si, já que as variáveis podem conter
qualquer tipo de dado, como o javascript por exemplo, é bom evitar essa prática,
pois isso pode causar confusão por parte daqueles que trabalham no mesmo projeto.
# Mais exemplos de declaração de variáveis
Podemos criar mais de uma variável ao mesmo tempo, podendo especificar o tipo ou
omitindo:
go
Podemos criar mais de uma variável também com tipos diferentes:
go
Ou, deixar o Go **inferir os tipos**, para ter o mesmo resultado:
go
Posso também utilizar o **Short variable declarations**, ou seja, declarações

curtas de variáveis utilizando o sinal : seguido do =.
go
Está última abordagem com := (dois pontos, igual), usamos apenas quando vamos criar
e atribuir um valor **dentro do escopo de uma função**.
Quando a variável receber um novo valor, devemos utilizar apenas o sinal de =

(igual). Caso contrário, receberemos a seguinte mensagem dizendo que não há novas
variáveis seguido do **:=**
go
# Não atribuir um valor ao criar uma variável
Quando criamos uma variável e não atribuímos um valor a ela, o Go se encarrega de

atribuir um valor. Sendo assim, é uma boa prática sempre inicializamos as variáveis
durante a declaração.
No C e C++ por exemplo se não inicializamos a variável, o compilador simplesmente

pega o que tive naquele espaço de memória que ele alocou e usa como se fosse sua
variável.
Em linguagens mais modernas como o Go a própria linguagem se encarrega de

inicializar as variáveis:
```
----------------------------------------------
| Tipo | valor atribuído pelo Go |
|---------- |------------------------- |
| numérico | 0 |
| booleano | false |
| string | " " |
----------------------------------------------
```
É sempre bom fazermos nós mesmos a inicialização das variáveis para não correr
nenhum risco dos padrões da linguagem mudarem e nosso programa parar de funcionar.
Como vimos, podemos criar variáveis de diferentes formas utilizando a linguagem GO.
Caso queira ver todos os tipos com detalhes, <a href="https://golang.org/ref/spec"
target="_blank">acesse este link</a>.
Quer aprender mais sobre Go lang?
Na plataforma da Alura temos um <a href="https://www.alura.com.br/curso-online-go-

lang-oo" target="_blank">curso de Go lang</a> ensinando mais sobre variáveis, fluxo
de controle, convenções e muito mais.
Também temos um<a href="https://www.casadocodigo.com.br/products/livro-google-go"
target="_blank"> livro da Casa do código</a> , onde apresentamos os recursos da
linguagem Go e importantes partes de sua biblioteca padrão, sempre incluindo
exemplos relevantes que demonstram o uso de cada recurso.
Query bonita escrita, executada, resultado zoado.
Gostaria de trazer os livros ativos cujos preços tem algo de estranho: são muito
baratos (< 10) **OU** muito caros (> 1000)
sql
Que caca! O espertinho trouxe um livro que está inativo. Mas eu pedi ativo, não
pedi? Pedi ativo, sim:
sql
O que aconteceu? Opa! Como já dizia meu pai, **"e ou"** não é a mesma coisa que
**"ou e"**. Vamos ver? Troco a ordem do nosso **AND OR** por **OR AND**:
sql
Opa lá! Não é mesmo! Para com isso!
Acontece que como em qualquer linguagem, SQL também segue padrões de precedência de
operadores. Se quer forçar sua própria ordem, diga aos SQL como diria a sua
professora de matemática: **use parênteses**.
sql
A sacada? Sempre que escrever uma regra que envolva um OR, utilize parentêses.
Gostou das boas práticas? [**recomende a lista para um amigo**]!
Desafio para a próxima: devo criar lógica de negócios complexa no banco? Quando
usar a tal da stored procedure?
imagem
Recentemente a Microsoft anunciou a entrada em produção da versão 2.1 para suas

principais tecnologias: .NET Core, Asp.NET Core e Entity Framework Core.
No caso do **Entity** [algumas coisas bem interessantes foram disponibilizadas],

como por exemplo a possibilidade de informar como o valor de um enumerado será
convertido no banco de dados. Até a versão anterior (2.0.3), o EF Core não
suportava essa conversão.
Nesse artigo quero mostrar essa limitação e como a versão 2.1 o supera. Para isso
vou usar um projeto de cadastro da eficiência energética de equipamentos
eletrodomésticos. Vamos lá?
Enfrentei essa limitação em meu curso na Alura sobre o uso do Entity Framework Core
em bancos legados. Nele mostrei uma alternativa para superá-la. Se você tem acesso
a Alura, mostrei esse tópico [nessa aula aqui].
## O problema em questão
Considere um banco de dados já existente com uma tabela que registra a eficiência
energética de equipamentos eletrodomésticos. O script de criação desse banco é o
seguinte:
sql
Repare que existe uma _check constraint_ na tabela. Ela restringe o valor que pode
ser armazenado na coluna Eficiencia para os valores A até G.
Poderíamos criar em nosso programa uma classe que fosse mapeada nessa tabela assim:
csharp
E para incluir alguns registros nessa tabela usando o EF Core eu usaria o seguinte
código:
csharp
A classe de contexto está listada abaixo:
csharp
Repare que começamos mapeando a propriedade Eficiencia, que é do tipo string, ao

tipo nvarchar. Tudo bem até aqui. O problema é que, do jeito que a classe está
mapeada, permitimos um código assim:
csharp
Quando tentássemos incluir esse objeto no banco seríamos presenteados com o erro:
> The INSERT statement conflicted with the CHECK constraint "CHK_Eficiencia".
Isso aconteceu porque a check constraint limitou o valor X que foi colocado na
propriedade Eficiencia do objeto.
Perfeito, a constraint funcionou! Mas como fazer com que os consumidores da classe
SeloProcel não cometam equívocos ao definir valores para essa propriedade? Ora, se
queremos permitir apenas alguns valores finitos uma boa opção será utilizar
enumerados. Vamos experimentar essa idéia.
## Usando enumerados
Vamos mudar nossa classe principal para utilizar enumerados na propriedade

Eficiencia. Para isso criamos o enumerado ÈficienciaEnergetica`.
csharp
Legal! Agora o código usado para inserir a terceira geladeira nem compila!
Alterando esse código para um válido...
csharp
... posso em seguida persistir a geladeira no banco.
Contudo, ao executar o código continuo recebendo o mesmo erro de _check

constraint_. Porquê? O que aconteceu?
## A limitação do EF Core 2 para converter enumerados e como superá-la
Quando vai persistir alguma propriedade do tipo enumerado o EF Core por convenção
utiliza o inteiro referente ao valor do enum.
Por exemplo, para o valor ÈficienciaEnergetica.F` ele vai usar o inteiro 5 (porque
esse valor é o quinto elemento no enumerado). Por isso a check constraint impede a
inclusão: o valor 5 não está entre os permitidos.
O problema é que a versão 2 do EF Core não oferecia possibilidade de alterar esse

comportamento! O que fazer então?
Para superar essa limitação eu vou seguir a indicação descrita [nesta issue],
registrada no repositório do EF Core no Github.
A solução que usei se dividia em 2 partes:
- Escrever uma classe de conversão usando métodos de extensão e um dicionário com o

mapeamento
- Criar duas propriedades na entidade, uma do tipo string para ser persistida e
outra do tipo enumerado para ser consumida no código
### A classe de conversão
A classe de conversão está listada abaixo. Ela utiliza dois métodos de extensão e
um dicionário para fazer o de-para.
csharp
Para converter do enumerado para string fazemos

ÈficienciaEnergetica.B.ParaString()` e para converter de string para enumerado
`"A".ParaEnum()` (repare que se tentarmos converter uma string não-mapeada uma
exceção será lançada).
### Mapeando as propriedades no EF Core 2.0
Já a entidade precisa ser modificada para se adequar a essa limitação. Podemos

começar abandonando o recurso de propriedades auto-implementadas em favor de um
campo privado, onde faríamos o de-para nos métodos de acesso para leitura/escrita:
csharp
Porém, o EF Core não suporta o mapeamento de campos privados! Uma pena, já que essa
solução utiliza uma prática comum em orientação a objetos: o encapsulamento com um
campo privado. O que fazer então?
Vamos tornar o campo privado uma propriedade pública com escrita privada. Por
convenção o nome de propriedades começa com maiúsculas, então mudamos seu nome para
ÈficienciaString` (você com certeza vai pensar em um nome mais adequado que o
meu!).
csharp
Pronto. Agora podemos configurar o mapeamento adequado no EF Core. Primeiro iremos

informar que é a propriedade ÈficienciaString` que será mapeada no banco com a
coluna Èficiencia` e depois vamos pedir que o entity ignore a propriedade
Èficiencia`. Veja o código:
csharp
Agora se eu executar o código anterior para incluir a terceira geladeira eu terei

sucesso, porque o EF está convertendo a propriedade para a string específica (B no
caso) e a check constraint irá validar esse valor. Ótimo!
O único senão é o fato de expormos uma propriedade (EficienciaString) apenas para

superar uma limitação em uma ferramenta. Um desenvolvedor que consumisse essa
classe poderia ficar confuso ao ver duas propriedades relacionadas à eficiência.
Qual delas utilizar?
Mas com a atualização do EF Core para a versão 2.1 isso não é mais necessário!!
Agora o EF Core suporta a conversão de valores entre propriedades do modelo e
colunas do banco. Vamos ver como isso é feito e substituir a solução acima.
## Como EF Core 2.1 converte valores

Segundo a documentação do EF Core 2.1 [sobre o assunto], agora é possível converter
valores de propriedades ao ler e escrever na base de dados. Isso pode ser feito
para converter valores do mesmo tipo ou tipos diferentes. Um exemplo da segunda
alternativa é a conversão de um tipo enumerado em uma string.
Para realizar a conversão usamos o método `HasConversion()` no momento da

configuração do modelo. Esse método faz parte da classe `PropertyBuilder` e tem 8
sobrecargas, cada uma com uma alternativas de conversão. Meu objetivo nesse artigo
não é explorar todas as possibilidades. Se ficou curioso, dê uma lida na
documentação através do link que disponibilizei.
A sobrecarga que vamos utilizar é uma que recebe dois delegates Func como entrada.
Um para converter do enumerado para string e o outro na direção contrária. Vamos
lá?
## Aplicando a nova solução
Primeiro vamos atualizar o EF Core para a versão 2.1. No Nuget Manager para o
projeto, clico na aba Installed e depois em Update (certifique-se que está
atualizando o EF Core para uma versão 2.1 ou superior).
Em seguida removo a propriedade ÈficienciaString` e volto a propriedade

Èficiencia` para uma propriedade auto-implementada:
csharp
Agora vou na classe de contexto e substituo o código anterior pelo código de

conversão...
csharp
Beleza! Testo a aplicação com uma inclusão de ar condicionado e tudo funciona

perfeitamente.
## Conclusão
É sempre importante buscar um código simples e conciso. Algumas vezes isso não é
possível por conta de limitações nas tecnologias que usamos. Mas sempre que
possível devemos revisitar nosso código para verificar se podemos refatorá-lo. Com
a nova versão do EF Core 2.1, pudemos voltar ao design simples de um POCO (_Plain
Old CSharp Object_), sem abiguidades ou dúvidas para os desenvolvedores que irão
consumir a classe SeloProcel.
Também vale a pena ficar antenado nas atualizações das tecnologias que você utiliza
em seus projetos, principalmente quando o time de desenvolvimento já houver
sinalizado que iria implementar a solução dessas limitações em seu roadmap.
Se desejar baixar e conferir o código que utilizei nesse artigo, vá até seu
[**repositório**] no Github.
Até o próximo artigo!
Durante o desenvolvimento de um projeto, é muito comum usarmos IDEs para facilitar

todo o processo de build do projeto, seja para a realização de compilação de
arquivos ou a execução da aplicação.
imagem
Hoje veremos alguns truques e dicas do [**Intellij IDEA**] que faz parte de uma das
mais famosas e poderosas IDEs do mundo Java.
> **Observação:** Vale lembrar que o IntelliJ em sua versão Ultimate, trata-se de
uma ferramenta paga que possue um Trial de **30 dias**. Entrentato, existe também a
versão free que é justamente a versão **Community** (comunidade). Se tiver
interesse em saber a diferença entre as versões, [consulte o site da própria
Jetbrains]. Caso não tenha o IntelliJ instalado, você pode seguir esse [**tutorial
de instalação**] da própria Jetbrains ou utilizar o [**Toolbox**] que é um
gerenciador de pacotes da Jetbrains, com ele é possível instalar todos os produtos
facilmente.
Todos os exemplos que veremos no post serão baseados na versão Community, pois
dessa forma você não vai precisar baixar a trial apenas para testar.
Além disso, irei considerar um projeto Java simples para um estoque, portanto,
todos os exemplos serão voltados para esse projeto. Caso não tenha nenhum projeto,
peço que crie um, [nesse link tem um tutorial explicando os passos]. Preparado?
Bora começar então.
## Ajustando os atalhos do IntelliJ
Um dos grandes primeiros passos com o IntelliJ é ajustar os atalhos, no caso, o

**_keymap_**. Nesse instante você deve estar pensando:
> "Então os atalhos não vem configurados?"
Sim, os atalhos já vem configurados, porém, dependendo da plataforma pode ser uma
configuração diferente da padrão!
### Qual keymap devo escolher?
Ao ajustar o keymap, você verá diversas alternativas referenciando ferramentas como

Eclipse IDE ou NetBeans. Quando eu comecei a aprender o IntelliJ eu estava
acostumado a usar o Eclipse IDE, portanto, optei em usar o keymap **Eclipse**.
Alguns atalhos funcionam de forma parecida com os comportamentos do Eclipse,

entretanto, durante o meu tempo de adaptação, haviam outros que só funcionavam
conforme os atalhos padrões do IntelliJ, portanto, tive que me adaptar.
Nesse processo de adaptação (durou meses), decidi parar de usar os atalhos do

Eclipse e migrei para os padrões do IntelliJ (Default), a princípio parecia contra-
intuitivo, mas conforme fui treinando fui me acostumando...
Atualmente já estou bem acostumado com os atalhos do IntelliJ e me sinto produtivo,

portanto, não sinto falta dos atalhos do Eclipse! Em outras palavras, não desanime
logo de cara caso não se sentir produtivo, o aumento da produtividade vai surgir
conforme for praticando!
Por experiência própria, recomendo para todos os devs que estão tentando migrar de
uma outra IDE para o IntelliJ fazer o mesmo, ou seja, evite o uso de atalhos de uma
ferramenta que já está acostumado, tente se adaptar praticando aos poucos com os
atalhos padrões, conforme for praticando, perceberá que já se acostumou!
## Configurando o keymap
Agora que fizemos o overview sobre os atalhos, vamos configurar o **keymap**.
Portanto, no IntelliJ, vá no menu **File > Settings**:
imagem]. Para isso, selecione o **src** e use o atalho **Alt + Insert**:
imagem do IntelliJ que tem como objetivo criar algo.
Veja que ele apresenta como primeira opção uma classe do Java, pois ele acredita
que seja a opção mais adequada nesse contexto, portanto clique ou tecle o **Enter**
na opção **Java Class**. Em seguida dê o nome **Main**, pois será a classe para
executar o nosso programa:
imagem e encontrar rapidamente o atalho que busco, seja pelo nome ou pelo próprio
atalho.
Além disso, o keymap faz referência ao último keymap configurado, portanto, caso
mudar o keymap, lembre-se de pedir a **Keymap References** novamente.
> **Recomendações**: Considerando que existem os atalhos padrões para cada

plataforma recomendo que sempre avalie quais atalhos "default" fazem mais sentido
pra você. Por exemplo, desenvolvedores que utilizam Mac OS preferem os atalhos
padrões para Mac, pois são mais intuitivos. E claro, mantenha-se utilizando sempre
o keymap reference para te auxiliar.
Agora que sabemos como buscar um atalho, vamos prosseguir com o nosso exemplo.
## Templates de código
De acordo com o que temos agora, queremos de fato executar a nossa classe `Main`,
certo? Para isso precisamos implementar o método `main()`. A princípio você deve
estar pensando:
> "Bom preciso apenas escrever o método `public static void`
Pois é, no IntelliJ é mais simples do que parece, basta apenas digitar as iniciais
da assinatura do método `main()` que ele já sugere e faz o resto pra gente:
imagem` junto da mensagem, porém, veja o tanto que a gente tá escrevendo apenas com
essa chamada!
Nem precisa falar que tem atalho, né? Digite **`sout`** e veja o IntelliJ
completando assim como ele fez no método `main()`:
imagem` junto com o método de impressão sem muito esforço, mas como podemos fazer
para executar o método `main()`?
A princípio pensamos em clicar no botão de play localizado no menu **Run > Run...**
que serve justamente pra isso.
Entretanto, a ideia do uso de uma IDE, principalmente do IntelliJ, é fazer com que
o uso do mouse seja raro ou inexistente justamente para aumentar a produtividade.
Sendo assim, para executarmos a nossa aplicação, basta apenas usar o atalho **Ctrl
+ Shift + F10**.
> Antes de executar deixe uma mensagem no `System.out.println()`, eu deixei

"Rodando a aplicação estoque"
Na parte de baixo vai aparecer a saída conforme o exemplo abaixo:

imagem** para navegar no projeto por meio da barra de navegação:
imagem.
## Criando atributos e seus getters e setters
Agora que temos a classe `Produto` precisamos adicionar os atributos, portanto

vamos considerar os atributos abaixo:
java
Legal, mas veja que agora teremos um trabalhinho para adicionar os métodos de
acesso aos atributos, isto é, os **getters e setters**.
Mas como já sabemos, as IDEs estão aí para salvar as nossas vidas, portanto, é mais
simples do que fazer na mão, basta apenas usar o atalho **Alt + Insert** novamente
que ele vai abrir as opções `Generate`:
imagem` faça a instância da classe `Produto`:
java
Agora que temos uma instância precisamos de um objeto. A princípio bastaria apenas
escrevermos algo como `Produto produto =`, certo?
Porém, podemos fazer isso de uma maneira mais fácil. Com o cursor em cima do `new`
utilize o atalho **Alt + Enter**, veja que ele vai aparecer a opção **Introduce
local variable** que vai atribuir a instância para o objeto do tipo `Produto`
automaticamente:
java
Note que inicialmente o IntelliJ sugere o uso do nome `produto`, pois por padrão
ele utiliza o nome da instância, mas nada impede de você editar conforme desejar :)
O atalho **Alt + Enter** é utilizado diversas vezes quando estamos dentro do

código, é por meio dele que o IntelliJ nos sugere as dicas de possíveis ações
baseando-se no local ao qual o cursor está, ou seja, já que ele estava no `new` ele
sugeriu a introdução da variável, se fosse um erro de compilação, provavelmente,
ele sugeriria outras opções.
## Alternando entre as classes abertas
Legal, temos o objeto, mas como podemos de fato criar um produto que tenha o nome
de "refrigerante", valor "5.00" e quantidade "10"? Atualmente, precisamos utilizar
todos os setters...
Uma abordagem mais objetiva seria criar de fato um construtor personalizado que já
recebesse esses parâmetros, mas como podemos fazer isso no IntelliJ?
A princípio, bastaria irmos para classe `Produto` com o **Ctrl + N** e depois usar
o **Generate** com o atalho **Alt + Insert**.
De fato funciona, porém, já que temos ambas as classes abertas, temos a capacidade
de alternar entre elas de um modo mais simples. Basta apenas usar o atalho **Ctrl +
Tab**:
imagem
Em outras palavras essa funcionalidade é conhecida como **find action**, ou na
tradução, **encontrar ação**, portanto, podemos até mesmo criar um projeto apenas
com esse atalho. A única coisa que ele vai exigir é um pouco do conhecimento de
inglês para facilitar o uso.
## Conclusão
Nesse post vimos como o IntelliJ facilita a nossa vida durante o desenvolvimento de
um projeto, entretanto, vimos apenas a parte básica na qual permite criar arquivos
e navegar no projeto.
Vimos também como podemos usar o template de código para facilitar a implementação
de códigos comuns, como é o caso do método `main()` ou o `System.out.println()`.
Além disso, aprendemos a gerar códigos comuns dentro de uma classe com o
**Generate** e vimos que o IntelliJ também nos sugeres possíveis ações dependendo
do contexto.
Por fim, vimos que temos a possibilidade de usar qualquer funcionalidade com apenas
um único atalho! Bacana, né?
Quer aprender mais técnicas da IDE para aumentar a sua produtividade em projetos
Java? Então não perca tempo e veja o [**curso de IntelliJ IDEA na Alura**].
Nele você vai aprender desde os conceitos mais básicos, conforme vimos nesse
artigo, como também, técnicas que são bem eficientes em qualquer projeto Java, seja
na busca, navegação, refatoração entre outras.
Na semana passada anunciamos no [blog da Caelum] que estou começando uma série de
posts sobre Java 9, pra que todos possam acompanhar as novidades da linguagem até o
seu tão esperado lançamento oficial.
A [JEP 286, Local-Variable Type Inference]:
> "We seek to improve the developer experience by reducing the ceremony associated
with writing Java code, while maintaining Java's commitment to static type safety,
by allowing developers to elide the often-unnecessary manifest declaration of local
variable types.
### Melhora contínua na inferência de tipos do Java
A idéia da JEP 286 é continuar o trabalho que já vem sendo feito nas versões
anteriores da linguagem, que é diminuir verbosidade, reduzindo a quantidade de
informações de tipagem que temos que declarar explicitamente em nosso código.
Quer um bom exemplo? O famoso _diamond operator_ do Java 7:
java
### Java 7 e o operador diamante
O operador diamante <> nada mais é do que um _syntax sugar_ dos tipos que tinham
que ser declarados explicitamente no momento de instanciar objetos genéricos. Até
então, o código anterior teria que ser escrito assim:
java
Foi um grande passo, mas a inferência de tipos ainda era bastante limitada.
### Java 8 e muitas novas possibilidades
No Java 8, novas JEPs foram aprovadas e parte do compilador foi reescrito,

melhorando drasticamente sua habilidade de inferir tipos. A introdução das
expressões lambdas foram um grande motivador. Um exemplo seria esse comparator, que
mostramos anteriormente em nosso [**post de Java 8**]:
java
Apesar de ser possível, em nenhum momento precisamos declarar que a variável **s**
da expressão lambda era do tipo _String_. Estamos ordenando uma lista que é do
tipo _String_, portanto isso foi inferido automaticamente.
### A possível inferência de variáveis locais do Java 9
A proposta do Java 9 foi além, sugerindo que a seguinte sintaxe seja aceita:
java
Repare no uso do **var** e do **val**. A diferença entre essas duas palavras chaves
é que a primeira, usada na lista de palavras, representas uma variável local,
mutável, do tipo _ArrayList_. A segunda representa uma variável local imutável,
isto é, final.
Seria equivalente a escrever:
java
### Mas isso só vai funcionar com listas?
Esse recurso não se limita apenas na declaração de listas e objetos genéricos...
java
Legal, não é? Ele pode ser usado desde uma simples _String_, um inteiro, ou até
mesmo _Path_s, _InputStream_s, mapas, sets e outros.
java
### E qual é a opinião da comunidade?
O Brian Goetz, um dos arquitetos do Java, publicou uma pesquisa para coletar a
opinião da comunidade a respeito dessa proposta. O resultado foi impressionante:
![survey result]
2.453 pessoas participaram e o entusiamo para adoção da feature foi evidente, 74.1%
votaram a favor! Tiveram outras perguntas na pesquisa também, [você pode ver o
resultado completo aqui]. E você, o que achou dessa proposta? Vale lembrar que ela
ainda pode ou não ser aprovada, tudo depende da Oracle. Mas se você quiser, já dá
pra ir brincando com [alguns builds não oficiais].
**Se você ainda não domina Java 8 e os recursos atuais da linguagem, com certeza
vai gostar do nosso [curso da Alura] e também do [livro publicado pela Casa do
Código]. A Alura usa Java 8 desde o lançamento final desta versão da linguagem, e
com Java 9 não será diferente.**
Em um sistema desenvolvido para a área de telemarketing de uma empresa foi

encontrado um bug na hora de mostrar a média das notas dos atendentes. Temos a
seguinte tabela de notas para nos mostrar de forma visual o problema:
java
Note que, nesta tabela todos os valores estão vindo quebrados, com diversas casas
decimais. Só que, para apresentar as notas aos funcionários, precisamos simplificar
esse valor para que seja melhor visualizado.
Para consertar este bug, primeiro vamos observar o método que calcula e devolve a
média:
java
Realmente o cálculo da média não toma nenhum cuidado com o arredondamento. O

`double` resultante terá a quantidade de casas decimais que chegue mais próximo do
verdadeiro resultado da operação matemática, respeitando o limite de casas decimais
do tipo primitivo `double`.
O primeiro passo para resolver esse problema é criar um método que cuida
exclusivamente de arredondar o valor calculado pelo método `calculaMedia()`. Então,
mesmo sem ter criado este método, vamos retorná-lo no `calculaMedia()`. Dessa
forma:
java
## Criando a função de arredondamento
Já dei spoiler de como será nosso método, ele recebe como parâmetro um `double` que
é o resultado do `calculaMedia` e retorna um `double` também, que é o resultado do
`calculaMedia()` arredondado. Então vamos começar a criar este método:
java
Para arredondar nosso `double`, podemos usar o método estático [**round()**] da

classe [Math]:
java
Tendo como exemplo um funcionário que teve as seguintes notas: 4.0,3.7 e 7.8,
representado por este código:
java
A média dele, na calculadora, seria: 5,166666667. Vamos ver o resultado que nosso
método nos traz:
imagem` devolve o `long` mais próximo do valor real passado no parâmetro. No nosso
caso, temos aproximadamente o valor real de 5,2. Portanto, o `long` mais próximo é
o 5.
Esquecendo o 5 que obtivemos vamos tentar de novo com as mesmas notas que usamos no
exemplo anterior, mas antes, vamos melhorar nosso método.
Para melhorar esse arredondamento, podemos usar uma gambiarra. Pensando que o
método `round()` arredonda para o `long` mais próximo, podemos multiplicar a
`media` por 100, usar o `round()` e depois dividir por 100. Fazendo isso no código,
temos:
java
Executando o código, nosso resultado é:
imagem` que arredondou para o `long` mais próximo, 517, e por fim dividimos 517 por
100, obtendo 5,17.
Tudo certo, né? Vamos tentar agora com outros valores. As notas do funcionário
agora serão: 3,1, 4,3 e 2,5. O resultado teoricamente seria 3,30. Vamos ver:
imagem]:
java
Nessa linha estamos dizendo que arredondaremos da metade para cima, ou seja, caso a
média seja 3,625, ela ficará 3,63.
Por fim, vamos formatar nossa média usando o método `format()` e já retornar este
valor. Dessa forma:
java
Perceba que ao fazer isso recebemos um erro de compilação. Isso aconteceu pois
nosso método àrredondar()` espera retornar um `double`, mas o método `format()`
devolve uma `String`. E agora?
Se pararmos para pensar, até faz sentido retornarmos uma `String`, pois já fizemos
todas as operações matemáticas que precisamos fazer. Agora só precisamos devolver o
valor formatado para o usuário ver. Logo, como não precisaremos mais operar sobre a
`media`, retornar a mesma como `String` faz sentido sim.
> Mas não poderíamos apenas transformar essa String em um double e devolver este
valor?
Sim, podemos, mas corremos o risco de perder a formatação feita, logo vamos optar
por retornar uma `String` mesmo. Então, vamos mudar nossos métodos para retornar
`String`.
## Conclusão
Pronto, formatamos os dados da maneira devida. Trabalhar com arredondamento às

vezes é uma tarefa complicada, dependendo da situação precisamos de valores
extremamente precisos, como, por exemplo, trabalhar com dinheiro.
Para manipular dinheiro o mais adequado é usar a classe [**BigDecimal que tem um
alta precisão**].
Para entender melhor como é trabalhar com arredondamentos e principalmente quando o

assunto é dinheiro temos o curso da Alura [**Curso Java Brasil: Formate datas, cpf
e números nacionais**], onde é usado uma biblioteca externa que ajuda na hora de
formatar valores de forma correta.
imagem
Precisamos de ambientes iguais, tanto para desenvolvimento, testes e produção. Ou

seja, em todos esses ambientes, a versão das bibliotecas, frameworks e demais
dependências devem ser iguais. Do contrário, podem causar erros.
Mas como conseguimos ter ambientes iguais?
## Conhecendo os containers
Nós podemos criar especificações que devem ser seguidas para manter todos os
ambientes o mais igual possível. Dessa forma, todos os desenvolvedores criam seus
ambientes por meio dessas especificações, porém, isso pode levar muito tempo de
todos os desenvolvedores.
Outra forma de fazer isso é criar apenas um ambiente e replicá-lo para todos do
time. Ou seja, criamos apenas uma vez esse ambiente e ele é repassado para todos da
equipe. Para isso, podemos utilizar **containers**.
Num primeiro contato, definimos containers como uma "virtualização não

convencional". Isto é, em uma virtualização tradicional, colocamos outro sistema
operacional em cima do nosso.
Esse sistema virtualizado possui o próprio kernel e hardwares virtuais. Já quando

criamos containers, estamos compartilhando o kernel e o hardware da máquina com os
containers.
Ou seja, nosso container possui apenas as bibliotecas e binários necessários para

seu funcionamento. Por isso, são mais leves do que a virtualização tradicional.
Um desses sistemas de criação de containers é o [**Docker**]. Com ele conseguimos

criar nossos containers a partir de imagens, que nada mais são do que
especificações de containers.
Dessa forma, quando precisarmos testar nosso programa, basta criar um container (ou
containers) baseado na nossa imagem. Portanto, precisamos criar uma imagem.
## Criando nossa própria imagem
Para criar imagens no Docker, podemos utilizar o `Dockerfile` para criar um imagem
baseada em uma imagem existente.
Por exemplo, podemos criar uma imagem da nossa aplicação e rodá-la em um container.
Para isso, vamos criar um arquivo chamado àplicacao.dockerfile`.
Nesse arquivo, temos que falar qual a imagem que estamos nos baseando para criar
nossa imagem. Como minha aplicação é em `Python`, vou dizer que ela se baseia
(`FROM`) na imagem do `python`.
`FROM python`
Nossa aplicação utiliza um microframework Python para web chamado Flask. Ou seja,
nossa imagem precisa ter esse framework para a aplicação funcionar. Logo, dizer
para o Dockerfile rodar (`RUN`) o comando para instalá-lo:
`RUN pip install flask`
Queremos que o container rode nossa aplicação. Portanto precisamos copiar (`COPY`)
o código da nossa aplicação para a nossa imagem. No meu caso, o código está na
pasta `src`, logo, vou copiar esse diretório para o diretório `/src`:
`COPY src /src`
Temos que acessar nossa aplicação de alguma forma. Para isso, nós podemos expor
(ÈXPOSE`) uma porta do nosso container. Dessa forma, sempre que quisermos acessar
a aplicação podemos utilizar essa porta do **container**.
Já temos o interpretador do Python, o código da aplicação e uma porta para

conseguir acessá-la. Falta alguma coisa?
Falta iniciarmos a aplicação! Para fazer isso, podemos dizer que quando o container
for criado, isto é, no seu ponto de entrada do container (ÈNTRYPOINT`) vamos pedir
para o `"python”`, executar nossa aplicação: `”/src/app.py”`
ÈNTRYPOINT ["python", “/src/app.py”]`
Nosso arquivo final fica dessa forma:
python
Pronto! Temos um Dockerfile file especificando uma imagem. Contudo, perceba que não
temos a imagem pronta. Para isso, precisamos falar para o Docker construí-la.
## Construindo uma imagem
Para construir nossa imagem, pelo terminal vamos até o diretório onde criamos o
Dockerfile.
Lá pedimos para o Docker construir (`build`), baseado no arquivo (`-f`)

àplicacao.dockerfile`, com o nome (`-t`) que, no meu caso, vou chamar de
`yurimatheus/app` (nome-do-usuário/nome-da-imagem) já que é um padrão no Docker.
Também precisamos dizer que todos os arquivos para construir a imagem estão neste
diretório, para isso, utilizamos o ponto (`.`) no final do comando:
`docker build -f aplicacao.dockerfile -t yurimatheus/app .`
imagem um container baseado na imagem que acabamos de criar (`yurimatheus/app`):
`docker run yurimatheus/app`
Lembra que colocamos uma porta no container para conseguir acessar a aplicação?
Logo, temos que mapear uma porta da nossa máquina host para o container. Isto é,
dizer que quando alguém acessar uma porta na máquina host, na verdade estará
acessando o container.
Neste caso, vou falar que a porta (`-p`) `8080` da nossa máquina host vai ser
mapeada para a porta `5000` do container, que foi a porta que especificamos no
Dockerfile:
`docker run -p 8080:5000 yurimatheus/app`
![]
Funcionou! Temos nossa aplicação rodando em um container com uma imagem que nós
mesmos criamos.
## Para saber mais
Criamos um Dockerfile bem simples. Podemos criar Dockerfiles para criar imagens
complexas, com diversos outros recursos.
Além de copiar arquivos para a imagem, podemos também criar volumes. Como o
container é um processo isolado do sistema host, quando salvamos algo no container
e este é reiniciado, ou desativado, nós perdemos esses dados.
É aí que os volumes entram em cena. Com volumes fazemos uma cópia dos dados do
container na nossa máquina local. Dessa forma, mesmo se o container parar, ainda
temos os dados disponíveis.
Podemos também utilizar o Docker para reduzir nossos gastos como, por exemplo, os
gastos com servidores. Ao invés de ter um servidor para cada aplicação, podemos ter
containers.
Podemos tem um container para cada ambiente, testes, homologação, produção. Ou

então, podemos ter diversos containers nesses ambientes. Um para cada serviço,
criando assim, uma [**arquitetura de microserviços**].
Para gerenciar esses diversos containers, o Docker nos oferece uma ferramenta
chamada de [**Docker Compose**]. Com ele, conseguimos compor uma aplicação com
diversos containers.
No [**curso de Docker da Alura**], além de aprender sobre como o Docker funciona,

como criar suas imagens, a como subir seus container na nuvem, você também aprende
a utilizar o Docker Compose.
Porém, quando o número de containers começa a crescer muito, mesmo com o Docker
Compose é difícil de gerenciá-los. Por isso, foram surgindo outras ferramentas, uma
muito utilizada é o Kubernetes.
Com ele conseguimos orquestrar nossos containers com base em um único arquivo de
configuração.
Aqui na Alura, temos um [**curso de Kubernetes**], onde você aprenderá a realizar

essa orquestração. A realizar a comunicação de containers da aplicação com banco de
dados, a escalar seus containers e realizar o balanceamento de carga, entre outras
coisas.
imagem
Empresas como Amazon, Google, Microsoft, entre outras, fornecem parte da

infraestrutura que já possuem para que nós usuários possamos utilizar em nossos
projetos. Sendo assim, nesse artigo, vamos explorar os serviços da Amazon AWS.
Após meses de desenvolvimento em nosso projeto de _e-commerce_ de livros de

tecnologia, feito com o framework do [**Spring MVC**], chegou o momento de levar
esse nosso projeto para o ambiente de produção para que os usuários possam acessar
nossa aplicação.
Para disponibilizar esse projeto na internet, precisamos de servidores,

equipamentos de rede, alocação de endereços IP, etc, porém acaba sendo um custo
muito elevado para nós, não é mesmo?
Dessa forma, justamente visando eliminar essa barreira inicial de investimento,

empresas como Amazon, Google, Microsoft, entre outras, fornecem parte da
infraestrutura que já possuem para que nós usuários possamos utilizar em nossos
projetos. Sendo assim, nesse post, vamos explorar os serviços da [**Amazon AWS**].
## Cadastrando um livro
Nosso projeto tem como objetivo que os administradores da plataforma façam o

cadastro dos livros, para que posteriormente esses livros estejam disponibilizados
na _home_ da aplicação, fazendo assim com que todos os usuários possam visualizar
os produtos que oferecemos e, eventualmente, realizar a compra desses livros.
imagem está dentro desse limite de uso gratuito e poderemos utilizá-lo para nosso
teste.
Uma vez que terminamos o processo de criação de conta na Amazon AWS, seremos
redirecionados para o painel inicial onde temos uma lista com os vários serviços
disponíveis. Na aba de _Storage_ seremos capazes de visualizar o serviço do **S3**.
imagem que será responsável por armazenar as imagens de nossa aplicação. Para isso,
clicamos no botão **Create bucket.**
imagem juntamente com as credenciais de acesso que foram configuradas no método

**basicAWSCredentials()** que acabamos de criar. Ao final, nossa classe
**AmazonConfiguration** deverá ter ficado dessa forma
java
Tendo o arquivo de configuração finalizado, devemos ir até a classe do projeto

responsável pelo tratamento das imagens e fazer o uso dos métodos para enviar os
arquivos para o _Bucket_ que criamos.
## Configurando classe de tratamento de imagens
Vamos até a classe de nosso projeto responsável pelo tratamento das imagens,
chamada **_FileSaver_** e pedir para o Spring fazer a injeção do objeto do tipo
**AmazonS3** que configuramos na classe **AmazonConfiguration**
java
Com isso, poderemos chamar o método **putObject** para fazer o envio das imagens
para o _Bucket_. O primeiro argumento desse método espera receber um objeto do tipo
**PutObjetctRequest**, onde deveremos passar as informações do nome do _Bucket_,
nome com o qual o arquivo deverá ser salvo no _Bucket_, o fluxo de dados que
compõem o arquivo e metadados de informação, caso seja necessário.
java
Por padrão, quando um arquivo é enviado para o _Bucket_, esse arquivo possui uma
visibilidade privada e com isso nenhum usuário que for acessar a aplicação será
capaz de visualizar a imagem das capas dos livros.
Dessa forma, nós precisamos alterar a visibilidade desses arquivos para que a
leitura seja pública, ou seja, qualquer usuário que tiver a URL de acesso,
conseguirá visualizar as imagens das capas dos livros.
Para isso, devemos chamar o método **withCannedAcl** e passar como argumento desse
método uma _ENUM_ de leitura pública, com isso, quando as imagens dos livros forem
cadastradas no _Bucket,_ terão uma visibilidade pública de leitura e todos os
usuários irão conseguir visualizar as imagens.
java
Agora que as imagens das capas dos livros foram passadas para o _Bucket_, esse
nosso método deverá retornar justamente a URL de acesso de cada uma dessas imagens
para que seja _persistida_ no banco de dados, com as demais informações que compõem
o livro.
Por padrão, os arquivos dentro de um _Bucket_ na Amazon seguem a seguinte estrutura

de acesso:
* http://s3.amazonaws.com/ \[Nome do Bucket\] / \[Nome do arquivo\]. Colocamos
então:
java
Com isso, nossa classe final responsável pelo tratamento das imagens cadastradas
deverá ter ficado dessa forma
java
## Analisando resultados
Nós fizemos as configurações necessárias em nosso projeto para enviar as imagens

das capas dos livros, falta somente nós testarmos a aplicação e ver se de fato as
imagens estão sendo enviadas para o _Bucket_ e se conseguimos visualizar as imagens
em nossa aplicação. Para esse teste, iremos utilizar a imagem do livro **Algoritmos
em Java** do autor **Guilherme Silveira.**
![]
O que esperamos nesse momento é que ao clicarmos no botão **Cadastrar**, a imagem

do livro seja passada para o _Bucket_ que configuramos no serviço do **S3** e que
possamos visualizar essa imagem na home da aplicação.
![]
Veja que temos aqui justamente a informação que o livro foi cadastrado com sucesso,
vamos conferir se a imagem do livro está no _Bucket_ que configuramos na Amazon?
![]
Vejam só o resultado, agora nesse _Bucket_ temos justamente um arquivo com nome
**algoritmos_java.jpg,** que é justamente a imagem do livro que cadastramos, será
que se formos na home de nossa aplicação, conseguiremos visualizar a imagem do
livro cadastrado?
![]
Olha só!! Conseguimos ter a imagem do livro que cadastramos sendo disponibilizada
na aplicação, com isso, todos os usuários da internet que forem acessar a _home_
serão capazes de visualizar as informações dos livros que acabamos de cadastrar.
Você pode encontrar a versão final do projeto com as alterações [**nesse link**].
Gostaria de aprender mais sobre a Amazon AWS e Cloud Computing? Na Alura temos
[**cursos especialmente sobre Cloud Computing**]
O principal objetivo dessa **mudança no Google** inibir páginas sem conteúdo

relevante e favorecer aquelas que apresentam maior qualidade, variedade de
informação e originalidade.
Inicialmente, Fred não foi apresentado como um nome oficial a Google não realizou
uma notificação a respeito dessa mudança nem apresentou detalhes sobre ela. Esse
nome foi dado inicialmente pela comunidade da [**área de Marketing Digital**] para
a alteração no código,que pegou os SEOs de surpresa ao perceberem uma brusca
redução do ranqueamento de diversos websites.
## Como foi dada essa descoberta?
Para se ter uma ideia, alguns SEOs se certificaram de que houve uma importante
alteração por uma [troca de Tweets] entre o produtor de marketing digital Avinash
Murty e o analista de tendências de Webmaster do Google John Mu.
Nessa conversa, entrou em pauta uma flutuação observada no ranqueamento de algumas

páginas. O funcionário do Google disse que são feitas atualizações constantemente,
e essa variação pode ter ocorrido em função de alguma delas.
De fato, a empresa realiza diversos updates em seu algoritmo de busca ao longo do

ano. Alguns, que provocam mudanças mais importantes em termos de ranqueamento de
páginas e na variação do tráfego, acabam se tornando mais conhecidos.
Temos como exemplo o [**Hummingbird**], que tornou a plataforma de busca mais

rápida e precisa, e o [Panda], que passou a dar prioridade a conteúdos de mais
relevância e qualidade.
## Quais as mudanças provocadas pelo Fred?
No caso do Fred, a mudança está relacionada aos critérios para a prioridade de

exibição de páginas web.
O algoritmo faz um julgamento mais aprimorado da qualidade dos links criados que
direcionam para a página (backlinks) e faz com que páginas mais focadas em serem
encontradas por mecanismos de busca do que em criar bom conteúdo percam em termos
de prioridade ou, até mesmo, não sejam listadas.
Para entender bem a questão, seguem alguns conceitos muito aplicados em

[**marketing digital**] para aumentar o tráfego do site que estão relacionados ao
Google Fred update:
### Keywords
São palavras, frases ou expressões relacionadas a um conteúdo em uma página WEB.

Ajudam a resumi-lo e em sua identificação. Quando aplicadas em seus metadados, o
mecanismo de busca qualifica melhor a página, conforme a pesquisa realizada por um
usuário.
### SERPs
É a sigla para Search Engine Results Page (página de resultados de mecanismo de

busca). É um tipo de plataforma onde se pode encontrar quais páginas serão
listadas, em ordem de prioridade, por mecanismos de busca, a partir de consultas.
O ponto forte de um SERP é que ele pode realizar esse ordenamento por busca de
keywords, o que ajuda a encontrar palavras chave adequadas para otimizar o tráfego
na página.
### Rankings de websites
São os sites exibidos no topo quando se faz uma pesquisa em um mecanismo de busca
como o Google.
### Otimização de páginas
A otimização de página se dá por meio de diversas técnicas de SEO, como criação de

metadados, estilização de títulos, uso de palavras-chave e organização do conteúdo
de uma forma que o mecanismo de busca não apenas entenda aquele conteúdo como ideal
conforme a busca, como dê preferência a ele na ordem de exibição.
### Backlinks
São links adicionados em uma página que direcionam para outra página. São usados
com muita frequência para indicar referências e facilitar a pesquisa do leitor da
página que,ao clicar em um link, encontra com mais facilidade uma informação
adicional.
Bons backlinks aqueles adicionados em páginas com conteúdo confiável e muito

acessadas valorizam o site para o qual eles apontam.
Então, para aumentar o tráfego em uma página, o administrador adiciona, nos

metadados e ao longo do texto, keywords identificadas como mais poderosas, para
alavancar o número de acessos. Quando o mecanismo de busca as encontra, dá à
página prioridade na exibição. Os SERPs são utilizados para encontrar as melhores
keywords.
A página também é estruturada para facilitar o encontro das keywords e, sempre que
possível, os geradores de conteúdo procuram colocar links para outras páginas e,
assim, aumentar o tráfego.
Cabe ressaltar que o uso dessas técnicas é perfeitamente legal e, inclusive, são
boas tanto para o usuário — que pode, com mais facilidade, logo ao realizar uma
busca, encontrar na lista de resultados a página que mais o interessa — quanto para
o produtor de conteúdos de qualidade, pois ele é encontrado e pode assim
disponibilizar para o seu público informações que lhe interessa.
## O problema são os excessos!
É comum que uma página, principalmente aquelas que dependem de alto número de
acessos e cliques em suas propagandas para sobreviverem, abuse desses recursos.
Então, abrem mão da informação de qualidade em detrimento do uso de técnicas de
SEO.
São considerados conteúdos de má qualidade aqueles que, em vez de conter
informações que resolvem um problema relacionado à busca que o levou àquele artigo,
foram tecnicamente elaborados apenas para [**aumentar o tráfego no site**].
Excesso de palavras-chave e de propagandas também reduzem sua nota.
Já os backlinks podem ser gerados de forma automática por bots. Eles colocam links
em comentários de posts em diversas páginas, povoando a web de links para aquela
página, ainda que sem um contexto apropriado.
## Como saber se a minha página foi afetada?
Consulte o [**Analytics**] e veja se ocorreu alguma redução no tráfego entre os

dias 5 e 20 de março de 2017. Caso não tenha havido uma redução significativa do
número de acessos, a qualidade dos links e de seu conteúdo está de acordo com os
novos critérios.
Usando uma ferramenta para checar os backlinks, verifique se algum deles tem
qualidade questionável. Verifique também se os backlinks considerados bons
aparentam ser naturais.
## Como não ser afetado pelo Google Fred update?
A primeira consideração a ser feita é zelar pela qualidade do conteúdo. [**Adicione

informações relevantes**] aos posts, que realmente interessem ao leitor que fora
trazido até ela. Evite excessos de palavras-chave, a priorização do buscador em
detrimento do usuário e repetição de conteúdo.
Seja criativo e procure apresentar diversidade de temas e tópicos relacionados ao

assunto principal que a página aborda. Apresente as informações de maneiras
distintas como guias, listas, comparativos de produtos e serviços. Enfim, ajude seu
leitor a realmente conseguir encontrar ali o que precisa para resolver o seu
problema.
Não use ferramentas que automatizam a criação de links e apenas os adicione quando
for apropriado e de forma contextualizada!
Portanto, o Google Fred update é uma atualização do algoritmo de busca do Google

que tem por objetivo filtrar páginas com conteúdo de baixa qualidade, porém, que
eram bem-sucedidas em termos de ranqueamento por utilizarem de maneira abusiva
técnicas que as favorecem.
Parodiando as torcidas do Fluminense e Atlético Mineiro, “O Fred vai te pegar” caso

o conteúdo de sua página não seja realmente relevante para os leitores e os links
criados para ela tenham sido criados por robôs, sejam descontextualizados ou
excessivos.
Esperamos que com esse artigo tenhamos esclarecido o conceito do Google Fred update
e como ele impacta no sucesso das páginas que geram conteúdo para Web.
Para ter sempre em mãos informações que contribuirão para o seu desenvolvimento
profissional, assine a nossa newsletter!
imagem
O que costumava ser um meio estático evoluiu para uma experiência muito rica e
interativa.
No entanto, não importa o quanto tudo mudou no processo de produção, já que o

sucesso de um app ou site ainda depende quase exclusivamente de uma coisa: UX
Design (ou, em português, experiência do usuário). A cultura de UX está cada vez
mais presente nos aparelhos que usamos diariamente, em especial nas interfaces
digitais de computadores e smartphones.
Conheça, no post de hoje, como os celulares atuais têm evidenciado a _user

experience_, ditando as necessidades do mercado atual:
## A experiência do usuário
A [**experiência do usuário**], do inglês _user experience_ (comumente abreviada

como UX), diz respeito a como alguém se sente ao se conectar a um sistema. Esse
sistema pode ser um site, uma aplicação web, um software desktop ou mesmo a
interface que o conecta ao caixa eletrônico de seu banco.
Quem trabalha com [**UX Design**] estuda e avalia como os usuários interagem com
essas interfaces, considerando coisas como a simplicidade de uso, percepção de
valor, eficiência, utilidade, entre outros aspectos que tornam uma experiência
positiva. O objetivo de tal avaliação é melhorar a satisfação e lealdade do
cliente, criando produtos úteis, fáceis de se utilizar e altamente interativos.
Se UX Design é a experiência que um usuário tem ao interagir com seu produto, ele é
também, por definição, o processo pelo qual determinamos (ou pelo menos tentamos
antecipar) que experiência será essa.
## Smartphones e _user experience_: uma nova fronteira
O smartphone, como conhecemos, já existe há mais de uma década. Pode parecer para
você que os últimos anos voaram, mas é mais provável que você sequer se lembre como
era a vida antes do smartphone. É tão difícil imaginar como vivíamos antes destes
dispositivos quanto imaginar o que virá a seguir.
Hoje, eles são onipresentes e tão bem-sucedidos em suas funções que é perturbador
pensar em nossa rotina sem esses computadores de bolso. Desde que telefones
começaram a se tornar inteligentes — e à medida em que a internet móvel ficou
realmente rápida — a UX Design começou a decolar.
Designers tiveram a oportunidade realmente nova de pensar interações e estratégias

para fazer as trocas homem-máquina com smartphones serem prazerosas. E o impacto de
suas decisões foi tão grande que uma tendência hoje toma conta da _user
experience_: o _mobile first_.
## _Mobile first_ e a mudança de paradigma
_Mobile first_ é exatamente o que seu nome indica: dispositivos móveis primeiro.
Tendência popular nas comunidades de design e desenvolvimento, o conceito foi
divulgado pela primeira vez na TechWeek de Chicago, em 2011 quando John Buda
explicou como escrever [**websites responsivos**].
Essa ideia, de que você poderia aplicar JavaScript para dizer a um [**website que
se adapte**] a qualquer dispositivo, foi revolucionária e se transformou em uma
nova forma de entender usabilidade.
Entretanto, empresas como o Google já adotavam uma estratégia de _mobile first_

desde 2010, e, graças a elas, projetar primeiro para uma experiência em
dispositivos móveis e depois para desktops passou a ser a norma entre as startups
de tecnologia que queriam fazer produtos que funcionassem tão bem tanto em uma
plataforma quanto na outra.
A abordagem exige um planejamento diferenciado, grande foco em UX Design e no

desenvolvimento e desloca completamente o paradigma da _user experience_. Em vez de
pensar primeiro nas exibições em desktop e nos ajustes que fariam dessas interfaces
responsivas, designers passaram a levar em consideração especificamente o mobile em
suas criações, criando a partir dele as soluções para desktops.
Se hoje a estratégia mobile first é adotada por muitos sites e aplicativos, não era
assim no começo. Devemos entender que isso só aconteceu porque os dispositivos
móveis são, atualmente, o principal meio pelo qual usuários acessam sites da web.
Além disso, como o número de pessoas que usam smartphones segue crescente — e
deverá aumentar ainda mais nos próximos anos, a tendência acabou por se instaurar
em definitivo.
Essa é uma prova de como os smartphones colocaram a cultura UX em destaque. Levando

desenvolvedores e designers a pensar primeiro na experiência para estes
dispositivos, devido a sua popularidade, o advento desses aparelhos foi o bastante
para gerar novas oportunidades de trabalho para designers ao redor do mundo.
Há, ainda, outro motivo para a _user experience_ se concentrar nesses dispositivos.
O mero desenvolvimento de tecnologias como o HTML5 e o CSS3, que juntas oferecem
novos recursos que suportam chamadas JavaScript sensíveis, fez com que fosse
possível trazer a UX de aplicativos para o desktop.
Hoje, desenvolvedores podem dizer aos sites da web que se comportem de uma
determinada maneira, tendo os recursos para otimizar seus [**layouts**] para
dispositivos específicos. Isso permite a criação de aplicações ricas em contexto,
um dos motivos responsáveis por tornar essa abordagem tão popular.
## _User experience_: do celular para o computador
Se no começo aplicávamos a linguagem dos desktops para os celulares na criação de

designs, o que acontece hoje é o contrário: elementos de UX antes encontrados
apenas em plataformas móveis estão começando a cruzar para os desktops, com
[**excelentes resultados**].
Você já deve ter visto por aí, em páginas como o Medium, menus pop-up de texto
selecionados. Pois bem, esses elementos surgiram no smartphone — mais
especificamente no iOS 3. Ali, as funções de cortar, copiar e colar apareceram pela
primeira vez em um menu contextual, função que foi copiada por outras
desenvolvedoras e evoluiu até chegar no desktop.
Hoje, é comum que as novidades venham do mobile e se adaptem para as interfaces

web. E por que elas funcionam bem em ambos os meios? Porque são baseadas na
simplicidade.
O bom design é tão claro e reduzido quanto possível. Se no mobile somos obrigados a
trabalhar com restrições extremas para produzir _user experience_ de ponta, é
também ali que surgem soluções simplificadas e fáceis de usar que podem ganhar
corpo e evoluir para outros meios.
## Como o celular colocou UX Design em destaque?
É exatamente por "forçar" essa simplicidade que o celular popularizou a cultura de

UX. Antes dele, nunca foi tão relevante pensar soluções que exigem o mínimo de
interação e produzem o máximo de resultado. Depois dele, no entanto, nenhuma de
nossas experiências com interfaces foi mais a mesma.
Entendeu por que UX Design ganhou destaque com o advento dos smartphones? Aproveite
e siga a Alura nas redes sociais para aprender tudo sobre _user experience_. Temos
perfis no [Facebook], [Twitter],[Linkedin] e um canal no [YouTube]!
A compactação e descompactação de diretórios e arquivos é uma tarefa bastante comum

no dia a dia. Podemos compactar um diretório para enviar para um amigo ou realizar
um _backup_. Talvez para alguns usuários, mais comum que a compactação seja a
descompactação: no nosso cotidiano podemos baixar arquivos compactados dos mais
diversos tipos e, naturalmente precisaremos descompactá-los para que seja possível
utilizá-los devidamente.
O objetivo da compactação é unir vários arquivos em um só, fazendo também com que o
arquivo final fique menor e seja mais fácil de transferir. Isso é feito através de
programas [compactadores de arquivos], que utilizam algoritmos para que seja
possível reduzir o tamanho dos dados que serão compactados.
Um dos formatos de compactação bastante conhecido é o **zip**. Você certamente já

viu algum arquivo com extensão `.zip` em sua vida. No Linux, para compactar no
formato `.zip` utilizamos o comando `zip`. Tenho um diretório, dentro do diretório
do meu usuário (`/home/nome_do_usuario`) que contém alguns projetos, vamos ver o
conteúdo desse diretório através do comando `$ ls -l Projetos/`.
Note que utilizei o argumento `-l` junto ao `ls` para obter uma lista mais
detalhada. O "d" no início de cada linha indica que temos dois diretório dentro de
`Projetos` (`GeradorDeXML` e `GeradorDeJSON`).
imagem.
bash
Espera aí! Dentro do arquivo `projetos.zip` existe apenas o diretório `Projetos/`.

O que houve com os diretórios `GeradorDeJSON` e `GeradorDeXML`?
Acontece que, por padrão, o `zip` não inclui os arquivos e subdiretórios de um

diretório, por isso nosso `.zip` contém apenas o diretório `Projetos/` vazio. Para
resolver isso é fácil: basta passar o argumento `-r` (_recursive_).
bash
Veja só! A saída do `zip` já foi diferente. Vamos listar o conteúdo do `.zip`
gerado.
bash
Agora sim! Os subdiretórios foram incluídos. Perceba que o `zip`, por padrão,
informa na saída do terminal todos os diretórios e subdiretórios que estão sendo
compactados. O ùnzip` funciona da mesma forma na descompactação. Para que isso não
ocorra, podemos utilizar o argumento `-q` (_quiet_).
Vamos primeiro excluir o diretório `Projetos/` para que no momento da

descompactação o diretório seja criado novamente.
bash
Pronto! O arquivo foi descompactado e temos a estrutura de diretórios de antes.
Vimos como utilizar o `zip` para compactação e descompactação de arquivos. Em breve

um outro post será publicado onde será utilizado o `tar` para realizar a
compactação e descompactação.
Cursos de uma série preparatória para a certificação [Linux Essentials] também

estão sendo [lançados]!
imagem
Estou **configurando a rede** em uma empresa. Nesta empresa, existem dez

computadores e um servidor, ambos conectados a um **switch** que, por sua vez, está
conectado a um roteador.
imagem deve possuir um [**endereço IP válido**] para que exista comunicação.
Nesse caso, são onze máquinas (dez computadores e um servidor), mas poderiam ser
vinte, cinquenta, cem máquinas. Teríamos que alocar todos, um por um? Isso, além de
tomar muito tempo, pode causar alguns erros, como alguma máquina sem endereço ou
com endereços repetidos.
Não existe alguma maneira de designar o endereço de todas as máquinas

automaticamente?
Conseguimos fazer nosso roteador entregar os endereços IPs para cada máquina que
fizer a requisição. Dessa maneira, não precisamos configurar máquina por máquina e,
além de economizar tempo que seria usado para alocar os endereços, essa prática
evita de ter endereços repetidos.
O protocolo que realiza isso é chamado de [**DHCP**].
## O que é o DHCP
DHCP (Dynamic Host Configuration Protocol) é o [**protocolo**]) que distribui

endereços IPs, para as máquinas. Desta forma, cada máquina que fez a requisição
recebe um endereço IP e um [**gateway**].
**Vamos especificar apenas o endereço do servidor manualmente.** Dessa forma o IP

do servidor não mudará, já que, caso isso ocorra, alguns serviços providos podem
ficar indisponíveis.
Colocarei o endereço do servidor como `192.168.0.2`, mas pode ser aquele que mais
se adequa a seu projeto.
Agora vamos ver como configurar nosso DHCP!
## Configurando o DHCP nos roteadores Cisco
Para realizar a configuração do serviço de DHCP em um **roteador Cisco**,

precisamos acessá-lo via terminal. No terminal temos que acessar o modo de usuário
privilegiado. Para isso digitamos: `> enable`.
imagem via o terminal (`terminal`):

`# configure terminal`
imagem para a rede, que entregará os endereços (`dhcp`). Esse serviço terá o nome
(`pool`) que, no nosso caso, será chamado de `REDE`.
`(config) # ip dhcp pool REDE`
imagem**.
Nossa rede pode ser qualquer uma que esteja dentro de um endereço de [**IP
privado**]. Neste caso vou utilizar o endereço de rede `192.168.0.0` mas pode ser
aquele que melhor se adequar ao caso (desde que seja um endereço válido).
`(dhcp-config) # network 192.168.0.0`
imagem é o que divide o endereço IP em duas partes: endereço da rede e endereço do

host. Cada vez que na máscara conter um `255`, significa que aquela parte do
endereço IP pertence a rede.
```
Rede: 10
Host: 0,0,0
Máscara: 255,0,0,0
```
Por exemplo, um endereço de rede igual a `10.0.0.0` e sua máscara de rede igual a
`255.0.0.0`. Isso indica que todos os computadores com endereço 10.alguma_coisa
pertencem a rede.
Isto é, o host `10.0.1.0` pertence a essa rede, da mesma forma que o host
`10.1.2.3`. Já que o `255` indica qual é a rede:
Agora, se tivéssemos um host com o IP `11.0.1.2` ele não pertenceria a rede dos
anteriores, pois o que indica a rede é o `10`, que representa o `255` na máscara.
Dependendo da máscara dizemos se o IP é de classe A, B, ou C. Em redes privadas

funcionam basicamente assim:
- **IP da rede:** 10.0.0.0 à 10.255.255.255- IP classe A - Máscara padrão:

255.0.0.0
- **IP da rede:** 172.16.0.0 à 172.31.255.255 - IP classe B - Máscara padrão:

255.255.0.0
- **IP da rede:** 192.168.0.0 à 192.168.255.255- IP classe C - Máscara padrão:

255.255.255.0
Neste caso vou utilizar a padrão da [**classe C**] (`255.255.255.0`). Dessa forma,
o endereço `192.168.0` pertence a rede.
`(dhcp-config) # network 192.168.0.0 255.255.255.0`
imagem.
Como queremos especificar qual o **roteador padrão** da nossa rede, basta digitar:
`default-router` seguido do endereço IP do roteador, que no nosso caso é o:
`192.168.0.1`.
imagem do nosso **pool** DHCP. Assim nosso roteador não o entrega:
`(config) # ip dhcp excluded-address 192.168.0.1`
imagem.
Para isso precisamos de um serviço chamado [**DNS**]. Ele nada mais é do que um
outro protocolo de rede que **resolve** nomes de domínio, transformando-os em
endereços IPs.
Por exemplo, o endereço `www.google.com.br` pode ser equivalente à 216.58.202.67.

Esse é o processo de **resolve**.
Podemos deixar nosso roteador entregar o endereço do **servidor DNS (DNS Server)**,
basta informar seu endereço.
Para isso vamos voltar ao seu modo de configuração, na parte que configura o
serviço de DHCP, e digitar:
`(dhcp-config) # dns-server`
Precisamos informar o endereço IP do nosso servidor DNS. No meu caso, o endereço IP

do servidor é aquele que removemos anteriormente do **pool** de entregas do DHCP:
`192.168.0.2`.
`(dhcp-config) # dns-server 192.168.0.2`
![]
Pronto dessa maneira temos o serviço de DNS configurado. Vamos tentar acessar
novamente o site da **Alura**:
![]
Sucesso! Agora temos todas as máquinas conectadas com seus endereços IPs, gateway e
DNS sendo alocados dinamicamente.
## Conclusão
Tínhamos que configurar o endereço IP de vários hosts, vimos como realizar sua
configuração de uma maneira dinâmica utilizando o DHCP.
Entendemos também como configurar o serviço de DHCP em roteadores Cisco, provendo

endereços IPs, DNS e gateways para os computadores que requisitarem.
**Com o DHCP não precisamos especificar o endereço IP de máquina por máquina, ele
faz isso automaticamente, o que nos poupa muito tempo.**
Gostou de redes? Essa é apenas uma parte desse vasto mundo de redes. Aqui na Alura,
temos uma [**formação completa em Redes**]. Nela você aprenderá sobre **protocolos,
como configurar roteadores e switches, sobre segurança da informação** e muito
mais!
Todo [**designer**], redator, jornalista, freelancer ou qualquer outro profissional

que trabalha com criatividade sabe a importância de manter essa habilidade em sua
rotina. No entanto, para ser criativo, não é necessário ter nenhum dom especial,
por mais incrível que pareça. Como ela não é inata, qualquer pessoa pode melhorar a
criatividade. E estímulos constantes são essenciais para isso.
Muitos profissionais costumam passar por bloqueios mentais e criativos. Nessas

horas, é normal entrar em desespero e achar que nunca mais vai conseguir criar como
antes.
Prevendo esses momentos de “branco total”, fizemos uma lista com algumas dicas que
podem ajudá-lo a recuperar a criatividade. Confira agora mesmo:
## Saia da rotina
Vá a outros lugares, passeie pelo parque ou shopping, mude o trajeto para o

trabalho ou faculdade, faça coisas diferentes. A sua criatividade será melhor
estimulada quando você ousar sair da rotina.
Procure novos cursos, seja de música, dança ou até mesmo de cuidador de idosos.
Trabalhos voluntários também são bons meios de sair do cotidiano, além de fazer com
que você se sinta útil e uma pessoa melhor.
## Escreva sobre outros assuntos
Se você trabalha mais com textos do que com imagens, que tal sair do lugar-comum e
escrever sobre outros assuntos? Faça um diário ou um blog, escreva frases
motivacionais para uma página do Facebook. Escreva não por obrigação, mas por
prazer e você verá a diferença na hora de criar.
Está sem ideias? Pense naquilo que você mais gostava de fazer na sua infância. Esse
pode ser um bom ponto de partida.
## Ande por lugares desconhecidos da cidade
Muitas vezes, fazer uma caminhada não é bom apenas como um exercício físico, mas
também como um meio de exercitar a criatividade.
Vá para outros bairros, conheça novas praças e parques, explore o lugar onde mora.
Com toda certeza, você não só vai descobrir espaços urbanos que nunca imaginou,
como também terá novas inspirações para seu trabalho. Só tome cuidado com assaltos!
## Viaje para melhorar a criatividade
Gostou tanto de andar pela cidade que quer conhecer outros lugares? Então,
aproveite o embalo e viaje! Pode ser uma viagem curta, por cidades perto de onde
você mora, ou pode ser até mesmo uma internacional. O importante é conhecer novos
ambientes, ampliar a sua cultura e conhecer novas pessoas.
Acredite, um intercâmbio cultural pode ser bastante benéfico para a sua saúde
mental e social!
## Anote seus sonhos
Você sabia que, durante o sono, o seu cérebro permanece em atividade? Por isso, o
seu processo criativo continua enquanto você dorme.
Portanto, quando você acordar e perceber que teve uma ideia genial enquanto dormia,
não estranhe! Tenha um caderno e um lápis ao lado da sua cama e sempre anote sonhos
e ideias que você teve durante a noite. Se não se lembrar, não se preocupe: anote
as sensações que teve durante o sono.
## Descanse a mente
Após passar horas trabalhando em um processo criativo, você deve notar que, em
algum momento, a sua mente não responde mais. Isso é normal, é sinal de que você
precisa descansar o seu cérebro.
Leia algum livro interessante ou até mesmo gibis, vá assistir a sua série favorita,
jogar ou dançar. Relaxe um pouco antes de voltar ao trabalho. Cuide, também, da sua
alimentação e saúde.
## Durma bem todas as noites
Descansar só a mente não basta, o corpo também precisa de descanso. Você tem uma
rotina diária de sono? Não? Então, é bom começar a se programar para dormir!
Procure sempre dormir em um mesmo horário, desligue aparelhos eletrônicos e todas

as luzes indiretas. Evite, também, consumir comidas pesadas antes de ir para a cama
e fazer exercícios estimulantes meia hora antes de dormir. Dessa forma, a sua
criatividade e até mesmo a sua saúde agradecem.
## Mantenha-se informado
Esteja atualizado continuamente. Procure notícias, informações, saiba o que está

acontecendo no mundo. Isso é crucial para ter uma criatividade ativa, pois você
estará estimulando o cérebro sempre com novas informações.
No entanto, tome cuidado com o excesso e as fontes das informações que você busca,
principalmente na internet. Informações são cruciais, mas é necessário saber
filtrá-las.
## Conheça novas pessoas
Para desenvolver as suas relações pessoais, você não precisa estar sempre viajando.
Afinal, você conhece todas as pessoas da sua cidade? Claro que não! Muitas vezes,
não conhecemos nem os nossos vizinhos!
Sendo assim, procure por novas amizades, seja frequentando algum curso, um grupo
religioso. Vá em busca de afinidades, nem que seja no supermercado ou na quitanda!
Se você é tímido, um curso de teatro pode lhe ajudar a destravar e, ainda, a
conhecer novas pessoas com a mesma dificuldade que a sua.
## Comece um novo hobby
Mesmo assim está difícil estimular a sua criatividade? Que tal começar um hobby?
Inove em alguma atividade que nunca pensou em fazer. Ou melhor, sabe aquela
atividade que você sempre quis fazer mas sempre teve receio? Comece por ela!
Faça artesanato, yoga, pilates! Quem sabe até algum [**curso**]de manutenção de
residências? Invente! Muitas vezes, a sua criatividade não foi embora, ela só se
escondeu até que você ouse fazer algo novo. Não hesite em, pelo menos, tentar!
As dicas acima procuram não consertar permanentemente a sua falta temporária de

criatividade, mas são um suporte para lhe ajudar em alguns momentos críticos. Caso
mesmo assim você não consiga [**melhorar**] a criatividade, é recomendável procurar
uma ajuda especializada, como um psicólogo. Procure algum por indicação, seja de
amigos ou de parentes, mas deve ser um profissional de confiança.
**Em casos mais graves, como perda de memória e cansaço, típicos de muito trabalho
mental, a solução pode ser tirar umas férias do trabalho criativo e relaxar por
alguns dias. Afinal, como o texto deixa bem claro, se você não relaxar, a mente não
cria. A criatividade necessita, antes de mais nada, de um bom tempo livre. Há
quanto tempo você não tira férias? Permita-se desligar um pouco, cuide mais de você
mesmo!**
E se existem várias linguagens, [**quantas devo aprender?**] Uma, duas, três, todas
que eu puder?.
Quando estamos ingressando nesse mundo de programação, essas são algumas perguntas
que podem surgir. Por isso, ter em mente qual o seu objetivo, é muito importante no
processo de aprendizagem.
Hoje em dia, grande parte das aplicações no mercado estão na web, sejam eles sites
web ou aplicativos mobile utilizam esses serviços.
Se o foco é ingressar rapidamente no mercado de trabalho buscar uma linguagem que

atenda esses quesitos é importante.
> _"Tudo bem, eu quero entrar no mundo de desenvolvimento web, o que devo fazer?"_
## O básico
O primeiro passo para se [**aprender qualquer linguagem é saber lógica de

programação**]. Por mais que cada linguagem tenha suas singularidades, a lógica é a
mesma para todas, apenas o modo de aplicá-la pode ser diferente.
## E como fica na parte de front-end?
Se o foco é estudar web, [**aprender lógica com Javascript**] pode ser um ótimo
começo. Javascript é umas das linguagens mais utilizadas no mundo e a principal
linguagem quando falamos de front-end.
Começar vendo lógica com Javascript pode encurtar o caminho para aprender outras
tecnologias como Angular, React, ou NodeJS.
> _"Mas e se eu já sei Javascript e quiser migrar para o back-end?"_
Se você já sabe Javascript, você pode criar [**aplicações no lado do servidor

usando NodeJS**], um framework usado por muitas empresas para desenvolver suas
aplicações back-end.
Ou então, você pode [**aprender PHP, umas das linguagens de back-end mais
utilizadas no mundo**]. Com PHP você pode começar a desenvolver para [**WordPress,
o sistema de gerenciamento de conteúdo que roda por trás de grande parte dos sites
do mundo**].
## Já no back-end...
Se estiver buscando algo mais voltado ao back-end, isto é, o código que roda no
servidor, talvez aprender [**lógica de programação com Ruby e criar seu próprio
jogo**] possa ser um bom caminho.
A linguagem Ruby possui o framework Rails, um frameworks muito utilizado no mundo

back-end.
Temos também outras linguagens como Java, ou C# com .Net.
Com Java, além de desenvolver para [**back-end com JavaEE**] ou com o [**framework
Spring**], você consegue [**desenvolver para smartphones Android**], ou então
aprender [**Kotlin**] pode ser uma boa pedida.
No caso de querer se especializar apenas em uma plataforma, como o IOS, talvez

[**aprender Swift**], a linguagem da Apple para desenvolvimento de seus apps.
Com .Net também temos uma linguagem muito usada no mundo corporativo, e também
podemos desenvolver tanto para IOS quanto para Android, [**utilizando o Xamarin**].
Agora, se você seguiu como um desenvolvedor Javascript, você pode utilizar seus
conhecimentos de front-end e desenvolver para [**mobile utilizando Cordova**], ou
[**Ionic**].
## "E o que mais posso fazer?"
Além de programação, temos outras áreas no mundo de TI. Como por exemplo [**redes
de computadores**].
Aprender mesmo que o básico de redes, como conhecer os protocolos, entender sobre
roteadores e switches, é algo importante para o profissional de infra.
Entender como [**funciona um sistema operacional**] pode ajudar a preparar um

servidor para receber uma aplicação.
Caso você queira integrar seus conhecimentos em programação com infra, talvez
[**estudar para ser um DevOps**] é o caminho a se seguir.
DevOps nada mais é do que a integração da equipe de desenvolvimento (Dev) com

operações (Ops), ou seja, com a equipe de infra.
Com o objetivo já definido fica mais fácil [**criar um calendário de estudos**]. E

para você que quer entrar no mercado de trabalho, talvez [**utilizar o LinkedIn**]
pode ser de grande auxílio para alavancar sua carreira.
Como criar uma campanha para oferecer seu serviço na Internet? O **Google Ads**
pode ser intimidador. Há as variações de anúncios, keywords, search terms, landing
pages, cpc, cpa, impressões, impression share e uma dezena de outras métricas para
ficar atento, além de modos automatizados como DSA. Mas se quero criar uma simples
campanha de bairro pra vender meu serviço, como do delivery do meu restaurante, ou
dos serviços do escritório de odontologia, qual o caminho mais simples e o que
preciso saber?
Exemplo de imagem
imagem
O que o código abaixo imprime no console?

javascript
A variável `x` é definida globalmente, fora da função com o valor `2`. Depois, é
redefinida dentro da função com o valor `3`.
A resposta mais lógica é a seguinte: deveria ser impresso `2`, o valor da variável
global, e depois `3`,o valor da variável local, depois da redefinição.
Mas será impresso:
javascript
Poxa... Mas por que?
O código JavaScript é executado em duas fases. Primeiro, é feito o **parsing**, em

que são vasculhadas declarações de variáveis, funções e parâmetros. Só depois é
feito a execução de fato.
O efeito disso é que é como se as declarações de variáveis fossem levantadas para o

topo da função ou arquivo em que estão definidas. O nome chique para esse
levantamento é **variable hoisting**. Coisa parecida é feita com funções...
Traduzindo o código para a maneira que o JavaScript vai executá-lo:
javascript
**JavaScript tem as suas pegadinhas... Para conhecer mais da linguagem, veja os

[**cursos de Javascript**] da Alura.**
As razões para essa frase aparecer no **Manifesto Ágil** são várias, mas, para mim,
a mais impactante é que, quando temos uma documentação extensa, frequentemente
cria-se a ilusão de que não precisamos conversar com o cliente e entendê-lo melhor,
já que o documento (supostamente) cobriria essa função.
No entanto, esse pensamento se baseia em pontos perigosos: assume-se que quem

escreveu a documentação realmente entendia do negócio, que essa pessoa (ou comitê)
conseguiu escrever de forma clara para todos os indivíduos que a consumirão, que
esses indivíduos vão interpretar o texto bem e ninguém esquecerá de detalhes
potencialmente muito importantes... e de que esse documento será sempre atualizado,
conforme as mudanças aconteçam.
Na prática, a frase do Manifesto significa que evitamos desperdiçar tempo com

documentações que não serão lidas ou que ficarão obsoletas rapidamente. Em vez
disso, preferimos que o próprio software seja sua documentação, através de:
**Testes de unidade automatizados: código que verifica um método/função/classe que,

para um dado cenário controlado, a saída esperada é tal. Essa é uma documentação
para o desenvolvedor que for alterar esse código interno no futuro.**
Testes de aceitação automatizados: código que simula o que o usuário do sistema

fará, seu comportamento usando uma funcionalidade. Essa é uma documentação para
quando o time for alterar o que um determinado código faz.
Clean code: prática de trabalhar ativamente para deixar o código claro e coeso,
para que o próximo que venha a mexer nele não precise gastar tempo desvendando o
que ele faz. Esse é um guarda-chuva gigante de boas práticas no dia-a-dia de
desenvolvimento.
Se o código ainda não está bom, a ponto de qualquer um entendê-lo... Documentação

dinamicamente gerada: geração automática, através de ferramentas específicas de
cada linguagem, da relação entre as partes e classes do sistema. Frequentemente,
usa-se UML aqui, e há diversas ferramentas que analisam um código e geram os
diagramas que refletem o estado atual do design e arquitetura do sistema.
É claro que, dependendo do seu contexto, você pode ser obrigado a prover certas
documentações para, por exemplo, o cliente. Nesse caso, fazemos o possível para
evitar trabalho desnecessário, mas... infelizmente, jogamos com a regra do jogo
atual.
**Como é possível organizar essas documentações de software ao final de cada

iteração?**
O método mais comum para nos certificarmos que uma certa documentação obrigatória
seja entregue é acrescentar um passo ao nosso Critério de Pronto, para que todo o
time saiba, claramente, que todo item desenvolvido precisa ser documentado e,
também, para que eventuais gargalos nesse step fiquem explícitos para todos.
Gostou? Que tal dar uma conferida no meu [**curso de scrum**] na Alura? :)
Aqui na empresa em que eu trabalho, usamos um sistema de comunicação interna que,

por alguns, já é considerado um tanto antiquado. É o [**IRC**], um protocolo de
comunicação que funciona, principalmente, como bate-papo por texto, e que teve seu
_boom_ lá pros anos 90. Com ele, podemos mandar mensagens privadas e conversar em
grupos nos denominados **canais**.
Se é tão antigo, por que escolhemos continuar usando ele? A questão é que, mesmo
antigo, ele ainda funciona muito bem! O protocolo é muito simples e leve, além de
dar espaço para modificações e extensões diversas, o que torna seu uso bastante
desejável.
Além de uma própria rede de IRC interna nossa, usamos um canal na conhecida rede
[**Rizon**], o `#minha-empresa`, para facilitar a comunicação com clientes.
Este canal é nosso principal meio de comunicação com os clientes. O problema é que
estávamos com poucos funcionários para acompanhar todo o conteúdo das mensagens de
lá a todo momento.
Frente a esse problema, nosso time de tecnologia me encarregou de criar algo que
poderia nos ajudar com a comunicação, não decepcionando os clientes - um [**bot de
IRC**] que, automaticamente, mandaria uma mensagem de boas vindas a todo mundo que
entrasse no canal.
A ideia é bacana! Mas como podemos implementar isso? Como fazer um programa que se
conecte ao IRC e ainda envie uma mensagem específica para todos que se conectem a
um determinado canal?
## Conhecendo os _sockets_
A primeira coisa que precisamos conseguir fazer com nosso programa robô é que ele
entre em nosso canal `#minha-empresa` lá dentro da Rizon.
A questão é que, antes de entrarmos no canal em específico, precisamos começar

alguma comunicação com o próprio servidor da Rizon. Mas como?
Nosso bot estará rodando em um processo em um servidor próprio da empresa, enquanto

o servidor de bate-papo IRC da Rizon funciona em um processo completamente
diferente, fisicamente em outra(s) máquina(s). De alguma maneira, precisamos fazer
uma comunicação entre esses processos.
Tratando-se de comunicação entre dois processos diferentes, a saída quase sempre é

a mesma - **[soquetes]**, ou, originalmente, _sockets_. Apesar de abstrato, esse
conceito aparece para todos nós, usuários da Internet, cotidianamente!
O nosso navegador, por exemplo, utiliza _sockets_ para fazer **todo tipo de
requisição web**. Quem trabalha com desenvolvimento de software ainda se depara com
outros múltiplos exemplos, como na [**conexão a um servidor via SSH**] ou
integração de um sistema a um banco de dados.
Tudo isso necessita do uso de _sockets_ para efetuar a comunicação entre dois
processos diferentes (que, na verdade, podem até estar em máquinas diferentes!).
Então como é que o IRC entra nisso? A questão é que o protocolo IRC funciona com
base no modelo [**cliente/servidor**], no qual os usuários usam uma aplicação
cliente para, através de um **socket**, se conectar ao servidor. Em nosso caso, o
bot é justamente a aplicação cliente! Mas como podemos fazer isso com o Python?
## Criando sockets com o módulo `socket` no Python
Assim como diversas outras linguagens de programação, o Python tem algumas

especificações que nos permite trabalhar com _sockets_. No caso, temos um [**módulo
inteiro**], o próprio `socket`.
O módulo `socket` abriga uma classe essencial, que representa, justamente, um

_socket_. A classe tem o mesmo nome do módulo - `socket`. Assim, instanciá-la não
deve ser muito difícil, certo? Basta importamos o módulo para nosso programa e
chamarmos a função construtora dessa classe:
python
Testando o código, vemos que ele realmente funciona! É tão simples assim, então?
Bem… mais ou menos!
Na realidade, não basta falarmos que queremos um _socket_ para ele magicamente
aparecer. Precisamos especificar algumas definições. Afinal, como o computador vai
saber como o _socket_ criado deve funcionar?
O que acontece é que, por padrão, o Python passa isso tudo automaticamente através
de parâmetros padrões no construtor. Vamos entender isso.
### Especificações do socket
Em primeiro lugar, de alguma maneira o computador precisa saber, ao criar um

_socket_, com o que ele vai conseguir se comunicar. Como já vimos, _sockets_ podem
ter funcionalidades bem diversas - podendo se comunicar com processos dentro ou
fora de uma mesma máquina.
Com o nosso bot, estamos tratando de comunicação remota. Nesse caso, temos uma
constante própria que especifica isso, chamada de **AF_INET**.
Essa constante faz parte de um grupo denominado **famílias de endereços**, ou

**_address families_**, que constitui exatamente o primeiro parâmetro opcional do
construtor `socket`. A **AF_INET** abrange os endereços do tipo [**IPv4**], antigo
padrão da Internet e, por isso, pode ser ideal para nós!
Além da família de endereços, precisamos especificar mais uma coisa - **o tipo do
socket**. Como assim? O que acontece é que, na Internet, existem diversas formas e
modelos para se efetuar uma comunicação. Assim, precisamos definir um, ao criarmos
nosso objeto `socket`.
Em relação ao tipo do socket, existem duas constantes mais importantes - a

**SOCK_STREAM**, que define _sockets_ de fluxo, e a **SOCK_DGRAM**, que define
_sockets_ de datagrama. Mas, na prática, qual a diferença delas duas?
Basicamente, um _socket_ de fluxo se refere ao protocolo **TCP**, enquanto um

_socket_ de datagrama, ao **UDP**. As diferenças entre TCP e UDP não são poucas,
mas, no nosso caso, não precisamos ir tão fundo.
Queremos estabelecer uma **conexão** com o servidor do IRC. Entretanto, no modelo

UDP não há conexão! É um protocolo chamado de _connectionless_, por isso. Mas como
não há conexão?
O que acontece é uma troca de pacotes desordenada e pouco confiável. A vantagem

fica na alta velocidade, como já discutimos antes.
No caso de um sistema de chat por texto, as desvantagens citadas acabam sendo

extremamente negativa, tirando o sentido do uso desse protocolo. Assim, por padrão,
o protocolo IRC usa o **TCP** e, assim, a constante **SOCK_STREAM**.
Agora já podemos criar nosso objeto `socket` no Python, com muito mais
especificação:
python
Agora que temos nosso objeto `socket`, basta nos conectarmos ao servidor da Rizon.
Mas como?
### Se conectando ao servidor de IRC
Com nosso objeto `socket` criado, partir para a parte de conexão não é difícil,
basta um método - o `connect()`. E como o Python vai saber com quem se conectar?
Bem, a princípio ele não sabe! Precisamos especificar isso através de um parâmetro
na chamada do método.
Sockets da família AF_INET necessitam apenas de um parâmetro, que é justamente o

endereço com o que queremos nos conectar. Esse endereço é uma [**tupla**] contendo
o host que queremos nos conectar (pode ser desde um IP, a um _hostname_) e a porta
pela qual queremos realizar a conexão.
Com uma rápida visita no [site oficial da Rizon], descobrimos que o _hostname_
padrão dessa rede é o **irc.rizon.net** e a porta oficial, assim como é por padrão
em outras redes de IRC, a **6667**. Assim, podemos efetuar a conexão:
python
Com a conexão estabelecida, podemos partir para a comunicação!
## Comunicação com o `socket`
Agora que temos nosso objeto `socket` configurado e conectado a um servidor da

Rizon, podemos começar nossa comunicação.
No geral, como clientes, começamos a comunicação checando se o servidor quer enviar
algo pra gente.
Com um objeto `socket`, podemos fazer isso simplesmente pedindo para receber
(_receive_), através do método `recv()`, que toma como parâmetro o número de bytes
que queremos receber do servidor.
[**A própria documentação do Python**] nos recomenda usar, nesse parâmetro, uma
pequena potência de 2, "para melhor compatibilidade com as realidades de hardware e
rede". Assim, podemos usar um valor como **2048** (2¹¹):
python
> É importante notar que `recv()` é um **método blocante**, o que significa que
todo o resto do programa vai esperar a execução dele para continuar rodando. Até
recebermos algo, o programa vai continuar esperando.
Rodando esse código, recebemos a seguinte resposta:
python
De fato é uma mensagem, mas desse jeito fica difícil de ler… por quê? Acontece que,
como o `b"` no começo indica, recebemos os dados em [**bytes**], não em string!
Para melhorar a impressão, podemos decodificar os bytes em uma string com o método
`decode()`, que recebe como parâmetro o _encoding_ queremos usar. No caso, usaremos
o **[UTF-8]**, por suportar [**Unicode**]:
python
Agora sim, olha o que apareceu:
python
Hum… por que todos esses "NOTICE" e ainda essa mensagem de erro, no final? A
mensagem avisa que a conexão está sendo fechada porque o tempo de registro expirou.
Ué, fizemos algo errado? Que registro é esse?
## Burocracias do IRC
O IRC é um protocolo há vários anos já bem definido, que especifica muito bem como
uma conexão deve ser trabalhada com esse protocolo.
No [**seu primeiro RFC**], foi definido padrões de registro para todo usuário do
IRC, uma série de passos que todo cliente deveria seguir ao se conectar a uma rede
de IRC.
Esses passos se resumem a três comandos, nessa ordem:
- **PASS**, a senha de registro do nickname em uso;

- **NICK**, o nickname que será usado e
- **USER**, que especifica outros detalhes do usuário (como nome verdadeiro).
Sabendo disso, agora podemos fazer o registro!
### Registrando um usuário
Em primeiro lugar, precisaríamos enviar a senha. Como nem temos nick registrado,
podemos simplesmente ignorar esse passo e partir para o comando **NICK**, com o
nickname que queremos usar, que pode ser **BotDaEmpresa**.
A princípio, é só enviar o comando `NICK BotDaEmpresa` para o servidor da Rizon,

através de nosso socket, mas na realidade não é bem assim… O que acontece é que o
protocolo IRC carrega mais algumas burocracias para funcionar.
Uma delas, por exemplo, diz respeito a tudo que é enviado do cliente para o
servidor - todos os comandos devem terminar com a sequência de caracteres especiais
`'\r\n'`, representando um **ENTER**, o envio. Agora, podemos usar o método
`send()` de nosso objeto `socket` para enviar o comando:
python
Quando rodamos um código… erro!
python
Assim como quando recebemos dados com nosso socket, precisamos enviá-los como
bytes. O processo é similar ao que usamos quando decodificamos os bytes recebidos
para uma string, mas dessa vez faremos o contrário, com o método èncode()`.
python
Certo! Podemos, agora, enviar o último comando de registro - o **USER**. O comando

**USER** toma quatro parâmetros (_username_, _hostname_, _servername_ e
_realname_), todos os quais podem ser resumidos pelo próprio nick que escolhemos.
Vale notar que esse último parâmetro, apesar de não ser importante para nós, deve
ser precedido com um `:`, indicando que ele pode conter espaços (e que tudo depois
do `:` faz parte de um único parâmetro):
python
Legal! Funciona, mas nosso código está começando a ficar feio, com tanta repetição
da parte burocrática de enviar um comando…
Para simplificar o processo, podemos fazer algumas funções que fazem todo esse
processo de envio de comandos e registro automaticamente:
python
Além disso, após a efetivação da conexão, vou fazer um loop que me permita sempre
ver o que estou recebendo do servidor, dessa forma:
python
Será que agora vai? Rodamos o código e olha só o que apareceu na tela:
python
Olha só! Dessa vez apareceu uma mensagem diferente, esse tal de **PING** com alguns
números estranhos. Ao final de tudo, ainda recebemos aquele mesmo erro. Mas e
agora? Não conseguimos fazer o registro?
### O comando **PING**
Na verdade, fizemos o registro adequadamente, e por isso mesmo recebemos a mensagem

diferente de **PING**. O problema está justamente nela, ou, mais especificamente,
no fato de a termos ignorado.
E o que significa esse **PING**? Esse tipo de comando é muito comum em sistemas que
exigem a manutenção de uma conexão. Ele serve para que se teste a latência dela,
isto é, quanto tempo demora para um conjunto de dados ser enviado de uma máquina a
outra e receber uma resposta.
O IRC trabalha suas conexões através desse comando. De quando em quando, o sistema
do servidor envia um comando **PING** seguido de uma mensagem (nesse caso,
`3685587899`) e aguarda a resposta do cliente com essa mesma mensagem. A diferença
é que a resposta do cliente, em vez de ir com o comando **PING**, deve usar o
**PONG**.
Se o servidor não receber a resposta do cliente em um determinado tempo, a conexão

é efetivamente encerrada, por isso recebemos aquela última mensagem de erro.
Precisamos já implementar um tipo de automatização - sempre que recebermos um

**PING**, precisamos responder com um **PONG**. E como fazer isso?
Em primeiro lugar, precisamos conseguir identificar quais mensagens recebidas

contêm um **PING**. Como vimos, mensagens desse tipo contêm o texto `PING :`
seguido pelos dados que precisamos enviar de resposta. Para evitar complicações,
podemos simplesmente verificar se esse trecho de texto existe na mensagem com o
conhecido operador ìn`:
python
Verificando que a mensagem recebida é do tipo **PING**, podemos enviar de volta o

comando **PONG**. Mas como vamos capturar o que recebemos do **PING**? Existem, de
fato, diversas formas.
Uma opção mais simples é cortar nossa string de mensagem na parte do `PING :` e,
então, pegar o que vem depois dessa substring. Podemos fazer isso com o método
`split()`, que toma, como parâmetro, a parte da string em que queremos fazer a
separação e retorna uma lista com todas as partes separadas.
O código que temos que devolver no **PONG** vai ser o que vem depois da separação,
ou seja, o último elemento da lista, podendo ser acessado pelo índice **\-1**:
python
Podemos até separar em uma função, para melhorar a organização:
python
Rodando esse código, olha o que recebemos, logo após o comando **PING**:
python
Deu certo! Podemos até checar se nosso bot está online usando, manualmente, o
comando `/whois BotDaEmpresa` no IRC:
imagem`. Enfim, só precisamos enviar ao IRC o comando **PRIVMSG** especificando o

canal, com a mensagem de boas vindas:
python
E olha só como deu certo agora:

![Bot funcionando]
## Sockets em todo lugar
O conceito de socket, por ser um tanto abstrato, chega a assustar alguns

desenvolvedores. Mesmo assim, todos nós provavelmente nos deparamos com sockets
todos os dias, ao utilizarmos a Internet!
Nesse artigo, enfrentamos um problema empresarial de automatização no contato com

clientes através do protocolo IRC.
Assim, passamos pela superfície da ideia e do uso dessa tecnologia no Python,

entendendo o porquê não devemos temer esse conceito tão presente em nosso dia-a-
dia.
Se gostou do post e quer aprender mais sobre a linguagem Python, dê uma olhada em
nossos [**cursos da Alura**]!
Atuar no mercado de edição de vídeos está cada dia mais vantajoso devido às
inúmeras opções que a [**tecnologia**] têm a nos oferecer. Mas para obter sucesso é
necessário estar focado nos estudos e sempre acompanhar as novidades que surgem a
todo momento.
## [1\. Windows Movie Maker]
Esse programa para edição de vídeo é uma ótima opção para quem está iniciando,
pois, além de ser muito prático e simples, é gratuito e já vem instalado no
Windows. As suas instruções são todas em português e os caminhos são bem intuitivos
aos usuários.
Um ponto fraco é que ele não é profissional, ou seja, se você deseja prosseguir na
[**carreira**] de editor certamente chegará um momento em que as funções ficarão
limitadas.
## 2\. iMovie
O [**iMovie**] é o editor de vídeos da Apple e suas funções são parecidas ao

Windows Movie, porém é mais avançado. Sua interface é bastante explicativa e
permite que o usuário consiga ter acesso a tudo que a plataforma oferece. Para quem
não tem um MacBook, o programa possui também uma versão para iOS (iPhone ou iPad).
Não é gratuito, porém tem um valor bem acessível.
## [3\. YouTube Vídeo Editor]
Essa ferramenta tem a vantagem de ser fácil e muito agradável para editar os
vídeos. Não necessita de instalação, basta ter uma conta no Google ou no Youtube, e
pronto! A ferramenta já está disponível para ser usada. O editor ainda se encontra
em fases de testes, portanto é bem possível que novos recursos sejam adicionados
futuramente.
## 4\. Collaaj
O [**Collaj**] além de funcionar no Windows e no Mac tem a vantagem de rodar em

iPad. Tem um sistema muito interessante que permite gravar da tela do computador e
da webcam. Quando forem realizadas, as gravações poderão ficar armazenadas nos
servidores da Collaj, o que facilita muito a sua divulgação.
Esse programa é muito utilizado para a gravação de cursos e videoaulas. Na versão
gratuita só é possível gravar 2 minutos, para ter um resultado mais compensatório é
necessário optar por um plano pago.
## 5\. Lightwork
O [**Lightwork**] é um editor de filmes para trabalhos profissionais, ele é capaz

de montar um projeto desde o início. O programa encontra-se disponível
gratuitamente para Windows, Linux e Mac. É indispensável fazer um cadastro no site,
pois só depois disso é enviado o link para o download.
Apesar de ser bem completo e cheio de opções, o usuário poderá precisar de um tempo
maior para se ambientar ao sistema, pois ele não é tão autoexplicativo como os
outros acima apresentados.
## 6\. Cyberlink PowerDirector
O [**Cyberlink**] é bem popular na área de edição de imagens, ele está no meio do

caminho dos programas para iniciantes e dos programas para profissionais da área.
Suas funções são completas e a velocidade de edição é bem superior aos outros
programas, se comparada à dos concorrentes. Ele conta com opções para importação de
vídeos do Youtube e Facebook, dentre outros sites. Todos os vídeos podem passar por
um processo de tratamento para melhorar as imagens ou alterar a produção original.
Um detalhe importante desse programa é o recurso que permite que as produções sejam
removidas para a tela do computador, fazendo com que as edições ganhem movimentação
na área de trabalho.
## [7\. Sony Vegas]
Esse aplicativo oferece bons recursos para projetos audiovisuais. Não é muito
complexo para ser utilizado, uma boa dica é tentar conhecer todas as suas
ferramentas para poder usufruir de todos os seus benefícios.
A sua interface é composta por um menu logo no topo, onde estão disponibilizados
todos os mecanismos para edição e um monitor que mostra as imagens gravadas na
linha do tempo. Além de tudo na linha inferior da tela tem um recurso composto de
imagens, textos, áudios e músicas que estão sendo trabalhados no momento.
## [8\. Final Cut Pro X]
Esse aplicativo faz parte de uma inovação que a Apple adotou para mudar o futuro
das edições de vídeo não lineares. Ressaltamos que não trata-se de upgrade de sua
versão anterior (Studio), mas de um novo programa, que de igual só tem o nome. Ele
faz parte de uma nova geração de editores de vídeo que promete recursos poderosos
para os profissionais da área.
Está disponível na [**Mac App Store**] , mas para quem já é usuário uma atualização
já basta.
## [9\. Camtasia Studio]
Esse programa é ideal para a criação de slides e tutoriais de vídeos. É fácil de

usar e possui a interface limpa, o que permite o uso de todos os recursos a partir
da primeira utilização.
Umas das suas vantagens em comparação aos outros sistemas é poder escolher a
resolução dos vídeos gravados sem perder a qualidade, o que facilita no momento de
reduzir o arquivo de acordo com as necessidades de quem vai utilizá-lo.
A versão de demonstração é muita curta, só podendo ser utilizada por alguns dias.
## [10\. Adobe Premiere]
Este programa é bem conhecido por profissionais do ramo da edição de vídeos. É

considerado um editor para quem necessita de uma ferramenta mais completa, que
agrada a quem deseja um aplicativo mais simples e mais acessível.
As versões mais recentes do Adobe Premiere são as Creative Cloud, Creative Suite e
Portable da Adobe.
Para baixá-lo é necessário comprar a assinatura, porém tem disponível para teste
gratuitamente por 30 dias.
É importante deixar claro que não é apenas a escolha do software que te faz um bom
profissional de edição. Diversos são os fatores que precisam ser observados também
nesse processo de aprendizagem, como: perceber todos os detalhes que o cercam,
estar sempre disposto a estudar sobre o que é do interesse comum e de tipos de
filmagens que são mais raras de aparecer para edição. E ter sempre em mente que no
decorrer do aprendizado, [**criatividade**] e dedicação são fatores primordiais
para que o trabalho seja reconhecido.
Gostou do nosso post de hoje? Já sabe qual programa para edição de vídeo vai
utilizar? Aproveite para nos seguir no [YouTube] e [Facebook], pois lá
compartilhamos mais dicas e você pode acompanhar tudo em primeira mão!
Resolvi me aventurar no mundo do **Dockerfile** e entender para que ele serve

efetivamente, quando usar, o que é, e o que faz cada uma das principais instruções
do Dockerfile?
# Tudo começa com um Dockerfile
Meu objetivo inicial é rodar um container bem simples que contenha apenas o Ubuntu
e tenha o Java instalado. Como posso executar essa tarefa?
Existem duas possibilidades: A primeira é escrever o Dockerfile e criar o container

a partir dele. A segunda é utilizar o comando [**docker**]) run para que ele busque
a imagem na internet e rode o container para nós.
Mas, quando se usa o comando docker run, ele vai até o Docker Hub, busca essa
imagem e baixa para nós. E como essa imagem foi gerada? Isso mesmo, com um
Dockerfile feito por outra pessoa!
# O que é o Dockerfile ?
O Dockerfile nada mais é do que **um meio que utilizamos para criar nossas próprias
imagens**. Em outras palavras, ele serve como a receita para construir um
container, permitindo definir um ambiente personalizado e próprio para meu projeto
pessoal ou empresarial.
Há ainda um outro ponto muito interessante que deve ser explorado (vejo muitas
pessoas confundirem quando ainda estão aprendendo) para entendermos melhor o
conceito e começarmos a compreender o Dockerfile mais a fundo: qual é exatamente a
diferença entre um container e uma imagem?
# Imagem x Container
Uma imagem nada mais é do que uma representação imutável de como será efetivamente
construído um container. Por conta disso, nós não rodamos ou inicializamos imagens,
nós fazemos isso com os containers.
O ponto que temos que entender agora é o seguinte: escrevemos um Dockerfile,

construímos uma imagem a partir dele executando o comando **docker build**, e, por
fim, criamos e rodamos o container com o comando **docker run**. O container é o
fim enquanto a imagem é o meio.
imagem. Nele, adicione a seguinte linha:
`FROM ubuntu:18.04`
Então, iniciei o processo de criação da imagem. Para isso, abri o terminal e

acessei a pasta que contém o Dockerfile. Após isso, executei o comando **docker
build .** (com o ponto) e o docker começou a construir a imagem a partir do
arquivo.
Ao terminar o processo, executei o comando **docker image ls**, e obtive a seguinte

saída:
imagem.
Se criarmos um container a partir dessa imagem, os dois comandos já terão sido

executados, já que **esses foram executados no momento de criação da imagem, não da
criação do container**. Então qualquer container criado a partir dessa imagem terá
o repositório do Ubuntu na mesma versão e o Java 8 instalado!
Para criar um container utilizando a imagem gerada e podendo manter a execução do

container, executei o comando passando o ID da imagem gerada na minha máquina
através do comando `docker run-it 41afdc6b059f`.
O `-it` serve para rodar o container em modo interativo, ou seja, eu quero

interagir com ele efetivamente. Caso não utilizasse esse parâmetro, o container
subiria e cairia logo em seguida.
![]
Lembra lá no início da explicação sobre o `RUN` quando falei que ele podia ser
usado uma ou mais vezes? Então, isso faz uma baita diferença na hora da criação de
imagens, pois, como foi dito, cada `RUN` criará uma etapa na criação da imagem.
Mas, o que isso muda?
O grande diferencial da instrução `RUN` é que cada camada gerada por ele poderá ser
reutilizada na criação de outras imagens.
Então, para testar, alterei meu Dockerfile para criar uma imagem nova com elementos
em comum da outra imagem:
```
FROM ubuntu:18.04
RUN apt-get update
RUN apt-get install openjdk-8-jdk -y
RUN touch arquivo-de-boas-vindas
```
Ele conseguirá reutilizar diversas camadas e tornará o processo muito mais rápido.
Caso eu queira adicionar um comando novo qualquer, ao executar o comando docker

build . para gerar essa nova imagem, vejam o resultado:
![]
Vejam só que elegante! O Docker conseguiu reutilizar as camadas de outra imagem

através do uso de cache para construir uma nova, tornando o processo muito mais
rápido, sem necessidade de fazer downloads repetidos!
O RUN aceita parâmetros de dois jeitos:
`RUN apt-get install openjdk-8-jdk -y` ou

`RUN ["apt-get", "install" "openjdk-8-jdk" ,"-y"]`
Ou seja, podemos passar os comandos separadamente entre aspas dentro dos colchetes.
O resultado é o mesmo
## CMD e ENTRYPOINT
Não há muito mistério na instrução **CMD**, ela na verdade é bem parecida com a
instrução RUN, com algumas poucas diferenças. Vamos ver quais são!
A sintaxe é a mesma, podemos passar os parâmetros do mesmo modo que a instrução

RUN, alterando o último RUN por um CMD:
```
FROM ubuntu:18.04
RUN apt-get update
CMD touch arquivo-de-boas-vindas
```
Se construirmos uma imagem com o Dockerfile acima, veremos que ele não executou
esse comando na etapa de criação.
Isso aconteceu porque na verdade a instrução CMD executa o comando apenas quando
criamos o container e não passamos nenhum parâmetro para ele, ou seja, quando
executarmos o comando docker run -it nessa imagem.
Caso passássemos algo como `docker run -it <id da imagem> /bin/bash`, ele
sobrescreveria o comando `CMD touch arquivo-de-boas-vindas` e executaria apenas o
`/bin/bash`.
Um outro teste também poderia ser:
```
FROM ubuntu:18.04
RUN apt-get update
CMD touch arquivo-de-boas-vindas
CMD touch outro-arquivo
```
Ao inicializar o container vi que apenas o outro-arquivo foi criado, mas por quê? O
que acontece é que podemos ter quantos CMD quisermos, mas no fim das contas apenas
será executado o último CMD, sem nenhum erro aparente!
E o **ENTRYPOINT** ? Essa instrução faz exatamente a mesma coisa, porém seus
parâmetros não são sobrescritos igual ao CMD.
## ADD e COPY
Os nomes dessas instruções são bem intuitivos.
**O papel do ADD é fazer a cópia de um arquivo, diretório ou até mesmo fazer o
download de uma URL de nossa máquina host e colocar dentro da imagem**
Eu utilizei o ADD para copiar o arquivo chamado arquivo-host da minha máquina para
dentro da imagem, com o nome arquivo-host-transferido:
```
FROM ubuntu:18.04
RUN apt-get update
RUN ["apt-get", "install", "openjdk-8-jdk" ,"-y"]
ADD arquivo-host arquivo-host-transferido
```
Se criarmos uma imagem e rodarmos um container, teremos o seguinte resultado:
![]
O arquivo está dentro do container
A instrução ÀDD` também tem alguns efeitos interessantes, como: caso o arquivo que
esteja sendo passado seja um arquivo de extensão tar, ele fará a descompressão
automaticamente, além do fato já mencionado de poder fazer download de arquivos por
URLS.
A instrução `COPY`, permite apenas a passagem de arquivos ou diretórios, diferente

do ADD, que permite downloads. Como podemos ver abaixo:
```
FROM ubuntu:18.04
RUN apt-get update
COPY arquivo-host arquivo-host-transferido
```
A próxima instrução mostrará como podemos documentar de maneira sucinta o nosso

Dockerfile para quem for utilizá-lo.
## EXPOSE
Há uma certa dúvida quanto ao uso dessa instrução. Muitas pessoas pensam que o
**EXPOSE** serve para definir em qual porta nossa aplicação rodará dentro do
container, mas na verdade o propósito é servir apenas para documentação.
Essa instrução não publica a porta efetivamente, já que o propósito dela é fazer
uma comunicação entre quem escreveu o Dockerfile e quem rodará o container.
```
FROM ubuntu:18.04
RUN apt-get update
EXPOSE 8080
```
Logo, o Dockerfile acima não faz a publicação da porta, apenas serve como
documentação.
Agora vamos entender como podemos compartilhar informações entre o nosso container
e nossa máquina host.
## VOLUME
Essa instrução cria uma pasta em nosso container que será compartilhada entre o
container e o host, funcionando do seguinte modo:
```
FROM ubuntu:18.04
RUN apt-get update
VOLUME /foo
```
Quando criarmos um container dessa imagem, ele criará uma pasta chamada foo:
![]
Todo arquivo criado dentro dessa pasta será acessível a partir da máquina host no
caminho `/var/lib/docker/volumes`!
Por fim, como pode ser feita a organização de trabalho do container? Será que
devemos trabalhar em qualquer pasta indefinidamente?
## WORKDIR
Essa instrução tem o propósito de definir o nosso ambiente de trabalho. Com ela,
definimos onde as instruções **CMD, RUN, ENTRYPOINT, ADD e COPY** executarão suas
tarefas, além de definir o diretório padrão que será aberto ao executarmos o
container.
```
FROM ubuntu:18.04
RUN apt-get update
WORKDIR /pasta-qualquer
COPY arquivo-host arquivo-host-transferido
```
Ao acessarmos o container gerado por essa imagem, teremos o seguinte resultado:
![]
Ou seja, além de inicializarmos o container nessa pasta, o COPY colocou o arquivo

dentro da pasta definida!
# Conclusão
O processo de criação de imagens é de suma importância para quem quer aprender

Docker. Vimos que através do Dockerfile podemos utilizar diversas instruções para
atingir um determinado fim, seja a instrução FROM para utilizar uma imagem como
base para a nossa, a instrução RUN para definir as camadas da nossa imagem, CMD e
ENTRYPOINT para configurar o container em sua inicialização, ADD e COPY para
movermos arquivos de nossa máquina para o futuro container, EXPOSE para documentar
as questões de portas do container, VOLUME para conseguir transitar arquivos entre
a máquina host e virtual, e, por fim, WORKDIR para definirmos o nosso ambiente de
trabalho.
Aqui na **Alura**, temos um [curso sobre Docker], nele você aprenderá tudo sobre o
que é um container, como fazer eles se comunicarem, além de aprender como criar
suas próprias imagens para personalizar seus container.
Em vários setores do mercado, especialmente de desenvolvimento de ferramentas,

softwares e em muitas [**startups**], os empreendedores buscam entregar mais valor
com o mínimo de recursos mas que pudesse ser testado, pra saber se há o **market
fit**. Essa necessidade criou o conceito de **Minimum Viable Product** (MVP).
Traduzido livremente como **mínimo produto viável**, é um produto, uma app, ou um

site com todas as características mais básicas necessárias para ser considerado
como “entregável”. Claro que, com base nos padrões atuais, dizer que algo está
“entregável” com algumas poucas funcionalidades pode soar estranho, mas faz uma
grande diferença para a empresa.
Esse conceito pode ser um pouco difícil de entender a princípio, especialmente se

você trabalha com a lógica de já entregar um grande projeto completo depois de anos
de trabalho e **análise de requisitos**.
## Entendendo um MVP
Para exemplificar melhor o que seria um “produto mínimo”, vamos usar um exemplo
clássico e comum em vários contextos: um carro pessoal. Pare por um instante e
pense no que você normalmente encontra dentro de qualquer automóvel. Talvez você
tenha pensado em algo mais ou menos assim:
- motor;
- tanque de combustível;
- volante;
- bancos;
- rodas;
- estepe;
- rádio;
- carroceria;
- luz interna;
- faróis;
- setas;
- cintos de segurança.
A lista poderia ser maior, mas já é o suficiente para o nosso ponto. O próximo
passo aqui é filtrar esses itens de acordo com a função mais básica de qualquer
carro: andar e ser guiado. O que sobra aqui é:
- motor;
- tanque de combustível;
- volante;
- um banco, pelo menos;
- rodas;
- carroceria básica para sustentar as peças.
Esse é o Minimum Viable Product para um carro. Pode parecer absurdo pensar em
vender um carro sem cinto de segurança, até pela especificação da lei. Mas, para
todos os efeitos, este “carro mínimo” cumpre a sua função.
Não está convencido? Bem, digamos que você está inventando o primeiro carro da
história e tem de convencer as pessoas de que vale a pena investir nele. Você
precisa, antes de mais nada, provar que ele pode se mover sozinho em terra, algo
inédito até o momento. Sua tarefa é focar nas características principais do produto
e trabalhar apenas com elas. É isso que o MVP faz.
Depois de obter o reconhecimento que precisa, você pode pensar em atualizar seu
produto, agregando mais valor e dando-lhe diferenciais de mercado. Inserir os
cintos, mais bancos para passageiros, uma carroceria com melhor aparência, para-
brisas, personalizar a carroceria etc.
Mas, em qualquer momento, você poderia apresentar o seu “carro mínimo” para
possíveis compradores ou investidores como um produto minimamente viável.
A mesma lógica se aplica a vários tipos de produtos, como festivais, softwares,

entre outros. Há uma série de componentes que podem ser considerados essenciais,
enquanto outros atuam para complementar o produto e diferenciá-lo dos demais.
## Como o Minimum Viable Product impacta na organização
### Abordagem gradual do desenvolvimento
Como você já deve ter notado no exemplo acima, seu carro não caiu do céu já montado
e com todos os detalhes de uma Ferrari. Ele foi desenvolvido passo a passo, com
cuidado para que os componentes mais importantes recebessem mais atenção, e que os
pontos adicionais fossem agregados com calma e qualidade.
A partir do momento que há um MVP estabelecido, não há necessidade nenhuma de

sobrecarregar o setor de desenvolvimento. Todas as funcionalidades extras, seja em
um carro ou em um software, serão adicionadas posteriormente, até que o prazo de
entrega seja concluído.
### Facilidade para o período de testes
Da mesma forma que um Minimum Viable Product permite uma entrega rápida, ele também
ajuda a dividir os estágios de desenvolvimento e possibilita uma realização de
testes em menor escala. Talvez um produto mínimo não funcione da mesma forma quando
todos os componentes forem agregados.
Com uma adição gradual, é possível detectar essas diferenças e ajustá-las de forma
mais eficiente. Além disso, enquanto os primeiros [**clientes**] utilizarem a
versão mínima do seu produto, você poderá coletar o feedback necessário sobre cada
componente.
### Definição eficiente de prioridades
Um dos principais objetivos de um produto mínimo é delinear quais funcionalidades

são as mais importantes. Centenas de projetos se perdem em meio a um milhão de
componentes, que nem sempre são importantes para o cliente final. Qual é a
utilidade, por exemplo, de adicionar três caixas de som a um automóvel quando a
direção não está devidamente regulada?
A definição das prioridades no MVP serve como guia para os desenvolvedores. Evita
que eles percam foco no que seus clientes finais realmente precisam e esperam.
Mesmo as ideias mais inovadoras e brilhantes não podem simplesmente entrar na
frente dos componentes mais básicos de qualquer produto.
### Possibilidade de venda em todos os momentos
Como já mencionamos várias vezes, um produto mínimo é um produto que pode ir para a
venda.
Um software de chat online, por exemplo, não precisa ter uma centena de emojis
embutidos,função de videoconferências e um editor de fotos. Nem mesmo uma função de
agenda de contatos bem estruturada. Ele precisa apenas carregar mensagens recebidas
e enviadas entre os destinatários.
**O caso dos softwares, é ainda mais específico.** Como é possível atualizar
programas de computador e celular quase constantemente, não é necessário
simplesmente cortar todas as funcionalidades que não foram adicionadas até o
momento. Você pode continuar divulgando e vendendo o seu programa enquanto trabalha
para torná-lo melhor e atrair novos compradores.
### Fidelização prévia de leads e clientes
Com um Minimum Viable Product em mãos, você já pode começar a atrair

investidores, [**seus primeiros clientes e qualquer outro tipo de pessoa**] que
acredite no que você está desenvolvendo.
Antes mesmo de adicionar as funcionalidades que considera como diferenciais, você

já poderá manter um fluxo de caixa mínimo, reduzindo o custo de desenvolvimento e
potencializando os resultados.
Além disso, clientes são uma das melhores fontes de divulgação disponíveis. Quando
você consegue mais uma ou duas pessoas para utilizarem seus produtos, elas
comentarão com amigos, familiares e sócios sobre suas qualidades.
Esse é o segundo post de uma série chamada **[Dicas de React]** que eu venho
fazendo, se você não viu o [primeiro da uma olhada aqui] e para ver tudo confere [a
listinha no meu site pessoal] :)[]
Esses dias estava fazendo uns testes com React em um freela que me apareceu pedindo
um site multi linguagem (português e inglês pra ser mais específico). De início
lembrei da época que trabalhava com o [**WPML**] para traduzir os projetos no
WordPress e tentei replicar a ideia do que ele fazia lá e consegui um resultado bem
satisfatório que gostaria de compartilhar com vocês :)
imagem. É legal você ter um conhecimento de JavaScript (objetos, arrays e como

manipular esses tipos de dados).
- É legal você também conhecer o [**React Router, caso não conheça fica a dica
desse outro post**]
## Problemas que precisamos resolver
Quando falamos de internacionalização (i18n é uma abreviação para

"_Internationalization_" entre I e o N existem 18 letras) existem diversos tópicos
para abordarmos como:
- [Tradução dos textos estáticos da interface]

- [Localização de moeda]
- [Alguns ajustes de CSS em caso de sites árabes por exemplo]
- [Timezone]
Entre alguns outros sub-tópicos, nesse post vamos focar em dois pontos.
1\. Traduzir os textos de uma forma escalável
2\. como resgatar o parâmetro via URL informando qual linguagem o usuário deseja
visualizar.
## Resgatando o parâmetro do idioma e setup inicial do React Router para i18n
Para não perdemos tempo configurando coisas, eu deixei tudo [pré-pronto esse
repositório]
Nele já temos uma app react com um sistema de roteamento configurado, e também o
código dessa parte da explicação que irei comentar agora.
O foco para começarmos a entender o projeto atual está no conteúdo do arquivo

[./src/routes.js]
imagem
- Caso não aconteça nenhum dos casos citados o usuário é levado para a rota
acessada normalmente e o atributo com o idioma é disponibilizado.
js
> Conversei bastante com o [Felipe Souto], e no meio da conversa a gente chegou no
ponto que é ultra importante ressaltar que poderíamos pegar o atributo do idioma de
várias formas diferentes.
>
> Mais abaixo no post eu cito outras formas de pegar o atributo
**Importante**: Sempre que possível, planeje a internacionalização de um site desde

o começo do projeto migrar essas coisas em um projeto que está rodando pode ser
extremamente trabalhoso.
Um último arquivo que falta mostrar é o que vem por meio do **ìmport { LANGUAGES }
from './_i18n/languages'`** que basicamente é um objeto com os idiomas que
possuimos e um atributo com a linguagem default (para podermos acessar em
diferentes locais do código)
js
Agora que vimos uma forma de resolver o lance do parâmetro do idioma, vamos ver
como traduzir os textos da nossa app.
## Traduzindo textos estáticos em uma app React
imagem recebemos o seguinte erro:
imagem, dado isso, precisamos carregar um pacote de configurações pra cada idioma
que formos trabalhar (em nosso caso o pt de português), por padrão a lib só carrega
as configs do idioma inglês. Dai vem a chamada da função **addLocaleData()**
- O código dentro do **componentDidMount()** faz com que caso não seja passado um
atributo de idioma válido o usuário seja redirecionado para a home com o idioma
padrão (lembrando que em seu sistema você pode implementar essa lógica do jeito que
achar melhor)
- o **<IntlProvider>** é o provider da react-intrl que nós estamos configurando,
ele recebe o objeto do JSON com as traduções do idioma (na prop messages),
referente ao locale atual (que em nosso sistema varia de acordo com a URL)
- O **import translations from './src/_i18n/translations.json'** nos traz um JSON
com o seguinte formato:
json
- Aqui a chave do JSON é o idioma atual. Dentro do objeto de cada idioma a chave é
a base para passarmos o **id=""** quando chamamos o componente para traduzir as
mensagens: **<FormattedMessage id="Bem vindo!" />**. Muitas pessoas preferem ao
invés de passar uma frase como "Bem Vindo!" passar algo como um id mesmo, algo como
"header.bemvindousuario", na prática tudo funciona da mesma forma (a diferença
nesse exemplo é que colando as chaves {} é possivel passar um valor dinâmico)
js
Agora ao abrirmos nosso projeto no navegador conseguimos alterar o idioma e ver

tudo funcionando tranquilamente
imagem;
- Ter um subdomínio e extrair da url do site (pt.meusite.com e en.meusite.com);
- [Pegar um parâmetro da query string,] essa última o próprio google não recomenda
caso você tenha intenção de trabalhar SEO
[https://support.google.com/webmasters/answer/182192?hl=pt] (embora eles mesmos
usem ¯\\_(ツ)_/¯ ).
Seja qual for a opção que você vá escolher, analise qual o melhor para o seu
projeto e defina uma estratégia em cima.
## E os dados dinâmicos como eu pego?
Para pegar os dados dinâmicos no backend, primeiro a API que você está se
comunicando precisa ter suporte para diferentes retornos baseados em um idioma
solicitado, caso suporte vc pode usar o header: [**Accept-Language**]
Minha sugestão é você criar um [**BFF**] (**B**ack end **F**or **F**ront end), ele
servirá como um meio de campo ente você e as API externas que você se comunica e
via ele você pode configurar as traduções.
## E se eu quiser carregar o JSON de traduções dinâmicamente?
Para isso você vai precisar mexer no \ÌntlProviderConfigured.js\` e fazer um

request que irá ti retornar as traduções. [Um código com um exemplo melhor disso
existe na documentação do **react-intl**]
## Conclusão
Trabalhar com **SPAs i18n** exige um certo esforço, e espero ter conseguido dar um
norte para você conseguir resolver os problemas em seus projetos atuais/futuros.
Espero que tenha gostado do artigo, em breve trarei mais dicas, se curtiu e quiser
saber em primeira mão quando vierem novos conteúdos, [**me segue no meu twitter**]e
pra acompanhar meus outros posts tá tudo centralizado em meu site
pessoal [**https://mariosouto.com**] até mais \\o
Em um sistema de cadastro de produtos que estou desenvolvendo em Python, para um

mercado,temos a seguinte classe que representa um produto:
python
Dentro desse sistema, recebi uma lista chamada `produtos`:

python
Contendo os seguintes produtos:
python
Porém, o dono do mercado pediu para verificar todos os produtos que estão acabando,
ou seja, com quantidade menores que 100. Uma solução procedural para esse problema
seria criar um `for`, e então, dentro dele, adicionamos um ìf` que verifica os
produtos com quantidades menores que 100 e, se for verdade, adicionamos a uma nova
lista contendo todos os produtos que estão acabando. Por fim, devolvemos essa nova
lista:
python
O resultado seria:
python
Para uma tarefa bem simples, escrevemos muito código... Em outras palavras,
escrevemos 3 linhas de código para resolver um problema bem comum em uma lista!
Será que tem como resolver isso de uma forma mais enxuta e objetiva?
No Python, além dos recursos básicos que encontramos em muitas linguagens de

programação,isto é, instruções de `for`, ìf` e èlse` entre outras. Temos também
um recurso bem interessante chamado [compreensão de lista], que nos ajuda, e muito,
na manipulação de dados de uma lista. Por exemplo, para resolver o mesmo problema
que acabamos de ver utilizando a compreensão de lista, faríamos da seguinte forma:
python
```
Feijao, Cafe, Sabao em po, Requeijao, Cafe, caixa de bombom
```
Exatamente o mesmo resultado! Porém, veja que resolvemos dessa vez em uma única
linha! E mais, sem a necessidade de criar uma lista vazia! Mas como isso aconteceu?
A compreensão de lista, itera sobre todos os elementos de uma lista e executa uma
ação para cada item encontrado de acordo com o filtro que utilizamos. Em outras
palavras, é descrita com a seguinte estrutura:
**ação a ser tomada, itens iterados, filtro**
- **ação a ser tomada**: Ação desejada para cada item. (Nesse exemplo só devolvemos
o item).
- **itens iterados**: lista que queremos iterar e extrair seus itens.
- **filtro**: Onde aplicamos as condições para devolver os itens de uma lista.
Suponhamos que dessa vez, o dono desse mercado pediu para verificar todos os
produtos com valores abaixo de R\$ 10,00, e então, para cada um desses produtos,
acrescentar 10% ao valor original. Como faríamos isso? Será que apenas em modo
procedural da certo? Para a nossa felicidade, por meio da compreensão de lista,
podemos também realizar operações aritméticas! Vejamos como ficaria:
python
Se imprimirmos os nosso produtos:
python
js
Como podemos ver, os produtos: "Feijao, Refrigerante, Cafe, Sabao em po, Requeijao,
Leite, pao de forma, Cafe e caixa de bombom". Sofreram o acrescimento de 10% com um
código de apenas 1 linha!
E aí, gostou da compreensão de lista? Que tal tentar agora mesmo substituir os seus
`for`s e ìf`s por ela? Quer aprender mais sobre os recursos do python? Então de
uma olhada nos nossos [**cursos online de python na Alura**].
imagem
Recentemente, estive trabalhando em um projeto de conversor de temperatura, de

Celsius para Fahrenheit, para desenvolvimento de alguns programas com viés
científico.
Lembrei da fórmula de conversão que me ensinaram na época de escola, na qual, sendo

**F** a temperatura em Fahrenheit e **C** a temperatura em Celsius, tínhamos `F =
1,8C + 32` e `C = (F - 32) / 1,8`, e implementei o seguinte código:
python
O objetivo principal desse meu código era para ser usado em outros programas
maiores, com um ìmport`. Apenas para testar, adicionei uma [**verificação do
escopo de execução do programa**]:
python
Rodando o programa com `python aluratemp.py`, recebo o seguinte:
python
Certo, o código funciona bem! E se importarmos as funções pelo interpretador do

Python?
imagem 2018 Yan Orestes
Permission is hereby granted, free of charge, to any person obtaining a copy of

this software and associated documentation files (the "Software"), to deal in the
Software without restriction, including without limitation the rights to use, copy,
modify, merge,publish, distribute, sublicense, and/or sell copies of the Software,
and to permit persons to whom the Software is furnished to do so, subject to the
following conditions:
...
```
Legal, agora qualquer usuário vai saber se (e em quais condições) ele pode usar
nosso software! Mas… espera, como as pessoas vão saber de que forma usar nosso
código? Não tem nada em nenhum lugar ensinando a usar, nem dando nenhum exemplo…
Será que tem algum padrão para isso?
### Explicando nosso projeto no _README.md_
Repare que, da maneira que estamos agora, alguém que baixasse meu software
precisaria ler todo o código para saber como funciona, ou mesmo sobre o que se
trata.
Assim, além de uma licença, é comum os projetos conterem um arquivo **[README]**,

explicando o funcionamento do software, dentre outras especificações. Esse arquivo
pode ter extensões diversas, como a `.md`, de [**Markdown**], que usaremos para
simplificar a escrita do arquivo.
Faremos um README bem objetivo e curto, mas o ideal é que ele tenha informações
suficientes para o usuário conseguir instalar, usar e entender seu projeto. Uma
abordagem simples pode ser, também, usar uma [template pronta] com algum padrão de
README.
No caso do **aluratemp**, deixei o _README.md_ simples assim:
python
Olha como fica visualmente:
imagem` com seus devidos argumentos. Essa função pode ser importada,
principalmente, de dois módulos - `setuptools` e `distutils.core`.
A própria documentação do Python nos incentiva a usar o `setuptools`, mas ele nem
sempre vem instalado por padrão no sistema. Caso isso aconteça, podemos instalar
com o seguinte comando no terminal:
python
> Dependendo do sistema, esse comando pode precisar de permissão de administrador

(`sudo`) para funcionar propriamente.
Se não tivéssemos como usar o _pip_, a solução seria usar o `setup()` do

`distutils.core`, mesmo. Isso implicaria em não poder aproveitar ao máximo essa
poderosa função, se limitando aos [argumentos suportados por esse módulo].
Daqui para frente usaremos o `setuptools`, cuja [lista de argumentos suportados

pelo `setup()`] é mais extensa.
Vamos começar a montar nosso código passando o parâmetro `name` para a função
`setup()`, indicando o nome do nosso projeto:
python
Tudo bem, passamos o nome de nosso projeto para o `setup()`. O problema é que
apenas assim o código não funciona, porque precisamos de mais informações, como a
versão (`version`), os autores (àuthor` e àuthor_email`) e os pacotes
(`packages`, geralmente uma lista com o mesmo nome especificado em `name`):
python
Agora sim! Isso é o básico que a função `setup()` deve receber. Porém, não seria
legal poder passar, além desses, mais dados para aparecerem lá na página do projeto
no PyPI e para facilitarem a busca? Mais uma vantagem da função `setup()` - em
geral, podemos!
Por exemplo, podemos passar também uma curta descrição (`description`) para
aparecer lá na página, em conjunto com uma mais longa (`long_description`).
Também podemos especificar uma URL (ùrl`)de página inicial para o projeto. No
caso, vou colocar o repositório do GitHub onde o código se encontra. Em outro
argumento (`project_urls`), podemos até passar um link de download:
python
Podemos até passar a licença (`license`) que escolhemos (obviamente de maneira bem
mais reduzida):
python
Outras informações legais que podemos passar são as que influenciam diretamente na
parte das buscas, como palavras-chave (**keywords**) e classificadores
(**classifiers**). O próprio PyPI nos disponibiliza uma [lista completa de
classificadores] para sabermos o que podemos usar para categorizar nosso projeto.
A lista de classificadores contém informações a respeito do status de

desenvolvimento, de quem é o alvo do código, da língua nativa dele, dentre várias
outras possíveis. No nosso caso ficou assim:
python
Ao final, nosso código ficou assim:
python
Agora que temos nosso projeto já configurado, podemos continuar o processo de

empacotamento e upload de nosso software.
## Empacotando nosso projeto
Já temos o projeto pronto, então o que fazemos agora? De alguma forma, precisamos
passar para o PyPI algumas informações e metadados que permitam a instalação de
nosso projeto pelo pip, ou ele não vai saber o que fazer com o nosso código!
Para isso, exploraremos o poder do arquivo `setup.py` que criamos e geraremos uma
distribuição raiz, ou, tecnicamente, **_[source distribution]_**, também chamada de
**_sdist_**, que é o mínimo que precisamos.
Para criarmos nossa _sdist_, basta um simples comando no terminal:
python
Rodando esse comando, olha como ficou a árvore do nosso diretório:
imagem para funcionar propriamente.
Com o twine instalado, usamos o comando `twine upload dist/*`. Como queremos
primeiro fazer o upload no repositório teste, precisamos especificar a url dele
(`https://test.pypi.org/legacy/`) com a opção `--repository-url`:
python
Teremos que digitar nossas informações de login e, enfim, [**o pacote já estará
disponível no repositório teste**]!
Mas não é chato termos que ficar passando a URL e nossas informações de login toda
vez que queremos fazer o upload? Podemos simplificar todo esse processo com um
arquivo `.pypirc`, que deve ser armazenado na pasta HOME de nosso sistema:
sql
Assim, apenas com o comando `twine upload dist/* -r testpypi` já daria certo!
> Se não tivermos acesso ao pip, podemos usar o comando `python setup.py sdist
upload -r pypitest`
Agora, e para o repositório oficial? O comando é mais simples ainda: `twine upload
dist/*`, e pronto! [Nosso projeto já está disponível]!
> Se não tivermos acesso ao pip, podemos usar o comando `python setup.py sdist
upload -r pypi`
Assim, meus colegas poderão usar as funções de conversão que eu criei apenas
instalando o pacote com o pip e importando-as nos seus próprios programas Python!
## Compartilhando nosso código em prol da comunidade
Compartilhar nosso código com a comunidade pode não parecer necessário, nem muito
útil, mas muitas vezes é uma atitude muito legal que podemos tomar! Uma das
maravilhas da linguagem Python é justamente isso - a comunidade e todo o apoio que
ela (**ou melhor, nós**) dá para si mesma.
Quando temos acesso ao código que outra pessoa fez, não precisamos mais ficar
reinventando a roda, o que poupa nosso tempo e esforço. Se fizemos um código que
pode ajudar outros, é sempre bom considerar compartilhar!
Nesse post, aprendemos como podemos fazer isso com o Python, utilizando ferramentas
como o `setuptools` para configurar e empacotar nosso projeto e o `twine` para
fazer o upload no PyPI - o maior repositório de código Python que conhecemos.
E aí? Que tal participar ativamente da comunidade compartilhando seus projetos pelo
PyPI? Se você se interessa pela linguagem e quer aprender mais, dê uma olhada em
nossos [**cursos na Alura**] e continue estudando!
E quando falamos em metas e objetivos, a primeira coisa é justamente definir o que

é isso. Quando entendemos o que realmente queremos, o caminho para chegar até ele
fica muito mais claro. Principalmente se estamos falando de nossos estudos.
## "Sei o que quero, e agora?"
Se quero aprender algo novo, nada mais justo do que organizar um planejamento que
seja efetivo e eficiente, certo? Afinal, o maior risco que corremos quando criamos
todas essas metas é atropelar algumas questões básicas que podem acabar nos
deixando frustrados, seja pela não conclusão do objetivo ou por nem conseguir
iniciá-lo.
A frustração é algo que pode nos abrir dois caminhos: ficar desmotivado e deixar
aquele objetivo de lado, ou superar esse sentimento com a motivação de continuar
tentando até conseguir.
Esses dois caminhos acontecem de forma muito relativa, dependendo do contexto em

que cada pessoa está, as possibilidades existentes, a personalidade, enfim… Varia
muito e não podemos prever como iremos lidar com esse sentimento.
Mas existem algumas coisas que podemos sim ter um maior nível de controle e evitar
que a frustração apareça.
# Planejar passo a passo
## Definindo o objetivo
Se falamos em planejamento de estudos, precisamos entender que existem algumas

etapas importantes a considerar. A primeira dela já sabemos: definir o que
queremos.
Mas como definir? Bom, se estamos falando de metas e objetivos, nada melhor do que
definir de forma objetiva, isto é, se queremos aprender sobre [**UX**], o que
exatamente queremos aprender sobre isso? [**Pesquisas de UX**]? [**Testes de
usabilidade**]? Especificar exatamente qual será o foco é importante para que não
precise perder tempo depois afunilando o que realmente é do nosso interesse dentro
desse tema tão amplo.
## Entenda sua rotina
Hoje em dia, uma das maiores queixas das pessoas é não ter tempo. De forma geral,
nunca temos tempo para nada, certo? Sempre temos uma sensação de que "poderíamos
ter feito mais".
> _"Estou sem tempo. Esta é uma frase que costumamos dizer e ouvir bastante. Seu
significado é ‘não tenho prioridade suficiente pra isso neste momento’. Todos temos
tempo, exatamente 24 horas por dia. O que podemos fazer então é gerenciar o tempo
para otimizá-lo."_, cita [Dionatan Moura].
Pois então, depois de definida sua meta, comece a avaliar sua rotina.
Coloque no papel tudo o que você faz ao longo da semana, começando pelas atividades
fixas e adicionando as variáveis depois. Agora, analisando o que você anotou,
analise os melhores horários para incluir um momento de estudo. Se for 20 minutos
ou 1 hora, não importa, todo momento de estudo é válido, contanto que você consiga
[**criar um calendário de estudos**] regular e focado no que pretende estudar.
## Trace os pontos de estudo
Ok, já sei o que quero aprender e como me organizar nos horários para incluir
momentos de estudo, posso agora incluir no calendário exatamente o que pretendo
aprender.
Mas, antes, é importante pesquisarmos qual a melhor trajetória a seguir naquilo que
queremos aprender. Pesquisar o que outras pessoas, que já passaram por esse
caminho, recomendam pode encurtar muito o tempo que você gastaria tentando
encontrar as melhores possibilidades.
Se quero ser um [**programador full-stack**], por exemplo, posso seguir por uma
linha de aprendizado, enquanto um [**programador front-end**] pode ter uma outra
rotina.
## Formando hábitos
Quando nos focamos em nossas metas, o maior desafio é a autodisciplina.
Alguns hábitos nós somos forçados a criar, como, por exemplo, a rotina de trabalho.
Temos horários a cumprir e isso nos força a dedicar o tempo de forma mais focada a
essa atividade, assim como cursos ou qualquer atividade de horário fixo.
Mas, [**se estamos falamos de hábitos**] em que o único que poderá cobrar
resultados somos nós mesmos, o processo é muito mais desafiador.
Segundo [Dionatan Moura], algo muito comum é essa **Síndrome do estudante** que
muitos de nós temos, em diferentes fases da vida. Essa nada mais é do que a prática
de **procrastinar**, isto é, nós podemos facilmente criar o hábito de _deixar para
depois_ nosso planejamento, usando qualquer distração ou dificuldade como desculpa.
Portanto, é interessante que essa cobrança aconteça de forma saudável, mas com
frequência. Para isso, crie formas de [**manter-se produtivo em seu dia a dia**] de
estudos.
## O principal é: Vamos começar!
Quem nunca fez mil planos para algo e nunca colocou efetivamente em prática?
Planejamentos são ótimos, mas de nada adianta se não iniciarmos nunca, certo?
Já sabemos o objetivo, refletimos sobre nossa rotina e o melhor calendário a seguir

e como manter essa rotina produtiva… Perfeito! Agora a ideia é concretizar tudo
isso.
Todos temos receios quanto ao retorno que esse investimento de tempo nos trará, mas
tenha em mente que todo aprendizado, seja ele pequeno ou grande, gera o enorme
valor para todas as experiências que acumulamos.
Na **Alura** temos [**diversas formações e cursos**] justamente para possibilitar à

todos os alunos a chance de encontrar todas as possibilidades de aprendizado que
queira tentar. Sempre é tempo de começar a aprender algo novo!
E você? O que planejou para esse ano? E para o ano que vem?
O jQuery é um framework **muito** bom. E com muitas funções. Mas muitos usam para
coisas simples, por não saber fazer em JavaScript puro.
Selecionar elementos é uma dessas coisas. Em jQuery a gente faz:
js
Ou seja, passamos um **seletor CSS** e ele encontra os elementos na página pra

gente. Mas quem manja de JS sabe que é fácil fazer sem jQuery, basta usar o
querySelector:
js
jQuery é bom, mas melhor ainda é conhecermos JavaScript e saber usar os dois.
Você já precisou deixar um processo executando em um servidor remoto mesmo depois
de fechar a conexão SSH? É muito frustrante termos falhas só por fechar o terminal
ou a conexão com o servidor.
imagem
Recentemente, estive trabalhando em uma [**aplicação de agenda de contatos**]

usando o [**Django**], da qual já fiz o [**deploy em um servidor remoto**] que eu
aluguei.
Aparentemente, tudo estava certo, o site funcionava bem. Assim, fechei minha
conexão [**SSH**] com o servidor, recarreguei a página aberta no meu navegador
local e olha o que apareceu:
imagem ao mesmo tempo e, no nosso caso, quando queremos que um programa não se
inicie como filho do Bash, para que possa continuar rodando mesmo quando
desconectarmos da máquina.
Existem diversas aplicações que funcionam como multiplicadoras de terminal,

estando, dentre as mais famosas, o [**GNU Screen**] e o [**tmux**]. No nosso caso,
usaremos o **GNU Screen**, por vir pré-instalado, por padrão, na maioria das
distribuições Linux. E então, como podemos usá-lo?
## Usando o GNU Screen para preservar a execução de um processo
Estamos em nosso terminal, e agora? Como podemos usar o GNU Screen para separarmos
a execução do Gunicorn? Bem, podemos começar rodando um comando para criar uma nova
sessão, da qual vou chamar de `rodaGunicorn`:
```
screen -S rodaGunicorn
```
Podemos checar as sessões do Screen rodando com o seguinte comando:
E verificar que estamos vinculados (àttached`) à sessão `rodaGunicorn`:

![Lista sessões do Screen]
Vinculados à nossa nova sessão, podemos voltar para o nosso projeto Django e
executar o Gunicorn:
![Gunicorn em execução]
Legal! E agora? Ficamos presos nesta tela? Com o GNU Screen, isso é fácil!
Vinculados a uma screen, podemos usar os comandos específicos do software através
de uma tecla de escape, que geralmente é **Ctrl-a**.
Para simplesmente nos desvincularmos da screen, podemos usar esta tecla de escape
seguida da tecla **d**. Podemos checar novamente a lista de sessões e olha só:
![Lista de screens detached]
O Gunicorn continua rodando na screen que criamos!
Fui entrar no meu site pelo navegador e continuou dando aquele mesmo erro! Acabei
me confundindo e esqueci que eu configurei meu servidor web para direcionar as
requisições para a porta **8001**, não **8000**.
Precisamos reiniciar o Gunicorn com as configurações corretas. Mas como voltamos

para a sessão onde o Gunicorn está rodando? Para nos vincularmos a uma sessão a
partir do nome dela, basta usar a flag `-r` do comando `screen`:
Podemos encerrar o Gunicorn com o comando **Ctrl-C** e iniciá-lo novamente com as

configurações corretas:
![Reiniciando o Gunicorn]
Dessa vez, podemos nos desvincular dessa screen e até fechar o terminal, que olha
só:
![Site funcionando!]
Nosso site continua funcionando!
## Para saber mais: Múltiplos terminais em uma única tela com Screen
O GNU Screen, além do uso básico que acabamos de ver, em que temos sessões
diferentes para diferentes processos, tem mais algumas funcionalidades muito úteis!
Uma muito bacana é a que nos permite dividir uma única tela de terminal em diversos
pequenos terminais, mais ou menos dessa forma:
![Divisões de tela com Screen]
Para isso, basta usarmos [alguns comandos] de gerenciamentos de janelas e divisão

de telas próprio do GNU Screen!
## Controlando múltiplos terminais com o GNU Screen
Muitas vezes, precisamos deixar um processo rodando em nosso terminal por tempo
indeterminado. Inevitavelmente, chega um momento em que precisamos fechar o
terminal, mas queremos que o processo continue executando, e aí?
Entendemos que os processos inicializados pelo terminal são filhos dele e, por
isso, são encerrados assim que este é. Por conta disso, tínhamos um grande
problema, afinal precisávamos manter o processo do Gunicorn rodando!
Assim, conhecemos o GNU Screen um multiplicador de terminal que nos permite separar
nossos processos por sessões que não interferem uma na outra. Dessa forma, quando
fechássemos o terminal, os processos dentro das sessões do Screen continuariam
rodando!
Além disso tudo, ainda demos uma olhadinha no poder do GNU Screen, com sua
funcionalidade de divisão de telas e janelas dentro de um único terminal.
E aí? Já conhecia o GNU Screen? Ele pode nos ajudar bastante, não acha?
imagem
Como podemos **salvar as informações com o Shared Preferences**?
No post onde mostro como podemos criar uma [**splash screen**], vimos que diversas
Apps fazem uso desse tipo de tela, entretanto, já percebeu quantas vezes essa tela
aparece para nós? Será que todas as vezes que abrimos a App? Algumas vezes? Apenas
uma vez?
## Entendendo o problema de usar splash screen
Imagine se **todas as vezes que o usuário abrir a App**, tiver que esperar um
determinado tempo para a App mostrar o conteúdo que ele vai interagir, sendo que
ele **já sabe o que é a App e o que ela faz**. Será que ele vai gostar disso?
Provavelmente não... Então como poderíamos resolver esse problema?
## Conceito para evitar o problema
Teoricamente, quando o usuário abrir a App, precisamos **armazenar uma pequena

informação** indicando que o usuário já iniciou a App uma vez. Porém, no Android,
como podemos armazenar dados ou informações?
Podemos optar por criar um banco de dados no [**SQLite**], e então, criamos uma
tabela para armazenar essas informações. Entretanto, precisamos apenas armazenar
uma informaçãozinha, ou seja, um `true` ou `false`, 1 ou 0.
Em outras palavras, qualquer dado que indica se o usuário iniciou ou não a App.
Considerando esse aspecto, faz sentido criar uma **estrutura complexa** como um
banco de dados, apenas pra resolver isso? Aparentemente não... Então como
resolvemos esse mesmo problema sem a utilização de um banco de dados?
## Conhecendo o Shared Preferences do Android
No Android, existem diversas opções de armazenamento, conhecidas como [**Storage

Options**], dentre essas opções, temos a [**Shared Preferences**] que nos permite
armazenar valores primitivos, como por exemplo, `booleans`, `floats`, ìnts`,
`longs` e `Strings` a partir de uma chave, por exemplo:
- **chave:** ja_abriu_app, **valor:** `true`
Bem legal, né? Vamos então adicioná-la na activity `SplashScreenActivity` que é a

_LAUNCHER_ da App. Como podemos fazer isso?
## Utilizando o Shared Preferences
Simples! Primeiro chamamos o método `getSharedPreference()` enviando 2 parâmetros:
java
- **1º parâmetro:** nome da shared preferences que queremos buscar.

- **2º parâmetro:** modo de acesso (Por defautl utilizamos o [**MODE_PRIVATE**]
pois ele restringe o acesso apenas para a App que está chamando ou para todas as
Apps que tiverem o mesmo user ID)
Esse método nos devolve uma instância da classe `SharedPreferences`:
java
A partir do objeto `preferences` podemos verificar se existe uma chave com o método
`contains()`. Portanto, antes de chamar o `postDelayed()` do `handler`, vamos
verificar se existe a chave `"ja_abriu_app"`.
java
Caso exista, mostramos a tela de login:
java
Mas e se a chave não existe? O que fazemos? Adicionamos um èlse` para mostrar a
splash screen, certo?
Antes de adicionar o èlse`, para facilitar a leitura e compreensão do código,

vamos extrair o método `mostrarSplash()` enviando todo o código que cria a splash
screen dentro dele. Então ficamos com o seguinte resultado:
java
Se executarmos a App, teremos o mesmo comportamento de antes, pois a chave que

enviamos ainda não existe! Então o que precisamos fazer agora?
## Salvando informações no Shared Preferences
No momento em que o método `mostrarSplash()` for chamado, precisamos também

armazenar essa chave no nosso `preferences`, certo? Então vamos adicioná-la!
Primeiro, vamos criar o método àdicionarPreferenceJaAbriu()` que recebe um objeto

do tipo `SharedPreferences`:
java
Dentro do método àdicionarPreferenceJaAbriu()`, criaremos a chave

`"ja_abriu_app"`. Mas como fazemos isso? A partir do `preferences` chamamos o
método èdit()` que nos devolve um objeto do tipo `SharedPreferences.Editor()`:
java
Então, a partir do èditor` podemos adicionar um valor, por exemplo, para adicionar
um `boolean`, utilizando o método `putBoolean()` enviando o nome da chave e o
valor:
java
Por fim, precisamos utilizar o método `commit()` do èditor` para salvar a operação
que realizamos:
java
> Nesse exemplo, adicionamos apenas uma chave antes de realizar o `commit()`,
porém, poderíamos adicionar mais de uma antes de chamá-lo!
Por fim, basta apenas chamarmos o método àdicionarPreferenceJaAbriu()` enviando o

`preferences` logo antes de chamar o método `mostrarSplash()`:
java
Executando novamente a App, temos o mesmo resultado de antes, pois **ainda não
existe a chave**, porém, a partir da segunda execução, a App direciona direto para
a tela de login!
Um detalhe importante sobre a Shared Preferences considerando esse nosso exemplo, é
que não utilizamos em nenhum momento o seu valor, isto é, foi necessário apenas
saber se a chave existia, afinal, caso ela exista sabemos que ele já abriu uma vez.
Então vem a questão:
> Em quais casos seria interessante pegar o valor da Shared Preferences?
## Consideração do Shared Preferences
Atualmente, é muito comum abrirmos uma App, realizarmos o login e, em algum

momento, fecharmos a App. Entretanto, quando abrimos novamente a App, não passamos
mais pela tela de login, certo?
Como será que isso é feito? Provavelmente, existe algum tipo de _token_
identificador que verifica se esse usuário faz parte ou não do sistema.
Considerando o cenário acima, como faríamos para armazenar esse token na App? Por
meio do Shared Preferences também!
Em outras palavras, o Shared Preferences pode nos auxiliar em diversos cenários no

dia a dia considerando que precisamos apenas salvar um dado primitivo.
Entretanto, seu uso precisa ser consciente, pois se a sua intenção é armazenar
configuração de preferência do usuário, o mais indicado é o uso da
[**PreferenceActivity**] :)
## Conclusão
Nesse post vimos que além do SQLite, temos outras Storage Options que nos permitem
armazenar dados nos dispositivos sem a necessidade de criar uma estruta de dados
complexa como um banco de dados.
Dentre elas vimos a Shared Preferences que nos permite armazenar valores primitivos
utilizando uma estrutura de chave e valor. O que achou da Shared Preferences? Teste
na sua App e me conte o que achou! ;)
E que tal aprender a integrar a sua App Android com um Web Service? Seus problemas
acabaram! Na Alura temos o [**curso de Android com Web Service**] no qual você vai
aprender desde o zero como podemos fazer com que a nossa App Android se comunique
com um servidor externo.
Unir o conhecimento com a técnica é essencial para o designer que deseja ingressar
no mercado de trabalho. Até mesmo quem [**busca um freela**] precisa ir além da
teoria e conhecer as ferramentas de web designer, itens importantíssimos que ajudam
a colocar em prática tudo aquilo que você aprendeu nos livros e nas salas de aula.
## Adobe Photoshop
Sem dúvidas, esse você conhece. O [**Photoshop**] (PS) é o software de edição de

imagens mais popular e mais usado no mundo.
Está no dia a dia tanto de designers gráficos quanto de designers digitais e

apresenta recursos muito poderosos. Com ele, você pode criar uma infinidade de
layouts de sites e fazer montagens e tratamentos de fotos, animações simples,
ilustrações e muito mais.
Entre os profissionais experientes, há controvérsias quanto ao uso do Photoshop
como melhor software para criação web. Alguns defendem o Fireworks, também da
Adobe, alegando que o PS foi originalmente projetado para manipulação de imagens.
Mesmo assim, o Photoshop é a preferência da maioria dos designers, pois esses
profissionais já estão bem familiarizados com seus comandos e recursos.
Saber trabalhar com o Photoshop é obrigatório para quem é designer. Se você ainda
não domina esse programa, [comece agora mesmo].
## Adobe Illustrator
Diferentemente do Photoshop, que trabalha com imagens bitmaps, o [Illustrator] é

uma ferramenta que lida com [**imagens vetoriais**]. Os dois softwares formam a
verdadeira dupla dinâmica no cotidiano do web designer.
No Adobe Illustrator, você pode desenvolver várias peças: ícones, ilustrações,

infográficos, logotipos e layouts diversos. E o melhor: ele tem integração com
outros softwares da Adobe, o que facilita bastante o trabalho.
## Heat maps
Os heat maps (ou mapas de calor) não são ferramentas para criação, mas são bem
importantes porque indicam se os visitantes estão usando o site da maneira
desejada. Afinal, de que adianta criar um design incrível se o mesmo não atingir os
objetivos a que se propõe?
Esses softwares fazem um rastreamento individual de cada interação e representam,

por meio de cores, o que as pessoas estão fazendo no site. Eles controlam,
inclusive, cliques em locais que não são links e que podem estar causando confusão
na cabeça dos usuários. Essas indicações são ótimas para que você descubra o que
não funciona tão bem e que deve ser melhorado.
Para conhecer mais sobre o assunto, confira as ferramentas [**CrazyEgg**] e

[ClickHeat].
## Testes de usabilidade online
Que tal colocar à prova a usabilidade do site que você desenvolveu? Isso é possível
com testes online em estilo moderado ou não moderado. Além de mais rápidos do que
os testes tradicionais, que recrutam pessoas, o modelo online economiza dinheiro e
possibilita mais controle dos seus cenários.
No [UserTesting.com] (moderado), por exemplo, você pode estabelecer que o teste

seja feito por usuários pré-selecionados. É possível segmentar por faixa etária,
gênero, país e outros critérios para se escolher quem deve participar da avaliação.
Já com o [ClickTale] (não moderado), a navegação dos visitantes é anonimamente
monitorada, registrada e estudada. Nesse caso, os participantes são selecionados de
forma aleatória dentro de uma base de cadastrados na própria ferramenta.
Os testes de usabilidade permitem que você observe os acessos dos usuários e

descubra como eles se comportam. Os resultados indicarão quais recursos devem ser
abandonados ou priorizados e apontar outras soluções centradas no usuário.
## Testes A/B
É muito provável que você já tenha passado pela seguinte situação: criou dois
ótimos e diferentes layouts, mas não consegue decidir qual é o melhor. Para sair
desse dilema, faz uma “votação” entre seus colegas de trabalho.
Hoje, já existem alternativas tecnológicas que eliminam essa dúvida. São os testes
A/B, ferramentas para web designer que permitem que você implemente vários projetos
do mesmo site, mostrados aleatoriamente aos visitantes. A ideia é fugir do
“achômetro” e ajudar a determinar qual opção é a mais eficaz.
Os testes A/B são muito usados no e-commerce. Numa loja virtual, pequenas
alterações podem [**influenciar na performance**]. Uma simples troca da cor do
botão “Comprar”, por exemplo, pode ser o que faltava para melhorar as vendas.
Se quiser saber mais sobre os testes A/B, conheça o [**Google Web Optimizer**].
## Editores de código fonte
Com frequência, o web designer precisa [**trabalhar com programação**] e também há

softwares que o auxiliam nessa tarefa. Dentre eles, temos as IDEs (do inglês,
Integrated Development Environment ou Ambiente Integrado de Desenvolvimento) que
fazem parte de um conjunto de ferramentas organizadas para facilitar o trabalho do
desenvolvedor.
O [Sublime Text 2] é uma aplicação que surgiu dessa tendência e com o intuito de
fazer a programação se tornar mais simples e adaptada à forma de trabalho do
usuário. Na prática, ele é um editor de texto leve e com interface fácil de usar.
Vale lembrar que o Sublime Text 2 é uma ferramenta paga, porém há outras
alternativas gratuitas que cumprem bem o mesmo papel. É o caso do [Brackets], da
Adobe, e do [Visual Studio Code].
## Just My Type
Se você é um designer apaixonado por tipografia, com certeza vai gostar do site
[Just My Type]. Ele permite que você teste várias fontes populares e veja a que
melhor se encaixa no seu layout. As opções vão desde os estilos antigos até os mais
modernos. Para surpreender, explore também o font pairing, uma técnica para sair do
lugar-comum, misturando dois tipos de fontes diferentes em uma mesma frase.
**Essas são as ferramentas que destacamos para você e que vão ajudá-lo na criação e
desenvolvimento de um bom trabalho de design. É claro que, sozinhas, elas não fazem
milagres. O profissional é uma peça-chave no processo e precisa ser criativo,
organizado e interessado em estudar, pesquisar e aprender cada vez mais,
principalmente numa área multidisciplinar como a de design.**
imagem
Usar muitas imagens separadas com `<img>` pode ter um custo de performance. Mas
transformá-las em sprites pra usar com CSS pode ter um impacto semântico, em SEO e
acessibilidade? E técnicas como LazyLoad?
Essa excelente pergunta foi trazida no [**fórum da Alura**] pelo [Guilherme

Battoni]. No cenário dele, ele tem uma galeria de muitas fotos e quer melhorar a
performance sem prejudicar a semântica.
## SEO/semântica vs performance
No fim, existem duas coisas conflitantes que precisamos pesar, neste caso tanto o
lado do **SEO** como também o de **performance**, vamos entender cada um deles:
### SEO
Do ponto de vista de SEO, você precisa sempre colocar a foto no `src` do `<img>`.
Qualquer outra coisa e o Google não vai indexar a imagem corretamente (seja sprite,
seja o lazyload). Se SEO é importante pra você, coloque as imagens do jeito
tradicional.
### Performance
Pra performance, pode não ser tão interessante carregar tudo em `<img>`. Então se o
SEO não for tão importante, podemos pensar nos truques. Meu favorito é o _Lazy
Load_ (carregar a imagem com JavaScript só quando ela for necessária). Inclusive no
[**curso avançado de Performance Web**] a gente fala disso.
## Vale a pena fazer sprites com muitas imagens?
Fazer sprites com muitas fotos eu já não acho uma boa ideia. Em geral fotos são
grandes e a sprite final vai ficar gigantesca. Isso vai demandar mais memória pra
processar e um download muito maior.
A compressão pelo fato de juntar várias fotos não vai ser tão boa assim porque em
geral o conteúdo é diferente. E é bem possível que certas fotos fiquem piores
visualmente que outras no meio dessa sprite gigante (pela forma que o JPEG
comprime).
## Como devo lidar com imagens grandes?
Agora, o importante também é medir o impacto real na performance sentida pelo

usuário. A gente se assusta com imagens grandes mas em geral elas são o menor dos
problemas. **Imagens são baixadas de forma assíncrona e não bloqueiam nada na
renderização.**
Então desde que você priorize os downloads de forma correta (baixar as imagens mais
importantes antes), em geral não é tão negativo ter vários requests de imagens.
Você só precisa ver se esses requests de imagem não estão bloqueando a fila de
downloads do browser e impedindo que coisas mais importantes como CSS e JS sejam
baixados (nesse caso, colocar as imagens num hostname separado ja aliviaria).
Mas claro, tudo isso pensando em performance de carregamento/execução. Se a

preocupação for com o total de bytes baixados (economizar banda, não parecer
rápido), aí a conversa é mais na linha do Lazy Load mesmo.
Aliás, Lazy Load é um bom exemplo de técnica que prioriza algo (consumo de banda)
em detrimento de outras coisas (percepção de performance, SEO).
## Resumo
Tudo depende, e você vai precisar quebrar a cachola um pouco pra ver o melhor pro
seu cenário.
A maioria dos usuários de WordPress gasta boa parte de seu tempo interagindo com o
editor visual da plataforma. Não é difícil entender porquê. A ferramenta é
extremamente poderosa e oferece o ambiente ideal para produzir e [**publicar
conteúdo**], o que tornou essa plataforma a número um para criação de sites e blogs
no mundo!
## 1\. Domine o WordPress com atalhos de teclado
Para utilizar ao máximo as capacidades de seu blog no WordPress, será preciso

conhecer alguns dos atalhos de teclado que tornam a postagem, edição e
compartilhamento de seu conteúdo menos complexos.
É irritante mover o mouse toda hora apenas para deixar um texto em negrito ou
adicionar um link, certo? O editor visual tem inúmeros atalhos de formatação que
vão tornar a escrita mais intuitiva.
Utilizando _ctrl_ + as seguintes letras, você consegue:
- **c:** copiar
- **v:** colar
- **x:** cortar
- **a:** selecionar tudo
- **z:** desfazer a digitação recente
- **y:** refazer a digitação recente
- **b:** colocar o texto selecionado em negrito ou **começar a escrever em
negrito**
- **i:** colocar o texto selecionado em itálico ou _começar a escrever em itálico_
- **u:** sublinhar o texto selecionado ou começar a escrever sublinhado
- **1, 2, 3, 4, 5, 6:** criar um título diferenciado, com as formatações H1, H2,
H3, H4, H5 ou H6
- **k:** inserir ou editar um link
## 2\. Altere o espaçamento entre parágrafos
Você sabe criar parágrafos e utilizar quebras de linha no WordPress? Cada vez que
você pressiona a tecla _enter_, um novo parágrafo com espaçamento duplo é originado
no editor visual.
Se preferir utilizar espaçamento simples, não se preocupe: pressione _shift +

enter_ na hora de escrever seu texto e _voilà_!
## 3\. Copie um texto sem a formatação
Quando copiamos trechos de textos da internet e colamos num post por meio do editor
visual, a formatação dele vem junto. Nem sempre isso é o ideal, já que seu blog tem
uma identidade e estilo próprios.
Para resolver o problema, pressione o botão _"Paste as text"_ no editor visual. É

aquele identificado pelo símbolo da prancheta.
## 4\. Adicione caracteres especiais à sua postagem
Precisa adicionar símbolos, como o _copyright_ (©), e não sabe onde encontrá-los?
Dentro do editor de textos, você tem um mapa de caracteres especiais para tornar
esse trabalho mais simples. Ele está identificado pela letra grega **Ω** (ômega),
que também é um caractere especial!
## 5\. Reorganize o editor de textos para deixá-lo do seu jeito
Você pode reorganizar a tela do editor de postagens do WordPress como quiser. As

_metaboxes_, que incluem categoria, informações sobre o autor e outros campos
úteis, como dados de plugins que você adicionou a seu website, podem ser
organizadas para ficar com a sua cara.
Uma área de escrita livre, por exemplo, pode ajudar a se focar no conteúdo. Clique
e arraste o título de uma dessas caixas para mudar sua posição.
Acha que não precisa de alguma delas? Clique no botão de opções, no canto superior
direito da tela, e escolha quais ocultar ou exibir.
## 6\. Escreva em tela cheia se preferir não se livrar das metaboxes
Tem hora que [**precisamos realmente focar no conteúdo**] e se livrar das

_metaboxes_ pode não parecer o suficiente. Para isso, uma das nossas dicas do
WordPress é utilizar o modo de tela cheia, que oferece um editor sem distrações.
Clique no botão "tela cheia" e produza posts com mais agilidade. Não se preocupe,
todos os instrumentos de edição visual, como a opção de mudar seu texto para
negrito ou itálico, ainda estarão lá.
## 7\. Destaque seus títulos alterando o tamanho deles
A tipografia é fundamental para enriquecer um conteúdo na web e, na maioria das

páginas que visitamos, ela compõe quase todo o layout. Você pode querer utilizar
diferentes tamanhos de fonte para capturar a atenção do leitor ou destacar seções
diferentes de um artigo.
Por padrão, o editor visual do WordPress permite que você escolha o tamanho da
fonte em parágrafos, cabeçalhos e rodapés. Selecione o texto desejado e edite a
informação na caixa _"Paragraph"_.
## 8\. Insira tabelas e organize seu conteúdo
Precisa incluir uma tabela no seu post, mas não sabe como? Alguns temas vem com
essa opção de fábrica, mas, para todos os outros, um plugin simples como o
TablePress pode ajudar. [Faça download do arquivo aqui] e, depois, entre na sua
página de plugins.
Lá você encontrará a opção de fazer o upload de um novo plugin. Indique o caminho

do arquivo e, após a instalação, ative-o. Pronto! Agora o TablePress está instalado
e você poderá incluir tabelas em seus novos posts.
Para criar uma tabela, vá até a aba do plugin (no canto esquerdo da tela) e
selecione _"add new table"_. Dê à sua tabela um nome, escolha o número de linhas e
colunas e insira os dados necessários. Quando quiser adicionar essa tabela a um
post, basta clicar no novo botão que aparecerá em seu editor de textos: _insert a
table from TablePress_.
## 9\. Integre vídeos ao seu website pelo WordPress
Não é uma boa ideia fazer upload de conteúdos em vídeo direto no WordPress.
Carregar esses arquivos em sua própria instalação vai custar largura de banda e,
provavelmente, exigir que você instale e configure alguns plugins adicionais para
que o conteúdo seja exibido corretamente.
A melhor coisa que você pode fazer é incorporar vídeos do YouTube em sua página,
consumindo assim a largura de banda de terceiros.
Faça upload do seu conteúdo no YouTube e, em seguida, copie a URL encurtada do

vídeo. Para inserir o conteúdo em seus posts, basta colar esse endereço no editor
visual de conteúdo.
## 10\. Alterne para o editor de HTML
O editor visual do WordPress é extremamente poderoso, mas pode ser que você queira
incluir seu próprio HTML para tornar posts e páginas ainda melhores. Às vezes,
quando lidamos com o alinhamento de imagens e textos, o melhor é recorrer ao código
para trabalhar com mais velocidade e controle.
Alternar entre o editor visual e o HTML é muito simples: basta clicar no separador
_"text"_.
E aí, o que achou das nossas dicas do WordPress? Elas vão facilitar (e muito!) a
construção do seu site, deixando o trabalho ainda mais intuitivo. Que tal conhecer
agora alguns [**hacks de Illustrator**] que vão permitir que você crie imagens
incríveis para deixar seu novo blog do seu jeito? Confira!
imagem
Veja como usar o git e aplicar versionamento em seus projetos.
Estou em um projeto para um mercadinho e agora estou desenvolvendo uma página web
em HTML com o intuito de listar todos os produtos do mercado. A princípio cheguei
no seguinte resultado:
imagem o gerenciamento do projeto:
`git init`
imagem o nosso arquivo `produtos.html` para ser salvo:
`git add produtos.html`
Pronto! Com isso nosso arquivo foi marcado pelo Git, porém, ainda precisamos marcar
os arquivos que estão no diretório `css` e `js`. Mas para isso eu preciso adicionar
todos os arquivos contidos neles um por um?
Não necessariamente, você pode adicionar um arquivo por vez passando o caminho até
ele, mas se você quiser adicionar todos os arquivos de um diretório, basta dizer
isso para o Git:
`git add css/`
Dessa forma, todos os arquivos dentro da pasta `css/` foram adicionados ao Git. Mas
se no meu projeto eu tiver muitos arquivos e diretórios, preciso adicionar um de
cada vez?
### Adicionando todos os arquivos de uma vez
Considerando que precisamos **fazer isso para todos**, podemos dizer para o Git
adicionar (àdd`) todos os arquivos modificados (`.`):
`git add .`
imagem indicando o que esse estado significa.
python
imagem:
imagem
## Adicionando uma imagem ao produto
Por fim, vou adicionar a imagem no produto e realizar o mesmo procedimento:
imagem
## Para saber mais
Além de um VCS, o Git também é conhecido como um SCM do inglês Source Code
Management ou gerenciamento de código fonte. Além dele, também existem algumas
alternativas com o mesmo objetivo:
- [**SVN**]
- [**Mercurial**]
- [**Perforce**]
Basicamente, essas ferramentas são capazes de aplicar todos os conceitos que vimos
durante o texto, porém, uma acaba tendo alguma vantagem em relação a outra, como
também, a adoção da comunidade de desenvolvedores.
> Legal, mas qual dessas ferramentas vale a pena eu aprender?
Uma das maneiras que podemos verificar, é justamente o quão usada é uma ferramenta
em relação a outra. Para isso, temos a possibilidade de visualizar a popularidade
de cada uma delas [**nessa pesquisa feita pela RhodeCode em 2016**].
Além dos tópicos que vimos anteriormente, um uso bem comum em ferramentas como o
Git é justamente manter a disponibilidade do nosso projeto de forma remota para
qualquer desenvolvedor que for participar do projeto.
Em outras palavras, deixar o nosso projeto em um **repositório online** como é o

caso do [**GitHub**], [**GitLab**] ou [**BitBucket**]. Então, se precisar baixar o
projeto ou pegar as últimas atualizações que foram feitas, basta apenas consultar
esses repositórios remotos!
A mudança é uma característica comum durante o desenvolvimento de um projeto e,

para lidarmos melhor com esse tipo de situação temos os VCS como é o caso do Git.
Esse é uma pequena parte do mundo de versionamento, ainda existem técnicas e

conhecimentos essenciais para usarmos essas ferramentas de maneira eficiente.
Se quiser aprender mais sobre versionamento, aqui na Alura temos um [curso de Git]
e na Casa do Código também temos um [livro sobre Git e Github].
Lá você verá tanto essa parte de versionamento do projeto como também técnicas mais
avançadas que podemos aplicar durante o desenvolvimento em time que é algo muito
comum no dia a dia.
imagem
Do que se trata a **User Experience (UX)** ?
## O que é UX?
Quando lançamos um aplicativo, um site, ou algo do tipo, nunca partimos do zero.
Afinal, se temos, por exemplo, um app de banco, que realiza diversas transações e
atividades muito importantes, faria sentido que o app fosse cheio de recursos
visuais decorativos que deixassem a navegação toda confusa?
Ou ainda, será que o usuário de um app desse tipo se sentiria confiante em realizar
ações tão importantes ali dentro, se nem conseguisse encontrar as páginas e campos
que precisa para concluir o que começou?
A user experience é a área que justamente pensa em todos esses processos, desde a
arquitetura da informação, o tipo de público que se pretende atingir, os recursos
de interface e interação que facilitarão a usabilidade e mesmo conseguir aplicar
todos esses conceitos de estratégia aliados aos interesses do cliente ou da marca.
**Pensar em user experience é passar por diversos processos**, construindo e

planejando a experiência do usuário até a validação e implementação de todas essas
ideias.
Ainda assim, em UX lidamos com **um processo contínuo de refatoração**, criando e

remodelando o que lançamos de acordo com a respostas dos testes com o usuário.
Isto significa que os processos em UX são diversos e cíclicos, exigindo

**expertises bastante distintas em cada etapa**.
> _"Tudo bem, mas que expertises são essas?"_
## O time de UX
É comum encontrarmos vagas de emprego por aí que exigem milhares de pré-requisitos

para o profissional de **UX**.
Geralmente essa pessoa precisa saber lidar com todo o planejamento estratégico,
além de ser designer e desenvolvedor também, que projeta e implementa o projeto,
realizando os testes e todo o acompanhamento do produto.
Mas, dificilmente alguém com uma sobrecarga tão grande de funções seria capaz de
realizar, em um período saudável de trabalho, todas essas funções com tanta
assertividade e qualidade.
Para isso, constroem-se times de pessoas experientes com os processos de UX, que
vão desde marketeiros, gerentes de produto, designers e programadores, incluindo ou
subtraindo algumas funções dependendo da demanda de cada projeto.
Quando dividimos os times dentro de expertises específicas, o trabalho fica muito

mais direcionado e completo. **Tiramos o melhor de cada processo com pessoas
especializadas naquela função.**
## O que todo o time de UX precisa
Entendemos que profissionais de diversas áreas participam de times de UX.
Vale lembrar também que a participação de **times interdisciplinares gera

brainstorming de ideias muito mais rico**.
Não é necessário que todos os profissionais sejam multi tarefas, capazes de

realizar com maestria todos os processos, mas é muito importante que um
profissional de UX consiga entender todas as etapas do projeto, alinhando suas
atividades com a do restante do time para criar um produto mais consistente.
Para entender um pouco mais de todos os processos, na **Alura** temos uma

[**formação de UX Designer**] explicando em mais detalhes toda essa parte. ;)
Vamos ensinar o nosso programa quais comentários são permitidos e quais não são.
Isto é, podemos dar para ele um monte de comentários dizendo quais são ofensivos ou
não. Com isso, quando um novo comentário aparecer, ele saberá como classificá-lo.
## Ensinando a máquina
Eu já tenho aqui no meu computador um arquivo **CSV** com vários comentários já

classificados para ensinarmos nosso algoritmo. Já que vamos utilizar esse arquivo,
precisamos abri-lo.
Uma maneira de abrirmos esse arquivo é utilizar a biblioteca [**Pandas**]. Essa é

uma biblioteca muito utilizada por pessoas que fazem análise de dados ou
aprendizado de máquinas, pois ela fornece uma série de funções e classes que nos
ajuda a manipular os dados.
Podemos instalar essa biblioteca com o comando `pip`:
python
Já temos o Pandas instalado no nosso computador. Vamos falar para o Python começar
a usá-lo no nosso código. Logo, falamos para o Python importá-lo (ìmport`). Pelo
fato do Pandas ser uma biblioteca muito utilizada, é quase que uma convenção
importá-lo como (às`) `pd`.
python
Vamos falar para o Pandas ler o nosso arquivo de comentários (`pd.read_csv()`) e

atribuí-los a uma variável:
python
Nesse arquivo CSV, temos os comentários e suas classificações. Para ensinar nosso
algoritmo, precisamos passar esses dados separadamente, isto é, precisamos dizer
para ele quais são os comentários e quais são suas classificações. Já que vamos
precisar desses valores, vamos atribuir cada um em uma variável:
python
Quando formos ensinar nosso algoritmo ele pegará cada texto e classificação e
aprenderá se aquele comentário é ofensivo ou não… Cada texto? O que torna um
comentário ofensivo é o comentário em si, isto é, o texto puro, ou as palavras
contidas nele?
Cada **palavra em um comentário tem um peso**, ou seja, não podemos olhar um

comentário como um todo, mas cada palavra que compõem este comentário. Logo, vamos
falar para o Python pegar essa nossa string (`str`) de comentários e separá-la
(`slipt()`):
python
Para ensinar nosso algoritmo, precisamos contar quantas vezes cada palavra apareceu
em um comentário. Isto é, do nosso conjunto de palavras, temos que contar quantas
vezes cada palavra aparece. Mas já temos esse conjunto de palavras?
O que temos até então são os textos dos comentários quebrados em palavras. Nós
podemos falar para o Python criar um conjunto (`set`) de `palavras` e para cada
palavra nos `textos_quebrados`, atualizar esse conjunto:
python
Um [**conjunto**]), ou um `set`, é uma estrutura de dados que guarda apenas uma

ocorrência de cada objeto, que no nosso caso é uma palavra. Ou seja, se tivermos
dez comentários com a palavra `legal`, no nosso conjunto, essa palavra aparecerá
somente uma vez.
Mas se nossa palavra só aparece uma vez em nosso conjunto, como vamos saber quantas
vezes ela apareceu?
Temos que contar quantas vezes cada palavra apareceu no texto, nós podemos criar
uma função para isso. Nossa função criará uma lista com o número de vezes que cada
palavra apareceu no comentário.
Para contar as palavras, precisamos saber qual é a palavra. Ou seja, podemos usar a
posição da nossa palavra no conjunto:
python
Quando executamos esse código, recebemos um erro:
imagem`. Mas teremos que fazer isso para cada palavra?
Nós podemos criar uma função que se encarrega dessa tarefa, porém, o Python nos
fornece muitas funções, inclusive uma que faz exatamente isso que estamos querendo.
Queremos criar um índice para as nossas palavras, uma maneira de fazer isso é
utilizando a função `range`. Com ela, conseguimos criar uma sequência de números,
por exemplo, podemos falar para a `range` criar um série de números baseada no
tamanho (`len`) do nosso conjunto de palavras:
python
Se nós imprimirmos essa variável, teremos o seguinte resultado:
imagem cada palavra com um número:
python
Com nossas palavras agrupadas com um número, nós podemos criar um tradutor, isto é,
um dicionário para cada (`for`) `palavra, indice` em nosso agrupamento
(`zip(palavras, indices)`):
python
Bacana! Agora cada palavra de nosso tradutor tem um índice, podemos finalmente
começar a escrever nossa função para contar as palavras.
## Vetorizando um texto
Nossa função terá que pegar todas as palavras do nosso tradutor e nos devolver uma
lista com a contagem de cada palavra naquele comentário. Para isso ela deve receber
um texto, ou seja, o comentário, e o nosso tradutor:
python
Nossa função precisa contar cada palavra que aparece no comentário, para isso,
podemos criar uma lista que tem o tamanho do nosso tradutor:
python
E, para cada palavra, checar se ela está no nosso tradutor, se sim, pegamos a
posição desta palavra e incrementamos o valor naquela posição do nosso vetor:
python
Já temos a função para vetorizar nossos textos. Agora podemos falar no nosso script
principal para vetorizar cada comentário, em nossos `comentarios_quebrados`
utilizando nosso tradutor:
python
Vetorizamos nosso texto, agora precisamos ensinar os algoritmos.
## Criando nossos modelos
Já temos nossos textos vetorizados, agora temos que treinar nosso algoritmo.
Existem vários algoritmos que podemos utilizar. Um algoritmo muito utilizado quando
queremos classificar algo é o [**Teorema de Bayes**]. Podemos utilizar o módulo
[**naive_bayes da biblioteca scikit-learn**].
python
A classe **MultinomialNB** é uma implementação do algoritmo de Bayes. Nós podemos

usar ela para treinar (`fit`) nosso modelo:
python
Legal, nosso modelo está treinado, agora já podemos falar para ele predizer
(`predict`) um comentário, basta separar cada palavra do texto e vetorizá-lo.
python
**O método `predict` nos devolve um array do Numpy com a nossa classificação.**
## Para saber mais
Classificar comentários é apenas uma tarefa que conseguimos realizar com

aprendizagem de máquina. Com um código parecido com o que realizamos, podemos
classificar se uma mensagem é spam ou não. Podemos verificar se o texto se trata de
um assunto financeiro ou não, entre várias outras possibilidades.
Esse nosso algoritmo já funciona muito bem, porém podemos melhorá-lo. Se dermos uma
olhada no nosso conjunto de `palavras` veremos algo como:
`{‘bom’, ‘Bom’, ‘carros’, ‘carro’, ...}`
`Bom` é `bom` são as mesmas palavras. A diferença é que uma está em caixa alta e a
outra não. Pelo fato do Python ser uma linguagem `case-sensitive`, ela diferencia
letras maiúsculas de minúsculas e isso pode afetar o modo que nosso algoritmo
classifica os dados.
Para resolver isso, podemos converter todas as letras para minúsculo no momento que
estamos quebrando os textos, por exemplo:
python
Se olharmos nosso conjunto de palavras agora, veremos que nosso conjunto só contém
uma palavra `bom`:
`{‘bom’, ‘carros’, ‘carro’, ...}`
Mas ainda temos algumas palavras no plural, como será que podemos resolver isso?
Nós podemos ir de palavra em palavra checando se ela é plural ou não, porém isso é
um pouco trabalhoso. Uma outra maneira é utilizar uma biblioteca para transformar
nossas palavras em uma só, isto é, extrair a raiz da palavra.
Uma biblioteca muito utilizada para isso é a [**NLTK**]. Essa biblioteca nos
permite manipular textos de várias formas. Podemos extrair a raiz das palavras,
retirar pontuações e até mesmo verificar e excluir termos comuns, como artigos e
preposições.
Ou seja, podemos melhorar muito nosso algoritmo retirando "sujeiras" que podem
atrapalhar nosso modelo na parte de aprendizagem e predição.
Aqui na **Alura**, temos uma [formação em Data Science]. Nela você aprenderá como
funciona algum dos algoritmos de classificação, como utilizar a biblioteca NLTK e
muiot mais.
imagem
Neste episódio do Alura Live, Gabs Ferreira recebeu Thuany Serpa, UX/UI designer na
Lambda3 pra falar um pouco desse assunto que vem cada vez mais ganhando espaço no
mercado de trabalho geral e para desvendarem um pouco dessas dúvidas entorno desse
tema.
https://www.youtube.com/embed/InGacP20a14?rel=0
Ficou interessado em saber mais? [Assista a live completa!]
- Links comentados no vídeo: [Google Design.] [Mergo UX. ] [UX.blog.] [Livro UX

Design]: Introdução e boas práticas em UX Design. [UX Design CC.]
- Cursos de UX da Alura: [UX:] do briefing ao protótipo. [UX mitos:] os erros

frequentes de usabilidade e as boas práticas. [UX Produto:] monitore, mensure e
teste o seu projeto.
- Pensar designer é pensar soluções que facilitam a sua vida e a do usuário, então
que tal investir em uma: [**Formação UX Designer.**]
Siga a gente no Twitter: [Gabriel Ferreira], [Thuany Serpa] e a [Alurinha]! ;)
Quem começa na área criativa de **design gráfico** sempre se pergunta: primeiro

**digital**? Ou é melhor aprender design para **impressos** antes?
A **carreira** de design ajuda todos nós a entender um produto da maneira que ele
foi concebido, e para ajudar aqueles que querem começar na área, ou curiosos de
outras áreas, criamos um guia de 3 passos.
## 1. Design e Gestalt
Para entender o que pode ser um bom ou um mal design dentro de um contexto
precisamos aprender como o ser humano reage a aquilo que ele vê. A base para se
tornar [**um designer começa no curso de Design e Gestalt**], onde profissionais
criativos e interessados em comunicação visual compreenderão na prática a Teoria da
Psicologia de Percepção das Formas, afim de adquirir a convicção de realizar bons
trabalhos e avaliar materiais.
## 2. Os caminhos se partem
Com a base de como o ser humano reage às informações visuais, você pode escolher
qual tipo de trabalho deseja realizar. Ao escolher uma área que deseja seguir, é
mais fácil conseguir seu primeiro trabalho criativo, seja freelancer, estagiário ou
designer júnior em uma empresa, oportunidades de trabalho que existem em abundância
no mercado.
imagem não têm essa verba. A internet possibilita divulgar produtos e serviços por
valores menores, direcionados a regiões e públicos-alvo específicos. É possível
anunciar em quase todas as partes da internet: dentro dos sites, nas pesquisas do
Google, no Facebook, por e-mail, etc.
Um **designer** que trabalha com a criação de peças publicitárias na internet

desenvolve banners estáticos e animados, imagens para conteúdo de redes sociais,
diversas imagens para anúncios e arte de e-mail marketing / newsletter. Muitas
vezes esse profissional acompanha de perto os resultados das campanhas e participa
das melhorias com idéias em reuniões, o que o torna mais próximo do **Marketing**.
### UX Design
[**UX Design com Axure: protótipo para App mobile**]
[**UX Writing**]
O design da experiência do usuário é uma área que ganhou muita visibilidade nos
últimos tempos. As empresas cada vez mais reparam que é importante cuidar da
qualidade da interação do usuário com seus produtos e serviços. O profissional de
usabilidade cuida menos de questões artísticas da interface, sua atenção está
voltada para o bom desempenho do usuário nas ações que deve tomar.
O UX designer deve imaginar caminhos, ações, questões de acessibilidade, tamanhos

adequados para botões, textos com linguagem adequada para o seu público alvo e, o
mais importante, trocar e alinhar informações com toda a equipe.
### Vídeo e animação
[**Introdução ao After Effects**]
[**Screenflow: Crie seus screencasts e vídeos**]
O design audiovisual é, sem dúvida, uma das formais mais completas que existe para
comunicarmos algo. Hoje em dia não temos apenas as demandas das emissoras de
televisão, temos telas em toda parte, até em nosso bolso. Para tudo que envolve
comunicação hoje em dia o audiovisual é útil: publicidade, entretenimento,
informação, arte, educação, etc. É importante que o profissional de motion
design entenda como produzir , editar e finalizar filmes, mas também saiba realizar
animações diversas.
### Webdesign
[**Photoshop para Web I: Desenhando suas páginas**]
[**Photoshop para Web II: Layouts avançados**]
[**Illustrator: Crie layouts fantásticos para a Web**]
[**HTML5 e CSS3 I: Suas primeiras páginas da Web**]
Esta é a área que faz fronteira com a programação **Front-end**: o webdesigner cria
layouts adequados e o Front-end traduz a informação visual para a linguagem da
internet. Aqui o importante é saber realizar boas composições, tornar a interação
do usuário agradável e otimizar as imagens para que tenham qualidade e,
principalmente, sejam leves.
Uma boa experiência na web está diretamente associada ao tempo gasto para realizar
determinadas ações, à familiaridade do usuário com a página e, logicamente, à uma
boa sensação **visual**. Como em qualquer outra área, não podemos nos restringir ao
que já aprendemos, o aprimoramento desta área se dá com o aprendizado de Front-end.
HTML e CSS são conhecimentos importantes para que o webdesigner converse com os
desenvolvedores e crie trabalhos de implementação viável.
## 3 Seu portfólio
[**Wordpress: primeiros passos**]
Diferente da maioria das carreiras, no Design é necessário que você mostre o que

sabe fazer, afinal seu trabalho é, na maior parte, visual. Você precisa mostrar o
que já produziu, mesmo que sejam apenas peças acadêmicas ou pessoais. As empresas
sempre solicitam portfólio, antes mesmo da entrevista. O Wordpress é um sistema
prático para divulgar seu trabalho na internet e atualizar seu conteúdo é ideal
para divulgar os seus projetos caso você não seja o "ás" do front-end, mas não
dispense uma boa apresentação.
E se você não precisa esperar, reúna seu projetos e monte já seu **portfólio**.
Um primeiro ponto mais importante do que aprender a linguagem é **entender

lógica**. É entender como podemos modelar os nossos problemas de uma maneira
lógica.
https://www.youtube.com/watch?v=uXHRqIrZ3Y8
Tudo bom, Henrique? Esta é uma pergunta bem válida: vale mais a pena aprender logo
de cara duas linguagens ao mesmo tempo ou me aprofundar em apenas uma e só depois
começar uma segunda?
No final das contas é **definir algoritmos**. Isto pensando em uma linguagem para,
aí sim, estarmos prontos para ir para uma próxima.
Se vou, por exemplo, contratar uma pessoa, tendo conhecimento básico ou avançado,
mais importante que o domínio de uma linguagem, é a pessoa ser capaz de entender
aquilo que estou passando para ela e traduzir para uma linguagem.
Tendo isso em vista e voltando para sua pergunta, eu focaria primeiro em uma
linguagem, ser capaz de responder diversos tipos de problemas em uma para passar
para a próxima.
Quando estamos nessa transição, percebemos algumas características que mudam na

maneira de modelarmos o algoritmo ou uma solução. Um ìf` ou um èlse` podem ser
muito parecidos de uma linguagem para outra, mas as soluções podem ser
completamente diferentes.
Se não temos bem claro em nossa cabeça como resolver um problema em uma linguagem,
teremos mais um problema se tentarmos com outra linguagem. Vence uma barreira por
vez.
Isso não significa que você deva esperar 5 anos para começar a aprender uma segunda
linguagem, até porque a maior parte das aplicações do mundo tem alguma conexão com
a Web. Ou seja, se faz necessário saber uma linguagem _back end_ e outra _front
end_, como Java e Javascript respectivamente.
Perceba que esta já é uma oportunidade de modelar problemas em linguagens

diferentes, como _queries_ em SQL e HQL, por exemplo. Ou ainda surgirão problemas
como analisar, filtrar, selecionar, somar, agrupar elementos em Java e, ao mesmo
tempo, pegar esses elementos da minha página e fazê-los interagirem com o usuário
em Javascript.
Perceba que já existirão diversos desafios. Por que, então, eu iria querer aprender
alguma outra linguagem _back end_ nesse instante? Repare que no primeiro ano de
aprendizado, por exemplo, se estou no mercado Web, já tenho, no mínimo, 3
linguagens para aprender:
- Uma para o _Back End_

- Uma de _Query_ para o banco de dados
- Uma para o _Front End_
Pra que aprender mais uma? Nos primeiros seis meses, se você se dedicar muito para
aprender uma linguagem, mas muito mesmo, tudo bem. Talvez valha a pena aprender
mais uma.
Veja que se em um ano você aprender bem essas três linguagens você estará na frente
de muita, mas muita gente mesmo. Isso acontece porque não é costume nos dedicarmos
tanto assim no primeiro ano.
Então minha sugestão é essa: em vez de aprender Java e C#, ou Java e Ruby, etc ao
mesmo tempo, escolha uma para o _back end_, uma para o _front_ e uma para o banco
de dados e se dedique a essas três. Você irá perceber o quão melhor você vai ser
depois de seis meses ou um ano.
**No fim das contas, minha sugestão ficou em você aprender três linguagens que
sigam esta ideia: uma para cada parte dos processos. Quando se sentir confortável,
passe para a próxima linguagem. Até lá, aprofunde-se!**
A Alura já conta com mais de 180 cursos de programação, design e tecnologia. Toda
semana novos cursos são criados ou atualizados na plataforma: foram mais de 80
cursos durante esse ano... 19 cursos só nesse mês de Dezembro!
### Cursos com 100% de recomendação
[Além dos cursos mais concluídos de 2015], sabemos também os cursos mais
recomendados pelos alunos, de acordo com a nota de sua avaliação final. A própria
página do curso mostra essa porcentagem, junto como a quantidade de inscritos:
imagem curso(s) anterior(es): nesse caso [Java I: Primeiros Passos].
![Screen Shot 2015-12-28 at 17.07.27]
A experiência do usuário não pode e nem deve ser avaliada apenas desse ponto de
vista.
Existe um viés de confirmação implícito que sugere que UX Design é pensada apenas
para soluções de tecnologia. Isso confunde as pessoas que estão entrando agora na
área ou mesmo as que já estão, mas que ainda não refletiram com profundidade sobre
o que experiência significa.
[**No curso de Design Thinking da Caelum**] ministrada pela [Carla de Bona], ela
mostrou um exemplo do quão abrangente pode ser uma solução pensada na experiência
das pessoas. O Exemplo usa a tecnologia como suporte, não como alvo.
O exemplo apresentado pela Carla é de surpreender. A solução usa a capacidade da

tecnologia de [**Realidade Virtual**] ou VR para transformar o processo de
vacinação de crianças em algo divertido.
Para quem estiver curioso sobre a solução, há um vídeo de apresentação da mesma no

YouTube
https://www.youtube.com/watch?v=VgCPMkNlkSI
É em exemplos como esse que vidas são transformadas pelas soluções de UX que contam
com o apoio da tecnologia.
[**Don Norman**], uma excelente referência de usabilidade descreve UX como a

experiência que temos do mundo, da vida, do serviço. É relativo a tudo que nos
rodeia.
https://www.youtube.com/watch?v=9BdtGjoIN4E
*Don Norman: The term UX.*
Quando nos desapegamos do enviesamento comum de pensar em sites e aplicativos

revolucionários, podemos pensar em soluções de impacto que podem ou não serem
tecnológicas, mas que com certeza podem tornar a vida das pessoas mais agradáveis.
E você? Como tem observado o mundo ao seu redor e como essa observação tem levado
seus pensamos a iniciarem com frases do tipo: “Se … fosse da seguinte forma, … ,
seria muito melhor”.
Em suma, a direção é essa. Não se trata de tecnologia de forma isolada. É sobre

pessoas, sobre suas dores e insatisfação. A solução pode ser um aplicativo ou site?
Sim, mas também pode ser simplesmente como falamos com as pessoas.
Fica a reflexão. :)
Num ambiente competitivo uma marca é capaz de se destacar através de um design de

qualidade e a inovação pode trazer singularidade para um projeto. Um dos passos
mais importantes é a escolha das fontes tipográficas.
O avanço tecnológico vem possibilitando o surgimento de fontes tipográficas de alta

qualidade e fazendo com que os designers saiam da zona de conforto do uso das
fontes clássicas.
**Explorar a variedade que cresce cada vez mais pode proporcionar encontros bem
sucedidos**, resultando em peças de design interessantes e com personalidade. As
tipografias clássicas sempre serão boas opções, mas vale a pena compreender o
porquê das mudanças que vêm acontecendo no Design Gráfico a fim de explorar os
novos recursos e ampliar seu repertório tipográfico.
## Os novos tempos para a Tipografia
Você provavelmente já ouviu falar na icônica fonte *Helvetica* se não ouviu falar
com certeza já viu ela por aí, seja em logotipos de grandes corporações, como Jeep,
Panasonic, American Airlines, 3M, entre outras, ou até nos seus dispositivos iOS do
passado. Ela foi projetada em 1957 visando a criação de uma tipografia neutra e
clara.
imagem
*Famoso estilo de camisa estampada com a Helvetica.*
Depois de um longuíssimo relacionamento com as grandes marcas, **a Helvetica, assim

como outras fontes muito difundidas no passado, começa a sair de cena para dar
lugar à novas fontes tipográficas.** A Apple percebeu que a fonte não adequa-se tão
bem aos novos suportes digitais e por isso, encomendou uma fonte exclusiva para
substituí-la.
Desenvolvida pela própria empresa com o nome que homenageia a sua cidade natal, a
fonte San Francisco, implementada em 2015, apresenta um design sem serifas, limpo e
compacto que possui uma ótima leitura até nos menores dispositivos, como o Apple
Watch.
imagem
*A família tipográfica San Francisco completa.*
imagem
*Apple Watch com a nova tipografia aplicada.*

A Apple, apesar de ser uma grande referência em Design, não foi pioneira na criação
de sua própria tipografia: a Google já utiliza a sua família tipográfica Roboto
desde 2011. Desenvolvida inicialmente para o Android, a fonte hoje ocupa todas as
plataformas Google.
imagem
*A família tipográfica Roboto completa.*
Outras grandes empresas, como a IBM, a CNN e a Coca-Cola, também passaram a

utilizar recentemente tipografias feitas sob medida para si. **Seja por
necessidades técnicas ou para ampliar o alcance de marcas, é notável que novas
tipografias vêm surgindo e mostrando-se muito eficientes para tomar o lugar de
outras que já fizeram a sua história.**
<iframe src="https://player.vimeo.com/video/164342604" width="640" height="360"

frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>
<p><a href="https://vimeo.com/164342604">CNN Sans</a> from <a
href="https://vimeo.com/cnncreativemktg">CNN Creative Mktg</a> on <a
href="https://vimeo.com">Vimeo</a>.</p>
*Apresentação da nova fonte utilizada pela CNN. O anúncio demonstra como a questão
tipográfica transborda do Design para o Marketing.*
## Explorando os novos recursos

A Helvetica não é a única a ficar para trás nos tempos atuais. Durante um longo
período **os designers não saíam da zona de conforto** que fontes como a Futura,
Gotham e Frutiger proporcionavam pelo seu bom funcionamento e legado.
O limite do uso de qualquer tipografia, sejam elas clássicas ou atuais, é a

**coerência** com o projeto que se está desenvolvendo:
O tipo é uma imagem e uma imagem sempre terá **significados intrínsecos**, sejam
eles sutis ou mais efusivos. O designer deve sempre questionar se o significado
desta imagem **condiz com o conceito do projeto que está desenvolvendo**.
Existem fontes adequadas para **telas** por permitirem, a partir de sua forma, uma
leitura mais clara em um ambiente display. Existem fontes adequadas para
**impressos**, que podem funcionar para textos de grande volume, como corpo de
texto em livros por exemplo, ou não, apenas para títulos.
É importante conhecer as diferentes características que determinaram se a fonte é

adequada para display ou para impressos. O mais importante é testá-las e avaliar se
a tipografia escolhida possui **boa leitura** no suporte em que ficará situada.
O livro **Pensar com Tipos**, da autora **Ellen Lupton**, é um ótimo guia para
decisões tipográficas. Lá é possível conhecer a **História da Tipografia** e ter
informações profundas sobre a destinação dos mais diferentes tipos de fontes.
## Baixando fontes
Para auxiliá-lo na busca e download de boas fontes tipográficas diante da vastidão
de opções que existem por aí, indicamos o [**Google Fonts**].
As vantagem de utilizar o Google Fonts começam no fato do usuário ter a garantia de

que todas as fontes ali disponíveis funcionam - diferente do que pode acontecer em
outros sites onde é comum baixar-se fontes com problemas.
O Google Fonts oferece um visual limpo, o que traz mais foco para o assunto
principal: as fontes oferecidas. Sua navegação é bastante intuitiva e é possível
testar várias tipografias sem precisar mudar de tela para isso.
imagem
*Página inicial do Google Fonts com testes de fontes tipográficas.*
O Google Fonts está alinhado com as tendências tipográficas mais atuais e traz
opções de ótima qualidade para os mais diferentes projetos.
Preparamos também um pacote de fontes para download com excelentes fontes, algumas
gratuitas e outras pagas, em versão trial, para os mais diferentes projetos. É
importante saber muitas fontes de qualidade não são gratuitas, mas que valem muito
a pena por ser um investimento importante para quem deseja trabalhar como designer.
> **OBS importante:** Sempre que desejar utilizar uma fonte em trabalhos comerciais
pesquise quais são os limites dos seus direitos de uso.
imagem
[**Clique aqui para baixar!**]
A [**Alura**](www.alura.com.br) oferece ótimos cursos para quem deseja aprimorar

seus conhecimentos em Tipografia:
- [**Tipografia: Conhecendo o que há por trás dos tipos**]

- [**Tipografía para web: trabalhe com fontes para compor páginas**]
Além disso selecionamos sites que tratam do tema Tipografia e que valem muito a
pena acessar tanto para **buscar referências** quanto para **imergir nesse
universo**:
- [We Love Typography]

- [fridayfonts]
- [Daily Type]
- [typegoodness]
- [Typographica]
- [Typography Daily]
- [Type Theory]
- [Type for you.]
imagem
Quando vamos acessar um sistema web, é bem comum passar por uma tela de login, na
qual colocamos nossas credenciais para ter acesso ao sistema.
Essas informações devem ser sigilosas, porém, quando fui tentar logar em uma
aplicação web que estou desenvolvendo, tive o seguinte resultado:
imagem foram passados pela URI, o que não é muito seguro não é? Geralmente quando
fazemos login em alguns sites isso não acontece, pelo menos na maioria deles.
Essas informações na URL ficam expostas, não apenas caso alguém esteja perto e veja
o que você digitou. Mas também quando essas informações trafegam na internet. O que
é uma vulnerabilidade na segurança.
O que define o local onde os parâmetros são passados é o [**protocolo de
comunicação**] da web, o HTTP.
## Conhecendo o HTTP
O **HTTP** é o protocolo responsável pela comunicação de sites na web. Quando

acessamos um site, é esse protocolo que utilizamos. Esse protocolo possui alguns
métodos, ou, como também são chamados, verbos.
Os verbos HTTP definem qual ação deve ser realizada e, dependendo do verbo, o
servidor pode dar uma resposta diferente.
## Conhecendo os verbos
Um dos verbos mais comuns do HTTP é o **`GET`**. Quando utilizamos o `GET`, os

parâmetros são passados no cabeçalho da requisição. Por isso, podem ser vistos pela
URI, como no caso do nosso formulário de login.
Esse verbo é o padrão para enviar dados quando submetemos um formulário HTTP. Por
isso no exemplo acima, foi utilizado o GET. Contudo, conseguimos alterar esse
comportamento dizendo para o formulário qual do método (`method`) ele deve usar.
No caso de formulários web, é muito comum que esse método seja o **`POST`**:
html
O `POST`, ao contrário do `GET`, envia os parâmetros no corpo da requisição HTTP.

Escondendo eles da URI:
![]
Então isso significa que se utilizarmos o `POST` protegemos os dados submetidos

pelo formulário, já que eles não aparecem na URI?
Não exatamente. A única coisa que o `POST` faz é enviar os parâmetros no corpo da
requisição. Se inspecionarmos a requisição, conseguimos acesso a eles:
![]
Se quisermos proteger, de fato, nossa aplicação, precisamos utilizar a ["versão

segura" do HTTP, o HTTPS]. Com ela, conseguimos criptografar os dados enviados.
Ambos os verbos são muito utilizado em formulários na web e possuem algumas outras
diferenças entre si.
Como o `GET` envia os dados no cabeçalho da requisição, ele tende a ser, não é uma
regra,um pouco mais performático que o `POST`.
Porém, por enviar os dados no cabeçalho da requisição, o `GET` tem um tamanho

máximo de dados que podem ser enviados, que no geral é de `255` caracteres. Com
`POST`, podemos enviar informações um pouco maiores, como imagens. Ou seja, se
tentarmos passar uma grande quantidade de informações via `GET`, algumas partes
podem ser perdidas no caminho.
Com isso você pode estar pensando que utilizar o `POST` é o melhor caminho já que
ele encapsula os dados no corpo da requisição e consegue transportar mais dados que
o `GET`, portanto, vamos utilizar o `POST` em todo lugar.
Porém, se existem dois verbos diferentes, é porque eles foram feitos para serem
utilizados em locais diferentes.
As requisições do tipo `GET` são recomendadas para obter dados de um determinado

recurso. Como em um formulário de busca ou em uma listagem de todos os produtos
cadastrados.
Já as requisições `POST` são mais utilizadas para para enviar informações para
serem processadas, como por exemplo, criar algum recurso, como um produto, ou um
cliente.
## Conhecendo outros verbos
Além do `GET` e do `POST`, existem outros verbos HTTP que podem ser utilizados. Por
exemplo, se quisermos deletar algum recurso, podemos utilizar o verbo `DELETE`.
Já se quisermos atualizar os dados, podemos utilizar o `PUT`, que substitui todas

as informações de um determinado recurso, por exemplo um produto. Ou então utilizar
o verbo `PATCH` que atualiza parcialmente os dados de um produto.
Todos esses verbos são muito utilizados no mundo web. Principalmente quando estamos
utilizando o [**modelo REST**].
Conhecer o protocolo HTTP e seus verbos é muito valioso para um desenvolvedor web.
Já que podemos construir aplicações melhores. Por isso, aqui na Alura temos um
[**curso sobre o protocolo HTTP**].
Nele você aprenderá como a web funciona, verá verbos como o GET e o POST, aprenderá
sobre o modelo REST e sobre o HTTP/2, a nova versão do protocolo.
**Role models** que podemos seguir e admirar. A área de tecnologia ainda é composta
por uma maioria de homens, e as mulheres podem e devem ter mais reconhecimento e
representatividade.
Repare que alguns momentos históricos na computação foram protagonizados por

mulheres e esperamos que essas histórias inspirem vocês, assim como nos inspiram
constantemente:
imagem] que foi lançado recentemente nos cinemas.
* * *
imagem foi Ph.D. em Matemática, analista de sistemas da Marinha dos Estados Unidos
nas décadas de 1940 e 1950 e almirante.
Foi ela quem criou a linguagem de programação [Flow-Matic] (hoje extinta) que
serviu como base para a criação da linguagem COBOL (Common Business Oriented
Language) devido a necessidade de criar uma linguagem orientada para negócios
comuns. Pois é! Essa linguagem que domina muitas áreas dos grandes bancos tem uma
mulher com papel de protagonista.
No começo dos anos 1950 ela desenvolveu um compilador operacional, naquela época
acreditava-se que computadores só podiam realizar operações aritméticas. Depois
como diretora de programação automática, seu departamento divulgou algumas das
primeiras linguagens de programação baseadas em compilador. Isso mesmo: considerada
uma das mães dos compiladores.
* * *
imagem é uma cientista da computação que formou-se, com honras, na Universidade de

Stanford, com mestrado e doutorado em Ciências da Computação. Seu trabalho na área
acadêmica resultou em várias patentes na área de inteligência artificial.
Entrou no Google em 1999 como funcionária nº20 e sendo a primeira mulher

engenheira. No Google teve cargos chave nos principais serviços da compania, com
destaque no time de Google AdWords, que é o coração financeiro da empresa, e por
fim vice-presidente de serviços geográficos e locais.
**Hoje é CEO e faz parte da diretoria do Yahoo! onde promoveu mudanças radicais em
vários produtos e na compania, como a melhoria política de maternidade, e compra de
diversas empresas como o Tumblr.**
Foi diversas vezes presente em ranking de mulheres de negócios mais poderosas do

mundo. Mesmo com o Yahoo! estando numa situação complicada entre os gigantes de
tecnologia, Marissa é referência mundial em liderança e tecnologia.
* * *
imagem, foi uma matemática e escritora inglesa. Ela foi a primeira a reconhecer que
máquinas poderiam ter aplicações além de puro calculos e criou primeiro algoritmo
para ser processado por uma máquina, a [máquina analítica] de [Charles Babbage].
Durante o período em que esteve envolvida com o projeto de Babbage, ela desenvolveu
os algoritmos que permitiriam a máquina computar os valores de funções matemáticas,
além de publicar uma coleção de notas sobre a máquina analítica.
Por esse trabalho é considerada a **primeira programadora de computadores** de toda

a história. Vale lembrar que ela escreveu o programa em um papel, com as instruções
de como programar a máquina analítica, que nunca chegou a ser construída em seu
tempo de vida. A Ada é até mesmo uma referência da cultura pop.
* * *
imagem (Paoli, 1936) é matemática, cientista da computação, engenheira de software

e empresária.
Foi diretora da Divisão de Software no Laboratório de Instrumentação do MIT, que

desenvolveu o programa de voo usado no projeto Apollo 11, software que impediu que
o pouso na Lua fosse abortado por falha humana. Você entendeu bem: sem o programa
que ela escreveu, nada de "pequeno passo para o homem, grande passo para a
humanidade". Foi um grande passo para as mulheres também.
Em 1986 ela fundou sua própria empresa, a Hamilton Technologies Inc com sede em
Cambridge. Onde desenvolveu seu paradigma para Sistemas e Design de Software, o
[Development Before the Fact].
Além de ser creditada por ter criado o termo "engenharia de software", foi uma das
desenvolvedoras dos conceitos de computação paralela, priority scheduling, teste de
sistema, e capacidade de decisão com integração humana, tais como mostradores de
prioridade que viriam a ser o fundamento do design de software ultra confiável.
Foi premiada com a Medalha Presidencial da Liberdade pelo presidente dos EUA Barack
Obama, maior honra a um civil daquele país.
## Ficamos por aqui?

Não! Isto é um pequeno passo perto do muito que ainda precisa ser feito para
aumentarmos a participação de mais mulheres na área de tecnologia, e também para
manter as que estão,através reconhecimento de seu trabalho e respeito.
Tecnologia é um campo fascinante, e realmente queremos trazer mais mulheres para

trabalharem com a gente: temos muitas vagas, é desafiador e possibilita que você
use suas capacidades criativas, não só técnicas.
**Vem trabalhar com tecnologia! Tire dúvidas comigo e com outras mulheres da
área.... computação é sim para você também!**
Nesse mês de março todas pessoas que assinarem Alura irão ganhar stickers bacanas,
sendo 5 deles com essas 5 mulheres incríveis e uma carta de nossas desenvolvedoras
reforçando a importância da participação das mulheres no campo de tecnologia.
Aproveite também e conheça um pouco mais das mulheres na tecnologia nesse

[**podcast**] do Hipsters Ponto Tech.
imagem
No dia a dia profissional lidamos com diversos desafios relacionados à profissão

que escolhemos, porém existem algumas situações que acontecem de maneira muito
semelhante com pessoas dos mais diversos cargos e áreas de atuação.
Um exemplo comum que faz parte do cotidiano de todo profissional é lidar com
pessoas. Seja por meio de atendimento ao cliente, reuniões ou até mesmo a
convivência no escritório, o tempo todo lidamos com pessoas que possuem jeitos,
opiniões e experiências de vida diferentes.
Uma outra situação que ocorre tem a ver com produtividade. No ambiente de trabalho,
é comum encontrarmos pessoas reclamando sobre não se sentirem produtivas, ou
dizendo que estão com muitas tarefas e não sabem nem por onde começar.
## Lidando com essas situações
Nessas e em muitas outras circunstâncias precisamos ter empatia, foco, uma boa
comunicação, senso de liderança e diversas outras habilidades que são conhecidas
como **Soft Skills**.
As _Soft Skills_ tratam de habilidades ligadas à interação e relação com as pessoas

e também se estendem a aptidões como foco e produtividade. Isto é: são competências
importantíssimas para quem deseja se desenvolver profissionalmente e até mesmo
levar alguns aprendizados para a vida pessoal.
Comunicar-se bem, lidar com opiniões divergentes, manter o foco, conseguir se

organizar e desenvolver liderança são habilidades que elevarão sua carreira,
melhorando seu dia a dia profissional.
## Desenvolvendo as Soft Skills
Para alcançar bons resultados é preciso dedicação. _Soft Skills_, assim como todos
os outros tipos de habilidades, exigem estudos e treinos diários para que o
aprendizado seja colocado em prática.
Então, se você se interessou sobre o assunto e quer obter essas aptidões, aqui na
Alura possuímos [**uma série de cursos de Soft Skills**] que vão aprimorar sua
carreira!
Durante o meu treinamento para certificação da Oracle surgiu o seguinte problema:
Imagine que temos a classe telefone:
java
Ótimo, agora vou cadastrar um telefone de São Paulo (SP):
java
vou adicionar mais 2 telefones, um de Salvador(BA) e outro de Refice(PE):
java
Ué, o telefone de Recife não compila? Como assim? Deixa eu imprimir o telSP e o
telBA:
java
Resultado:
```
> (9) 33229000 (57) 55339000
```
9? 57? Como assim?! Que estranho. A variável do tipo ìnt`, além de receber
inteiros, aceita números octais, hexadecimais e até mesmo binários!
Nesse caso, quando utilizamos o 0 na frente do número, indicamos que estamos

lidando com números na base 8, ou seja: estrutura de números entre 1, 2, 3, 4, 5, 6
e 7, por isso os valores foram 9 e 57. Isso também explica o motivo de não compilar
o código de Recife(081), já que em octal, não existe o número 8 ou 9. Então se
tentarmos compilar um telefone de Campinas(SP):
java
Não compila também! Para resolver esse caso, bastaria retirar o 0 em cada um dos
ddds:
java
```
> (11) 33229000 (71) 55339000 (81) 22669000
```
Agora o meu sistema cadastra os telefones conforme o esperado!
Vimos que nem sempre os valores que esperamos dar certo funcionam e por isso é
importante compreender todas as restrições que as nossas variáveis possuem. Ficou
curioso a respeito de outros valores interessantes que a variável int e as demais
podem receber? Dê uma olhada nos [**nossos cursos da formação Java.**]
Estou programando um sistema de agenda de contatos telefônicos em **Python**. Para

isso, preciso armazenar os números dos contatos. A princípio, podemos pensar em
usar uma lista:
python
Tudo bem, temos os números de telefone armazenados. Mas… qual o sentido de termos
uma lista de números soltos? De quem é o número que está na segunda posição?
Precisamos, de algum modo, conectar os telefones a seus respectivos contatos. Já

conhecemos um tipo que pode nos ajudar com isso **[a tupla]**:
python
Para não precisarmos de uma variável para cada contato, podemos colocá-los direto
em uma lista de contatos:
python
Ok! Se quisermos acessar o número de telefone da Marina, podemos fazer:
python
E o resultado:
```
8877-7788
```
Conseguimos! Agora, o número do Pedro: … Mas espera, qual é mesmo a posição do

Pedro na nossa lista de contatos?
Repare que do modo como está, mal faz diferença ter os nomes dos contatos salvos,
porque só conseguimos acessar cada contato pela sua posição na lista. Será que não
há um jeito melhor?
## Mapeando contatos com um dicionário
Até agora temos uma lista de contatos em que, ao menos, cada contato tem seu nome e
telefone conectados. Entretanto, por enquanto, só conseguimos acessar um contato
individualmente pela sua posição na lista, e não pelo seu próprio nome.
O ideal seria mapear o nome de cada contato com seu telefone, evitando outros
problemas.
Por exemplo, podemos falar que o contato `Yan` tem o número de telefone `1234-
5678`. Assim, quando quisermos saber qual o n de telefone do Yan, basta ir até o
seu nome. Dessa forma, não precisamos decorar qual a posição na lista que o
telefone se encontra, basta sabermos seu nome de contato.
Veja que, nesse caso, estamos criando uma espécie de dicionário, parecido com os
dicionários de língua portuguesa, ou inglesa. Nesses dicionários, temos uma chave
que é a palavra que estamos a buscar, que no nosso caso é o nome de contato.
Quando achamos essa palavra, podemos ver o seu significado, isto é, o valor daquela
palavra na língua, que no nosso caso, é o número de telefone.
Esse tipo de estrutura é muito utilizado em diversas linguagens de programação (mas

normalmente tem outro nome, como **[array associativo]**. Com ela, conseguimos ter
um comportamento parecido com o de dicionários.
Bem, vamos falar para o Python criar um desses dicionários para a gente. No Python,
usamos **chaves** (`{}`) para construir nossos dicionários. Neste caso, falamos
para o Python, que a chave `'Yan'` possuí (`:`) o valor `1234-5678` como seu
telefone:
python
E olha o tipo da variável `contatos` que acabamos de criar:
python
**`dict`** - de fato um dicionário. Mas será que vamos ter que redigitar todos os
dados de contatos que já colocamos em nossa lista de contatos? Também podemos criar
um dicionário usando sua função construtora `dict()` e passando, como parâmetro,
uma lista de tuplas, como em nosso caso:
python
E agora:
python
Certo, temos nossa estrutura pronta! Mas espera aí, o nosso dicionário não está
ordenado em ordem alfabética, ele não tem ordem nenhuma… Como podemos acessar seus
itens?
## Acessando os itens de um dicionário
Podemos acessar os valores dele de forma similar a como acessamos os valores de uma
lista, por exemplo, com a diferença de que usamos as chaves que definimos no lugar
dos índices numéricos:
python
E o resultado:
Tudo bem! Até que, depois de um tempo, quis ver se eu encontrava o telefone de um
velho amigo João. Fiz o seguinte:
python
Mas olha o que apareceu na tela:
python
Hum… uma exceção de tipo **`KeyError`** indicando que a chave `'João'` não foi
encontrada. Mas é um pouco estranho imprimir toda essa mensagem para o usuário, não
é? Pode ser confuso... Será que não podemos substituir isso?
Os dicionários possuem um método específico para busca de valores, o `get()`, no
qual podemos passar como parâmetros a chave que queremos e um valor padrão para
retornar caso essa chave não seja encontrada:
python
E o resultado:
Muito melhor agora!
Também podemos verificar se um contato está em nosso dicionário através da palavra

chave **ìn`**:
python
E a resposta:
python
Como esperado!
Esses dias, achei um número solto aqui e quis verificar se ele estava em minha
agenda:
python
Dessa vez, olha o resultado:
python
Ué! Mas esse número está sim na agenda, é o número do Pedro! Por que será que o
resultado foi `False`, então?
Acontece que o ìn`, usado dessa forma, verifica apenas as **chaves** do

dicionário, não os valores. Para obtermos valores, podemos usar o método
**`values()`**:
python
E a resposta:
python
Agora sim! Temos nossa estrutura de mapeamento e já conseguimos visualizar os dados

dela. Mas e agora, o que mais conseguimos fazer?
## Adicionando valores ao dicionário
Encontrei meu amigo João e, finalmente, decidi adicionar o número dele na minha
agenda. Mas… como posso fazer isso com nosso dicionário de contatos? Fui tentar
usar um método **àppend()`**, como nas listas, e olha o que apareceu:
python
Esse método não existe… Ainda tentei criar um outro dicionário e fazer uma soma,
mas o resultado foi esse:
python
Também não funciona! A sintaxe de adicionar um item em um dicionário é um pouco

diferente de que em outros tipos do Python, mas também bastante objetiva. Por
exemplo, se queremos adicionar o João no nosso dicionário de contatos, basta
atribuir seu telefone na chave `'João'`:
python
Agora olha como está o dicionário:
python
Deu certo!
## Removendo itens do dicionário
Infelizmente, minha amiga Marina perdeu o celular e, consequentemente, não era mais
dona do número salvo em meu dicionário de contatos. Precisamos, agora, apagar o
item que corresponde a ela. Mas como?
Uma maneira simples é usando o **_statement_** `del`, dessa forma:
python
E agora, nosso dicionário:
python
Certo! Mas e se tentarmos remover um item que não existe?
python
Olha o que acontece:
python
Um `KeyError`, como aquele que obtivemos ao tentar pegar um item que não existia!
Para evitar essa exceção, também temos um método de dicionário que pode nos ajudar
- o **`pop()`**.
O método `pop()`, além de remover o elemento com a chave especificada do

dicionário, nos retorna o valor desse elemento. Também podemos definir um valor
padrão de retorno, para caso a chave não seja encontrada:
python
E o resultado:
python
Tudo certo, agora! Uma pena que tenho poucos contatos na agenda...
## Juntando dois dicionários
Pedi para meu amigo Pedro me ajudar a aumentar minha agenda, adicionando mais
alguns amigos como contatos. Ele me passou a agenda dele:
python
Mas e aí? Como adicionamos todos esses contatos em minha agenda? Podemos tentar
fazer um `loop` passando pelos contatos do Pedro e os adicionando um a um:
python
Agora vamos ver meu dicionário:
python
Certo, funcionou! Mas será que não tem um jeito mais simples de fazermos isso,
evitando o laço **`for`**?
Repare que queremos juntar nossos dois dicionários em um só - o primeiro. Queremos

atualizar o primeiro dicionário para que contenha também os valores do segundo.
Para isso, temos um método próprio - o **ùpdate()`**. Podemos substituir o loop
pela chamada do método:
python
E o resultado continua certo, com um código mais sucinto!
## O problema do prefixo `9` e compreensões de dicionário
Fui tentar ligar para meus amigos e em todas as minhas tentativas recebi a mensagem
de **número não existente**. Mas ué, por quê? Eu sei que os números estão corretos…
Pesquisei e descobri que os números de celular precisam ter o prefixo `9` hoje em
dia, e eu tinha esquecido de atualizar isso! Mas e agora? Será que vou precisar
usar o método ùpdate()` para mudar todos os valores? Não faz muito sentido…
O ideal seria ter uma lógica mais objetiva, que simplesmente copiasse todo o
dicionário de contatos, mas adicionasse um `9` a cada valor. A princípio, uma ideia
é fazer isso com um `for`, o que deve funcionar, mas será que não tem forma mais
simples?
Mais sintático e elegante que um loop `for` tradicional, entretanto, é o que

podemos fazer com o que já conhecemos da sintaxe de **[compreensão de lista]**, mas
dessa vez aplicado aos dicionários **compreensão de dicionário**. A ideia é a mesma
e a sintaxe parecida:
python
E o resultado:
python
Conseguimos! Agora já conseguimos manipular bem nossa agenda!
## Para saber mais
### Dicionários são mutáveis
Um detalhe que talvez você tenha percebido até aqui é que ao longo do post,
normalmente modificamos (seja adicionando, removendo, ou atualizando de fato) o
dicionário no próprio local, sem a necessidade de criar um outro objeto.
Isso se dá porque os dicionários, assim como as listas, são **mutáveis**. É

importante ter noção disso, para não nos atrapalharmos nas possíveis complicações
que a [diferença de mutabilidade] implica nos objetos no Python.
### _Views_ vs. listas
Usamos o método `values()` para verificar se o dicionário tinha um valor

específico, mas não chegamos a ver o que ele retorna. Vamos testar:
python
Aqui chegamos em um ponto interessante. Ao rodarmos esse código no **Python 2**,

olha o que aparece
python
Uma lista contendo os valores, certo. Agora, no interpretador do Python 3:
python
O resultado é parecido, mas de outro tipo **`dict_values`**. O que é isso? Essa

classe é o que chamamos de **_[view de dicionário]_**, que nada mais é que uma
janela para os valores do dicionário.
**_Views_** geralmente são vantajosos, comparados às listas, justamente porque são

apenas uma abertura, não uma estrutura em si. Assim, eles estão sempre atualizados:
python
No interpretador do Python 2:
python
A lista ficou como a anterior. Já no do Python 3:
python
A variável `valores` atualizou junto! Além dessa vantagem, também economizamos

memória com as _views_, já que elas sempre ocupam o mesmo espaço, como uma janela:
python
Com a lista no Python 2, o resultado:
Agora, com a _view_ no Python 3:
Bem menos!
## O tipo de mapeamento no Python
Tuplas e listas podem nos ajudar bastante a organizar nossos dados nos programas,
mas, às vezes, precisamos de um tipo mais direto e específico para mapeamento com
base em chave e valor.
Para essa necessidade, no Python temos o tipo **dicionário**, que é mutável e nos
provê diversos métodos para facilitar o manipulamento dos dados nessa estrutura.
Nesse post, aprendemos não só a criar um dicionário, mas a acessar itens dentro
dele, adicionar outros, remover, e até juntar um dicionário com outro. Outra
funcionalidade legal que pudemos explorar é a de compreensão de dicionário, que nos
permite uma criação de dicionário poderosa com sintaxe mais simples.
Gostou do conteúdo? Esse novo tipo pode te ajudar bastante como desenvolvedor
Python! Se quiser se aprofundar mais na linguagem, dê uma olhada na nossa formação
[**Python para web**] e continue estudando!
Se você esteve antenado durante esses dias, provavelmente soube da notícia do jovem
Bruno de Melo Silva Borges que [desapareceu no Acre]. Neste caso o jovem deixou
diversas mensagens criptografadas com símbolos, "textos" e objetos.
Entretanto, o diretor da Antecipe (startup de segurança da informação) Igor Rincon,

e o líder de desenvolvimento, Renoir dos Reis, ambos alunos da Alura criaram o site
[Decifre o livro] com o objetivo de descriptografar as mensagens codificadas pelo
rapaz desaparecido. Incrível, né? :)
Fizemos algumas perguntas sobre como tiveram a ideia de criar o site, como também,
como eles chegaram nesse resultado. Quer saber como foi? Então bora descobrir!
### Olhando apenas as imagens na TV, não havia dificuldade?
> _Sim, inclusive esse é o maior desafio da nossa [comunidade], o pessoal tenta
pegar os frames dos videos e melhorarem a qualidade._
Embora a ideia tenha partido deles, veja que temos também uma grande colaboração da
comunidade! Um trabalho e tanto! Mas por que será que eles criaram esse site? É
hora de entedermos seus motivos.
### Por que criaram o Decifre o livro?
> _Meu sócio Igor Rincon começou a traduzir um texto e logo eu fiquei bastante
intrigado com aquilo._ _Quando vi que começamos a formar um alfabeto me veio o
desafio de criar um teclado que transformava aqueles códigos em um texto legível
para humanos._ _Com isso poderíamos fazer com que a comunidade acelerasse o
processo de decodificação e trabalhasse apenas no que falta ao invés de cada um
tentar decifrar o que já foi decodificado._
Veja que, mesmo a troca dos caracteres parecer uma tarefa simples, eles tiveram que
implementar tudo isso. Como será que a implementação foi realizada? Vamos descobrir
o que está por de baixo dos panos!
### O que usaram no site do Decifre o livro?
> _Inicialmente utilizamos [bootstrap] cruzão com ecmascript 6, sempre tentando

aplicar o que eu aprendi nos curso de [Javascript avançado da Alura] (o qual eu
ainda não terminei), a grande sacada foi liberar o código para a comunidade, o que
fez com que o desenvolvimento fosse bem ágil e a melhoria do sistema foi
exponencial._
**Mas não podemos esquecer** que estamos em um **caso grave** que envolve o
desaparecimento de um jovem, portanto, esperamos que o Bruno seja encontrado o
quanto antes e sua família seja amparada.
Foi criado um App de previsão do tempo e o resultado ficou mais ou menos assim:
imagem.
E como será que ficaria aquele primeiro exemplo nesse novo contexto?
## De volta ao exemplo inicial
Se aplicarmos estes novos conceitos ao exemplo que citamos anteriormente, teríamos

algo assim:
![]
Perceba que agora, com um design limpo e alinhado com a proposta do App, criamos
uma experiência muito diferente da anterior.
A imagem no início remete ao tema do App, por exemplo, bem como as cores de
background para dia ensolarado e chuvoso, reforçando a ideia que queremos passar e
deixando o visual muito mais bonito.
A ideia aqui é deixar claro para o usuário que nós nos preocupamos com o nosso
produto, mas além disso, esperamos que esse produto se conecte bem com os
interesses dele e torne essa experiência mais interessante e prazerosa através de
um [**design consistente e atrativo**].
## Foco na experiência
Sabendo de todos estes conceitos, chegamos à conclusão de que UX envolve todo um

universo de possibilidades a serem consideradas além da usabilidade, se quisermos
construir uma experiência satisfatória ao usuário.
Se nos dedicarmos a preencher cada um dos níveis da pirâmide com qualidade, aliando
o conceito do negócio com as necessidades do usuário, teremos um produto
consistente e pronto para competir com a concorrência no mercado.
Existem outras coisas muito importantes de se considerar quando desenvolvemos um

produto pensando em UX. Confira o curso [**10 heurísticas de Nielsen**] da
**Alura** e entenda como evitar erros comuns de UX.
imagem
**HTTP** é um protocolo, uma forma de conversa entre duas máquinas, que permite
transferir hiper-texto de um lado a outro. Daí o nome Hyper Text Transport
Protcolo.
É o protocolo que te permite comprar passagens de avião pela internet, conversar

com amigos pelas redes sociais e assistir mandar videos de gatos para sua familia.
É o protocolo por trás da Web. Com ele, é possível que um estudante num café em São
Paulo leia um artigo sobre o império mongol que está armazenado em um servidor nos
Estados Unidos.
Entender bem o protocolo HTTP pode te ajudar a desenvolver melhores aplicações web
e a debugá-las quando as coisas derem errado. Para entender bem o HTTP, vale
entender **como o navegador web funciona**:
https://www.youtube.com/watch?v=kDy62zaCHZE
# Recursos, URLs e URIs
A parte que conhecemos melhor do protocolo HTTP é o endereço HTTP de um site. Por
exemplo, quando quero comprar pomada para o meu bigode, abro o navegador e digito,
por exemplo, _http://pomadasparabigode.com_. Meu navegador entende a sintaxe e faz
uma requisição para um servidor chamado _pomadasparabigode.com_.
O endereço _http://pomadasparabigode.com_ é o que chamamos de URL - **U**niform

**R**esource **L**ocator(localizador de recurso uniforme). Ela representa um
recurso específico na web. Recursos são coisas que eu quero interagir, como:
imagens, páginas, arquivos, e videos. Neste caso, o recurso é a página inicial do
site _pomadasparabigode.com_, normalmente um HTML.
Imagine a seguinte URL, que representa umaa fictícia Pomada do Bem:

_http://pomadasparabigode.com/produto/pomada-do-bem-10773_
Podemos quebrar ela em 3 partes:
- `http`, a parte antes de "://" é o que chamamos de **URL Scheme**_**(esquema da

URL). O esquema descreve **como** acessar um recurso em particular. Nesse caso,
estamos falando para o navegador usar o **Hypertext Transfer Protocol**, o HTTP.
Existem outros esquemas, tais como: https, TCP, FTP, maito. Tudo que vier depois de
"://" é específico do protocolo que estiver sendo utilizado.
- `pomadasparabigode.com` é o nome do **host**(servidor), que seria o nome do

computador que armazena nosso recurso. Nosso navegador vai realizar um processo
conhecido como DNS Lookup para traduzir _pomadasparabigode.com_ em um endereço de
rede. E vai enviar a requisição para esse endereço.
- `/produto/pomada-do-bem-10773` é o que chamamos de **URL Path** (caminho da URL).

O servidor irá identificar qual é o recurso especifico que deve devolver para este
caminho quando a requisição chegar. URLs podem apontar para arquivos físicos, como
por exemplo _http://pomadasparabigode.com/foto.jpg_ provavelmente para um arquivo
físico do servidor, uma foto em formato jpg. Já no caso da URL
http://pomadasparabigode.com/listar-pomadas provavelmente não aponta para um
arquivo físico diretamente.
Nesse caso, provavelmente o que vai acontecer é: uma aplicação desenvolvida em

alguma tecnologia como ASP.NET, PHP, Rails, Java irá tratar a requisição no
servidor, fará uma consulta em um banco de dados e o recurso que será devolvido vai
ser construído dinamicamente por esta aplicação.
# Números de porta
`http://pomadasparabigode.com:80/listar-pomadas`
Esse número `80` representa o número da porta que o servidor está usando para
"ouvir" requisições HTTP. 80 é a padrão e é opcional no caso do uso do endereço em
um navegador, então normalmente você não vê esse 80 nas URLs. É mais comum
especificarmos esta porta quando estamos testando a aplicação em ambiente de
homologação/testes. O `443` aparece para o `https`.
# Query strings
`http://pomadasparabigode.com/busca?nome=pomadalegal`
Tudo o que vem depois da `?` é o que chamamos de **query string**. Nesse caso `?
nome=pomadalegal`. Geralmente colocamos na query string informações que serão
interpretadas de alguma forma pela aplicação que é executada no servidor. Não
existe uma regra formal de como as query strings são montadas, mas a forma mais
comum de utilização é através de pares chave-valor, separados por `&`, como em `?
nome=pomadalegal&tipo=2&categoria=bigodesruivos`:
`http://pomadasparabigode.com/busca?
nome=pomadalegal&tipo=2&categoria=bigodesruivos`
# Fragmento
`http://pomadasparabigode.com/produto/pomada-especial#descricao`
Esse `#descricao` na URL não é interpretado pelo servidor, mas sim pelo navegador
do usuário. Depois de carregar o recurso que é especificado através dessa URL, o
navegador irá procurar um elemento com o id `descricao` na página e irá posicionar
a barra de rolagem a partir do início dele, ou seja, onde começa a descrição do
produto.
Resumidamente, uma url pode ser quebrada então no seguinte formato:
> \[**esquema**\]://\[**servidor**\]:\[**porta**\]/\[**caminho**\]?\
[**querystring**\]#\[**fragmento**\]
## Media Types
Um recurso pode ser várias coisas diferentes: imagens, arquivos HTML, XML, videos e
muitos mais. Pra que um servidor possa **servir** um recurso e para que o cliente
possa consumi-lo apropriadamente, as partes envolvidas(cliente e servidor) têm de
ser específicas e precisas quanto ao tipo do recurso. Afinal, não faz o menor
sentido que meu navegador tente renderizar como imagem um arquivo XML, certo?
Quando um servidor responde uma requisição HTTP, ele devolve o recurso e o seu tipo
- chamado de **Content-Type**(também conhecido como media type). Para especificar
tipos de recurso, o HTTP usa um outro protocolo(que inicialmente foi feito para
comunicação através de e-mail) chamado **MIME**: **M**ultipurpose **I**nternet
**M**ail **E**xtensions.
O `content-type tem` duas partes: tipo e subtipo. Por exemplo:, um servidor pode
devolver uma imagem no formato png. O content-type da resposta viria como
ìmage/png`. Se fosse um jpg, o content-type seria ìmage/jpg`. E se fosse um
arquivo html? `text/html`. E um json? `text/json`. O navegador olha o Media Type
para saber o que fazer com um arquivo.
## Content Type Negotiation
Como já falamos, um recurso pode ter diferentes representações. Vamos pegar como
exemplo a URL que representa o manual de como cuidar do seu bigode:
`http://pomadasparabigode.com/comocuidardoseubigode`
Este manual poderia, por exemplo, ter diferentes representações no site para
diferentes idiomas. Poderia até ser disponibilizado em diferentes formatos: _PDF,
DOC, html_. Neste caso, seria o **mesmo recurso**, mas em **formatos diferentes**.
Como o servidor vai saber em que formato deverá enviar o recurso? É aí que entra o
mecanismo de [Content Negotiation] especificado pelo protocolo HTTP: quando um
cliente faz uma requisição, ele pode especificar quais Media Types ele aceita.
Desta forma, aplicações diferentes podem solicitar o mesmo recurso - mas em
formatos diferentes. Se o servidor irá conseguir devolver o recurso naquele formato
já é outra conversa, que cabe a quem desenvolver o serviço que roda no servidor :)
## O processo Request-Response
Se você chega e me pergunta: _Qual a próxima turma de C# na escola Caelum?_
Para que eu possa responder essa pergunta corretamente, são necessárias algumas
coisas:
- eu preciso entender a sua pergunta. Se você me perguntar em um idioma que não

conheço, provavelmente não conseguirei te dar uma resposta;
- preciso de acesso a algum lugar que conste as próximas turmas da Caelum.
O HTTP funciona mais ou menos desta mesma forma: um cliente precisa de um recurso
que está em um outro computador. Então, o cliente você faz uma requisição
(**request**) para um servidor usando uma linguagem e vocabulário que espera que o
servidor consiga entender. Se o servidor conseguir entender sua requisição e tiver
o recurso disponível, ele irá responder com uma resposta(**response**). Caso o
servidor entenda a requisição mas não tenha o recurso, provavelmente ele vai
responder que não tem. Caso ele não entenda a requisição, você pode não ter
resposta.
Request e Response são dois tipos de mensagem diferentes quando falamos de HTTP. A
especificação HTTP diz exatamente o que podemos colocar dentro de cada um destes
tipos de mensagem para que todos que "falem" o idioma HTTP consigam trocar
infomações corretamente.
Uma requisição HTTP tem o seguinte formato:
imagem
E ai curtiu? Fique atento para o próximo post! E se quiser saber ainda mais sobre
HTTP, temos [um curso no Alura] que fala especificamente sobre isso :)
Temos [um curso sobre HTTP] que te ensina o protocolo HTTP por baixo dos panos.
Mais? Leia sobre as [diferenças dos métodos HTTP](/artigos/diferencas-entre-get-e-

post), em especial GET e POST. Também aqui na Alura um artigo sobre a [diferença
entre HTTP e HTTPS](/artigos/qual-e-diferenca-entre-http-e-https).
As funções **ìnput`** e **`raw_input`** podem trazer confusão quando programamos

em **Python**. Onde utilizar cada uma?
Tenho um sistema escrito em Python, para o terminal, que precisa das credenciais de
login do usuário para funcionar:
python
Quando rodo no meu computador, digito meu login e recebo em resposta:
python
Exatamente o que eu tinha digitado, capturado pela variável ùsuario`!
Fui levar o programa para a empresa, mas quando fui testar, digitei meu login e
olha o que apareceu:
python
Ué, *"mas funciona no meu computador"*! O que significa esse **`NameError`** que
tivemos como resposta ao rodar o código no computador da empresa?
Esta exceção indica que estamos tentando usar uma variável que não foi definida,
nesse caso, `yanorestes`. Mas `yanorestes` é o login em uma string, não uma
variável, então por que isso acontece?
Vamos checar as versões do Python em cada computador para ver se tem a ver com
isso. Primeiro, no meu computador:
python
Agora, no computador da empresa:
python
Ah! Então realmente há uma diferença nas duas versões, como suspeitávamos.
## A função input() no Python 2
Por que recebemos o `NameError`, então? A questão é que **a função ìnput()`, no
Python 2, não transforma a entrada do usuário em string, mas tenta avaliar,
calcular ela:**
python
Por exemplo, se mandarmos `3 + 5`:
python
Então quando tentamos mandar o usuário `yanorestes` para o ìnput()`, ele trata
como se fosse uma variável. Como essa variável não existe, recebemos o `NameError`.
Por conta do pouco uso desse comportamento, **ele foi removido no Python 3**. Ainda
assim, podemos simulá-lo através da função **[eval()]**, dessa forma:
python
E então, como no exemplo anterior:
python
Mas, então, como podemos fazer no **Python 2** o que a função ìnput()` faz no
**Python 3**?
## A função raw_input() no Python 2
**No Python 2, em vez da função ìnput()`, utilizamos a função `raw_input()` para

pegar a entrada do usuário como string**, veja:
python
Agora sim:
python
No **Python 3**, a função `raw_input()` foi simplesmente renomeada para ìnput()`.
## O que fazer a respeito da diferença de versões?
Como você deve ter percebido, há uma inconsistência aqui - se quisermos capturar
uma entrada do usuário como string, não há um código único que simplesmente
satisfaça ambas as versões 2 e 3 do Python.
Nesse momento, nós, como programadores, devemos tomar uma decisão pensando nos
benefícios de cada versão do Python e, principalmente, na maioria de nossos
usuários.
> "Mas e se eu precisar que o meu programa funcione em qualquer das duas versões?"
Se quisermos dar uma volta nessa incompatibilidade, é possível checar a versão do

Python através do atributo `version_info.major` do módulo **[sys]**, o que nos dá a
possibilidade de criar uma condição ìf` e ficar em cima do muro, como no exemplo:
python
## O perigo de executar uma entrada do usuário
É importantíssimo notar o quão perigosas são as funções ìnput()` no **Python 2** e

èval()` em ambas as versões!
Executar algo digitado pelo usuário abre uma tremenda brecha na segurança do
programa e até do computador em que o programa está sendo utilizado.
Veja [nesse artigo de Ned Batchelder] um pouco mais dos perigos do èval()`. Um
simples exemplo:
python
Isso listaria os arquivos no diretório raiz de nosso computador.
E se, em vez de listar, usássemos o comando de deletar? Todos os arquivos e

diretórios de nosso computador seriam apagados, sem mais nem menos!
**Por isso, sempre devemos lembrar de tomar cuidado ao executar uma entrada do
usuário.**
## Conclusão
Nesse post, aprendemos as diferenças entre as funções `raw_input()` e ìnput()`,

como isso muda do **Python 2** para o **Python 3** e até um pouco sobre èval()` e
seus perigos!
E aí? Resolveu essa dúvida cruel? Se está interessado em Python e quer aprender
mais, que tal dar uma olhada na nossa [**formação Python para web**]?
Nesse artigo conto como decidimos parar de seguir essa metodologia em cascata e
seguir uma metodologia mais fluída.
Uma vez fui contratada por uma empresa que desenvolvia softwares e aplicativos para
outras empresas. Nela, um dos meus primeiros trabalhos era auxiliar no
desenvolvimento de um aplicativo que visa permitir que as pessoas encontrem
restaurantes baratos perto de onde ela se encontra.
Quando conheci o time, já me explicaram que eles seguiam uma estrutura clássica:
**planejamento, análise, design, documentação, codificação, realizar testes,
implementar e, caso necessário, fazer a manutenção do aplicativo**.
Essa é uma metodologia de desenvolvimento chamada **em cascata**, que significa que
o processo é realizado por meio de fases e uma delas só é iniciada quando a
anterior termina e, assim, não é necessário retornar a um trabalho, já que ele já
foi completamente finalizado.
Porém, levamos muito tempo na etapa de planejamento, análise e documentação de todo

o projeto e o cliente ficou impaciente de não mostrarmos nenhuma novidade à ele.
Além disso, o que havíamos feito não poderia ser apresentado para o cliente, já que
a documentação é para consulta de analistas, arquitetos, desenvolvedores e testers
do projeto, ou seja, não era para o cliente.
Então, ele nos informou que o software agora tinha uma finalidade diferente da
inicial. Tentamos mudar, porém, precisaríamos analisar, planejar e começar a
documentação toda de novo. Pensando no tempo que demoramos para fazer isso, o
cliente cancelou e, assim, o trabalho inteiro foi jogado fora.
Vimos que este método não estava mais funcionando. E qual foi o nosso erro?
# Agilidade
Começamos a pensar em maneiras que poderíamos agilizar ainda mais os próximos

projetos. Então, decidimos parar de seguir essa metodologia em cascata e seguir uma
**metodologia mais fluída**.
Mas aí como podemos fazer isso? Acabar com todas as regras?
Pensando nisso, dividimos as tarefas entre todos os integrantes da equipe. Assim,

decidimos que cada pessoa pegaria uma questão definida para ser feita naquele mês e
iria desenvolvê-la.
E quando começamos o projeto fomos o desenvolvendo desta maneira: as tarefas foram

divididas e cada uma atribuída a quem tinha mais facilidade em desenvolvê-la.
Porém, como a equipe se dividiu, não sabíamos o que cada um estava fazendo e qual
parte estava pronta ou não. Isso, com o passar do tempo começou a nos deixar
perdidos em qual fase estávamos e quando podíamos começar a desenvolver um outro
requisito.
E piorou quando fomos apresentar ao cliente, pois como não sabíamos como estava
cada fase, tinha parte que estava completamente avançada e outras que estavam no
início.
Sem contar que algumas pessoas estavam tendo muita dificuldade em realizar suas
tarefas, porém, não conseguiam pedir ajuda, pois não havia uma **comunicação entre
a equipe**.
Também, tínhamos os **requisitos**, mas não sabíamos o porquê eles eram necessários
e isso nos deixava perdidos em como fazê-lo da melhor forma para o usuário.
Percebemos que um método sem regras não estava funcionando também. E como
poderíamos resolver? Voltar para as regras que também não haviam funcionando?
Então, decidimos tentar colocar algumas premissas para serem cumpridas durante o
processo.
## Os indivíduos e as interações entre eles mais que os processos e as ferramentas
Como percebemos que estava havendo um obstáculo para a equipe falar para todos em
que ponto estava tendo dificuldade, decidimos que deveríamos ter mais integração
entre nós, por meio de almoços e conversas durante o café.
E, além disso, conhecer o trabalho um do outro, por meio de reuniões onde cada um
poderia dizer o que estava fazendo, o que iria fazer a seguir e se estava tendo
alguma dificuldade ou facilidade. Nelas planejamos o que iremos fazer a seguir,
além de integrar toda a equipe no processo de desenvolvimento.
Pensamos que processos e ferramentas são importantes, mas eles são feitos e
utilizados, respectivamente, pela equipe e a interação entre ela deve estar fluida
e equilibrada para que a eficácia dos processos e ferramentas ocorra sem grandes
problemas.
Além disso, para cada requisito, ao invés de escrevermos o que precisamos fazer,
como por exemplo adicionar um campo de busca, escrevemos como aquilo ajudará o
usuário, como por exemplo o usuário precisa pesquisar termos para encontrar as
funcionalidades do software de maneira mais rápida.
## Software funcionando mais do que documentação completa e abrangente
Como perdemos muito tempo com a documentação, decidimos que nosso **foco** seria
mais no desenvolvimento, pois ela não agrega muito valor ao **cliente**.
Assim, quando recebemos um projeto, analisamos como cada requisito pode ajudar o
usuário e começamos a desenvolvê-lo.
Desta forma, temos menos trabalho com documentação, já que fazemos por partes, ao
mesmo tempo que desenvolvemos o _software_ e apresentamos ao cliente.
## A colaboração com e dos clientes mais do que negociações e contratos
Também definimos que o cliente deveria estar mais presente em todo o processo de
desenvolvimento, avaliando o que foi feito e nos indicando as próximas prioridades.
Além disso, desta forma, caso o projeto precise de qualquer outra coisa, ele pode
facilmente nos avisar, pois o cliente faz parte do projeto e participa de cada
etapa.
Para ter essa colaboração frequentemente marcamos uma reunião por mês com o
cliente. Nela, mostraremos o que foi feito, receberemos novas demandas ou
alterações de anteriores de forma frequente e sem precisar jogar o projeto inteiro
fora, pois, caso tenha alguma mudança saberemos logo.
## Resposta a mudanças mais do que seguir o plano inicial
Como as necessidades do cliente e do projeto mudam, precisamos sempre estar

atentos. Assim, ao invés de planejarmos todo o projeto de uma vez, agora planejamos
cada etapa individualmente e em conjunto com o cliente.
Por termos esse contato mais direto com o cliente e por fazermos parte por parte,
podemos nos adaptar a mudanças de forma mais rápida já que teremos que replanejar
somente uma parte e não o todo.
Depois de alguns meses, essa nova forma estava apresentando resultado por conta dos
benefícios trazidos por aquele método, que entre eles foram: satisfação do cliente;
melhor gestão de prioridades; melhor visibilidade dos projetos, já que todos sabiam
o que estava acontecendo nele; maior produtividade da equipe, pois ela estava mais
motivada por seguirmos um ritmo saudável e simplificado de desenvolvimento.
Foi quando um novo integrante para a equipe foi contratado e assim que explicamos
como tínhamos organizado as tarefas, ele nos respondeu que era **uma metodologia
ágil**, e que **a maneira que fazíamos seguia os valores do manifesto ágil**.
Confira essa entrevista do nosso **CEO Paulo Silveira com Alexandre Magno da
Emergee**:
https://www.youtube.com/watch?v=j5mCirZD-0s
# Manifesto Ágil
O [**Manifesto para o Desenvolvimento Ágil de Software**] foi escrito em 2001 por

um grupo de 17 desenvolvedores. Eles agruparam e aprimoraram diversos conceitos de
metodologia de desenvolvimento ágil no manifesto.
Esses conceitos iam pelo caminho contrário ao método em cascata, ou seja, rígida,
onde as regras e etapas devem ser seguidas, e contra o método sem qualquer regra ou
definição, que fica perdida. A metodologia ágil fica no meio termo entre o rígido e
o livre.
Esse manifesto conta com **quatro valores e doze princípios** que devem ser
incluídos na rotina da empresa.
Os valores, que já estávamos seguindo são:
- os indivíduos e interação entre eles mais que os processos e ferramentas

- software funcionando mais do que documentação completa e abrangente
- a colaboração com e dos clientes mais do que negociação
- contratos e resposta a mudanças mais do que seguir o plano inicial
E não que somente a parte antes do “mais do que” seja importante, porém, ela é uma
prioridade maior que o que vem depois.
Agora, os [**princípios**] por trás dos valores, que sempre devem ser mantidos em
mente enquanto o software estiver sendo desenvolvido são:
- A maior prioridade é satisfazer o cliente, através da entrega adiantada e

contínua de software de **valor**;
- Aceitar mudanças de requisitos, mesmo no fim do desenvolvimento. Processos ágeis
se adequam a mudanças, para que o cliente possa tirar vantagens competitivas;
- Entregar software funcionando com frequência, preferencialmente em semanas;
- Cooperação diária entre pessoas que entendem do ‘negócio’ e desenvolvedores;
- Projetos surgem através de indivíduos motivados, entre os quais existe relação de
confiança.
- A maneira mais eficaz e eficiente de transmitir informações são através de
conversas cara a cara;
- Software funcionais são a principal medida de progresso do projeto;
- Processos ágeis promovem um ambiente sustentável. Os patrocinadores,
desenvolvedores e usuários, devem ser capazes de manter indefinidamente, passos
constantes;
- Contínua atenção à **excelência técnica e bom design, aumenta a agilidade**;
- Simplicidade é essencial. Cultivar a arte de maximizar a quantidade de trabalho
que não precisou ser feito;
- As melhores arquiteturas, requisitos e projetos emergem de equipes auto-
organizadas;
- Em intervalos regulares, o time reflete em como se tornar mais efetivo, então, se
ajustam e otimizam seu comportamento de acordo.
O manifesto ágil é como se fosse o embasamento filosófico para as metodologias

ágeis e, baseado nesses valores e princípios, muitas foram criadas. Entre elas, o
[**Scrum**], [**Kanban**] e o [**EXtreme Programming, conhecido como XP**].
Agora que nossa equipe já conhece os valores do manifesto ágil, podemos utilizar
algumas das metodologias para seguir no dia-a-dia do desenvolvimento.E agora que
você já sabe um pouco sobre Metodologia Ágil, o que acha de conferir [**nossa
formação de Gerente Ágil**] para colocar em prática as metodologias ágeis na sua
equipe?
No artigo sobre como [**criar uma aplicação Java Web**] utilizando Servlets,
fizemos uma aplicação bem básica que imprimia apenas uma mensagem no navegador,
porém, eu havia dito que eu queria criar uma aplicação que permitisse o cadastro
dos meus livros, e então, listá-los!
Na Web, como fazemos para mandar informações para a aplicação? Utilizamos um

formulário em HTML, certo? Para a nossa felicidade, Já temos um modelo de
formulário em HTML para cadastro de livro que é explicado com mais detalhes nesse
[post] que escrevi! Então vamos reutilizá-lo:
Formulário de cadastro de livros
Livro Autor ISBN Valor Data da compra

Cadastrar
Precisamos adicionar esse formulário e uma página HTML, portanto, vamos criar uma
página HTML no nosso projeto, podemos inserir esse arquivo na nossa pasta
"WebContent/WEB-INF" com o seguinte conteúdo:
html
Ótimo, mas como podemos acessar o nosso formulário? Precisamos de uma Servlet que
represente esse formulário, então vamos criar a `FormularioServlet`:
java
E como fazemos para exibir HTML usando Servlet? Pelo método `println()` do tipo
`PrintWriter`, certo? Porém, dessa vez, não queremos escrever o HTML, pois já temos
um arquivo pronto!
O que queremos fazer é, no momento em fizermos uma requisição para essa Servlet,
exibir esse nosso arquivo! Para isso, precisamos indicar qual o local que está esse
arquivo por meio do método `getRequestDispatcher()` do objeto `HttpServletRequest
req` que representa a requisição dessa Servlet:
java
Por fim, precisamos dizer para ele avançar com essa nossa requisição, ou seja,
direcionar para essa página chamando o método `forward()`:
java
E como podemos acessar agora essa nossa Servlet? Lembra que precisamos adicionar no
nosso arquivo `web.xml`? Então vamos adicioná-la:
java
Vamos testar nossa aplicação? Clique com o botão direito no projeto "Run as > Run
on Server", escolha o seu Tomcat conforme havíamos configurado e clique em
"Finish":
imagem` desse parâmetro e retornar o valor do ìnput` por meio do nome dele!
java
Agora que temos as informações do livro, que tal mostrá-las na página de cadastro?
Dessa forma verificamos todas as informações do livro enviado! Primeiro, vamos
indicar que a nossa resposta será em HTML ao invés de texto:
java
Modificaremos o primeiro texto também:
java
Por fim, vamos imprimir as informações do livro:
java
Reiniciando o Tomcat e enviando o mesmo formulário de antes:
![livro-enviado]
Excelente! Agora sim nós conseguimos enviar uma informação desse livro para o nosso
servidor!
Nesse post, aprendemos como podemos direcionar uma requisição para uma página HTML
que está contida no nosso projeto. Além disso, vimos também que, a partir da API de
Servlet 3.0, podemos registrar uma Servlet utilizando a anotação `@Webervlet`. Por
fim, vimos que, para mandar as informações para o servidor a partir de um
formulário em HTML, precisamos informar a URL por meio do atributo àction` da tag
`form`.
E aí? Curtiu a API de Servlets? Quer aprender mais a fundo sobre Servlets? Pensando
nisso, o instrutor Guilherme Silveira, criou o curso de [**Servlets e fundamento de
Java web**], onde ele aborda toda a base para desenvolvermos uma aplicação de Java
Web!
Criar um projeto [**Angular**] partindo do zero não é tarefa fácil, existem

diversas dependências e integrações necessárias que precisam ser configuradas para
que a inicialização da aplicação ocorra corretamente.
A princípio, quando o Angular ainda estava em suas primeiras versões de

desenvolvimento, a própria documentação quickstart do framework sugeria o clone do
projeto semente (seed project) através do repositório oficial no GitHub.
Mas será que não temos uma alternativa mais objetiva?
## Conhecendo o Angular CLI
A partir da versão 2, o framework JavaScript Angular vem com uma interface de linha
de comando (command line interface) para facilitar e acelerar a criação de nossas
aplicações, conhecida como [**Angular CLI**].
Quando a versão 1.0 final do CLI foi lançada, ele se tornou a forma oficial para
iniciar um novo projeto em Angular.
O Angular CLI é baseado no [**Webpack**], uma ferramenta que ajuda a processar e

agrupar nossos diversos arquivos TypeScript, JavaScript, CSS, HTML e imagens. Por
baixo dos panos, o Webpack é responsável por estruturar o ponto de entrada da
aplicação, ou seja, a raiz contextual (arquivo de inicialização).
> O Angular CLI não é obrigatório para desenvolvermos com Angular, porém é uma
ferramenta produtiva que automatiza a criação de arquivos com código estrutural
base que repetimos diversas vezes durante o desenvolvimento, como por exemplo, a
criação de _components_.
## Instalando o CLI Angular
Para instalar o Angular CLI usamos um ambiente de tempo de execução JavaScript

(JavaScript runtime environment) chamado Node.JS junto com o seu gerenciador de
pacotes Npm (Node Package Manager).
javascript
Utilizamos o comando `npm` para invocar o Node Package Manager (gerenciador de

pacotes do Node.JS) e através do parâmetro `-g` definimos que o pacote àngular-
cli` deve ser disponibilizado globalmente em nosso computador.
Se a instalação ocorrer com sucesso, uma mensagem deve ser exibida conforme imagem
abaixo:
imagem em sites como [**Heroku**], [**AWS**], [**Azure**] ou qualquer outro.
Todavia, subir nossa aplicação para esses servidores não é uma tarefa muito
prática. Durante o desenvolvimento do projeto é mais comum (e rápido) utilizar um
servidor web local.
Para iniciarmos um servidor local usando o Angular CLI utilizamos o comando `ng
serve`:
imagem, um para a página (HTML), um arquivo de testes (spec.ts) e o próprio arquivo

TypeScript (.ts) do _component_.
Por convenção, os nomes dos arquivos são separados por `-`, mas o nome lógico não:
![]
Além disso, todo o código gerado por meio da ferramenta segue o [**guia oficial de
estilos do Angular**] e já vem com arquivos de teste. Sempre que o CLI detecta
alterações em qualquer arquivo, todos os testes são re-executados por baixo dos
panos para garantir a qualidade do projeto.
## Build do projeto
Vimos que o comando `ng serve` faz um ótimo trabalho ao fornecer um servidor web
local, porém isso é apenas para desenvolvimento. Eventualmente, precisaremos
hospedar nossa aplicação em outro servidor e para isso, é recomendado gerar o build
do projeto, ou seja, compilar, comprimir e empacotar.
Para gerar um _build_ para produção, podemos executar:
`ng build --prod`
O comando acima agrupa todos os nossos JavaScript, CSS, HTML em um conjunto menor
de arquivos que podemos hospedar em um servidor externo. Esses arquivos são gerados
na pasta dist:
![]
## Conclusão
Nesse post tivemos uma visão geral dos principais comandos do Angular CLI. Para
descobrir mais detalhes sobre cada comando, além de como personalizar seus
comportamentos, podemos executar `ng help`.
Existem diversos outros comandos que podem ser aprendidos na [documentação oficial
do Angular CLI].
No meu sistema de cadastro de alunos eu recebo um aluno com os seguintes atributos:
java
Ao imprimir os dados de um aluno:
```
Nome: Alex2016 Sobrenome: 12Felipe Telefone: 11992232121455
```
_Alex2016_? _12Felipe_? E esse telefone bizarro? Esse aluno contém informações que
não fazem sentido...
Como posso fazer para impedir que esses tipos de dados sejam inseridos no meu
sistema?
Vamos tentar validar esses dados criando um método que valida o aluno:
java
Vamos começar pelo nome do aluno. Não queremos que tenha números nem no começo e
nem no final do nome! **Como** podemos fazer isso?
Vamos extrair tanto o primeiro caracter quanto o último por meio do método
`charAt()` da classe `String`:
java
Para verificar se um caracter é uma letra, podemos usar o método estático

ìsAlphabetic()` da classe `<a
href="https://docs.oracle.com/javase/7/docs/api/java/lang/Character.html">Character
</a>`:
java
Implementamos nossa primeira validação! Vamos agora adicionar um `sysout` dentro de

um ìf` para testarmos:
java
Vamos testar um nome que começa com um número, no caso "1Alex":
```
aluno 1Alex é inválido
```
Ótimo! Funcionou como o esperado. Mas, e se o número estiver no final? Por exemplo,
o que foi apresentado no começo: "Alex2016". Vamos ver o resultado:
```
aluno Alex2016 é inválido
```
Aparentemente tudo está funcionando conforme o esperado! Agora, e se um número

estivesse no meio do nome? Por exemplo "A1ex":
```
aluno A1ex é válido
```
Eita! Não pensamos nesse caso! Como podemos fazer com que o nome do aluno não tenha
nenhum número? Precisaremos "varrer" toda a nossa `String`, caracter por caracter e
verificar se é válido:
java
Se testarmos novamente com o nome "A1ex":
```
aluno A1ex é inválido
```
Ótimo! Agora o nome do meu aluno está sendo validado conforme o esperado! E se
recebermos um aluno que tenha inserido o nome com apenas uma letra? Como "A" por
exemplo... o que aconteceria?
```
aluno A é válido
```
Hmmm, mas com certeza para o meu sistema não faz sentido um aluno com o nome de
apenas 1 letra...então adicionaremos mais uma condição no nosso validador:
java
Se testarmos agora:
```
aluno A é inválido
```
A nossa validação por enquanto está funcionando, mas olha o tamanho que ficou o
método:
java
À primeira vista conseguimos entender o que está sendo feito? Provavelmente não.
Note também que **a cada validação** que precisamos fazer são mais ìf`s que
precisamos adicionar. Será que existe outra forma mais simples para validarmos
esses dados? A resposta é **sim**!
Podemos utilizar **expressões regulares** por meio do método `matches()` da classe

`String`. Vamos definir nossa expressão regular para validar o nome do aluno:
java
Certo, essa expressão regular significa que esperamos **apenas 1 única letra do
alfabeto**. Mas o que queremos é que tenha pelo menos 2, certo? Simples! Basta
adicionar chaves (`{}`) e informar a quantidade de repetições que você deseja:
java
Nesse exemplo estamos informando que queremos **apenas** 2 repetições, ou seja, a

quantidade **não pode ser maior ou menor** e sim **igual a 2 letras**! Com certeza
não é isso que queremos! E agora? Como podemos dizer que queremos pelo menos 2
letras?
Quando utilizamos as chaves podemos passar 2 parâmetros: o primeiro significa a

**quantidade mínima** e o segundo a **quantidade máxima**. Ou seja, se adicionarmos
apenas uma ",":
java
Nesse instante estamos dizendo que esperamos pelo **menos 2 letras** e a

**quantidade máxima não tem limite**!
Se testarmos o nome "Alex":
```
aluno Alex é inválido
```
O que aconteceu? Não era pra ser válido? A nossa expressão regular diz que espera
pelo menos 2 letras, porém **letras minúsculas**! Agora, como podemos fazer com que
a nossa expressão regular espere uma letra maiúscula no começo? Da mesma forma que
pra letras minúsculas usamos `[a-z]` podemos usar `[A-Z]` para letras maiúsculas:
java
Agora a nossa expressão regular está esperando uma `String` com a primeira letra
maiúscula e por isso precisamos apenas garantir que terá pelo menos 1 letra
minúscula depois! Se tentarmos rodar novamente:
```
aluno Alex é válido
```
E se tentarmos com aqueles nomes inválidos? Por exemplo: "A1ex", "1Alex" e o

"Alex2016"? Vejamos o resultado:
```
aluno A1ex é inválido
```
```
aluno 1Alex é inválido
```
```
aluno Alex2016 é inválido
```
Excelente! Tudo funciona como o esperado e de uma forma mais clara e de fácil
manutenção! Se um dia precisarmos **modificar nossa validação**, basta adaptar a
nossa expressão regular para a nova regra de negócio :)
O que achou da expressão regular? Que tal um desafio? Faça a definição de uma
expressão regular para **validar um telefone** que aceite apenas telefones nesses 2
formatos: (11) 1111-1111 ou (11) 11111-1111. Comente o seu resultado!
E aí, curtiu expressões regulares? Que tal aprender mais sobre o assunto? **Na
Alura, o [curso de expressão regulares] aborda mais detalhes sobre esse recurso
poderoso que facilita, e muito, a vida do programador na hora de realizar diversas
validações!**
imagem
Criatividade e inovação são fundamentais para o trabalho de um [**designer**].

Afinal, é por meio desses elementos que torna-se possível produzir soluções
originais, surpreendentes e mais efetivas em seu trabalho.
**A inspiração não é algo que simplesmente aparece quando bem entender, mas surge
como resultado de uma busca ativa.** Quando procuramos por novas fontes de
informação, nós ampliamos o nosso leque de referências e, consequentemente, nos
expressamos de forma mais criativa.
Sendo assim, separamos algumas maneiras que podem ser adotadas para incrementar sua
inspiração para design. Não deixe de conferi-las!
## 1\. Observe o espaço ao seu redor

Ser observador é essencial para ativar a inspiração. Estamos rodeados por tantos
elementos, cores e formas, que acabam estimulando a criatividade e gerando alguns
**insights**.
Então, por que não juntar essa prática com uma volta pela cidade? Na correria da
rotina acabamos esquecendo de observar os lugares ao nosso redor, mas as cidades
têm referências riquíssimas que podem ser utilizadas como inspiração para o design.
Não deixe de observar a arquitetura das construções, outdoors, cafés e,

principalmente, a [**natureza**]. Todos esses elementos podem ser uma fonte
inspiracional poderosa.
Essa prática ainda é uma ótima maneira para espairecer a cabeça, o que pode ajudar
na hora da criatividade.
## 2\. Assista a filmes e vídeos
Há uma infinidade de elementos que podemos usar como referência ao assistir

a [filmes] e vídeos.
Você pode ver documentários mais específicos do design, como o "[**Abstract: The
art of Design**]", ou até mesmo buscar vídeos mais conceituais no Youtube.
Quando fizer isso, preste atenção nos detalhes, na luz, na fotografia, no modo como
a produção foi gravada etc. Esse é um bom exercício para buscar uma inspiração mais
visual.
## 3\. Leia bastante
O profissional do design precisa estar [**constantemente atualizado**], e a leitura

é uma boa fonte de informação e aprendizado, além de exercitar a criatividade. Por
isso, tente se habituar a ler regularmente, e não apenas livros focados em design.
Eles são importantes, porém, soluções surpreendentes também podem surgir de fontes
inesperadas.
Encontre outros temas que despertem seu interesse, e que mostram perspectivas
diferentes daquelas que você está acostumado a ver. Vale ler livros de romance,
ficções científicas, revistas, comics e o que mais desejar.
## 4\. Pesquise a história de tudo
Nos dias de hoje, o design segue algumas tendências e moldes que, muitas vezes,
combinam e dialogam com nosso jeito de viver, socializar ou consumir.
No entanto, não foi sempre assim. A sociedade se modificou ao longo do tempo e a

tecnologia avançou, gerando inúmeras possibilidades. Cada período histórico teve
sua própria cultura, estilo de vida, arte e arquitetura. Então, por que não buscar
inspiração no passado?
Podemos criar muitas ideias originais ao pesquisar sobre movimentos sociais e

artísticos,vestimentas, propagandas e por aí vai.
## 5\. Escute música
Mais do que inspirar, a música também pode deixar você no humor certo para ser mais
criativo. A dica aqui é criar playlists que que gerem sensações prazerosas e deixem
você animado ou alegre.
Outra forma de inspiração para design com a música consiste em observar como os
artistas estão se comunicando visualmente. Como são os clipes musicais, a capa do
seu álbum de músicas e sua página no Facebook, por exemplo.
## 6\. Anote tudo
Tenha sempre um bloquinho em mãos. Escrever exercita a memória e faz com que você
não esqueça nenhuma ideia que surgiu de modo inesperado.
É possível ir além. Tente escrever com frequência, crie um diário de ideias

ou esquemas, escreva versos e histórias, não se limite. Esse exercício por si só já
pode ser uma fonte rica de inspirações. Além disso, as suas anotações podem ser
importantes para estimular a criatividade no futuro.
## 7\. Respeite o seu momento de descanso
Você já sabe que a inspiração depende de uma ação intencional. Portanto, ela
demanda esforço e trabalho.
Sendo assim, respeite os momentos de descanso do corpo e da mente. Evite dormir

poucas horas ou passar noites em claro. O cansaço é um verdadeiro inibidor da
criatividade, então, se você deseja se manter inspirado, nunca deixe de fazer
pausas.
## 8\. Invista em técnicas criativas
Existem técnicas em que se pode investir para inspirar, libertar a criatividade e

solucionar os problemas de forma inovadora.
O [**Mindmapping**] (ou Mapa Mental) serve para organizar visualmente as ideias

conforme elas vão surgindo. Essa dinâmica possibilita uma maior fluidez do
pensamento e, por ser um mapa, pode ir guiando você em direção a mais inspirações.
Já o [**Brainstorm**] (ou Tempestade de Ideias) consiste em produzir ideias sem

julgamentos, para depois avaliá-las. O ideal para a prática é que seja feita em
grupo, por isso convide amigos e colegas e faça o teste.
Essas são ótimas técnicas para se inspirar de forma surpreendente, por meio de
ideias que poderiam ser absurdas, mas que em realidade podem ser bem viáveis.
## 9\. Curta os momentos de ócio
A distração e a diversão são fundamentais para qualquer ser humano. Em meio ao dia
a dia,é preciso encontrar tempo para deixar a mente ocupada com momentos prazerosos
e de lazer.
Esses intervalos podem ser muito mais produtivos do que você imagina. O cérebro
continua bastante ativo nesses momentos e pode ser que em um deles uma grande ideia
apareça! Por isso, não tenha medo de aliar a rotina de trabalho com momentos
divertidos e devaneios.
## 10\. Inspire-se em outros trabalhos e designers
Não deixe de aprender com trabalhos já feitos por outros profissionais. Dê uma
olhada no [**portfólio**] de designers e artistas famosos — eles podem ser uma
ótima referência para o seu processo criativo.
Aproveite para conversar com seus colegas de profissão. Pergunte o que estão
fazendo e onde buscam suas inspirações também. Inspirar-se de forma colaborativa
pode ser uma ótima ideia!
**Essas foram algumas dicas que podem ajudar você a se inspirar mais facilmente e
ativar a criatividade. Aplique-as no seu cotidiano profissional e veja qual se
encaixa melhor ao seu perfil. A prática de encontrar a inspiração para design é
única e é assim que se criam trabalhos originais e surpreendentes.**
Interessou-se pelas dicas? Então compartilhe este post nas suas redes sociais e
ajude a inspirar mais pessoas!
O uso de autenticação é praticamente unânime em qualquer aplicação. Seja um fórum,

uma rede social, internet banking ou o sistema da empresa.
Ao desenvolver uma aplicação, precisamos tomar muito cuidado com o login e senha
dos usuários. É comum encontrarmos tabelas como esta abaixo por aí, em vários
sistemas:
python
O que aconteceria com a reputação de nosso produto caso algum invasor tenha acesso
a essa tabela com usuários e senhas?
> _“Oras, mas o banco de dados não é exposto na internet pública, fica em rede
local”._
Será que isso é o suficiente? Em geral, as empresas que trabalham com

desenvolvimento isolam os ambientes de desenvolvimento e produção. Inclusive, para
as pessoas desenvolvedoras programarem, é comum usar um banco de dados com dados
como email, telefone, etc. falsos, para garantir uma maior privacidade do usuário
final.
Mas, estes dados ainda são visíveis para administradores de sistemas e o time de
infraestrutura. E se algum funcionário, buscando prejuízo da empresa, executar um
`select * from Usuarios` e publicar estas informações?
> Moral da história: **nunca guardar uma senha bruta no banco de dados!**
Se não vamos guardar a senha em formato bruto, o que podemos fazer? Podemos guardar
um texto bagunçado difícil de reconhecer. Algo como:
python
O nome disso é hash! Uma função que gera o hash recebe como entrada um texto
qualquer, e o mapeia para uma cadeia de caracteres com tamanho fixo. Por exemplo:
- Hash de `"minha_senha_segura"` = `4f24ed619ffb73b8792e3f74e5ffa3bb`;

- Hash de `"sp23494"` = `de1dc74c5561739cbe4c6368f78e9b6f`;
A partir de `de1dc74c5561739cbe4c6368f78e9b6f` é inviável descobrir a senha

original!
Mas, peraí, o usuário ao fazer login não vai digitar esse código gigante, né? Na
verdade, quando recebemos uma requisição de autenticação, o código da aplicação irá
calcular o hash da senha informada e comparar com o que está no banco de dados!
Desta forma, iremos comparar hashes e não mais senhas brutas, nos poupando do
problema de guardar esta informação sensível no banco de dados.
Mas…Será que isto está seguro mesmo? As pessoas que conseguirem acesso a esta
tabela não poderão saber qual senha é qual, mas poderão calcular o hash das senhas
mais usadas no mundo, como àbcdef` ou `123456`:
- Hash de `"abcdef"` = è80b5017098950fc58aad83c8c14978e`;

- Hash de `"123456"` = è10adc3949ba59abbe56e057f20f883e`;
Se fizermos uma busca em nossa tabela pelos usuários que possuem esses hashes,
saberemos quem possui a senha àbcdef` ou `123456`! Ops, nada bom, né? E se não
calcularmos mais os hashes nos baseando apenas na senha bruta, mas a concatenando
com algo mais? Dessa forma, não calcularemos o hash do texto àbcdef` e sim o hash
do texto àbcdef + <Texto aleatório>`. Por exemplo: àbcdef+HjJK8L`. Teremos um
hash totalmente diferente!
Mas, isto só vale se houver um texto aleatório diferente para cada usuário, senão
nosso invasor poderá calcular o hash das senhas mais comuns com este mesmo texto
aleatório.
Essa porção a mais que colocamos na senha antes de calcular o hash se chama
[**salt**])! Então nossa tabela de usuários será:
python
Se houver **informações internas vazadas**, será difícil manter a segurança total.

Mas, com esse gerenciamento de senhas mais robusto, podemos dificultar ao máximo
que pessoas mal-intencionadas tenham acesso a informações sensíveis.
Talvez você esteja pensando que melhor que isso só se guardarmos as senhas
criptografadas. Será?
A criptografia, por definição, deve ser reversível! A partir da chave de

criptografia e do texto cifrado, voltaremos ao texto original, ao contrário do
hash, em que não podemos voltar ao texto original.
Se nossa tabela de senhas cair em mãos erradas, será necessário apenas descobrir a
chave de segurança. Uma chave fraca pode ser obtida com força bruta e uma chave
forte ainda precisa ser armazenada e visível para alguma pessoa, não? E se essa
pessoa usar ou compartilhar a chave com alguém? É por isto que usamos hash e salt!
Gostou de ver um pouco sobre segurança e algumas vulnerabilidades que podem existir
na aplicação? Na **Alura**, falamos mais sobre segurança no curso [**Segurança Web:
Vulnerabilidades do seu sistema e OWASP**]. Temos também este artigo do que fala
sobre como implementar os [**recursos de Hash**].
**O design da experiência do usuário (ou UX design) é o processo que visa melhorar
a satisfação do usuário com um produto ou serviço, melhorando a usabilidade, a
acessibilidade e até mesmo a satisfação proporcionada na interação.**
Trata-se de um campo amplo, que abrange o design tradicional de interações homem-

máquina e o prolonga, abordando todos os aspectos pelos quais um serviço ou produto
é percebido pelo usuário.
Ao longo deste artigo, você vai compreender o que a UX design significa e descobrir
por que ela é tão importante! Vamos lá?
## O que é UX design?
Segundo o estudo [**Interacting With Computers**], do Oxford Journal, o principal
objetivo da UX design nos negócios é melhorar a satisfação e a lealdade do cliente,
tornando suas interações com produtos ou serviços mais simples e prazerosas.
Podemos entender, então, que esse é o processo de concepção (digital ou física) de

mercadorias úteis, fáceis de utilizar e prazerosas de se interagir.
Sua função é melhorar a experiência que os usuários têm ao interagir com um

determinado produto, mas infelizmente essa não é uma explicação boa o bastante para
que você saia por aí se dizendo um especialista.
O termo experiência de usuário, abreviado como **UX** (**U**ser e**X**perience),

refere-se ao que uma pessoa sente ao interagir com um sistema — que pode ser um
site, aplicativo web ou software para desktop. Mas pode ir para o mundo offline
também, pense na última vez que você entrou em uma determinada rede de
supermercados ou como foi atendido por um médico, tudo isso envolve UX.
No contexto moderno, UX diz respeito a todas as interações homem-máquina possíveis:

desde os comandos de voz que um usuário dá para seu celular executar determinada
função (a Siri no iOS por exemplo) até a [**posição dos botões**] em um aplicativo.
## O que faz um designer da experiência do usuário?
Aqueles que [**trabalham com UX**] estudam e avaliam como os usuários se sentem a
respeito de um determinado sistema, olhando para questões como a facilidade de uso
e a percepção de valor, utilidade e eficiência na execução de tarefas, entre
outros.
UX [**designers**] também se dedicam aos subsistemas e processos dentro de um

sistema, como o checkout de um e-commerce, para garantir que os usuários considerem
o processo de compra fácil e agradável.
## Como e quando surgiu o termo?
Comparada com muitas outras disciplinas, a UX design é relativamente nova. O termo

foi cunhado pelo [**Dr. Donald Norman**] no começo da década de 90 enquanto
trabalhava na Apple, um pesquisador de ciência cognitiva que também foi o primeiro
a descrever a importância de um design centrado no usuário. Em 2016 a NN Group
publicou um vídeo com Norman comentando sobre o termo:
https://www.youtube.com/watch?v=9BdtGjoIN4E
Hoje, descrever e justificar a importância de projetar e aprimorar a experiência do

usuário parecem ações quase desnecessárias, entretanto na sua época não era bem
assim.
Até pouco tempo atrás quem tem experiência na indústria deve lembrar —,
costumávamos fazer interfaces de uma maneira bem diferente. Pense nos sites dos
primórdios da internet. Antes de compreendermos o valor do usuário, tomávamos
decisões com base apenas em dois itens: o que achávamos bonito e o que o cliente
queria ver.
Construíamos interações a partir do que pensávamos que funcionava, desenhando para

nós mesmos. O foco estava na estética e na marca, com pouquíssima gente pensando em
como as pessoas que usariam o site se sentiriam a respeito.
Mas depois que a web se tornou onipresente (e os sites, ambientes complexos), os

projetos tiveram que mudar de foco. Passamos a nos conscientizar da importância de
características como acessibilidade não só para aqueles que têm necessidades
especiais, mas também para quem acessa um site de um dispositivo que não seja o
computador.
**As mudanças no acesso, como a popularização da banda larga e do smartphone,

fizeram com que sites bonitos fossem substituídos pelos agradáveis de usar,
independentemente da plataforma escolhida para receber tal conteúdo.**
O fator impulsionador para construirmos páginas hoje é a experiência que queremos

dar aos nossos usuários.
## Por que a UX design é importante?
O termo é usado para se referir às abordagens e aos métodos utilizados para se

certificar que um [**site**] é totalmente adaptado e personalizado para seu
público-alvo. A eficácia de uma plataforma online depende de um fator-chave, que é
a experiência do usuário.
De maneira simples, podemos dizer que a satisfação do cliente é tudo. Portanto, um

site deve ser fácil de navegar, simples de operar e oferecer aos usuários
benefícios e vantagens únicas.
Quando falamos apenas em plataformas web, já há algumas complicações, mas imagine

que tablets, smartphones, wearables e outros dispositivos já fazem parte da malha
digital e precisam ser levados em consideração por designers na hora de lançar um
novo produto.
A experiência do usuário deve ser ótima em cada um destes canais e é por isso que o
papel do UX designer é tão importante.
A qualidade do uso é tão essencial quanto os componentes estéticos de um site. Você

pode ter uma das melhores plataformas online ou [**apps**] no mercado, mas, se os
clientes não conseguirem aprender rapidamente a utilizá-los, pouco adianta.
Embora a UX tenha um papel vital no desenvolvimento de todos os recursos digitais,

sua importância é ampliada quando falamos de sites, aplicativos, softwares
corporativos ou interfaces que usamos todos os dias, como a do caixa eletrônico de
um banco.
Quanto mais complexo é o processo, mais importante se torna o design da experiência

do usuário, pois ele ajuda seu público-alvo a navegar e a executar processos. Isso
pode ser simples, em projetos de nicho, ou extremamente desafiador quanto maior for
o número de pessoas que deve ser atendido por aquela configuração. Uma dica é
pensar em personas ou [**proto-personas**] para nortear um pouco mais seu caminho.
A importância da UX cresce ainda mais no caso de empresas jovens e startups, porque

geralmente falta uma reputação robusta para servir de suporte. As chances de
sucesso se concentram na qualidade de suas plataformas e na primeira impressão que
conseguem provocar nos clientes.
## Por que sua implementação é um desafio?
O design da experiência não funcionará em todas as situações para cada pessoa

porque, como seres humanos, somos todos diferentes. O que dá certo para um
indivíduo pode ter o efeito oposto em outro.
O melhor que podemos fazer é projetar experiências específicas e promover certos

comportamentos, embora não possamos fabricar, impor ou prever comportamentos reais
que vão ocorrer durante o uso.
Não é possível determinar a eficiência da UX design com base apenas em
estatísticas, como exibições de página e taxas de conversão ou rejeição.
Podemos, sim, fazer suposições com base nesses dados e pedir aos usuários
evidências, mas não instalar um aplicativo que grave automaticamente as impressões
do uso diretamente. Por isso é tão desafiador desenhar a experiência do usuário.
## UX design é o mesmo que usabilidade?
UX design e usabilidade tornaram-se sinônimos por aí, mas são campos distintos. A
UX se refere a como um usuário se sente ao usar algo, enquanto a usabilidade é
sobre a eficiência da interface em si.
Se um sistema se propõe a funcionar como uma lista virtual de afazeres e os

usuários conseguem adicionar tarefas e marcar aquelas que completaram, tem uma boa
usabilidade. Entretanto, isso não significa que a mesma ferramenta ofereça uma boa
experiência a eles.
**Embora a usabilidade constitua grande parte da UX e desempenhe um papel

importante em sua avaliação, fatores antropológicos, ciência, psicologia,
arquitetura da informação e princípios de design centrado no usuário também merecem
destaque.**
Pensando no exemplo anterior, você pode ter usuários que consigam fazer uso de um
sistema, mas que não se sintam confortáveis com isso por algum motivo.
Seja em função das cores que não oferecem um contraste suficiente, devido à
complexidade das etapas para cada ação ou, ainda, pela inexistência de uma
hierarquia entre as tarefas criadas: muitos são os motivos que podem fazer de uma
interface com boa usabilidade uma péssima experiência.
Em geral, os dois itens caminham juntos. Não é possível um sistema oferecer uma boa
UX sem ter sua usabilidade bem pensada. Mas o contrário pode acontecer.
Gostou de saber mais sobre a UX design? Então siga nossas redes sociais
([Facebook], [Twitter], [Youtube] e [Linkedin]) e continue aprendendo conosco!
Dessa vez, o nosso aluno Wanderson Macêdo, compartilha a forma como estuda e
descreve uma de suas técnicas de aprendizagem que faz muita diferença para o
aprendizado! Bora dar uma olhada?
imagem, lido livros e já estava no 7º semestre da faculdade (e ainda estou).
Eu poderia ter ido direto para os cursos mais avançados, mas não, comecei pelos
básicos e mesmo achando que aquilo não somaria em nada nos meus conhecimentos eu os
fiz e disse para mim mesmo: **Vou fazer esse curso aqui só para revisar, eu já sei
disso**. O que me impressionou? **As dúvidas básicas no fórum em que eu não tinha
certeza da resposta**. Pois é, acabei aprendendo um monte de coisas “novas”.
No vídeo, com o instrutor, que já domina o assunto, você aprende, faz os exercícios
e absorve aquele conhecimento passado pelo instrutor. No fórum, você discute e vê
problemas sobre a perspectiva de outras pessoas, problemas que talvez não tenham
acontecido com você e que você pode ou não ter a resposta. Podemos chamar isso de:
**segunda parte do aprendizado**.
E esse segundo passo é muito importante para fixação e compreensão do assunto
estudado, você pode estar ensinando e/ou aprendendo com mais alguém sobre
determinado assunto sobre outra perspectiva que antes você não havia pensado.
Se você é aluno do Alura, assim como eu, explore um pouco o fórum, caso tenha
problemas, procure uma solução lá, caso não tenha, abra um tópico! Dessa forma,
alguém que já sabe pode lhe mostrar no caminho das pedras para resolver seu
problema ou alguém que está aprendendo pode entrar na discussão também e aprender
porque aconteceu o problema e como resolver.
**É Aluno da Alura também e tem uma história bacana pra nos contar? Conta que
publicamos seu depoimento aqui! Envie um email para
gabriel.ferreira@caelum.com.br**
Na maioria das linguagens de programação, o escopo das variáveis locais é vinculado

ao bloco onde elas são declaradas. Sendo assim, elas “morrem” ao final da instrução
em que estão sendo executadas. Será que isso se aplica também à linguagem
JavaScript? Vamos verificar:
javascript
Estamos declarando duas variáveis em blocos de código diferentes, qual será o

resultado? Vamos testar:
javascript
Se `mensagemDentroDoIf` foi declarada dentro do ìf`, por que ainda temos acesso a
ela fora do bloco desta instrução?
## Utilização antes da declaração
Vejamos abaixo outro exemplo de código em JavaScript:
javascript
Observe que estamos declarando a variável `mensagem` apenas depois de atribuir um

valor e exibí-la no log, será que funciona? Vamos testar!
javascript
Funciona! Como é possível usar a variável `mensagem` antes mesmo de declará-la?

Será que o escopo é garantido apenas dentro de onde a variável foi criada?
## Hoisting
Em JavaScript, toda variável é **“elevada/içada” (_hoisting_)** até o topo do seu

contexto de execução. Esse mecanismo move as variáveis para o topo do seu escopo
antes da execução do código.
No nosso exemplo acima, como a variável `mensagemDentroDoIf` está dentro de uma

_function_, a declaração da mesma é elevada (_hoisting_) para o topo do seu
contexto, ou seja, para o topo da _function_.
É por esse mesmo motivo que “é possível usar uma variável antes dela ter sido
declarada”: em tempo de execução a variável será elevada (_hoisting_) e tudo
funcionará corretamente.
## var
Considerando o conceito de hoisting, vamos fazer um pequeno teste usando uma

variável declarada com `var` antes mesmo dela ter sido declarada:
javascript
No caso da palavra-chave `var`, além da variável ser içada (_hoisting_) ela é

automaticamente inicializada com o valor undefined (caso não seja atribuído nenhum
outro valor).
Ok, mas qual é o impacto que temos quando fazemos esse tipo de uso?
Imagine que nosso código contenha muitas linhas e que sua complexidade não seja
algo tão trivial de compreender.
Às vezes, queremos declarar variáveis que serão utilizadas apenas dentro de um

pequeno trecho do nosso código. Ter que lidar com o escopo de função das variáveis
declaradas com `var` (escopo abrangente) pode confundir a cabeça até de
programadores mais experientes.
Sabendo das "complicações" que as variáveis declaradas com `var` podem causar, o
que podemos fazer para evitá-las?
## let
Foi pensando em trazer o escopo de bloco (tão conhecido em outras linguagens) que o
ECMAScript 6 destinou-se a disponibilizar essa mesma flexibilidade (e uniformidade)
para a linguagem.
Através da palavra-chave `let` podemos declarar variáveis com escopo de bloco.

Vamos ver:
javascript
Qual será a saída do código acima?
javascript
Veja que quando tentamos acessar uma variável que foi declarada através da palavra-
chave `let` fora do seu escopo, o erro _Uncaught ReferenceError: escopoBloco is not
defined_ foi apresentado.
Portanto, podemos usar tranquilamente o `let`, pois o escopo de bloco estará

garantido.
## const
Embora o `let` garanta o escopo, ainda assim, existe a possibilidade de declararmos

uma variável com `let` e ela ser _undefined_. Por exemplo:
javascript
Supondo que temos uma variável que queremos garantir sua inicialização com um
determinado valor, como podemos fazer isso no JavaScript sem causar uma
inicialização _default_ com _undefined_?
Para termos esse tipo de comportamento em uma variável no JavaScript, podemos

declarar constantes por meio da palavra-chave `const`. Vamos dar uma olhada no
exemplo:
javascript
O código acima gera um _Uncaught TypeError: Assignment to constant variable_, pois

o comportamento fundamental de uma constante é que uma vez atribuído um valor a
ela, este não pode ser alterado.
Assim como as variáveis declaradas com a palavra-chave `let`, constantes também tem
escopo de bloco.
Além disso, constantes devem ser inicializadas obrigatoriamente no momento de sua

declaração. Vejamos alguns exemplos:
javascript
No código acima temos o exemplo de uma constante ìdade` sendo declarada e

inicializada na mesma linha (constante válida) e um outro exemplo onde o valor não
é atribuído na declaração de `pi` (constante inválida) ocasionando o erro _Uncaught
SyntaxError: Missing initializer in const declaration_.
É importante utilizar `const` para declarar nossas variáveis, porque assim

conseguimos um comportamento mais previsível, já que o valor que elas recebem não
podem ser alterado.
## Conclusão
Aqui tem um resumo do site [constletvar.com]:
![]
Graças ao _hoisting_, variáveis declaradas com a palavra-chave `var` podem ser

utilizadas mesmo antes de sua declaração.
Por outro lado, as variáveis criadas com `let` só podem ser utilizadas após sua
declaração, pois, apesar de serem elevadas, elas não são inicializadas.
Além das variáveis declaradas com `var` temos a possibilidade de usar constantes
por meio da palavra-chave `const` ou utilizar variáveis com escopo de bloco através
da `let`.
Mais JavaScript? Vemos essas e outras características profundas do ECMAScript nos

nossos cursos de [**JavaScript avançado**]. Aqui também um video do Zac Gordon para
resumir o que vimos:
https://www.youtube.com/watch?v=pcxR1iMegfU
**O perfil do consumidor de informação mudou muito.** Existiu um tempo em que os

textos cativavam a atenção das pessoas, no entanto esse período ficou no passado.
Dessa forma, o vídeo vem se tornando uma ferramenta de marketing vital em qualquer
esfera mercadológica.
O objetivo neste artigo é expor as opções de atuação promovidas pelo mercado e

mostrar como o profissional da área deve manter-se informado acerca dos novos
métodos e tecnologias existentes. Confira!
## O futuro do Marketing
Sem dúvida, pode-se dizer que os principais meios de comunicação existentes no

Brasil são a televisão e a internet sendo, esse último, o que vem apresentando
maior crescimento nos últimos anos.
Em consequência disso, o perfil dos usuários tem passado por inúmeras mudanças.
Mesmo os consumidores mais antigos, adeptos dos jornais impressos e do rádio, têm
se guiado pela facilidade das informações disponibilizadas em vídeo.
## O perfil do consumidor de conteúdo
Como já mencionado, o perfil dos consumidores de conteúdo vem se transformando nos

últimos anos, mesmo entre aqueles habituados exclusivamente aos textos impressos e
disponíveis em meio digital.
Muitas pessoas estão cansadas de ver materiais que dialogam em sentido único. A
busca por conteúdos interativos e o **desejo de ouvir um interlocutor falando sobre
os assuntos de seu interesse têm sido os principais motores dos usuários pela
demanda audiovisual.** Nesse sentido, o vídeo torna-se uma ferramenta ideal na
aproximação do espectador com o conteúdo disponibilizado.
## As opções de mercado para o profissional de edição de vídeos
Até agora mencionamos os motivos que fizeram com que o mercado de edição de vídeos
estourasse no Brasil, entretanto, ainda não demonstramos as opções que esse ramo de
atuação proporciona.
O mercado de edição de vídeos é muito amplo, oferecendo oportunidades diversas aos

mais variados tipos de profissionais. Algumas delas são:
### 1\. Redes de televisão
O nicho televisivo é, sem dúvida, o mais visado pelos profissionais de edição de

vídeos. São várias as atividades que necessitam dele. A edição de telejornais,
programas de auditório e telenovelas são exemplos de áreas que o editor de vídeos
pode atuar no âmbito das empresas de televisão.
### 2\. Marketing Digital
Um segmento de mercado que vem se destacando e [**crescendo consideravelmente**]

[no Brasil] quando começou a ser explorado massivamente é o de marketing digital,
em especial aquele realizado [**por meio de blogs**] e de redes sociais, como o
Facebook.
O marketing digital é uma área que tem se valido, cada vez mais, dos produtos
audiovisuais, principalmente, devido à crescente demanda dos consumidores.
Dificilmente você encontrará uma página de vendas ou apresentação de conteúdo sem,

no mínimo, um vídeo. **Isso porque, informações escritas não geram o mesmo impacto
que as informações audiovisuais e, dificilmente, proporcionam a conversão desejada
pelo proprietário.**
### 3\. Filmes e documentários
Outra área de atuação que necessita de profissionais de edição de vídeos altamente

qualificados é a produção audiovisual de filmes, documentários e curtas-metragens.
### 4\. Canais do YouTube
Recentemente, presenciamos o surgimento e o sucesso de várias personalidades do

mundo digital que conquistam milhares ou até mesmo milhões de pessoas no Brasil com
os mais variados tipos de conteúdo em vídeo publicados no YouTube.
Como a demanda desses materiais cresceu muito – o que pode facilmente ser percebido
em uma simples consulta no YouTube consequentemente, a qualidade dos vídeos também
teve de melhorar.
Com isso, abre um novo mercado para os profissionais de edição de vídeo, que podem
atuar em conjunto com os chamados "YouTubers", objetivando transformar suas
apresentações na internet mais profissionais.
### 5\. Jornalismo
Outra área de atuação para o profissional de edição de vídeos é o jornalismo. Os

portais de notícia, tanto online quanto televisiva, sempre precisam de bons
profissionais para realizar o tratamento nos conteúdos que serão disponibilizados à
sua audiência. Assim, o profissional de edição de vídeos também poderá explorar
essa área do seu mercado.
### 6\. Criação de vinhetas em vídeo
**As propagandas que são transmitidas nos canais de televisão, abertos ou fechados,
necessitam passar pela edição de vídeos feita por um bom profissional da área.
Abrindo assim, mais uma oportunidade de trabalho.**
Existem empresas especializadas na criação de vinhetas em vídeo. Essas organizações

são uma excelente opção para o ingresso nesse mercado.
### 7\. Criação de efeitos visuais e acabamentos
Outra área de atuação dos profissionais de edição de vídeos é a confecção de

efeitos e acabamentos em conteúdos diversos, para terceiros não vinculados a
empresas de televisão ou grandes portais de marketing de conteúdo.
Existem profissionais dessa área que atendem pessoas que necessitam criar efeitos
diversos em vídeo para alguma apresentação mais profissional em empresas, eventos
ou reuniões. O profissional de edição de vídeos pode oferecer os serviços de
freelancer para atender a essa demanda.
### 8\. Grandes portais de internet
Outro ambiente que necessita de um bom profissional de edição de vídeos é o de

empresas que possuem grandes portais na internet, como por exemplo: Terra, Uol, MSN
Brasil, Globo.com, entre outros.
Esses canais são repletos de conteúdos em vídeo, ou seja, uma ótima opção para quem
deseja atuar nesse ramo.
## Os desafios do profissional de edição de vídeos
Na mesma proporção em que cresce o mercado de edição de vídeos, aumentam as

exigências em relação ao profissional que exerce essa função. Aquele que não se
adaptar às constantes mudanças do mercado, fatalmente sucumbirá diante das
exigências e demandas.
Além do conhecimento das diversas [**ferramentas de edição de vídeo**] e

[**imagem**], o profissional deve estar atendo às variáveis que permeiam os vídeos
promocionais, publicitários ou jornalísticos.
Algumas dessas variáveis estão ligadas ao uso das cores, à execução de pequenos
cortes no meio do conteúdo, à inclusão de frases e informações distribuídas ao
longo do vídeo e, principalmente, à qualidade visual do material trabalhado.
Com a vinculação massiva dos conteúdos audiovisuais, os consumidores passaram a

adotar uma postura cada vez mais exigente. Sendo assim, publicar um vídeo sem
qualidade de edição pode não produzir o resultado esperado, mesmo que o conteúdo
incorporado seja de extremo valor para o usuário.
Dessa forma, investir na qualidade da edição de vídeo pode determinar o sucesso ou

o fracasso do tema associado. O profissional de edição de vídeos é tão importante,
quanto aquele que produz o conteúdo que será transmitido e, como tal, merece o
reconhecimento pelas técnicas utilizadas e pela qualidade obtida.
Entretanto, não custa repetir: a capacidade de se adaptar às constantes mudanças e

transformações que permeiam o mercado digital, pode ser determinante para o seu
sucesso. A demanda por criação de material multimídia é abundante e um profissional
qualificado tende a ser disputado pelos vinculadores de conteúdo.
Estou fazendo um aplicativo de finanças e uma das funcionalidades dele é calcular o

valor total de todas as minhas compras em um dia. Para isso, tenho um método que
recebe um array com os valores de cada uma das compras que eu fiz no dia:
java
O método percorre o array de valores, incrementa a variável `totalHoje` com o cada

um dos valores e imprime em meu log o que ele está fazendo.
Se testarmos esse método passando o array: `double[] gastos = {30.0, 10.0, 20.0,
15.0, 25.0};` olha só o que acontece: imagem. E o segundo é que eu levei um
ÀrrayIndexOutOfBoundsException`, ou seja, tentei **acessar uma posição do array de
gastos que não existe**. O que será que está causando isso no meu código?
Verificando melhor o meu método, percebi que o culpado de isso ter acontecido é que
eu usei um `++indice` em vez de usar ìndice++` para incrementar a variável índice!
Você sabe qual é a diferença entre eles? Vamos lá!
- `++indice` vai incrementar o valor de indice e me retornar o valor já

incrementado.
- ìndice++` vai me retornar o valor de indice no momento em que é chamado e depois
incrementar esse valor.
Mas, calma aí, como isso funciona na prática? Vamos ver o exemplo abaixo:
java
Como eu chamei o `++indice` no método, logo a primeira vez que ele entrou no
`while` o valor de indice era 1, por isso ele "pulou" a primeira posição. E o
segundo problema foi que meu índice ficou maior que o tamanho do array de gastos
antes de ele passar pela condição do `while`.
Então para eu consertar o meu método basta eu trocar `++indice` por ìndice++` e
agora, olha o resultado:
imagem eu incrementar o número de compras e usar o getter para me retornar esse

número atualizado.
Vimos que as vezes são os pequenos detalhes que fazem toda a diferença em nosso
código e que precisamos prestar atenção no comportamento de cada um dos comandos
que usamos para garantir que o código vai funcionar da maneira que esperamos. Você
já sabia dessa diferença?
**Você pode aprender mais sobre esse e outros comandos comuns à diferentes
linguagens de programação no nosso curso de [Lógica de Programação I: comece na
carreira com JavaScript]. Ainda, para garantir que bugs como esses não vão acabar
indo pra produção você pode fazer nosso curso de [Testes: TDD com Java].**
Fui contratado por um e-commerce para criar modelos de inteligência artificial que
ajudam a entender melhor os clientes.
Esses modelos serão usados para saber quanto vai custar o frete de um produto, ver
se um cliente vai comprar ou não e agrupar clientes com gostos parecidos.
Mas como funcionam esses algoritmos? Teremos apenas um para fazer todas essas
funções? Temos que treinar cada algoritmo?
## O aprendizado de máquinas
Em todos os casos queremos ensinar a máquina a trabalhar com os nossos dados. Por
exemplo, para calcular o preço de frete de um produto. O frete pode ser diferente
dependendo da taxa de cobrança para a distância e quantidade de produtos.
Essa taxa não tem um valor fixo, ela depende de outros fatores do mercado como o
preço do combustível, os impostos em cima dos produtos, entre outras coisas. De
toda forma, quando um usuário pedir para calcular o frete, a gente deve poder
estimar um valor.
Porém, como podemos estimar o frete se a taxa pode mudar? Mesmo com a taxa mudando
o seu valor, podemos utilizar valores dos fretes passados como forma para estimar o
frete futuro. Ou seja, podemos ter um modelo, **um algoritmo de inteligência
artificial**, que estimará o frete para a gente.
Para isso, basta treinar esse algoritmo com os fretes antigos, ensinar a ele como
eles foram calculados. Quando um frete novo for ser calculado ele pode utilizar
esses dados para descobrir o valor que queremos.
Nesse caso, estamos ensinando a máquina como trabalhar com os nossos dados, logo,
estamos supervisionando o aprendizado da máquina. Por isso, dizemos que esse
algoritmo é um algoritmo de **aprendizado supervisionado**.
No aprendizado supervisionado passamos todos os dados para treinar o modelo. Isto

é, passamos os dados e os resultados. Com base nisso, o algoritmo descobre uma
forma de trabalhar com os dados.
Vimos que podemos utilizar esses tipos de algoritmos para prever o preço do frete,
mas ainda temos que classificar os clientes e agrupá-los por seus gostos, como
podemos fazer isso?
## Classificando os dados
Temos que descobrir se um cliente que vai comprar ou não um produto no site. Para
isso, podemos utilizar algumas informações como se ele veio de um link externo,
como e-mail, ou um anúncio, se ele olhou a descrição de outro produto, se ele tem
cadastro.
Podemos utilizar dados de acesso dos usuários para treinar o modelo a classificar
se o usuário pode comprar ou não. Podemos pegar esses dados e falar para o nosso
algoritmo: olha, esse usuário veio de um link externo, não olhou a descrição, tem
cadastro e comprou o produto.
Já esse outro, não veio de link externo, olhou a descrição, não tinha cadastro e
comprou o produto. Para cada um dos comportamentos no site, treinamos a máquina com
os dados e com os resultados. Quando um novo usuário acessa a página, podemos falar
para o modelo qual foi o seu comportamento.
Assim, o modelo consegue predizer se esse novo usuário comprará ou não. Nesse caso,
assim como no frete, estamos passando os dados e os resultados para treinar nosso
algoritmo. Contudo, ao contrário do outro, não estamos tentando prever um valor e
sim uma **classificação**.
Estamos querendo classificar um usuário em vai comprar ou não vai comprar.

Portanto, esse tipo de algoritmo - que também é um algoritmo de aprendizado
supervisionado, já que estamos passando os dados e os resultados para ensinar o
modelo - é chamado de **algoritmo de classificação**.
Enquanto que o algoritmo para calcular o frete é chamado de **algoritmo de

regressão**. Esses dois tipos de algoritmo são os mais conhecidos, e mais
utilizados, algoritmos para o aprendizado supervisionado.
Todos esses algoritmos, como o aprendizado de máquina no geral, utiliza de funções

matemáticas para treinar os modelos. No nosso primeiro exemplo, podemos utilizar,
por exemplo, a [**regressão linear**], enquanto que para classificar, nós podemos
utilizar o [**algoritmo de Naive Bayes**], por exemplo.
Legal! Vimos como resolver dois dos nossos problemas. Basta agora, descobrir como
podemos agrupar os clientes.
## Criando grupos
Olhando para os algoritmos que conhecemos, podemos pensar que criar grupos de
clientes é um problema de classificação. De fato, podemos aplicar classificação
para criar grupos para a gente, mas que grupos teríamos?
Grupos de clientes que compram eletrônicos? Grupo de clientes com até quarenta
anos? Grupo de clientes da região norte? Podemos utilizar esses grupos para enviar
e-mails especiais para cada um deles, mas e se esses clientes só tiverem isso em
comum?
Isto é, talvez nem todos os clientes que compram eletrônicos ou os clientes que
moram em uma determinada região tenham gostos parecidos.
Mas então, como podemos agrupar os clientes? Vimos que podemos classificar nossos
dados, mas isso poderia gerar grupos não muito próximos ao que queremos. E se, ao
invés de nós criarmos os grupos, falar para o modelo agrupar os dados da maneira
que ele achar melhor?
Dessa forma, por meio do algoritmo implementado, o modelo associa um dado a outro e
dessa forma cria os grupos.
Ao contrário da classificação, estamos passando para o modelo apenas os dados e não

os resultados. Ou seja, não estamos supervisionando o aprendizado, logo, dizemos
que esse é um algoritmo de **aprendizado não supervisionado**.
Diferente do aprendizado supervisionado, neste tipo de aprendizado nós não passamos

os resultados para ensinar o algoritmo. O próprio algoritmo pega o conjunto de
dados e descobre como trabalhar com eles. Os tipos de algoritmos mais utilizados
nesse tipo de aprendizado são o [**clustering**] e as [**regras de associação**].
Um exemplo de algoritmo é o [**K-Means**].
## Para saber mais
Além desses tipos de algoritmos, existem também o chamado aprendizado de reforço.

Nele a máquina interage com o ambiente.
Essa interação gera um feedback, positivo ou negativo. Caso seja um feedback

positivo, a máquina grava que pode realizar essa ação novamente, em caso de
feedback negativo, o modelo sabe que não pode executá-lo novamente.
Essa foi uma breve introdução sobre o tema de aprendizado de máquina. Para cada
conjunto de dados, podemos aplicar diferentes algoritmos e modelos para alcançar os
melhores resultados.
Aqui na Alura temos a [**Formação Machine Learning**].
Nesta formação, você verá algoritmos de classificação e algoritmos não

supervisionado. Aprenderá sobre processamento de linguagem natural, validação e
otimização de modelos. Além de sistemas de recomendação e redes neurais.
imagem
Quando estamos fazendo um jogo do tipo _tower defense_ cada torre dentro do nosso
jogo precisa verificar qual o inimigo mais próximo dela, com o intuito de atacar
ele. Para isso, podemos implementar um comportamento de **Radar** nessas torres.
imagem, ela pare e então, no frame seguinte (dia seguinte), ela volte para esse
método a partir do ponto em que parou. Como faremos isso?
Normalmente, quando queremos interromper a execução de um método ou função, usamos

a palavra-chave `return`, e assim o compilador já sabe que ele deve sair daquela
função. Mas dessa vez, não queremos que ele somente saia, precisamos que o
computador salve o ponto onde ele parou para poder voltar depois, e por isso,
precisamos usar outra palavra-chave junto com o return.
Essa palavra-chave é o **yield**. Como não queremos retornar nenhum valor de fato,
vamos apenas adicionar a linha `yield return null` no final do loop `for`, assim,
toda vez que o computador executar essa linha, ele deve sair dessa função e
aguardar o próximo frame para continuar executando ela.
csharp
Para executarmos uma `coroutine` utilizamos o método `StartCoroutine`, passando a

função como parâmetro.
csharp
Dessa forma, o loop dará apenas uma volta antes de parar, e isso acaba demorando
demais para completar. Podemos dar mais voltas nesse loop antes de pararmos.
csharp
Assim, temos um processamento mais uniforme, e se olharmos de novo na janela do

_Profiler_ da Unity, veremos que o _framerate_ do nosso jogo fica ali em torno dos
4000 quadros por segundo.
![]
Dessa forma, podemos utilizar coroutines para dividir o processamento de tarefas em

mais de um frame e assim não temos uma queda brusca na atualização do jogo porque
alguma função está demorando muito para ser executada.
Veja os [**cursos de jogos**] que temos aqui na Alura, com certeza você vai achar
algo que te interesse. Além dos cursos de [**Unity**] temos outras ferramentas como
[**Cocos Creator**] e [**TIC-80**].
imagem
Não falo dos Estados Unidos ou da Europa, onde existe esse problema em grau menor,
mas existem outros, como o dump de uma tecnologia (preparar o jovem para ser um bom
consumidor dos produtos de uma empresa através da doação pela empresa de
equipamentos, softwares e conteúdos e, consequentemente, com o conhecimento da
dobra mais escondida da alma do aluno).
Numa palestra perguntaram como um software pode ser usado em escola sem verba
suficiente? Com simplicidade, a palestrante respondeu: há escolas que compram
quantidade de equipamentos menor do que o número de alunos e os alunos os utilizam
em dupla, em trio…
Isso dá oportunidade para trabalhar a colaboração, um comportamento esperado para

cidadãos do seculo XXI. (A oportunidade nasce das deficiências. Com isso não estou
dizendo que se quer a deficiência, mas quando ela existe, procura-se ver nela a
oportunidade).
É isso que encontramos no fórum, por exemplo, da Alura. Procuramos entender a

questão de um problema em diversas perspectivas; diversos sào os alunos, diversas
as posições. Procuramos discutir os diversos caminhos de soluções. Encontramos
diversas solucoes e adotaremos uma delas pelo tempo em que ela for uma solução.
E dessa forma também flutuam as empresas modernas. Como casamento. Unimo-nos para
expandirmo-nos.
E assim desatamos o nó górdio.
Quando falamos em relacionamentos interpessoais, é importante entender um pouco

mais a fundo como lidar uns com os outros e dar um feedback da maneira correta. Na
Alura temos um curso de [**Relacionamentos pessoais**] que fala exatamente
disso. :)
- "Quero ser mais saudável."
- "Quero mudar de trabalho."
- "Quero fazer uma especialização na minha área profissional."
- "Quero viajar mais."
- "Quero ter mais tempo livre."
- "Quero ver mais meus amigos."
- "Quero trocar de carro."
Podemos fazer listas com metas em qualquer período do ano, mas parece que Dezembro
é um mês onde as pessoas mais se inspiram para pensar no que elas querem fazer de
diferente a partir do ano novo.
A pessoa está motivada e tudo vai muito bem, até que um dia ela não consegue
cumprir algo que estava na lista… Pronto! Esse é o motivo que bastava para ela
deixar a sua meta de lado e pensar:
> _"Ah! deixa, não ia dar certo mesmo..."_
## 1\. Um novo hábito deve partir de uma decisão consciente.
Criar listas é muito simples: você simplesmente anota tudo o que espera conquistar
em um determinado período de tempo. Até aqui ok. mas e depois?
Quando você falar alguma frase relacionada a uma mudança de hábito, como por
exemplo "quero emagrecer" ou “quero aprender inglês”, lembre-se que isso requer que
você tome uma atitude e pense a respeito para preparar um plano de ação.
Uma sugestão para você começar a criar o seu plano de ação agora é pensar em
objetivos e metas. Então se eu quero emagrecer vou pensar da seguinte forma:
> _"Meu objetivo é perder 6 quilos em 3 meses"_
Perceba que além do que você espera alcançar é interessante determinar um prazo
também, isso te ajudará a manter o foco. Agora vem as metas:
> - _"E para isso vou me matricular na academia para fazer musculação 3 vezes por
semana e aula funcional 2 vezes por semana."_
>
> - _"Também, vou fazer mais caminhadas porque em breve quero ter condicionamento
para correr aquelas corridas de rua de 5 km._
>
> - _" Então para me ajudar a acompanhar esses quilômetros percorridos vou usar um
aplicativo no celular, como o [**NikeRun**] por exemplo, onde posso criar treinos
iniciantes com foco em aumentar a intensidade das corridas."_
>
Agora se você quer aprender inglês (ou outro idioma), siga o que fizemos no exemplo
acima, primeiro o objetivo:
> _"Meu objetivo é aprender o básico de inglês em 6 meses."_
Então vem a meta:
> _"Para isso, vou estudar uma unidade por dia no [**Duolingo**], assistir filmes
em inglês com legenda para me familiarizar com o idioma, e logo assistir sem
legenda para ver como vai a minha compreensão."_
Tem pessoas que estudam ou se exercitam melhor durante a manhã, outras à noite,
cada um precisa experimentar diferentes horários para ver como se adequam.
Muitas vezes também temos limitação de tempo, concordo com você que fica difícil
conciliar tantas coisas. Para nos ajudar neste ponto, lembre-se de priorizar as
coisas que você tem que fazer e desenvolva muito a sua disciplina.
Vai ter dia que a preguiça vai querer te dominar? Vai, mas lembre-se que se você
não tiver foco e disciplina as coisas não mudarão.
Ter consciência das coisas nos ajuda a evitar lançar palavras ao vento. Então
quando você pensar em adotar um novo hábito, questione-se o porquê ele é
importante, o que você espera conquistar e principalmente como fará e em quanto
tempo.
No caso de eu querer emagrecer, por exemplo, é importante porque quero me sentir

melhor, ser mais saudável.
E quero aprender inglês porque estou programando uma viagem para fora do Brasil e
quero me virar bem ou porque quero me destacar na minha carreira, afinal de contas
muitas vagas de trabalho requer inglês e eu não quero perder oportunidade porque
não tenho conhecimento neste idioma.
## 2\. Desaprender um hábito antigo
Muitas vezes fazemos tantas coisas porque nos acostumamos, então, perdemos a noção
de que algo poderia ser feito diferente.
Imagina uma pessoa que vai dormir tarde e que precisa acordar cedo, mas como ela
sempre acaba perdendo a hora (ou saindo da cama praticamente se arrastand0, sempre
bate aquele arrependimento e ela diz:
> _"Hoje vou dormir cedo."_
Ao chegar em casa ela repete o seu ritual e pronto: mais uma vez ela vai dormir
tarde.
Se você se identificou com este exemplo saiba que nem tudo está perdido.
Existem técnicas que podem nos ajudar a lidar melhor com isso, mas antes tenha
consciência sobre o que te incomoda e pense em alternativas para reverter esse
quadro.
A disciplina é um elemento fundamental neste processo. Uma pessoa pode querer

dormir mais para ficar mais disposta no dia seguinte. Legal, isso indica que ela
tomou consciência de que dormir poucas horas tem prejudicado o seu rendimento ao
longo do dia.
Mas quando chega a hora de dormir ela pensa:

> _"Queria dormir, mas não tenho sono, vou continuar acordado."_
**Resultado**: mais uma manhã repleta de sacrifícios para se levantar.
Então na próxima vez, que tal se ela agir diferente?
Ela pode agir assim:
> _"Preciso dormir porque amanhã terei um dia longo, e vai se deitar."_
Uma hora o sono chega e ele consegue dormir.
## 3\. Tenha paciência
Tudo é muito imediato. Se você espera uma página web abrir em 3 segundos já é
motivo para se incomodar. Agora imagina deitar na cama para dormir sem sono?
Provavelmente você vai se levantar e ficar até tarde esperando o sono chegar.
Então lembre-se que toda vez que você quiser **adquirir novos hábitos é importante
ter paciência**, porque podemos fazer uma ação por tanto tempo que leva mais tempo
para o nosso corpo e mente se acostumar com essas novas rotinas. Mas lembre-se:
**não desista**.
## 4\. Repita, repita e repita
A repetição é um importante elemento para nos ajudar a consolidar novos hábitos.

Então você pode pensar:
> _"Priscila, eu fiz tudo bonitinho por uma semana e teve um dia que eu não fiz e
pronto… Parece que regredi tudo."_
Aquisição de novos hábitos não é uma ciência de tudo ou nada, se um dia você deixou
de fazer algo, respire fundo e pense:
> _"Amanhã farei melhor ainda."_
Quanto mais você repetir o hábito, maior serão as chances de você fortalecer aquilo
que você quer mudar.
## 5\. Crie recompensas
A vida é muito curta para fazer algo legal e não receber uma recompensa. E não
pense que elas precisam ser coisas caras ou complexas.
Eu por exemplo adoro comer chocolate, mas para eu seguir meu Projeto Verão (que na
verdade chamo de projeto de vida) diminuí muito a quantidade de doces.
Estou tão disciplinada que mereço um chocolate! Brincadeiras à parte, faça algo que
você goste e que além de ser uma recompensa, pode te estimular na aquisição de
novos hábitos.
Existem outras maneiras de nos ajudar a criar hábitos melhores e se você quer
entender mais o que está por trás dos nossos hábitos e como melhorá-los, conheça o
curso [**Hábitos: da produtividade às metas pessoais**].
Gostou deste post?
Aproveite e compartilhe com seus amigos, pode ser útil para eles também :)
Aproveite para nos seguir nas redes sociais para ter acesso a outros conteúdos como
este! Estamos no **[Facebook]**, no **[LinkedIn]**, no **[Youtube]** e no
**[Twitter]**.
imagem
Em jogos, é comum termos sempre muitos arquivos de áudio sendo executados ao mesmo
tempo,alguns deles são efeitos sonoros (passos, ataques, inimigos, ambiente, etc…),
já outros compõem a trilha sonora.
Com tantos objetos de áudio dentro de uma cena, como controlamos o volume do jogo
de forma centralizada? Pense em uma tela de configurações onde temos dois
_sliders_, um para controlar o volume da música do jogo e outro para ajustar os
efeitos sonoros.
imagem’ to script”.
![]
Uma vez que a variável foi exposta para o código, ela fica visível na aba "exposed
parameters" - parâmetros expostos - no canto direito da janela do audio mixer, é
aqui que podemos renomear esses parâmetros.
![]
Agora, criaremos um script que recebe um mixer e o nome do parâmetro que queremos
alterar para que possamos usar essas informações e ajustar o som do jogo de acordo
nosso slider.
Para isso, vamos criar uma função `MudarVolume` que recebe como parâmetro um valor
do tipo float. Sabemos que esse valor está entre 0 e 1, uma vez que quem vai chamar
esse método é o próprio componente **Slider**. Assim, calcularemos o volume
desejado utilizando a função `Mathf.Lerp` e passar o valor calculado para o _mixer_
utilizando o método `SetFloat` dele.
csharp
![]
Como falamos, utilizaremos o componente **Slider** para chamar o método

`MudarVolume` e faremos isso utilizando o evento "On Value Changed" - Quando o
valor mudar - do próprio componente **Slider**.
Para adicionarmos uma "resposta" a um evento podemos clicar no “+” logo abaixo
dessa propriedade. Com isso, podemos fazer com que esse evento chame o método
“mudarVolume”.
![]
Fazendo isso para os dois **Sliders**,temos cada um deles controlando um grupo

diferente o volume da música e dos efeitos sonoros separadamente.
Você conhecia os mixers de áudio da Unity? Já tinha utilizado em algum projeto?

Como você costuma separar os grupos do seu programa?
Aproveita e passa lá na [**Alura**] para conferir os cursos de Unity que temos!
No dia 27 de Janeiro a Oracle anunciou o fim do suporte ao plugin do Java nos

navegadores. Isso causou muitos rumores e um pouco de confusão por parte de alguns
desenvolvedores.
https://youtu.be/EZR7CZ8oWqg
Quer aprender mais sobre Java? Temos uma [**Formação Java**] somente sobre o
assunto!
Siga os istrutores no Twitter: Gabriel Ferreira -

[http://twitter.com/devgabsferreira] Alberto Souza -
[http://twitter.com/alberto_souza].
Esse é o terceiro post da [série dicas de React] e hoje vamos falar de padronização
de código com **ESlint**, **EditorConfig**, **Prettier** no **VSCode**
É bem comum que ao trabalhar com um time em um projeto em algum momento você passe
pela situação de sem olhar no github o histórico de quem escreveu um código (famoso
git blame)você identifica o desenvolvedor dono do código pelo estilo de como ele
separa o if, se ele usa ponto e vírgula, se ele prefere aspas simples ou não e em
alguns casos o pessoal fica horas e horas discutindo sobre quem estaria certo com
relação a esse tipo de coisa.
Na prática o que realmente tem valor nessas discussões é quando a gente para e faz
o commit para entregar a feature que estava em desenvolvimento, mas é inegável que
ter uma padronização de código ajuda a dar manutenção e nesse post vamos falar de
algumas ferramentas que vão ajudar a não ter a carga mental de pensar em diversas
dessas coisas além de automatizar todo o processo de correção do nosso código
dentro do **Visual Studio Code**.
## Preparando tudo
Para esse post é legal você já ter trabalhado com react ou em projetos JavaScript e
conhecer o [**create-react-app**] que inclusive é o que vamos usar para criar um
projetinho novo para esse post.
imagem.
O ponto é, cada um tem suas preferências uns preferem que os códigos usem espaços,
outros preferem usar tabs. O [**editorconfig**] serve como um guia para que seu
editor favorito consiga saber qual padrão de espaçamentos ele deve usar. Por
exemplo muitas pessoas gostam de usar 2 espaços, outras 3 espaços ou 4.
Se alguém do seu time usar algum editor que tenha algum tipo de autoformatação
baseada nas preferências pessoais de 2 espaços, fizer um commit isso vai pro seu
histórico do versionamento normalmente.
Quando algum outro dev que mexer nesse arquivo tiver configurado no seu editor 4
espaços e também usar um autoformatador essas edições irão aparecer no seu commit
como alterações poluindo assim o histórico do seu projeto.
Para prevenir isso, sempre que criar um projeto novo crie um arquivo
**.editorconfig** na raíz do mesmo com pelo menos algo próximo das configurações
abaixo.
`./.editorconfig`
```
// Remova os comentários quando for usar em seu projeto :)
root = true // especifica que seu projeto inteiro a partir deste ponto irá ter um
padrão baseado nas configurações deste arquivo
[*] // Aqui estamos dando match em TODOS os tipos de arquivos, mas você poderia
especificar passando algo como: [*.{js,py}]
indent_style = space // Força que mesmo que alguém aperte tab, ele seja convertido
para espaços isso ajuda a padronizar o tamaho da distância entre todos os editores
já que o tab varia muito o espaçamento
indent_size = 2 // Aqui estamos forçando que mesmo que o usuário de um tab ele seja
equivalente a 2 espaços
charset = utf-8 // Forçamos o encode utf-8
trim_trailing_whitespace = false // Aqui estamos removendo espaços desnecessários
que ficam no final de uma linha
insert_final_newline = true // Isso aqui é uma coisa que eu não sabia mas envolve
que algumas ferramentas antigas ignoravam a última linha de arquivos caso elas não
fossem preenchidas
```
imagem, assim todo mundo vai ter um código padronizado onde isso é garantido a cada
save que você der em um arquivo.
imagem
imagem
imagem
Minha amiga que possui um clube de assinaturas começou a utilizar o [**Growth

Hacking**] após conhecer um pouco mais sobre ele.
Ela pediu a minha ajuda para ver como poderia começar a resolver um problema: a
maioria das pessoas, que experimentavam o período gratuito do clube, não
continuavam a assinar, ou seja, não pagavam pelo clube.
Queríamos entender o momento específico em que o usuário pensava em cancelar o

plano e, nessa fase, abordá-lo com alguma ação que ajudasse a reverter a situação.
Ela queria dar um empurrãozinho, ajudá-lo a entender o produto e, com sorte, manter
a assinatura.
Mas será que existe alguma forma de entender o caminho que o usuário percorre e
identificar com precisão esse momento em que ele desiste? Com isso poderíamos
definir ações para este momento, fazendo com que os clientes continuem com o clube
de assinatura.
Então, ela decidiu desenvolver essa trajetória dos clientes, da forma que
acreditava que acontecia.
Começou a escrever em um papel as fases que ela acreditava que o cliente passava
para assinar o clube de assinaturas:
- Interesse, no qual o cliente descobre o clube;

- Análise, onde o cliente começa a considerar assinar, mas ainda está avaliando;
- Assinatura gratuita: quando o cliente assina o clube, mas durante o período
gratuito;
- Assinatura paga: quando cliente começa a assinar, de forma paga.
Nós avaliamos segundo o que acreditamos acontecer, mas, assim como um dos autores
do livro "Hacking Growth", [**Sean Ellis**] diz, Growth Hackers não adivinham,
testam.
Então, não conseguimos definir nada a respeito do nosso produto com precisão,
baseadas no que achamos que acontece. Precisamos de algo que traga valores mais
concretos do próprio usuário.
E como podemos fazer isso?
## Afunilando os dados
Assim como no [**marketing de conteúdo**], **existe um funil no Growth Hacking**,

que vai mostrando os passos do cliente para nos ajudar a perceber os momentos em
que os usuários se interessam e nos quais desistem de assinar. E que era muito
diferente do pensado por ela.
Ela pensou que o funil era assim:
![]
Quando, na realidade, ele é dividido nessas etapas:
![]
**O funil de Growth Hacking**, em vez de nos apontar qual tipo de conteúdo devemos
criar em determinada etapa - como é no funil de marketing de conteúdo -, ele nos
mostra exatamente essa etapa em que poderíamos estar perdendo os clientes, para
que, então, possamos definir ações e experimentos de Growth Hacking para melhorar
essas etapas.
**As métricas** utilizadas para avaliar cada fase do funil variam de acordo com a
forma com que a empresa lida com os clientes em cada fase, não sendo exatamente a
mesma para todas as empresas. Assim, a empresa deve escolher quais são as métricas
que combinam com o objetivo dela naquela etapa.
Então, o que precisamos de fato considerar quando montamos nosso funil?
# Funil do Growth Hacking
O funil de Growth Hacking possui cinco fases:
## Aquisição
A aquisição é a fase na qual o usuário começa a conhecer o clube de assinaturas.

Esse conhecimento pode acontecer por meio de uma propaganda nas redes sociais,
publicação de algum parceiro do clube, um conteúdo sobre clubes de assinatura, a
busca da pessoa por chocolate ou até mesmo a publicação de outro usuário que
decidiu compartilhar sua experiência.
Nessa etapa, as ações de Growth hacking são focadas em todo conteúdo e páginas que
mostram como sua empresa, produto ou serviço podem auxiliar a pessoa, conquistando
o cliente.
Então, quais métricas minha amiga poderia utilizar para avaliar o desempenho dessa
fase?
As métricas que minha amiga decidiu avaliar foram:
- o número de visitantes no site, principalmente nas páginas de informações e

depoimentos,
- gastos com propaganda e quantidade de pessoas que clicavam na propaganda.
## Ativação
Na ativação devemos proporcionar uma boa primeira experiência para o usuário.

Então, a primeira página que ele acessa deve carregar rapidamente, ter um design
que agrade e informações e conteúdos que chamem a atenção dele.
Além disso, nessa etapa, é quando o cliente realmente demonstra um interesse maior
em adquirir o serviço. No caso do negócio da minha amiga, é quando eles fazem os
testes e se inscrevem na newsletter para receber novidades do clube.
Logo, a métrica avaliada por ela nessa fase é a quantidade de pessoas que se
inscrevem na newsletter de acompanhamento, na qual ela só envia conteúdos a
respeito de chocolates e curiosidades a respeito do alimento.
## Retenção
A retenção é a etapa na qual o usuário se inscreve no clube de assinaturas pelo

período gratuito de um mês ou assina a newsletter disponível no site. Isso quer
dizer que ele se interessa e que quer estar sempre em contato com a empresa.
Nessa fase, minha amiga avaliou a quantidade de pessoas que se inscreviam para o
período de teste de um mês gratuito do clube de assinaturas e de onde elas vinham.
Analisava quantas pessoas se inscreviam sem participar da newsletter e quantas se
inscreviam depois de receberem a **newsletter**.
## Faturamento
Nessa fase é quando o cliente sai do período de teste, ou acaba o mês gratuito do
clube de assinaturas, e ele continua a fazer parte do clube, pagando para receber
mensalmente a caixa de chocolates em sua casa. Dessa forma, ele passa a gerar um
faturamento para o clube, tornando-se realmente cliente.
Então, ela começou a analisar exatamente este número: quantas pessoas, depois do
período de teste, continuavam a assinar o clube e começavam a pagar para receber a
caixa com chocolates.
## Indicação/Recomendação
Essa etapa é quando o cliente que já assina o clube compartilha sua experiência e
indica o serviço para alguém. Pode ser por meio de alguma publicação nas redes
sociais ou até mesmo recomendar diretamente, tanto por conversa com a pessoa quanto
pela interface do clube, que permite que a pessoa convide amigos usando o e-mail.
Como não tem como fazer uma análise completa com o número de todas as pessoas que
indicam o clube, pois muitas indicações podem acontecer pessoalmente e não dê para
medir realmente, ela tentava acompanhar através dos compartilhamentos nas redes
sociais do site e dos perfis do clube de assinatura.
Além disso, nessa etapa, ela sempre investiu bastante em trazer um bom atendimento
para as pessoas, tanto no site, e-mail, quanto nas redes sociais.
Desta forma, ela passou a cultivar um contato com os clientes, criando um

relacionamento. Assim, os clientes conheciam o clube, criavam uma simpatia e tinham
mais propensão a indicá-lo para outras pessoas.
# Análise do funil de Growth Hacking
Diferente de um funil de vendas, as etapas do funil de Growth Hacking não são

delimitadas e seguidas exatamente dessa maneira por todas as empresas.
No Growth Hacking, uma empresa pode ter duas etapas em uma, como a de retenção e
faturamento, por exemplo: assim que uma pessoa começa a consumir, a empresa já
começa a faturar.
Outro exemplo é a indicação vir antes do faturamento, que acontece quando uma
pessoa conhece a marca, e mesmo sem comprar nada, se identifica e a indica para
outra pessoa.
Analisando o funil, qual é a etapa em que o clube de assinaturas da minha amiga

apresenta mais problema?
Já que os clientes desistem quando devem começar a pagar pelo clube, as primeiras
ações no Growth Hacking do clube de assinatura devem ser focadas na etapa do
faturamento.
Devemos pensar em pequenas mudanças na página de pagamento, nas formas de

pagamento, analisando o custo de aquisição do cliente o quanto custa para que o
cliente assine, desde propagandas até hospedagem, o valor da assinatura e toda a
interface que diz respeito a essas etapas.
Assim, o funil de Growth Hacking, nos mostra o caminho que o usuário percorre até
adquirir o seu produto, ou serviço. Desta forma, podemos identificar em qual fase
desse trajeto o cliente está desistindo do clube de assinatura e criar experimentos
e ações focados neste momento da compra do cliente para que ele continue com o
clube.
Então, o próximo passo é criar experimentos e ações focadas nessa fase, para gerar
a atenção do cliente para começar a pagar pelo clube.
Quer saber mais ainda sobre Growth Hacking? Que tal fazer o nosso [**curso
Introdução ao Growth Hacking: crescimento para negócios digitais**]?
Cada vez mais comum no Brasil, a modalidade de [**trabalho freelancer**] requer

alguns cuidados tanto da parte da empresa, quanto da parte do contratado.
Por ser uma relação onde não há vínculo empregatício, o freelancer tem a
possibilidade de desenvolver seu trabalho [**para várias empresas ao mesmo
tempo**].
Porém, muitas vezes o freela aceita fazer o trabalho sem a formalização do vínculo
temporário. Ou mesmo a própria empresa contratante não toma esse cuidado, o que
pode trazer várias complicações chatas.
Por isso, é importante elaborar um contrato de freelancer para firmar o acordo de

trabalho temporário e, assim, evitar dores de cabeça.
Mas você sabe como elaborar esse documento? Continue com a gente e descubra!
## Identifique as partes envolvidas
Assim como todo contrato, é importante identificar corretamente e com detalhes

tanto o profissional contratado quanto a empresa contratante. Isso quer dizer
incluir dados como nome, endereço, documentação (CPF e RG para pessoas físicas e
CNPJ para pessoas jurídicas), nacionalidade e estado civil.
## Descreva o trabalho
Uma descrição completa do que irá ser realizado pelo freela é um dos itens mais
importantes do contrato. É essencial que todo o trabalho a ser entregue seja
descrito com o máximo possível de detalhes, para que não existam reclamações de
nenhuma das partes. Lembre-se de citar quaisquer [**tarefas a serem cumpridas pelo
freelancer**], desde a mais básica até a mais complexas.
## Especifique as obrigações
Como qualquer contrato, cada uma das partes possui obrigações a serem cumpridas ao
longo do desenvolvimento do trabalho. Seja um compromisso de viagem da parte do
freelancer, por exemplo, seja o dever de fornecer estrutura por parte da empresa, é
essencial descrever esses pontos detalhadamente.
## Estipule um prazo
Como o contrato de freelancer é feito diretamente para a execução de um trabalho

específico, isso significa que ele deverá ter um prazo para acabar. Caso as tarefas
tenham um cronograma de entrega ao longo da duração do trabalho, é importante
também incluir esses prazos na cláusula. Lembre-se: quanto mais claro e detalhado
for o contrato, melhor para ambas as partes.
## Defina a forma de pagamento
Essa cláusula deve conter valores a serem pagos ao freelancer, bem como a forma
como esse pagamento será feito. Basicamente, esse item pode ser construído de duas
maneiras:
- descrevendo o pagamento no final do contrato, onde é importante incluir datas e

valores;
- ou detalhando a periodicidade dos pagamentos, no caso de um trabalho recorrente.
## Estabeleça regras para a rescisão
Uma das cláusulas mais importantes em qualquer contrato, a rescisão deve ser
detalhada e estabelecida de maneira justa para ambas as partes, determinando
sanções e multas para quando houver quebra unilateral. Ela deve conter apontamentos
como devolução de valores, cobrança de multas e, principalmente, motivos que levem
à rescisão contratual.
## Acrescente condições gerais
**Todas as outras condições contratuais devem entrar em cláusulas detalhadas. Elas

irão variar muito de acordo com o tipo de trabalho a ser executado. Analise tudo
que irá envolver a relação de trabalho freelancer-empresa e coloque no contrato
caso seja necessário.**
## Inclua informações do foro
Como todo e qualquer contrato, é importante incluir as informações do foro onde o

contrato será assinado. O foro deve ser definido a partir de um acordo entre as
duas partes, sendo que quando empresa e freelancer são da mesma cidade, normalmente
se usa o foro em questão. Nele serão decididas possíveis divergências entre as
partes.
## Tenha atenção às características do contrato de freelancer
Apesar de não existir no Brasil uma legislação que regule o trabalho de freelancer,
alguns pontos precisam ser respeitados. E o principal deles é: não deve haver nada
que caracteriza vínculo empregatício entre as partes.
**Isso significa que não deve haver subordinação em nenhum nível na relação
contratante-contratado. Como o freelancer não faz parte do corpo de funcionários da
empresa, ele não deve ter obrigações de horários, uso de uniforme, ou controle de
frequência, por exemplo.**
Em contrapartida, a empresa que decide contratar um freelancer também não tem

nenhuma obrigação trabalhista com o mesmo. Por serem trabalhadores independentes e
autônomos, freelas têm apenas os direitos estabelecidos em contrato, não cabendo a
exigência de nada existente em contratos regulados pela CLT, como férias, FGTS,
seguro-desemprego, auxílio de transporte, entre outros.
O profissional independente pode, apesar de tudo, se aproveitar da condição de

empresário para emitir notas fiscais. No Brasil, esse modelo é regulado a partir do
MEI (Micro Empreendedor Individual), pelo qual o freelancer poderá pagar seus
impostos de previdência social, além da emissão de notas.
**Apesar de não possuir direitos regulados por uma entidade externa, tanto
freelancer quanto a empresa contratante podem entrar com uma ação na justiça caso
sejam lesados por descumprimento do contrato.**
## Busque orientação jurídica
Fuja daqueles modelos prontos que normalmente são encontrados na internet. Muitos
deles possuem furos que podem ser explorados por qualquer uma das partes.
O ideal é buscar orientação jurídica para construir um contrato-padrão, o qual será

adaptado de acordo com as especificações de cada trabalho. Geralmente, boa parte do
contrato será a mesma para qualquer trabalho freelancer. Para cada trabalho a ser
realizado, pequenos detalhes serão alterados, sendo que o grosso do contrato
permanecerá o mesmo, garantindo mais segurança na relação.
**Se você trabalha ou é dono de uma empresa que tem o costume de contratar
freelancers, essa tarefa talvez seja mais fácil para você, uma vez que o
profissional muitas vezes terá que se adequar ao seu modelo já pronto de
contrato.**
Caso você seja um profissional liberal que tem o costume de trabalhar para muitas
empresas, também é importante ter um modelo de contrato. Ele será usado com
empresas que não fazem uso do documento, além de ser uma boa maneira de argumentar
com empresas que não possuem um contrato bem elaborado, ou mesmo abusivo.
## Formalize o contrato
Por último, mas não menos importante, é essencial que seu contrato de freelancer
seja reconhecido em cartório. Apesar de, infelizmente, não ser uma prática muito
comum para contratos mais simples, registrá-lo formalmente evita questionamentos em
caso de divergências.
Mantenha uma cópia do contrato com você e outra com a outra parte envolvida. Assim,
todos podem consultá-lo em caso de dúvidas, além, é claro, de ter o instrumento
legal em mãos, caso seja necessária uma ação judicial.
É importante lembrar de **sempre consultar um advogado** na hora de criar seu

modelo de contrato de freelancer!
Aproveite e siga a Alura no [LinkedIn], [YouTube] e [Facebook]!
Escutamos o tempo todo sobre os obstáculos e dificuldades que podemos encontrar

quando decidimos começar nossa carreira… Mais ainda se já estamos em alguma
atividade e optamos por migrar para alguma outra.
Em função disso, muitas dúvidas e receios acabam surgindo e a maior questão é:
> Como me preparar para enfrentar essa realidade?
A primeira coisa que todos precisamos ter em mente quando decidimos enfrentar o
mercado de trabalho é que devemos estar dispostos a arregaçar as mangas e correr
atrás do nosso foco.
Ok, isso parece uma dica bastante óbvia, mas muitos acabam se perdendo nesse
caminho e perdem o foco do que realmente queriam conseguir. Saber o que realmente
quer é essencial para começar.
E, certamente, existem alguns passos que precisamos entender melhor antes, afinal,
o que seria “correr atrás”? Sair fazendo todos os cursos da minha área? Tirar todas
as certificações possíveis? Será que o meu conhecimento já é suficiente para
trabalhar na área?
O Yuri Bett, um dos alunos da Alura, nos contou um pouco dessa trajetória dele até
conseguir seu emprego dos sonhos (dreamjob). Falou das suas experiências e
processos, além de dicas interessantes para quem se encontra na mesma situação que
ele há um tempo atrás.
> “Tem que realmente mergulhar de cabeça nos estudos, ser fora da média para se
destacar dentre tantos nesse mercado tão concorrido e conseguir o emprego dos
sonhos.”, comenta Yuri.
Ficou interessado? Confira então um pouco mais da história do Yuri baixando nosso
Ebook!
[**Como profissionais de tecnologia se preparam para o mercado de trabalho**]
Em meu preparo para a certificação da Oracle, tive que lidar com a complexidade dos
imports. Vamos verificar essa classe Àluno`:
java
Agora vou adicionar os alunos em uma lista para formar uma turma. Para adicionar
todos os alunos de uma vez usarei o método àddAll()` da interface `List`:
java
Analisando um pouco o nosso código, veja a quantidade de imports que tivemos que
fazer do mesmo pacote. Será que não tem como importar as 3 classes de uma única
vez? E se tentarmos:
java
Mas não compila! Vamos tentar de outra maneira:
java
Também não compila! Para **importarmos classes específicas** precisamos sempre de

um import cada uma para delas ou então podemos **importar todas de uma vez**
utilizando o "\*":
java
Agora teremos acesso a todas as classes do pacote java.util. Vamos supor que o meu
sistema tenha as seguintes classes:
java
Se eu tentar **importar todas as classes** do pacote dao:
java
Terei acesso a todas as classes? Inclusive as classes de subpacotes? A resposta

é... Não! Se quiser todas as classes de um pacote, precisa especificar **SEMPRE**
qual o pacote que você quer:
java
Agora sim podemos acessar todas as classes do pacote dao e do pacote factory!
O que achou dos imports do Java? Não sabia o quão restrito poderia ser? Quer saber
mais? Pensando nisso, o instrutor Guilherme Silveira criou a [**os cursos de
certificação Java**] que especifica todas as peculiaridades da linguagem Java com 9
cursos preparatórios para a certificação da Oracle!
Mauricio Linhares, engenheiro de software da Digital Ocean, tem uma longa história
até ir trabalhar nos Estados Unidos, mais especificamente na Philadelphia. Ele
começou como muitos começaram: [trabalhando remoto](trabalho-remoto-e-home-office)
para uma empresa de fora do Brasil, mas fazendo isso da sua própria casa em João
Pessoa. Depois de uma jornada aparece a oportunidade de trabalhar fora. Dada a
experiência com o inglês e de já estar ambientado a cultura de uma empresa
americana, os próximos passos ficaram mais fáceis.
Quais tecnologias estudar? Como se preparar para pedir um visto de trabalho fora do
país? Quando de inglês preciso saber? Mauricio Linhares conversa comigo desses
assuntos nesse vídeo:
https://www.youtube.com/watch?v=TVQioHZi2S0
#Carreiras de brasileiros no exterior
Há um podcast que conta [histórias de brasileiros no exterior]. No carreira sem

fronteiras você pode ouvir muitas pessoas que foram trabalhar com tecnologia, como
o Felipe que foi para a Austrália ser programador:
<iframe src="https://open.spotify.com/embed-podcast/episode/5YiIGMYpmC9pWVkyhrQi4Z"
Tem também a Andressa, que é cientista de dados no Canadá:
<iframe src="https://open.spotify.com/embed-podcast/episode/2bX9S7u3e8LJ96mIAxC1tE"
E a Giovana, que é desenvolvedora no Facebook em Londres e já trabalhou com a gente

na Alura quando morava no brasil:
<iframe src="https://open.spotify.com/embed-podcast/episode/3dDXAdCx2vSBpP2sAy3mus"
E outros episódios com artistas, designers e jornalistas que decidiram encarar o

desafio de uma outra cultura e outra língua! Vale conferir!
Quem opta por seguir uma carreira de freelancer tem vários benefícios, como
flexibilidade de horários, não enfrentar congestionamentos diários no trânsito e
liberdade para programar alguns dias de folga durante a semana.
No entanto, assim como todo trabalho, esse tipo de profissional também enfrenta
diversos desafios. Afinal, manter a organização, a concentração e a produtividade
são verdadeiros obstáculos.
Para cumprir as demandas diárias, é necessário planejar sua rotina, definir

prioridades e programar cada tarefa para que ela seja concluída sem estresse e com
qualidade. Mas como fazer isso?
## 1\. Escolha um local de trabalho
[**Quem trabalha em home office**] precisa organizar não só a rotina, mas também
seu ambiente de trabalho. Uma boa organização dependerá do local que você escolher
em sua casa como seu escritório.
Quando você escolhe onde executará as suas tarefas diárias, seu cérebro consegue
entender que aquele momento é para trabalho e não para lazer. Além disso, outra
vantagem desse espaço é que ele estará sempre preparado para você desenvolver suas
atividades.
## 2\. Defina seu horário de trabalho

Ter flexibilidade de horários é o sonho de qualquer profissional freelancer, não é?
Mas, para que você consiga entregar suas demandas, é crucial estipular qual será o
horário do seu expediente. Geralmente, quando uma pessoa trabalha em home office,
ela se perde facilmente entre o trabalho e lazer.
Uma rotina desorganizada leva o profissional a trabalhar várias horas por dia,
inclusive à noite e aos finais de semana. E isso, obviamente, é muito ruim, pois o
período de descanso é essencial para qualquer ser humano.
Nesse sentido, ao estipular um horário para trabalho você terá os seguintes

benefícios:
- mais produtividade;
- mais tempo disponível para lazer;
- melhor planejamento da sua vida social.
## 3\. Crie um ritual diário
Qual é horário em que você acorda? Quando você faz o seu horário de almoço? Ter
respostas para essas perguntas é muito importante para que você organize melhor o
seu dia. Afinal, será mais fácil definir quando é o momento para trabalho e quando
é o momento para lazer.
Então, aplicando esse ritual no seu cotidiano, você consegue cumprir as suas
demandas com mais facilidade e evita a famosa procrastinação — que tanto prejudica
aqueles que seguem carreira como freelancer.
## 4\. Estabeleça suas prioridades
De fato, grande parte dos freelancers ainda comete um grave erro quando organiza o
seu dia de trabalho: não estabelecer prioridades para as suas demandas.
Não adianta pegar uma agenda e sair anotando as suas tarefas. Elas não possuem a
mesma importância e, assim, você perderá tempo com um trabalho que poderia ser
executado em outro momento.
Contudo, existem alguns critérios que você pode utilizar para escolher as demandas
mais urgentes. Os principais, em ordem de importância, são:
- **Prazo da tarefa**: produza primeiro os conteúdos que possuem um prazo menor

para ser concluído. Nunca é demais lembrar que a pontualidade é essencial para um
freelancer.
- **Nível de dificuldade da tarefa**: suas produções estão em dia? Então, avalie a
qualidade da tarefa para descobrir por onde começará o seu trabalho. Recomendamos
que você inicie o seu dia com as tarefas mais complicadas, afinal, você terá mais
energia para pensar nas melhores ideias. As fáceis deixe por último, pois o seu
cérebro estará cansado e não será necessário pensar muito sobre um determinado
projeto.
- **Conhecimento prévio: **inicie o seu dia com as tarefas que exigem mais
pesquisas. Com o corpo mais descansado, sua mente estará mais tranquila para
absorver as informações e você estará mais disposto a conhecer novos assuntos.
## 5\. Programe cada atividade
Desafios e surpresas são bem comuns no dia a dia de um freelancer, pois é difícil
prever se cada job será fácil ou difícil. E o tempo necessário para concluir cada
demanda dependerá da complexidade do material.
Então, para evitar que você demore muito tempo em uma tarefa e prejudique sua
rotina, crie o hábito de programar as suas atividades.
Dessa forma, além de avaliar a sua produtividade com mais clareza, você poderá
organizar sua rotina com mais praticidade, já que terá conhecimento sobre o grau de
dificuldade das suas tarefas.
## 6\. Estabeleça limites para as suas tarefas
O excesso de tarefas também pode prejudicar a sua rotina: não adianta ter várias
demandas se você não consegue entregá-las dentro do prazo.
Quando você não cumpre com o combinado, certamente a sua credibilidade será
afetada. Como consequência, terá menos trabalhos para criar no futuro, pois a
confiança entre você e seu cliente ficará estremecida.
Portanto, ao listar quais tarefas serão executadas ao longo do dia, considere

somente aquelas que você tem certeza de que concluirá.
## 7\. Fique longe dos vilões da organização
É maravilhoso quando você consegue colocar todas as orientações no papel, não é? Ao

lado da organização, aparece a produtividade e mais qualidade de vida!
No entanto, tudo isso pode se perder se você não conseguir vencer os vilões da
produtividade. E, para isso, é necessário manter a disciplina, pois eles são muitos
e bem tentadores.
Estes são apenas alguns deles:
- televisão ligada;
- redes sociais (facebook, twitter...);
- serviços mensageiros (whatsapp, telegram...);
- videogame;
- preguiça;
- relacionamento com familiares e outros membros da casa.
De fato, uma das maiores dificuldades de quem segue carreira como freelancer é
explicar para seus familiares ou membros da sua residência como ocorre a sua
rotina. Afinal, apesar de você trabalhar em casa, eles não podem perturbá-lo toda
hora.
## 8\. Dê presentes como prêmio para si mesmo
Nada é mais gratificante para um freelancer do que quando ele consegue terminar uma
tarefa para um cliente, que a aprova sem nenhuma alteração. E um desempenho como
esse merece ser comemorado, então, aproveite a oportunidade para se dar um
presente!
Os benefícios podem ser variados. Já que o seu escritório é em casa, passe um tempo
com a família, jogue um videogame ou assista a sua novela preferida. Qualquer coisa
que te relaxe pode ser interessante.
E não use o tempo livre para adiantar outras demandas. Lembre-se: é importante
reservar um tempo para si mesmo.
## 9\. Reserve um período para se organizar
Essa dica pode até parecer estranha. De fato, com a correria do dia a dia, esse
detalhe passa despercebido e informações importantes podem se perder em rascunhos,
arquivos ou papéis.
Mas é mesmo essencial separar um período do seu dia para organizar como será a sua
semana. Só assim será possível economizar e preparar o seu tempo.
Use o domingo à noite ou a segunda de manhã para deixar tudo em ordem, pois nesses
dias você já sabe como será sua semana. E não se esqueça de reservar um espaço para
imprevistos — eles sempre acontecem, e podem prejudicar o seu trabalho.
## 10\. Use a técnica Pomodoro
Por fim, há uma técnica que vale muito a pena indicar. Desenvolvida pelo
italiano Francesco Cirill, a técnica pomodoro se baseia na teoria de que, quando
dividimos o fluxo de trabalho em blocos, tanto a nossa produtividade como nosso
foco aumentam em um dia de trabalho. E, nesse caso, cada bloco é denominado de
Pomodoro.
Então, para aplicar essa técnica em seu dia a dia, siga os seguintes procedimentos:
1. enumere suas tarefas que ainda não foram finalizadas;

2. com o auxílio de um cronômetro, programe o tempo limite para concluir sua
tarefa. Estabeleça 20 minutos;
3. execute uma tarefa e termine-a sem interrupção. Para isso, lembre-se de eliminar
os vilões da organização;
4. quando o tempo terminar, faça uma pausa de cinco minutos. Aqui é permitido
caminhar pela casa, interagir com a sua família ou até conversar com amigos nas
redes sociais;
5. assim que concluir sua tarefa, lembre-se de riscá-la da sua agenda;
6. depois, continue o seu trabalho. E, novamente, aplique a técnica por mais 25
minutos;
7. quando concluir quatro “pomodoros”, estabeleça uma pausa de 30 minutos.
Por fim, para conseguir resultados com essa técnica na carreira de freelancer,
coloque no papel quantos pomodoros foram necessários para finalizar as suas
tarefas. E não se esqueça desse procedimento, pois ele ajuda a entender quanto
tempo foi necessário para terminar as demandas.
Então, agora que você já sabe como deixar a sua [**carreira como freelancer**] mais
organizada, sugerimos que pratique essas técnicas diariamente. Afinal, a prática
leva à perfeição! E, caso você tenha alguma dúvida relacionada ao assunto,
aproveite a oportunidade e deixe o seu comentário! ;)
imagem
Estamos desenvolvendo um sistema web para uma empresa de ensino online. Nesse
sistema é necessário que o usuário preencha um cadastro inicial, nada muito
trabalhoso, apenas o nome, data de nascimento e o estado onde ele reside.
Temos o seguinte formulário de cadastro:
imagem**] da classe `Map`. Ele nos devolve um [**Set**], que, basicamente, é uma
coleção de elementos únicos, logo, não se repetem.
Agora vamos iterar sobre o retorno desse método para vermos se nosso método está
realmente retornando todas as siglas:
java
Ao executar esse código, obtemos o seguinte resultado:
imagem**] da classe `Map`. Ele nos devolve um `Set<Map.Entry<K, V>>`, onde K e V

são os tipos da chave e do valor respectivamente do nosso mapa. Esse retorno nada
mais é do que uma entrada contendo a chave e seu respectivo valor.
Vamos iterar esse èntrySet()`:
java
Como resultado desse código, temos o seguinte:
imagem**] e [**getValue()**] de [**Map.Entry**]:
java
E como resultado, temos:
imagem**] que retorna uma coleção contendo os valores do mapa. Assim:
java
Ao executar esse código:
imagem**] da interface `Map` para pegar seu respectivo valor. Dessa forma:
java
Para testarmos, vamos mandar a sigla RJ:
java
O resultado é exatamente o que esperamos:
imagem`
java
Se quiser conhecer mais sobre as milhares de funcionalidades trazidas pelo Java 8

confira o curso [**Java 8: Tire proveito dos novos recursos da linguagem**] da
Alura.
Quer dominar de vez mapas e coleções? Aqui na **Alura** temos uma [**formação em
Java**]. Lá é mostrado a fundo cada coleção e, também, possui um capítulo só sobre
mapas. Vale muito a pena dar uma conferida.
Quando estamos desenvolvendo um aplicativo temos uma grande possibilidade de ter

que consumir dados de algum servidor, portanto precisamos fazer alguns códigos para
fazerem a comunicação e, por boa prática, centralizamos esse código numa classe
especialista para realizar a comunicação :
java
Até a versão 4.0 do Android estavámos acostumados a utilizar a [biblioteca da
Apache] para fazer essa comunicação. Após a versão 4.0, foi recomendado usar a
biblioteca nativa do java. Vamos ver como fazer um **GET & POST** utilizando essa
biblioteca, vamos adotar que no **POST** enviaremos um JSON.
java
Geralmente a nossa classe `WebClient` fica mais ou menos com essa carinha, uns
métodos a mais para fazer outros tipos de requisição. Contudo, essa classe está
muito verbosa, estamos digitando bastante. Deve ter alguma forma de melhorar esse
código e é o que iremos fazer.
Vamos usar a [biblioteca OkHttp] para facilitar nossa vida !
Para trazermos ela para nosso projeto temos que registrá-la no nosso **gradle** :
java
Para conseguirmos usá-la, teremos que criar um objeto do tipo ÒkHttpClient`, que
será responsável pela comunicação.
java
Temos que pedir para nosso client fazer a requisição ao servidor, para isso
usaremos o método `newCall()`, que quando for executado devolverá a resposta do
servidor :
java
Estamos fazendo uma chamada que faz a requisição, mas não definimos qual é a
requisição que queremos fazer. Portanto temos que criar a nossa requisição :
java
Como vimos no código, criar uma requisição na mão daria muito trabalho, por esse
motivo estamos usando um `Builder`, atráves dele passamos as informações que são
necessárias, como a URL. Para escrever no corpo do nosso POST usamos o objeto
`RequestBody`, para criar este objeto usamos o método estático `create`, que recebe
um identificador do tipo do arquivo, representado na classe `MediaType`, e recebe o
objeto que será escrito no corpo.
Agora com o corpo da requisição pronto, temos que informar ao nosso `Builder` que
nossa requisição será um POST, passando o corpo da requisição. Com isso pronto,
basta criarmos a requisição, atráves do método `build()`.
Feito tudo isso, falta agora pegarmos o corpo da resposta e devolver como resposta
do nosso método, igual fazíamos antes :
java
Para pegarmos o corpo da resposta, temos o método `body()`, que retorna um

`ResponseBody` e para transformarmos ele em `String` usamos o método `string()`.
Desta forma, o nosso **POST** está terminado, ficou faltando fazermos o **GET** :
Java
Como podemos ver, não muda praticamente nada do que fizemos anteriormente, exceto
por não termos que falar que estamos fazendo um GET, pois já é definido por padrão.
Qual você prefere, a utilização da biblioteca nativa do Java ou usar a biblioteca
ÒkHttp` ? Vimos aqui como utilizar a biblioteca do OkHttp 3 para facilitar nossas
requisições, evitando muito código e de leitura bem mais simples !
Quer saber mais sobre Android ? Aqui no Alura temos alguns cursos bem bacanas,
confere [clicando aqui] !
imagem
Uma empresa de estacionamento precisa registrar o dia e hora de entrada e saída dos
carros e, atualmente, realiza esse processo manualmente, inserindo no sistema cada
informação em um campo separado:
Entrada:
csharp
Saída:
csharp
No final do mês, ao analisar em uma tabela a lista de entradas e saídas tínhamos

alguns valores meio estranhos:
```
Data (entrada - saída)| Hora (entrada - saída)
----------------------------------------------
12102000 1210000 | 12h30 - 11h30
----------------------------------------------
08/03/2019 10/02/2019 | 11:00 - 11:00
----------------------------------------------
01-02-2015 05/08/2019 | 10:00h - 10:30h
----------------------------------------------
00-00-0000 20/02-2006 | 23:00h - 14:30h
----------------------------------------------
31-12-2012 30-12-2012 | 12:00h - 13:00h
----------------------------------------------
2018/02/24 2018/03/07 | 11:00am - 22:00pm
----------------------------------------------
```
Essa tabela tem algumas datas que estão com os valores formatados sem padronização,
além de ter valores que não têm sentido, por exemplo:
- Entrada com data posterior a da saída (ENTRADA: 31-12-2012, SAÍDA:30-12-2012);

- Entrada com valores zerados, como (00-00-000);
- Horário com padrão americano (am e pm), indicação de horas com "h" e sem, etc.
americano.
Então, para evitar este tipo de erro, podemos deixar uma formatação já pré-
definida, ou seja, podemos criar um padrão para que esses valores sejam recebidos
sempre da mesma forma. Assim garantimos que apenas surgirão valores padronizados e
essa confusão deixa de existir. Mas como fazemos isto em C#?
Atualmente, o valor recebido de data e hora está contido em uma **String**. Com
isto nós podemos colocar qualquer valor nela seja em texto ou em número, mas a
String pode conter erros de formatação e, além disso, do jeito que está
implementada agora não contém nenhuma validação.
Utilizar String para fazer a formatação e validação demandaria muito tempo e

código, pois teríamos que fazer a formatação muito detalhada, validando cada
fragmento de data e hora, como por exemplo funções para validar se está com os
valores corretos. Felizmente, no C# temos um tipo específico para fazer essa
validação e formatação de data
## Formatação de data e hora
No C# temos o **DateTime** que é uma classe específica para trabalhar com data e
hora e também formatar de maneira mais fácil e ainda contém algumas funções para
data e hora.
Vamos utilizar a instância direta do DateTime:
csharp
E teremos esse resultado:
csharp
Este não é o resultado que nós gostaríamos. Este valor é retornado quando não
passamos nada no **construtor**, pois é a data padrão que está no definida no
DateTime. Então vamos passar os valores para o construtor desta vez e ver como
fica. Ele espera os valores de: ano, mês, dia, hora, minuto, segundo.
Então vamos usar como por exemplo a data: 01/05/2019 e a hora 13:52:22. Quando
colocarmos os valores no construtor, a **variável** terá, por padrão, os valores
que estão definidos no construtor.
Depois disso criaremos as variáveis de ano, mês e dia para o código ficar mais
legível e atribuir elas no construtor do nosso DateTime.
csharp
Mas como mostramos nosso horário formatado na tela? Usamos o **Console.WriteLine**

para isto.
csharp
Nosso valor de saída então vai ser:
csharp
Porém com isto a hora está com os valores padrão do construtor, então vamos colocar
a hora, minutos e segundos, então vamos fazer o mesmo procedimento atribuindo os
valores nas variáveis e colocar os valores no construtor.
csharp
Nossa saída vai ser:
csharp
Nossa saída está de acordo com data, hora e formato o nosso sistema operacional ou
seja se por exemplo nós rodamos este mesmo código em um [**compilador online**] que
a data, hora e formato está com formato americano qual vai ser nossa saída?
A nossa saída vai ser em formato americano, pois está pegando de acordo com o que
está definido no sistema.
csharp
Para que isto não aconteça vamos definir o locale da queremos a data, como podemos
fazer isto? Vamos primeiramente importar duas bibliotecas a **Threading** que é a
de criar um thread (um novo processamento, no nosso caso para a formatação) e o
**Globalization** para definirmos a região que queremos.
Para importar as bibliotecas temos que fazer assim e vamos por no topo do nosso
código para que fique mais organizado:
csharp
Como no compilador online não funciona, vamos testar mudando o nosso horário, que
está com o formato brasileiro, para o formato americano, passamos no construtor o
formato que queremos, "en-us," e o outro se é necessário usar as configurações de
cultura do sistema.
Então vamos colocar a modificação do horário antes da formatação da data.
csharp
Sendo assim nosso código fica do seguinte jeito:
csharp
E teremos a seguinte saida:
csharp
Vamos fazer a troca do **en-us** para o pt-BR para que sempre que tivermos uma data
ela fique no padrão brasileiro.
csharp
Mas toda vez que a gente tiver uma entrada ou saída nova temos que declarar isso no
construtor e ainda assim continua um processo manual, podendo acontecer erro mais
uma vez.
Para que este processo não seja todo manual, temos que procurar uma função que
pegue o valor atual da hora e data para fazer essa atribuição. Mas qual função
usar?
## Vamos trabalhar com o Now
Vamos utilizar a função **Now** do Datetime, que pega a data e hora atual do seu
sistema operacional, com isto ele faz a atribuição do horário para variável de
maneira automática.
E como definimos para pegar a formatação do Brasil, não precisamos nos preocupar
como vai vir a data e nem se ela será digitada errada.
csharp
Nosso valor de saída vai ser a hora atual do meu sistema.

csharp
## Conclusão
Nós começando com datas mal formatadas, onde não havia padronização e nenhum tipo
de validação para saber se a data está certa, o que dificultava o trabalho de quem
precisava analisar esses valores depois.
Poderíamos utilizar uma **String** para fazer esta validação e formatação de data,
mas isto seria muito complicado, pelas questões de tempo e de código, que ficaria
gigante.
Para isso utilizamos o **DateTime**, que formata nossa lista de uma maneira mais
padronizada e de fácil compreensão para quem vai analisar ela, as data vão ficar
formatadas de maneira correta e de mais fácil compreensão.
E aí, o que achou do post? Fica até mais fácil trabalhar com datas no c# agora, não
acha?Se quiser continuar estudando sobre o assunto, dê uma olhada em nossos cursos
na Alura de [**C#**] continue aprendendo!
A **JTA** é uma especificação do Java que facilita o trabalho com transações

distribuídas, geralmente entre um servidor de aplicação com um banco de dados
relacional. Além de interfaces e métodos, há anotações do Java que facilitam o
trabalho, evitando que seu código fique cheio de 'commits' e 'rollbacks' óbvios
espalhados por aí.
# Obtendo uma transação manualmente
User managed transactions
(exemplos de codigos curtos com cada cenario)
no hibernate/JPA?
no Spring?
no Container CDI?
# rollback e timeout
# Container-Managed Transactions e suas anotações
imagem
Uma editora de livros é seguida nas redes sociais por jovens entre 20 e 34 anos
(principalmente) e suas publicações são somente textos que dizem coisas como:
> "Um novo livro foi lançado hoje com a propositura de apresentar um novo mundo de
fantasia para os leitores ávidos por essas aventuras".
Esse texto possui uma **linguagem muito formal** para se comunicar com jovens.
Entender a linguagem com a qual devemos conversar com o nosso público-alvo é
essencial, porque será por meio dela que um relacionamento entre a marca e o
cliente será criado para que, eventualmente, ocorra a venda.
Fazemos parte da equipe de marketing dessa editora e vamos utilizar um método para
definir qual a melhor linguagem para o seu público e, dessa forma, conectar-se com
ele.
## Primeiro passo: Conhecendo o público
Pensamos em três formas para conhecer nosso público. A primeira foi entrar em
alguns perfis de pessoas que nos seguem nas redes sociais, principalmente aqueles
que mais interagem com o perfil da editora.
Assim, começamos a anotar como a maioria delas se comporta em cada rede social.
Notamos que muitas utilizam gifs no twitter, imagens mais elaboradas e textos mais
longos no Facebook, e imagens bonitas com frases curtas no Instagram.
A segunda forma foi analisarmos nossos números e **métricas** de cada rede social.
O Facebook e o Instagram apresentam, em uma ferramenta própria deles, qual a faixa
etária e a cidade da maior parte do seu público.
Por último, montamos um formulário que enviamos para quem já é cliente da editora,
possui uma conta na loja e já efetuou ao menos uma compra. O objetivo do formulário
era conhecer mais os clientes, seus hábitos de leitura e de compra.
Fizemos as seguintes perguntas no formulário:
- nome,
- idade,
- gênero,
- região em que mora,
- profissão,
- quanto tempo passam na internet,
- quais as redes sociais que estão cadastrados,
- gênero literário favorito,
- por qual meio compram livro normalmente - online ou livraria/sebo
- quantos livros compram, em média, por mês e
- quantos livros leem por mês
- se compram mais e-book ou livro físico
- qual outro hobby eles praticam, além de ler.
A partir das respostas do formulário, vimos quais são as redes sociais mais usadas
pelos nossos clientes e quais os principais interesses da maioria deles analisando
qual a resposta escolhida pela maior parte. Assim, fomos capazes de traçar, cada
vez com maior precisão, o perfil de nosso público para, assim, saber como será
nossa comunicação com ele.
Com essas informações das pesquisas, tanto do questionário quanto nas redes
sociais, descobrimos que nosso público mudava bastante do Facebook para o Twitter.
Também levamos em conta a questão dos canais pelos quais queremos nos comunicar com
as pessoas. Cada um tem um tipo de público, que, por sua vez, possui um tipo de
linguagem. Então, em cada canal devemos ter uma **linguagem diferente de acordo com
a maior parte do público que o utilizada e com o nosso objetivo naquele canal.**
Por isso, decidimos focar primeiro em criar toda nossa linguagem para somente uma
rede social. A escolhida foi o Twitter, já que notamos que a maior parte da nossa
interação direta com as pessoas acontecia naquele perfil.
## Segundo passo: Criando personas
Outra dado que descobrimos foi que a maioria das pessoas que respondiam que
gostavam mais de mexer no Twitter eram mulheres, universitárias, que leem mais
livros impressos.
Quando fomos analisar as métricas e o perfil dos nossos seguidores no Twitter,

essas informações bateram! Revelando que a maioria dos perfis que nos seguem são
mesmo de mulheres, o que mostra que nossa análise está dando certo!
Então vamos fazer uma abordagem mais focada na linguagem que a maioria dessas
pessoas usam.
Entrando no perfil de algumas delas também vimos que a maioria era comunicativa,
sempre entrando em contato com as marcas e empresas que acompanhavam. Além de
sempre compartilharem os livros que leem, fazendo pequenos comentários com fotos e
gifs.
Não seria mais fácil então definir a linguagem que vamos utilizar se fossemos falar
com uma pessoa em específico, a qual conhecemos os hábitos e gostos?
E se pegarmos essas informações da maioria do nosso público, principalmente aquele

que interage com nossas redes sociais, e criássemos uma pessoa que poderia ser
nossa cliente?
Assim, focando em uma pessoa em específico, podemos ter uma visualização e ideia
mais concreta de para quem estamos vendendo, causar mais empatia pela pessoa e,
neste caso, descobrir uma maneira correta de nos comunicarmos com ela.
Com todas as informações que coletamos, criamos, então, a cliente fictícia abaixo
para definir nossa linguagem no Twitter e escolhemos a seguinte imagem para
representá-la.
![]
> _Laura Cordeiro, 22 anos, estudante da faculdade de Letras, solteira, mora com os
pais. Tem como hobbies ler, viajar, fotografar, ir aos museus, navegar pelas redes
sociais, principalmente o twitter. Família de renda média alta, está em um estágio
na sua área, prefere ler livros impressos e tem uma estante cheia deles. Compra de
5 a 8 livros por mês, porém, lê cerca de dois por mês. Lê em todo lugar possível:
casa, faculdade, metrô, ônibus, entre outros. Cresceu lendo livros como Harry
Potter e Senhor dos Anéis e, por isso, gosta muito de livros de fantasia, porém,
segundo ela, não consegue mais encontrar livros bons desse gênero. Também encontra
dificuldades em carregar livros muito grandes, já que passa o dia inteiro fora de
sua casa. Gosta de piadas e memes atuais que estão em alta nas redes sociais.
Queria encontrar mais livros de fantasia e descobrir novas maneiras de ler mais,
entretanto sem carregar muito peso. Quer momentos agradáveis lendo livros, que ela
possa ler em qualquer lugar, afinal gosta muito de ler e qualquer tempo livre
disponível, ela aproveita para fazer isso._
Essa pessoa que criamos para representar nossos clientes, com características da
maioria deles, é a nossa **persona**.
Existem outras formas de criar uma persona, como, por exemplo, [**a proto-
persona**], mas optamos por somente descrever as características e personalidades
dela e definir uma foto, para que possamos vê-la e saber cada vez mais com quem
estamos conversando.
Legal! Agora já temos nossa persona, mas como será a linguagem que vamos utilizar
para falar com ela? Depois de sabermos todas as características dela, não é mais
fácil saber qual o melhor tipo de conteúdo que podemos criar para ela?
## Terceiro passo: defina a linguagem
Com uma pessoa em vista, que no caso é a **persona** que criamos, pensamos com mais
detalhes no tipo de abordagem que usamos para nos comunicar com ela.
Primeiro, refletimos a respeito de qual nosso objetivo de nos comunicarmos com

essas pessoas, que, no caso, é nos aproximarmos dos clientes por meio desses canais
para, no fim, vendermos mais livros.
Como uma das questões da personalidade dela é gostar de piadas e memes, incluindo
gifs, pensamos em utilizá-los bastante, para chamar a atenção e, então, provocar
uma interação. Laura também procura mais livros com novas aventuras de fantasia,
então, queremos apresentar livros exatamente como os que ela procura.
> Você já pensou em conhecer um universo completamente novo? Conheça mais sobre a
galáxia Lix, o cenário desse novo livro que vai te surpreender!
Para este post, como é um novo universo e propomos para a pessoa explorá-lo,
consideramos que isso seja incrível e deixe a pessoa surpresa. Ultimamente, quando
há algo que choque, as pessoas dizem que aquilo "explode a mente". Pensando nisso,
utilizamos um gif no qual alguém faz o movimento típico dessa expressão.
<iframe src="https://giphy.com/embed/26ufdipQqU2lhNA4g" width="480" height="480"

frameborder="0" class="giphy-embed" allowfullscreen></iframe>
[via GIPHY]
Assim, definimos que a nossa linguagem no Twitter será informal, recheada de

sugestões de leitura e gifs.
Porém, como já dissemos antes, nosso público muda do Twitter para o Facebook, por
exemplo. Como podemos definir, então, a linguagem para o Facebook?
No caso do Facebook, no qual há uma variedade muito grande de usuários, criamos

mais de uma persona. Assim, podemos diversificar entre os vários tipos de linguagem
que poderão agradar a todos.
E, se depois de um tempo, o nosso público nas redes sociais mudar? Podemos

continuar com a mesma linguagem ou será que isso afastará essas pessoas?
Como sabemos que é importante ter uma linguagem para cada tipo de público,
percebemos que é muito importante validar e atualizar essas personas de tempos em
tempos. Nosso público pode ter mudado ou pode ter mais pessoas que darão base para
uma nova persona. Assim, deverá ser definida uma nova linguagem para conversarmos
com eles.
Definimos que a cada três meses iríamos fazer essa validação, por meio de pesquisas
sobre os nossos seguidores das redes sociais e reenviando o formulário,
principalmente, para os novos clientes. Assim poderemos, se necessário, Recriar as
personas já feitas e definir novamente a linguagem.
Percebemos, então, a necessidade de escolhermos nossa linguagem nas redes sociais,

pesquisando mais sobre nossos clientes e o público-alvo, por meio de envio de
formulários e análise de pesquisas. É importante definir para qual canal será
criada determinada linguagem, e criarmos uma persona de acordo, que é um cliente
fictício validado a partir das informações dos clientes reais. A partir disso,
saberemos como nos comunicar com essa pessoa, com base em como ela fala, se
comporta e vive.
Se você quiser saber um pouco mais sobre marketing de conteúdo, confira no curso
[**Marketing de Conteúdo: Uma introdução ao Marketing de valor**]. Caso também
queira saber mais sobre personas e até mesmo como criar uma, faça o curso [**UX
Strategy: divergindo e afunilando ideias**], que fala sobre a criação de personas
para a experiência do usuário.
Me interesso muito por edição de vídeos, já aprendi os princípios e ferramentas

básicas e gravei as primeiras cenas de um curta-metragem sobre cachorros que estou
desenvolvendo,
agora vou começar a trabalhar no processo de **colorização na pós-produção**.
Minha equipe utilizou duas **câmeras** de marcas diferentes para capturar o vídeo e
assim registrar dois **ângulos diferentes** dos nossos personagens em ação. A ideia
era que na pós-produção, na hora de editar o curta, fizéssemos os cortes e
juntássemos estas duas imagens, concebendo a cena desejada.
Quando subimos o material para a edição percebemos uma diferença sutil nas imagens
das duas câmeras:
imagem, e podia ser assistido em um aparelho chamado **kinetoscópio**, sendo um

processo muito artesanal, lento e dispendioso, mas que revelava um novo mundo para
a história dos filmes.
Passando pela colorização de três películas da **Technicolor** até o primeiro

longa-metragem colorido que arrebatou as bilheterias dos cinemas da época, "…E o
vento levou", de 1939, hoje temos inúmeras possibilidades de colorização que
crescem cada vez mais com o avanço das tecnologias, e neste processo surgiu o
**colorista**: profissional especializado em tratamento de cores na pós-produção de
vídeos.
imagem que diz em inglês: No novo esplendor da tela… A imagem mais magnífica de
todos os tempos!”, se referindo às cores apresentadas.
Alguns diretores têm como marca registrada o uso de cores, como Wes Anderson. Em
seus filmes cada personagem possui a sua própria paleta,geralmente em tons pastéis
e suaves que acompanham o personagem nos cenários onde passa e em seu figurino
durante toda a narrativa. Seus filmes são conhecidos pela harmonia de cores e suas
paletas são sua [assinatura] artística.
imagem, de Wes Anderson._
A liberdade de uso de cores é tão ampla nos dias de hoje que filmes recentes foram
pós-editados em preto e branco, como "O Artista" (2011), de Michel Hazanavicius, e
"Roma"(2018), de Pablo Berger. Por uma questão conceitual do roteiro os filmes
foram mostrados ao público em escala de cinza, remetendo à tempos antigos, porém,
com um balanço de tons impecável gerado pelas possibilidades tecnológicas.
imagem, de Alfonso Cuarón._

E aí? O que achou desse artigo?
Para se aprofundar ainda mais no tema conheça [**o curso da Alura**] num software
promissor que está sendo muito difundido no mercado e perfeito para executar
tratamentos de colorização: o **DaVinci**.
Será que existe alguma maneira de reverter os caracteres de uma String em

JavaScript?
javascript
É... Parece que não...
Mas um Array tem essa função de reverter:
javascript
**Poderíamos transformar a String em Array com `split`, reverter esse Array e

transformá-lo novamente em String com um `join`.** Tipo:
javascript
Funcionou!
Seria legal se pudéssemos colocar esse nosso código na String do JavaScript... O

incrível é que podemos!
javascript
No código anterior, usamos o `prototype` de String: um objeto compartilhado por

todas as Strings do JavaScript. Ao colocar a nova função `reverse` como propriedade
desse `prototype` das Strings, estamos colocando essa nova função para todas as
Strings!
javascript
Essa técnica de mudar detalhes da linguagem (como String), colocando código a mais
é chamada de **Monkey Patching**, ou **remendo** em bom português. O pessoal mais
experiente recomenda que você **não use** isso em seus projetos. Poder pode, mas
não deve... Imagine se todas as bibliotecas que você usa fizessem esse tipo de
coisa com a String... Ia virar uma bagunça!
**Aprenda mais sobre a linguagem Javascript com [nossos cursos de Javascript]. Se

preferir cursos presenciais, temos a [Formação Front-End] na Caelum.**
Bom, mais um dia na vida do desenvolvedor e, ao chegar no trabalho, no mural de

tarefas, temos a criação de uma feature nova.
imagem on <a href='https://codepen.io'>CodePen</a>. </iframe>
Observe que nesse arquivo adicionamos apenas classes para estilizar a nossa página.
Como nossas tags html já foram criadas com classes baseadas no que cada elemento
seria, fica mais fácil de estilizar no CSS só chamando a classe usando o ponto
(`.`) antes do seu nome.
## Infelizmente nem tudo são flores...
Embora tenha ficado fácil estilizar, quando salvamos o código e testamos o novo
pedaço da interface no ambiente de desenvolvimento, ele apresenta um conflito
visual com algo que já havia sido implementado.
imagem.
## Momento análise
O conjunto do html e do css para gerar a parte visual do _infousuario_, pode ser
representado de que forma?
> _"Ahh, ele é um pedaço dela!"_
Isso! Nosso arquivo **infousuario.css** junto com o trecho HTML referem a um pedaço
do site, algumas pessoas chamam de **bloco** outras de **componente**.
No geral, esse é o cara responsável por vários elementos dentro dele que compõem o
que iremos ver sobre o usuário. Tendo isto em mente, tudo que tiver dentro desse
cara deve ser estilizado a partir dele, como por exemplo:
css
Mas veja que do jeito que está, ainda temos o risco dos aninhamentos que
sobrescrevem coisas!
## Utilizando o padrão BEM
Para fugirmos desse caso de sobrescrita dos nossos estilos, podemos utilizar um
padrão de escrita de seletores que vem sendo bastante utilizado pela comunidade de
front-end chamado [**BEM**]:
css
Nesse cenário temos uma classe ao invés do aninhamento, os dois underlines podem
até soar estranho de início, mas o BEM estabelece por meio deles uma relação de
elemento pai e elemento filho sem aninhamento. Sendo o pai um **b**loco e o filho
um **e**lement (**be** que vem do **BE**M).
Do jeito que fizemos aqui já estamos evitando conflitos de CSS com uma classe
`.avatar` que estiver solta pelo código :)
imagem on <a href='https://codepen.io'>CodePen</a>. </iframe>
Agora nosso CSS não está mais conflitando! \\o/
> _"Mas, e se eu quiser reaproveitar algum estilo?"_
Boa pergunta! Um cara perfeito para analisarmos o reaproveitamento é o nosso

avatar.
css
Quando definimos o `border-radius` como `50%`, estamos deixando o avatar sendo um

circulo por padrão, mas caso quisermos que ele seja assim apenas em determinados
casos, podemos dizer que, ser circular é uma **modificação** deste **elemento**
dentro do **bloco** ìnfoUsuario`.
Para criar o seletor dele nós escrevemos as classes com dois hífens, `.avatar--
circular` utilizando assim o M do BEM (modifier) que serve para representar a
modificação de um elemento (nesse caso para deixar circular ou em um menu para
deixá-lo ativo). Isso deixaria nosso CSS assim:
css
<iframe height="500" scrolling="no" title="#03 - CSS do BEM"

src="https://codepen.io/soutomario/embed/WENymv/?height=265&theme-
id=0&default-tab=css,result&embed-version=2" frameborder="no"
allowtransparency="true" allowfullscreen="true" style="width: 100%;">See the Pen <a
href='https://codepen.io/soutomario/pen/WENymv/'>#03 - CSS do BEM</a> by Mario
Souto (<a href='https://codepen.io/soutomario'>@soutomario</a>) on <a
href='https://codepen.io'>CodePen</a>. </iframe>
## Criando componentes reutilizáveis
Agora nosso avatar tem seus estilos bem definidos e fica mais fácil trabalhar com
ele, mas o avatar circular é utilizado em diversos pontos no site da alura:
infosUsuario, header, forum…
O que podemos fazer ao invés de reescrever toda vez o `border-radius` em cada um

dos lugares que ele aparece?
> _"Podemos criar um componente avatar!"_
Exatamente! Um único ponto que precisamos levar em conta é que, o estado de ser um
círculo e ter a borda borda azul alteram um estado padrão do avatar. Seguindo essa
linha, temos o seguinte resultado:
css
Agora a única propriedade CSS que precisamos alterar no nosso **infousuario.css** é

o margin-top:
css
Com isso nosso componente está pronto! Também estamos com tudo certo para adicionar
as novas funcionalidades nos nossos projetos com um código reutilizável e se
esquivando com sucesso de conflitos.
<iframe height="500" scrolling="no" title="#04 - CSS do BEM"

src="https://codepen.io/soutomario/embed/eRqrgY/?height=265&theme-
id=0&default-tab=css,result&embed-version=2" frameborder="no"
allowtransparency="true" allowfullscreen="true" style="width: 100%;">See the Pen <a
href='https://codepen.io/soutomario/pen/eRqrgY/'>#04 - CSS do BEM</a> by Mario
Souto (<a href='https://codepen.io/soutomario'>@soutomario</a>) on <a
href='https://codepen.io'>CodePen</a>. </iframe>
Caso queiram ir mais a fundo no BEM, deixo o link da [**documentação para vocês
conferirem**], espero que o artigo ajude vocês em seus projetos e não deixem de
compartilhar o que vocês fizerem :)
Ahh, e caso queiram ir um pouco mais a fundo no assunto organização de CSS

conhecendo outras formas além do BEM, deixo [este ótimo post] do [@marcobrunobr].
Se vocês quiserem aprender mais sobre CSS, HTML, Javascript e outras tecnologias
que fazem parte da web, aqui na Alura temos uma [**Formação Front-end**]. Nela você
aprenderá sobre HTML e CSS, Javascript, aprenderá frameworks como jQuery e como
criar sites responsivos.
Sintam-se a vontade para comentar, dar críticas ou sugestões!
Pode passar uma semana afastado pois teve um pepino ou outro...mas ele volta,
continua e retoma o ritmo. Eu também sou assim, todos somos.
Por todo seu esforço junto a plataforma ele foi escolhido para ser [moderador no
Alura] e compartilha conosco um pouco de sua experiência, de como se motivou a
crescer na área e como outras pessoas também podem encontrar seu caminho nesse
nosso mundo de desenvolvedores.
Compartilho com vocês um pouco da história do Romário...
\---
# **Do jogo ao código**
Bem, meu gosto por programação começou a partir de Games e etc.. Sempre gostei de
Jogos Online, principalmente MMORPG, em especial Ragnarok.
**Porém, assim como em vários MMORPG, existem servidores privados, ou seja:

servidores customizados. Então, de tanto jogar neles e por discordar de algumas
coisas na forma como os responsáveis pelos servidores administravam o jogo, resolvi
criar meu próprio servidor. A partir daí tive meu primeiro contato com algumas
linguagens ([HTML], [SQL] e etc..).**
Mas eu sempre tive meio que um prazer pelo conhecimento, então não me contentei em
apenas saber o básico para fazer o jogo e sempre fui atras do significado das
coisas e assim comecei a estudar sobre programação.
Sou autodidata e assim sempre procurava conteúdo sobre programação para estudar e
saber mais. Desta forma encontrei e fiz cursos de várias empresas como Treehouse e
Codeacademy,mas estes cursos são em inglês e por mais que eu soubesse bastante
inglês, sempre escapava alguns detalhes. Assim, passei a procurar uma escola
nacional e então cheguei ao Alura.
Eu sempre busquei cursos que pudessem me trazer mais conhecimentos. Muitos dos que
fiz eram superficiais e apenas básicos. No Alura, eu pude aprofundar mais meus
conhecimentos e então parti para livros mais complexos de programação.
# **O futuro**
Recentemente fui aprovado na universidade no vestibular de Medicina. Então,

atualmente estou com bastante tempo livre e pretendo investir todo esse meu tempo
nos meus conhecimentos de programação e na carreira como programador. Futuramente,
pretendo exercer as duas funções: Medico e Programador. Pretendo conciliar as duas
quando possível. Para o próximo ano, então, pretendo aprofundar e melhorar meus
conhecimentos em programação e investir mais nessa área.
# **O aprendizado online**

Creio que o estudo online é uma nova modalidade de ensino que tende a crescer
devido a maior comodidade e controle que o usuário tem da forma como irá estudar.
Através do estudo online eu pude adquirir diversos conhecimentos. O Alura, por
exemplo, ajudou-me a aprimorar meus conhecimentos sobre programação e hoje estou
mais ativo e mais empenhado em trabalhos nessa área.
Creio que a melhor sugestão para quem está começando nos estudos da área seja:
determinação.
Seja determinado e nunca se canse de aprender, também nunca se contente com o que
você sabe. Seja determinado em sempre buscar ser o melhor naquilo que você quer
fazer.
Muitas pessoas não conseguem o que desejam por falta de determinação. Já dizia o
escritor francês Vitor Hugo: "As pessoas não carecem de força, carecem de
determinação."
Então, seja determinado naquilo que você deseja e o sucesso será consequência.
Então você já aprendeu os básicos do **After Effects** e a partir desse ponto é

muito comum que uma pergunta apareça na sua cabeça: “Será que eu estou usando o
máximo do AE?”. Não, não estou falando de instalar plugins e nem sobre aprender
mais uma técnica complexa para virar um mago do After Effects.
Essa dúvida tem mais a ver com o que você poderia estar fazendo mais rápido, que
atalhos poderia estar usando e coisas assim. Para te ajudar a usar o software
melhor e aumentar sua produtividade, decidi separar “5 truques do After Effects que
você precisa saber”.
## Atalhos
O After Effects possui muitos **atalhos**, isso você já sabe, mas quais deles são
realmente indispensáveis? Quais deles vão aumentar seu aproveitamento do software?
Sendo bem direto, quais são as principais coisas que costumamos utilizar em uma
animação? **P**osição: só apertar **P**, **T**ransparencia: só apertar **T**,
e**S**cala: só pressionar o **S**, **R**otação: se utiliza o **R**.
imagem**, ou até mesmo colocar a arte no lugar e, antes de exportar, remover as

referências. Mas é possível deixar a arte referenciada sem precisar apagar depois?
Sim! É só usar as Guide Layers, que são fáceis de serem ativadas e desativadas,
para transformar um layer em uma **Guide Layer** é simples, só selecionar a Layer a
ser utilizada, clicar com o botão direito e selecionar a opção Guide Layer.
![5_truques_after6]
## **Mask como Motion Path**
Então você precisa que um item de sua animação percorra o caminho de um quadrado
perfeito? Sem problemas: são quatro Keyframes, um pouco de paciência e tudo certo!
Agora precisa fazer uma bola? Ok: quatro Keyframes, muita destreza e paciência e
tudo certo novamente! Que tal fazer isso com um shape maluco que seu designer
criou?
É, realmente ficou dificil. O ideal seria copiar o caminho desse **path** e usá-lo
para “mandar” na nossa posição! E é isso ai! Não sabia que era possivel? É só
copiar o caminho e colar na posição daquilo que se quer mover e todos os Keyframes
estarão lá. Dá pra usar com todo tipo de **Shape**. Adeus tempo perdido!
![5_truques_after7]
Gostou das dicas? Quando montei meus cursos de After Effects para a **Alura**, fiz
questão de ensinar além da ferramenta. **Ensinar dicas bacanas, workflow entre o
After Effects, Photoshop e Illustrator** e muitos toques sobre como trabalhar com
vídeo. Se você é um principiante e quer começar a trabalhar com Motion Graphics,
recomendo que você de uma olhada nos cursos [**After Effects I**] e [**After
Effects II**].
Estamos sempre buscando melhorar a nossa plataforma para deixar o ambiente de

estudos cada vez mais fácil de usar e possibilitar que o aluno aprenda de maneira
rápida. Esse ano já reformulamos todo o nosso fórum, melhoramos a página de cursos
colocando mais informações e incluindo uma seção de perguntas frequentes.
Agora, nós **redesenhamos toda a tela de aula**! Deixando ela mais bonita e
melhorando a usabilidade.
imagem
Para aproveitar ainda mais todo o espaço da tela, removemos o header que aparece
nas outras páginas e movemos os links importantes para o final do menu lateral.
![]
Além disso, o menu está sempre acessível em qualquer parte da página, essa técnica
é chamada de Sticky Menu. Mesmo que você esteja no final de transcrições grandes, é
possível usar o menu para navegar sem ter que fazer o scroll até o topo da página.
![]
O espaço que antes era vazio, agora sempre está preenchido e facilita a navegação.
![]
## Questões de alternativas
Nas questões com alternativas, o aluno recebe um feedback imediato
![]
Antes ele precisava ir para outra página para saber se tinha acertado ou não.
![]
## Transcrições
A transcrição, que antes ocupava um espaço muito grande na tela agora ocupa um
tamanho menor até o aluno decidir que quer ler mais.
![]
Os alunos já estão usando essa tela nova e já recebemos vários feedbacks de pessoas
que gostaram. Se você tem alguma sugestão, não deixe de nos avisar!
A área de desenvolvimento de jogos é algo que atrai o interesse de muita gente:

fazer algo divertido e ganhar dinheiro com isso é algo realmente bacana.
Essa semana entrevistamos o Julius, um aluno da Alura lá de Brasília. O Julius é o

responsável pelo desenvolvimento do [**Wingbirds**], um jogo para Android inpirado
no famoso [Flappy Bird]. Atualmente desempregado, ele usa o tempo livre de forma
extremamente produtiva: estuda para prestar concurso e pega firme para aprender
desenvolvimento Android.
Aos 40 anos, o Julius nos contou que ele ainda é um novato na área. Algumas pessoas
às vezes tem um pouco de receio de começar a desevolver depois de uma certa idade,
mas para ele e isso não é empecilho não! Confira a seguir o bate-papo que tivemos
com ele :)
**Fala Julius, beleza? Diz pra gente o seu nome completo, por favor.** Julius de
Sousa Lima
**Mora em qual cidade atualmente?** Brasília, DF.
**Estuda? Qual instituição e curso?** Estudo para concurso. IMP concursos. E no

momento, estou procurando me desenvolver profissionalmente na criação de
aplicativos para Android.
**Trabalha atualmente? Qual o seu cargo?** Não. Estou desempregado. Trabalhava com
manutenção de máquinas hospitalares. Sou Técnico em Eletrônica e recentemente, me
formei em Análise e Desenvolvimento de Sistemas.
**Como foi seu contato com a área de TI?** Sempre gostei de computadores,
informática, desenvolvimento, montar, desmontar, entender... Na década de 80 fiz
por curiosidade, um joguinho do tipo Enduro usando o GWbasic (o Basic), na tela
"verde" de um PC XT da IBM e lamento muito, por nunca ter procurado me desenvolver
nessa área. Mas hoje a "coisa toda" é muito diferente.
Em 2011, depois de trabalhar 14 anos com manutenção de máquinas hospitalares,

entrei na faculdade de Análise e Desenvolvimento de sistemas pensando em
programação como na época do PC XT e percebi que tudo havia mudado muito, os
conceitos, a forma de trabalho, as necessidades, os ambientes... tudo!
**E porque começou a desenvolver para Android?** Já conhecia o sistema operacional

Android por causa dos smartphones que sempre usei. E associei de certa forma a
"liberdade" que o Android dá, com a "liberdade" das distribuições Linux que uso e
que permitem uma interação com um ambiente em desenvolvimento constante. Dessa
forma, a vontade de aprender a desenvolver foi crescendo cada vez mais.
**Seu objetivo aprendendo Android sempre foi criar jogos?** Não só jogos, mas
aplicativos úteis e que possam ajudar. O WingBirds foi o primeiro aplicativo e o
primeiro joguinho que desenvolvi. Fiz na "mãozona"...sem frameworks, apenas com o
Android Studio. Achei muito legal o resultado desse primeiro trabalho.
Gosto da ideia de criar jogos pela possibilidade de colocar minha imaginação para
fora e de certa forma mostrar para os outros o que penso, como penso e o que
considero importante, criando apps que possam entreter, animar e ensinar.
**Por optou por Android e não outra plataforma?** Acho que o Android tem mais
abertura e flexibilidade para o desenvolvimento de aplicativos de o uso corriqueiro
e também maior alcance em diversos níveis. Considero que o aspecto "liberdade" pesa
muito quando se pensa em globalização e compartilhamento. Além de me parecer uma
excelente opção para início de carreira na área.
**Quais foram as maiores dificuldades que você teve durante toda a sua trajetória?
Ou seja, desde seus estudos até o desenvolvimento do seu jogo** A maior dificuldade
é pessoal... a falta de apoio. Estou mudando de área num momento não muito
favorável a isso. Outra situação é a falta de experiência, com tempo de serviço em
outra área, e a idade. O mercado não quer se arriscar e a única opção que resta é
se desenvolver por conta própria e mostrar serviço. Já com o aprendizado e
profissionalização, a dificuldade é prevista. Basta estudar e se interessar. E
nesse ponto não falta disposição e reconheço, até certa facilidade em aprender.
**Quais são seus planos para o futuro?** A verdade é que comecei há pouco tempo na
área. Estou conhecendo ainda o mundo do desenvolvimento.
Nessa construção de uma nova carreira, primeiro quero me aprofundar mais no Android
e pouco a pouco nos outros sistemas. Desenvolver aplicativos úteis, comercializá-
los e entrar no mercado de desenvolvimento com alguma parceria válida.
O desenvolvimento multiplataforma é inevitável. Alguns softwares desenvolvidos para

dispositivos específicos acabam sendo "empurrados" para uma realidade mais
abrangente e acabam sendo atualizados em diversas plataformas. Tenho grande
interesse em começar a desenvolver com essa finalidade e logo vou procurar conhecer
ferramentas e softwares que possam impulsionar meus conhecimentos e atuação nesse
sentido.
**Existem outros projetos que você está desenvolvendo ou pretende desenvolver

atualmente?** Sim. Além das atualizações do WingBirds, vou desenvolver aplicativos
comerciais, deliverys e outros com os quais possa iniciar um negócio. O WingBirds
foi um "startup" para meu desenvolvimento.
**Para quem quer começar a fazer um jogo para Android, o que você sugeriria?**
Existem opções diversas para se criar aplicativos comerciais em Android e em outros
sistemas. Particularmente, acho que não são opções que lhe dão liberdade total de
criação e limitam em vários aspectos.
Mas para jogos, existem várias ferramentas que ajudam no desenvolvimento de

aplicativos Android. Antes de tudo, acho que a pessoa que tem interesse em começar
a desenvolver jogos, tem que se preocupar em aprender alguma linguagem de
programação que lhe seja útil. Na maior parte das vezes, é necessário o
conhecimento básico de programação. E para que o profissional seja completo, isso é
indispensável.
Então, procure por ferramentas que lhe permitam iniciar o desenvolvimento e que lhe
dêem uma visão geral do ambiente de desenvolvimento, identifiquem a necessidade de
uma linguagem que lhe permita continuar o trabalho e procure cursos específicos que
possam lhe auxiliar nesse sentido. Comecei com o Java na faculdade e posteriormente
na Caelum, onde tive a oportunidade de conhecer um pouco mais sobre a linguagem.
Quando iniciei com o Android no Alura, tinha uma boa noção da linguagem e isso me
ajudou muito. Todo o desenvolvimento do WingBirds foi feito com essas bases, sem
outras ferramentas além do Android Studio.
**Daqui para frente, claro, é fazer curso em cima de curso, aprender novas
linguagens e ampliar minhas possibilidades. Talvez, uma outra faculdade, o que com
certeza ajuda muito. Além de cursos diversos, mesmo que online, a exemplo do Alura
que nos oferece várias opções de aprendizado.**
Aprenda como manipular array de um modo **funcional** em Javascript, utilizando os
métodos map, reduce e filter.
Na empresa onde trabalho começamos um [Coding Dojo], que é basicamente uma reunião
com programadores e programadoras a fim de resolver desafios e aperfeiçoar as
habilidades com algoritmos.
O desafio dessa semana foi o seguinte, dado o array \èmpresas\`:
javascript
Tenho que exibir as seguintes informações:
- Empresas criadas depois dos anos 2000.

- O nome de cada empresa e de seu CEO.
- O valor de todas as empresas somadas.
A primeira coisa que precisamos mostrar são as empresas criadas depois dos anos
2000. O que podemos fazer nesse caso é criar uma maneira de filtrar o array para
conseguir exibir essa informação.
## Filter
Por sorte já existe um método para fazer esse tipo de filtro e adivinha o seu
nome ? Isso mesmo [**filter**]. Ele vai percorrer todo o array e criar um novo com
todos os elementos que passaram no teste implementado, no nosso caso, quando ano de
criação for maior que 2000.
Como temos objetos dentro do array, precisamos acessar suas propriedade para fazer
o filtro. Para isso basta chamar o nome do array seguido da notação de ponto e logo
após, o nome da propriedade.
Então para acessar a propriedade ànoDeCriacao` fazemos:
javascript
Agora basta criar a condição para exibir o\ànoDeCriacao\` maior que 2000, dentro
do `filter`:
javascript
javascript
Conseguimos realizar a primeira tarefa, agora para a segunda temos que exibir o
nome das empresas e de seus CEOs. Seria interessante criar uma função que extraia
esses dois valores para nós.
## Map
Felizmente temos esse método pronto e ele se chama [**map**], com ele é possível
percorrer todos os item do array, executar alguma transformação nesses itens e
retornar um novo array sem modificar o atual.
No nosso caso vamos percorrer o array e dentro de cada objeto vamos pegar as
propriedades nome e CEO de cada empresa.
javascript
Temos como resposta:
javascript
Mais um item do nosso checklist concluído, agora falta exibir o valor de todas as
empresas somadas. Seria interessante se já tivéssemos algo parecido com os dois
últimos métodos, mas para somar todos os valores.
## Reduce
E temos, o método [**reduce**] passa por cada item do array fazendo uma expressão
escolhida, e no final vai devolver um único valor. Exatamente o que precisamos para
fazer a soma do valor de mercado das empresas.
Ele recebe dois valores, um acumulado e um atual, no nosso caso o acumulado irá
somar com o atual. Como no primeiro loop da soma não temos nenhum valor acumulado,
então precisamos passar como segundo parâmetro esse valor, que no nosso caso vai
ser 0.
Se não tivéssemos passado um valor de acumulado o \`reduce\` pegaria o primeiro

item do array, tomando o como se fosse o valor acumulado.
Nosso código ficou terminado ficou assim:
javascript
javascript
Com a utilização dos métodos como `map`, `filter` e `reduce` foi possível realizar
todos os desafios propostos no Coding Dojo com códigos semânticos, simples e
funcional.

melhor, aqui na Alura temos uma [**formação front-end.**] Nela, você verá como
utilizar outros métodos do Javascript moderno, conhecer boas práticas e muito mais.
Aproveitando essa parceria, tivemos uma conversa com a Ulli Olivetti (colaboradora
da ITA Júnior) que topou fazer uma entrevista conosco falando um pouco sobre como é
trabalhar na **ITA Júnior** e compartilhando os seus desafios do dia a dia.
Curioso para saber mais sobre a nossa conversa? Então acompanhe e descubra:
## O que faz o ITA Júnior?
> A ITA Júnior é uma empresa formada unicamente por alunos do ITA. Nosso principal
objetivo é desenvolver o estudante por meio da vivência empresarial e da execução
de projetos vendidos ao mercado. Ao mesmo tempo, incentivamos o empreendedorismo na
região. Isso porque nossos projetos têm custo mais baixo, dado que possuem
tributação menor, sendo voltados, principalmente, para micro e pequenas empresas
que não teriam condições de obter um serviço de consultoria sênior. Hoje em dia,
fazemos projetos em TI e em otimização. Basicamente, podemos fazer desde o site da
sua empresa ou a plataforma web que nosso cliente sempre sonhou, até a análise de
como melhorar o seu negócio e otimizar seus processos para diminuir desperdícios.
## Como você começou a participar da empresa?
> Assim que entrei para a faculdade, fiquei sabendo da ITA Júnior e da oportunidade
que eu teria de desenvolver habilidades interpessoais e de entrar em contato com o
mercado, sem me afastar da engenharia! Sempre fui uma pessoa tímida, então essa
ideia me atraiu muito. Fiz o processo seletivo e consegui entrar no início de 2016.
Na época, não poderia imaginar o quanto aprenderia na empresa e o quanto a ITA
Júnior me amadureceria como pessoa.
## Quais as tecnologias que vocês usam mais atualmente?
> Para os projetos de web, utilizamos muito [HTML, CSS], [jQuery], [JavaScript],
[Angular] e [Node]. Em otimização, usamos muito [Excel], [VBA], [Access] e
conhecimentos de [Lean]. Grande parte da nossa capacitação vem da Alura. Com a
plataforma, conseguimos que nossos membros tenham o conhecimento e a segurança para
executar os projetos de maneira contínua, sem que esse aprendizado se perca ao
longo das gestões.
## O que acham interessante na proposta da Alura?
> Muita coisa (rs). Primeiro, o fato de ter cursos de diversos assuntos de
qualidade garantida em um só lugar facilita muito o estudo. Os instrutores também
são muito bons e todos os vídeos são acompanhados de vários exercícios, o que
permite que uma pessoa sem conhecimento nenhum no assunto se torne um bom
profissional após concluir o curso. Os cursos também estão sempre se atualizando,
seguindo a tendência das linguagens de programação. Além disso tudo, a plataforma é
super amigável e o atendimento ao cliente é excelente. Olhando para trás, adotar a
Alura foi a decisão mais acertada que tomamos na ITA Júnior dos últimos tempos.
## Vocês participam de eventos, fóruns e listas?
> Sempre incentivamos nossos membros a participarem de tudo que a Alura oferece. Os
tópicos são sempre bem interessantes para nossos projetos e os fóruns são uma ótima
maneira de tirar dúvida rápido, já que o suporte é bem ágil. Acreditamos que
devemos aproveitar tudo que é oferecido para ter uma capacitação completa.
## Quais são os maiores desafios do dia a dia?
> A ITA Júnior compartilha de muitos desafios comuns das empresas juniores. Hoje em
dia, a gente tem certa dificuldade para fazer os empresários da região nos
conhecerem. Queremos atingir mais pessoas e fazer mais projetos, para conseguir
impactar mais o mercado e ajudar mais empresas a crescerem. Mas ainda não
conseguimos encontrar a melhor forma de atingir nosso público.
A **média ponderada** é utilizada quando precisamos considerar **pesos para as

diferentes medidas.** Por exemplo, se eu quero calcular o meu preço médio de vendas
do primeiro bimestre do ano, e eu sei que em janeiro o preço médio foi R$10,00 e em
fevereiro foi R$8,00.
Se eu usar a média simples, o preço médio das vendas do primeiro bimestre seria
R$9,00. Isso só vai ser verdade se eu tiver vendido exatamente a mesma quantidade
nos dois meses que estamos analisando. Mas e se eu vendi 10 unidades em Janeiro, e
30 em Fevereiro?
Se eu for ponderar pela quantidade vendida, minha média deveria ficar mais perto de
R$8,00 do que de R$10, afinal, vendi mais em fevereiro.
Uma forma de descobrir o nosso preço médio do primeiro semestre, é primeiro

descobrir o valor total das vendas, e depois dividir pela quantidade total das
vendas. Ficaria assim:
• **Valor das vendas em Janeiro:** R$10,00 * 10 unidades = R$ 100,00;
• **Valor das vendas em Fevereiro:** R$8,00 * 30 unidades = R$ 240,00;
• **Valor das vendas no primeiro bimestre:** R$100 + R$240 = R$340;
• **Quantidade total das vendas:** 10 + 30 = 40;
• **Preço médio do primeiro bimestre:** R$340 / 40 = R$8,50.
# Média ponderada no excel
Agora vamos aumentar nosso exemplo, e tentar calcular o preço médio das vendas do
ano, a partir da tabela de quantidades, e preço médio por mês:
imagem
Tem duas formas de fazer esse cálculo no Excel. Vamos começar com o caminho mais
longo e depois mostramos o atalho usando a função **SOMAPRODUTO (ou SUMPRODUCT)**.
Se a gente fizer igual ao primeiro exemplo, o primeiro passo vai ser calcular o
valor total das vendas por mês, adicionando a coluna **“Valor das vendas”**:
imagem
Depois, **adicionamos uma linha com os totalizadores de quantidade**, com a

**função SUM (ou SOMA se o excel estiver em português):**
imagem
O mesmo para o **total do valor das vendas**:
imagem
E chegamos ao **preço médio com a divisão simples**:
imagem
E chegamos no valor de R$8,35 de preço médio no ano.
# Média ponderada no excel usando somaproduto (ou sumproduct)
O Excel nos dá um atalho para calcular o valor total das vendas, sem precisar
calcular o valor da venda de cada mês para depois somar. Como o próprio nome já
diz, **a função somaproduto já calcula a soma dos produtos de dois conjuntos (ou
arrays).**
No nosso exemplo, o primeiro array são as quantidades, e o segundo são os preços
médios:
imagem
**O resultado vai ser o mesmo que tínhamos calculado antes:**
imagem
Agora é só dividir pela quantidade, e temos nosso preço médio! Pra tabela ficar
mais fácil de ler, vou colocar as duas fórmulas juntas, na célula C14:
imagem
E chegamos nos mesmos R$8,35, c.q.d. :)
# Google Spreadsheets
Esse passo a passo, assim como as fórmulas, também funcionam no Google

Spreadsheets. Vou deixar um link aqui embaixo com o resultado final:
imagem
Você pode acessar a tabela através do link:

https://docs.google.com/spreadsheets/d/19-
MH0kn6v64MbyoCT4FBrfBbY4osEP8vWwW2VU2d360/edit#gid=0
Gostou desse artigo? [**Inicie em excel ou aprimore seu conhecimento com a

Alura**].
Durante os meus estudos para certificação da Oracle, surgiu uma questão bem
interessante... O que um arquivo .java precisa para compilar? Vamos verificar com a
classe Teste.
java
Se eu tirar o método `main`:
java
E tentar compilar:
![compilando-arquivo-java] Ele compila conforme o esperado! Certo agora eu acho que

não tem mais nada que possa retirar... Mas e se eu tirar a classe inteira? Ele
compila? Sim? Não? O que você acha?
Vamos tentar compilar sem a classe, ou seja, um arquivo vazio:
![compilando-arquivo-java2]
Compilou??? O que!? Isso mesmo, compilou! Para **compilarmos** um arquivo .java não
precisamos de nada em específico, ou seja, não precisamos de uma classe, método ou
qualquer conteúdo. Simples assim!
Caiu na pegadinha e quer se preparar mais? Pensando nisso o instrutor **Guilherme

Silveira** criou a [**Formação Java**] na **Alura**.
imagem
Na criação de aplicativos quantas vezes caímos na necessidade de manter dados

salvos para economizar o pacote de dados dos usuários ? Acredito que a resposta
deve ser bem próxima de "muitas vezes" ou até mesmo "sempre".
A parte mais chata é que toda vez que queremos manter um cache de nossa aplicação
precisamos criar uma classe que extenda de `SQLiteOpenHelper`. Aí que os problemas
começam, quando eu tenho mais de uma tabela, como eu faço?
Precisaria criar um monte de DAOs que tenha como atributo a classe que faz o acesso
direto ao banco. Isso seria um grande trabalho, além de ter muito código repetido
pra lá e prá cá, o que a galera geralmente chama de _codigo boilerplate_.
Pra solucionar esse problema a galera do google criou uma serie de bibliotecas que
fazem parte de um conjunto de ferramentas denominadas **Architecture Components**.
Dentro dele podemos encontrar um ÒRM` , cujo nome é Room.
Já falei bastante dele no meu curso aqui na Alura, mas ficamos bem na base dele lá,
vimos como ele facilita e muito o desenvolvimento.
Agora estou querendo evoluir um pouco da conversa. Lá fiz um sistema com apenas
duas entitidades, `Prova` e Àluno`, bem similar a isso aqui:
java
É bem comum pensarmos agora que uma nova tarefa seria implementar o relacionamento
de ambas as entidades, até mesmo, porque um aluno realiza uma prova. Essa junção
pra gente, representa o `Resultado` e como parece ser bem importante isso para
nosso sistema, seria legal gerar uma nova entidade para ele:
java
Ai é quando caímos numa das pequenas ciladas que o mundo android nos dá. Estamos
tão habituados a fazer esse tipo de relação no mundo web que não pensamos duas
vezes fazes antes de efetivamente transcrever isso para esse mundo.
A biblioteca **não consegue fazer esse "inferimento automático"**. Precisamos

deixar claro pra ela que existe uma relação entre as tabelas. Primeiro precisamos
mudar o tipo dos objetos, mapeando exatamente como será o banco de dados em si:
java
Com isso o Room já vai ficar feliz por saber como precisa criar a tabela, contudo
ainda não falamos que ambos ids são chaves estrangeiras. Para isso, precisamos
colocar uma anotação que vai deixar claro e criar todas as constraints para nós,
contudo fazemos isso na declaração da entidade:
java
Dessa forma o Room já criou nossa tabela, mas há outro detalhe que é legal ficarmos
de olho: se alguma prova ou algum aluno for removido da base, ficaremos com dados
totalmente inconsistentes. Para resolver esse problema, podemos adicionar uma
condição exclua junto o resultado, essa ação é conhecida como **ação em cascata**:
java
Agora basta criarmos nosso DAO para manipular nossos resultados. Mas, se formos
parar novamente para pensar, quando formos fazer uma busca no banco e usar os
resultados, como vou saber quem é o aluno com o id 1 por exemplo?
Acho que vai ser bem difícil isso. Trazer o aluno com suas informações, é nessa
parte que precisamos fazer uma busca um pouco mais inteligente. Já pensando que
precisamos trazer os dados tanto da prova quanto do aluno junto com o resultado.
Uma query com joins já resolve esse problema, mas e agora? Como fazemos para
representar isso no nosso sistema?
A solução proposta pelo Room é que a criação de um objeto que represente exatamente
a busca que estamos fazendo, algo similar a isso:
java
Com isso, podemos montar nossa query da seguinte forma:
java
Contudo, quando executarmos o código e pegarmos essa lista, vamos ver que não terá
nada! Esquecemos um detalhe bem importante: toda vezes que tivermos mapeando um
objeto dessa maneira, precisamos deixar claro para o Room que dentro do resultado
haverão nossos objetos. Fazemos isso através da anotação `@Embedded`
java
Rodando agora nosso aplicativo teremos o resultado que estavámos buscando!
E ai gostou de saber um pouco mais sobre o Room? Não conhecia ainda, corre lá e faz
meu [**curso de Room na Alura**] :D.
Nele você vai ver como automatizar a criação do seu banco sem muitos problemas,
fazer um crud de maneira simples e objetiva e fazer queries dinâmicas, além disso
vai aprender diversas boas práticas de programação mobile.
imagem
Programação funcional é o processo de **construir software através de composição de

funções puras, evitando compartilhamento de estados, dados mutáveis e efeitos
colaterais. É declarativa ao invés de Imperativa** Essa é uma definição do [Eric
Elliott] que eu gosto muito.
Mas confesso que tem muita informação nesse parágrafo não é, então vamos começar do
começo.
## Da onde veio a ideia de programação funcional ?
A inspiração do **paradigma funcional** veio dos matemáticos teóricos que lidam com
grandes abstrações:
imagem
Eles costumam trabalhar com sistemas complexos e a maneira como eles encontraram
para se manterem organizados e chegar no objetivo final foi através das funções. Se
trouxermos para nosso mundo de desenvolvimento, existe uma certa analogias de que
trabalhamos com sistemas complexos e com **abstrações**.
Então o paradigma funcional foi inspirado nesse modelo de trabalho onde as funções
são utilizadas para lidar com abstrações e aplicou no desenvolvimento de sistemas.
Agora que já entendemos um pouco da história, vamos ver os **conceitos fundamentais

começar a desenvolver de modo funcional**.
## Composição de função
**Composição de funções** é criar uma nova função através da composição de outras.

Por exemplo, vamos criar uma função que vai **filtrar** um **array**, filtrando
somente os números pares e multiplicando por dois:
js
# Funções Puras
**Uma função é chamada pura quando invocada mais de uma vez produz exatamente o
mesmo resultado**. Isto é, o retorno da função é sempre o mesmo se você passar os
mesmos parâmetros, então ela não pode depender de valores mutáveis. Por outro lado,
ela não pode causa efeitos colaterais externos, pois se ela imprime uma linha de
saída, altera algo no banco, lança um foguete para o espaço, ao invocá-la a segunda
vez ela vai causar um novo efeito.
js
Se imprimirmos:
js
A função `verifica_se_e_maior_que()` é pura porque atende todos os requisitos
listados. Por não causar efeito colateral e por não usar valores mutáveis
compartilhados, seus resultados podem ser cacheados e ela pode ser executada em
paralelo sem maiores preocupações.
# Imutabilidade
**Imutabilidade** significa que uma vez que uma variável que recebeu um valor, vai
possuir esse valor para sempre, ou quando criamos um objeto ele não pode ser
modificado.
O objeto **string do Javascript** por exemplo é imutável:

js
## Efeito Colateral
**Efeito colateral é toda interação da nossa função com o mundo externo** No nosso
dia a dia fazemos coisas como:
- Acessar banco de dados;

- Realizar chamadas assíncronas,
- Alterar propriedades de objetos entre outras tarefas
E nem sempre podemos prever esse resultado.
Mas dissemos antes que funções puras não possuem efeito coleateral certo ? Mas
programamos para um mundo onde dados mudam constantemente.
Então a programação funcional não elimina efeitos colaterais totalmente, mas tentam
confiná-los. Como fazemos interface com o mundo real, algumas partes do programa
vão ser impuras então o papel é minimizar essas partes e separá-las do resto do
programa.
## Imperativo x Declarativo
É muito comum aprender a programar de forma **imperativa**, onde mandamos alguém

fazer algo. Busque o usuário 15 no banco de dados. Valide essas informações do
usuário.
Na programação funcional tentamos programar de forma **declarativa**, onde

declaramos o que desejamos, sem explicitar como será feito. Qual o usuário 15?
Quais os erros dessas informações?
## Estado Compartilhado
**Estado compartilhado** é qualquer valor que está acessível por mais de um ponto
de uma aplicação. Por exemplo:
js
Neste caso a função `calculaIdadeDosIrmaos()` utiliza uma variável externa que está
fora do seu escopo e não depende apenas dos argumentos passados.
Quer saber a opinião de especialistas que trabalham com programação funcional no

dia a dia,
participe da nossa [semana da programação funcional]!
E se você gostou e quer conhecer mais, pode começar pelos nossos [][cursos de
programação funcional de clojure].
Pode também ouvir um podcast focado em Clojure:
spotify:0yAvwgYYl1w6dzCZnENFI1
E outro de linguagens funcionais no geral, com equipe da Alura e outras empresas:
spotify:6CJmqvJA6Tk6QZBKPwRl5z
Se você desenvolve pra web é mais do que comum querermos centralizar elementos na
tela, certo? Vamos imaginar que temos a seguinte _div_:
html
Se você quiser centralizar o **texto dentro da div**, pode fazer:
`.container { text-align: center; }`
Você pode ver esse código funcionando aqui [**aqui**].
Esse código funciona para centralizar qualquer elemento que seja _inline_ (você
pode ver quais são [inline]) ou _inline-block_.
Ah, mas e se eu não quiser centralizar o conteúdo, mas sim a _div_ na tela? Desse
jeito que fizemos, não vai funcionar. Nesse caso, temos que fazer basicamente duas
coisas:
dar um tamanho para a _div_ e setar as margens esquerda e direita para _auto_:
css
Você pode ver um demo desse código [aqui].
Esse código funciona para qualquer elemento [**block**].
E aí, gostou? Quer aprender mais? Dá uma olhada na nossa [**Formação Front-End**]!
imagem
Hoje na Alura todos nós usamos o [**Slack**] como ferramenta interna de comunicação
da empresa. E, se é uma ferramenta de comunicação, a primeira coisa que pensei é em
instalar o app também no celular e poder acompanhar de qualquer lugar as mensagens.
Só que, quando instalei o app, algumas coisas eu ainda não sabia do que se tratava…
Na verdade, eu sabia bem pouco de como era a ferramenta. Então, eu teria dois
caminhos a seguir:
- Aprender no dia a dia, usando o app, de fato;
- Olhar a documentação;
No primeiro caso, eu poderia levar pouco ou muito tempo, dependendo da minha

familiaridade com esse tipo de ferramenta.
Já no caso da documentação, apesar de ser útil para sanar algumas dúvidas pontuais,
são tantas informações sobre todo o app que provavelmente usaria algumas delas para
atender minhas necessidades e outras nunca chegaria a usar.
Mas será que não tem um jeito de informar somente as coisas mais básicas para o
usuário de primeira viagem?
## Apresentando seu app ao usuário
Se queremos apresentar algo novo a alguém, uma boa forma de conduzir esse primeiro
contato é apresentando as informações mais básicas sobre o que estamos falando.
Isto é, se são as informações mais básicas, precisamos selecionar o que

consideramos ser mais relevante para o usuário num primeiro momento de interação.
Por exemplo, se o Slack é uma ferramenta de comunicação, pode ser interessante

apresentar as especificidades da ferramenta antes mesmo de abrir o app propriamente
dito, certo?
Nesse caso, a apresentação do app acontece apenas na primeira vez que o usuário
abre o app.
imagem e fácil para realizar pesquisas internas (**uma feature relevante** para
quem busca esse tipo de ferramenta de comunicação).
Além disso, os recursos visuais utilizados nessa tela mostram que essa ferramenta
não existe apenas para a versão mobile, mas também em outras plataformas, como o
desktop.
> Escolher bem o apoio visual para a mensagem é essencial, uma vez que a informação
a ser passada deve ser enxuta e objetiva. Portanto, escolha com cuidado, utilizando
imagens como ilustrações, animações, prints da tela ou quaisquer recursos visuais
que auxiliem na compreensão da ideia.
imagem, descrito como uma espécie de "grupos de conversas".
Essa é uma feature interessante a ser apresentada, uma vez que o conceito de canais
difere um pouco do que conhecemos como "grupos" em apps de comunicação que precisam
de um convite do membro administrador do grupo para permitir a entrada de novos
membros.
imagem poderiam ter uma experiência desagradável com esse primeiro contato
desgastante e longo com o app.
Portanto, **resumir em poucas telas** é uma dica importante.
Além disso, é também uma prática comum deixarem um botão estratégico para aqueles
que, independente de qualquer coisa, não quiserem passar pela apresentação do
aplicativo:
imagem elimina a etapa da apresentação e direciona o usuário direto para o

aplicativo.
Ainda que isso gere o risco de perder algumas informações relevantes, é

interessante deixar ao usuário a escolha de passar por esse processo ou não, porém
não é uma regra.
## Resumindo…
As telas de apresentação de apps fazem parte de uma série de recursos que podemos
utilizar para planejar a primeira interação do usuário com nosso app, isto é, o
**onboarding**, que engloba todo o processo de experiência do usuário aprendendo a
utilizar o produto.
E, para criar um Walkthrough eficiente, precisamos considerar estes fatores:
- As informações apresentadas precisam ser enxutas;
- O conteúdo deve apresentar o produto e suas features mais relevantes;
- Descreve-se em poucos passos o que pode ser mais relevante ao usuário saber antes
de entrar no app;
- Recursos visuais podem ser muito relevantes para apoio da mensagem passada, sejam
prints, fotos, ilustrações ou animações.
Cada passo no processo de UX é muito importante para entender no que apostar ou não
em nosso produto.
Conhecendo bem cada etapa, conseguimos visualizar melhor o que precisamos, testar e
reformular novas tentativas, para isso, temos na Alura [uma formação dedicada a
ensinar diversas dessas etapas de UX].
O pessoal estava trabalhando nesta versão desde o fim de 2014. Os desenvolvedores
dizem que esta versão é mais rápida do que a anterior e que ela foi desenvolvida
com retrocompatibilidade em mente - ou seja, o que você já usava na antes
continuará funcionando.
Vários workarounds(também conhecidos como _gambiarras_) feitas especificamente para

as versões mais antigas do IE foram **removidas** e a biblioteca agora utiliza
recursos das APIs mais modernas onde faz sentido.
A ideia é que atualizem as versões anteriores caso hajam correções críticas a serem
feitas, mas elas não vão ganhar mais novas funcionalidades. A versão 3 é o futuro
do jQuery.
Você pode pegar baixar a versão mais nova aqui: [https://code.jquery.com/jquery-

3.0.0.js] Versão minificada: [https://code.jquery.com/jquery-3.0.0.min.js]
E pode ler muito mais detalhes do que mudou e tem de novo [aqui].
**Ainda não manja de jQuery? [Temos um curso] especial para você na Alura :)**
No passado, a pesquisa de imagens no [**Google Imagens**] tinha um sistema de

paginação mais ou menos assim:
![]
Para pesquisar imagens de qualquer tema precisávamos seguir um processo de scrollar

a página até o limite de resultados e passar para a página seguinte com mais
resultados. A cada nova página isso se repetia.
Depois de muitas páginas continuava a fazer as buscas pelas referências que queria,
em um exaustivo processo de recarregamento de página para cada nova leva de
resultados, além de quebrar meu ritmo nas buscas.
Se me apresentam uma grande quantidade de informações e não sei onde está o que
procuro, uma boa forma de facilitar a interação com todo esse mar de dados seria
permitir que o conteúdo fosse apresentado organicamente, de forma organizada e
contínua, em que eu não precisasse sempre carregar uma nova página para ver uma
nova informação, já que esse é justamente meu objetivo desde o início.
E como poderia conseguir isso?
## Automatizando o carregamento de resultados
Com o passar do tempo, a página do Google Imagens sofreu várias alterações,

chegando ao que temos hoje:
<iframe src="https://streamable.com/s/x3jry/julplo?muted=1" frameborder="0"

width="100%" height="100%" allowfullscreen
style="width:100%;height:100%;position:absolute;left:0px;top:0px;overflow:hidden;">
</iframe>
Perceba que agora nem percebemos muito bem a quebra de carregamento de novos
resultados, seguindo **um ritmo muito intuitivo e contínuo** na busca e tornando o
processo de busca mais fluido ao usuário.
**À medida que descemos a página temos o carregamento de mais imagens**, isto é,
novos resultados são apresentados por padrão a mim, diminuindo minha necessidade de
recarregar novas páginas. Agora, apenas o conteúdo que estou buscando vai surgindo
na minha tela.e, quando atingimos uma grande quantidade de imagens, nos deparamos
com este botão:
![]
Nesse momento o Google nos para e, agora sim, decidirmos se queremos ou não
continuar as pesquisas, dando maior **sensação de controle** da ação.
Em sistemas com muitos dados a apresentar, como nesse caso, a scrollagem infinita
pode ser uma boa pedida para melhorar a UX.
Porém, existem algumas ressalvas a considerar, antes de sair adicionando esse

recurso em qualquer lugar.
## Quando scroll infinito é uma boa ideia…
Se a intenção aqui é deixar o caminho aberto **para que o usuário navegue em uma
grande quantidade de informações**, um scroll que automaticamente oferece novos
resultados pode ajudar muito.
Mas, além disso, **se temos um conteúdo dinâmico**, que pode ser alimentado
diariamente com mais conteúdo, a scrollagem contínua dessas novidades ajuda a
manter o sentido da interação mais natural, mantendo o foco do usuário naquela
atividade específica.
O Facebook, por exemplo, também é um site que precisa apresentar uma infinidade de
dados diariamente na timeline do usuário.
![]
Deixar esse caminho orgânico faz com que a única necessidade do usuário seja
continuar seu caminho pelas novidades que tem interesse em visualizar.
Isto é, sites que possuem uma _timeline_ de informações que cresce constantemente
são potenciais bons exemplos para essa função, assim como Pinterest, Twitter,
Instagram…
Em todos esses casos a scrollagem infinita é muito bem aproveitada.
## … e quando não utilizá-lo?
Queremos sempre facilitar a vida do usuário e ter uma usabilidade eficiente que
melhore a experiência como um todo, mas a scrollagem infinita de páginas pode nem
sempre ser uma boa pedida.
Um desses casos é justamente **quando recarregamos a página e perdemos toda a

scrollagem que fizemos antes**, voltando ao início dos resultados buscados
anteriormente. Ou seja, voltar para algum ponto depois de reiniciar a interação na
página pode gerar muita frustração para o usuário, a menos que faça a
[**implementação de um recurso em JavaScript que altera a URI à medida que scrolla
a página**].
Para contornar essa situação, no próprio Google Imagens, quando selecionamos uma
imagem para abrir e visualizá-la, automaticamente somos redirecionados para uma
nova aba. Isto evita o problema de recarregamento da página.
Mas, além disso, carregar **tantos elementos na mesma página pode sobrecarregar o
desempenho do site** e tornar a performance bem ruim, uma vez que o [**DOM fica
carregado demais**].
E, depois de tudo isso, ainda podemos estar sacrificando um ponto importante do

nosso site: o **footer**, que geralmente servir de complemento às informações
referentes ao site.
Com a scrollagem infinita precisamos ter cuidado e pesar se é ou não relevante para
o nosso negócio aderir a essa feature.
## Aplicando scroll infinito em sites e apps
Ainda que possa parecer um recurso interessante para agilizar o processo de busca
por resultados em um site, precisamos sempre levantar se nossa página precisa ou
não desse recurso.
Em apps, por exemplo, podemos ter uma necessidade muito maior de utilizar essa
ideia por se tratar de um dispositivo que se adequa bem a esse tipo de interação
devido à gesturização que, diferente de botões, é muito mais simples de ser
utilizada em diferentes tamanhos de tela.
Para implementar essa feature em nossas páginas podemos, inclusive, [**utilizar

apenas JavaScript puro**], de forma simples, ao invés de recorrer a bibliotecas
pesadas que também prejudicariam a performance.
Mas ainda assim, existem contextos em que a paginação pode ser uma solução mais
eficiente para uma apresentação modular do conteúdo, principalmente se aquele que
estiver acessando o conteúdo tenha filtrado a busca em um funil mais específico e
focado no que se pretende encontrar.
![]
Note que, depois de categorizados e afunilados, os resultados buscados nesta página

de e-commerce recebem justamente essa paginação para facilitar a interação com os
produtos apresentados.
Isso considerando também que o conteúdo apresentado não tenha tanta prevalência da
ação de retorno ao que já foi visualizado, uma vez que esse retorno se torna cada
vez mais complicado à medida que mais resultados são carregados. Portanto, analisar
e dosar a utilização segundo o que faz sentido é essencial.
Se retomarmos toda a ideia até agora, podemos sumarizar como vantagens desse
padrão:
- Em páginas de conteúdo muito dinâmico, conseguir um flow contínuo na interação;
- Pode criar no usuário a sensação de estar perdido, sem controle do que está
acontecendo;
- Facilitar a busca por novos resultados sem ter que carregar sempre uma nova
página.
E quanto às **desvantagens** da utilização:
- Prejudicamos a UX se não criarmos um mecanismo eficiente que permite ao usuário

voltar ao ponto que parou;
- Podemos acabar prejudicando a performance;

- Sacrificamos o footer do site.
Para entender se isso faz sentido ou não dentro do seu sistema, é normal fazer
apostas iniciais, [**testes AB**] ou mesmo testes de usabilidade, e na Alura tem um
curso muito interessante de [**UX Produto**] que mostra algumas das possibilidades
que temos para fazer esse contínuo acompanhamento de como o usuário vê nosso
produto.
**Qualquer nova feature é importante ser testada e analisada.**
imagem
Para entender melhor como funciona cada um dos protocolos, vamos tentar enxergar
uma situação prática onde cada um deles pudesse fazer diferença: o **UDP** e o
**TCP**.
Recentemente, eu estive trabalhando em uma aplicação de bate-papo online, para

treinar minhas habilidades de programação. Para testá-la, enviei o programa para um
amigo para tentarmos conversar através dele.
Quando começamos a conversar, logo notei que havia algo de muito estranho - as
mensagens do meu amigo não faziam muito sentido. Não só isso, mas ele parecia não
conseguir entender o que eu estava dizendo também! Olha só como estava a conversa
para mim:
imagem]
Mandei para o email dele esse screenshot de como a conversa estava aparecendo pra
mim, para ele entender minha confusão e ele respondeu meu email com a imagem de
como a conversa estava para ele:
imagem]
Agora sim fiquei confuso! Para mim, a conversa estava de um jeito, mas para meu
amigo estava de outro… O que será que estava acontecendo com o meu programa?
A princípio, pensei que podia ter alguma relação com a nossa Internet, mas a
conexão estava muito boa e, ainda, as mensagens estavam chegando bem rápido. O que,
então, poderia ser?
Depois de diversas pesquisas, consegui entender qual era o problema - **o protocolo
que eu estava utilizando na camada de transporte**. Mas como assim, um protocolo?
Na camada de transporte? O que é tudo isso? Vamos com calma!
## A camada de transporte
A Internet se baseia, no geral, em requisições e respostas. Se pensarmos na Web,

temos um exemplo bastante concreto - usamos um navegador (como o Google Chrome ou o
Mozilla Firefox) para fazer uma requisição para um servidor de determinado site. Se
tudo der certo, esse servidor me devolve uma resposta com a página web que eu
procurava.
Mas como é que funciona, de fato, uma requisição? O que está por trás disso?
Para descrever os passos de uma requisição, existem diversos modelos que descrevem
os protocolos (isto é, as regras) por trás desse processo. Os modelos mais
conhecidos são o [**OSI**], que é dividido em 7 camadas, e o [**TCP/IP**], que é
dividido em 5 camadas.
Em ambos esses modelos, há uma mesma camada que é fundamental a [**camada de

transporte**]. Nos dois casos, a camada de transporte é, como o próprio nome
indica, a responsável pela transferência de dados entre diferentes máquinas (seja
um servidor, ou mesmo um computador pessoal).
A respeito dessa camada, temos dois protocolos principais: o **TCP** e o **UDP**.

No programa de bate-papo que eu fiz, utilizei o UDP, simplesmente porque pensava
que não havia muita diferença. Afinal, foi justamente esse o meu erro!
## O protocolo UDP
O protocolo UDP (sigla para _User Datagram Protocol_) tem, como característica
essencial, um atributo que pode parecer esquisito para os iniciantes no tema - a
**falta de confiabilidade**.
Isso significa que, através da utilização desse protocolo, pode-se enviar

[**datagramas**] de uma máquina à outra, mas sem garantia de que os dados enviados
chegarão intactos e na ordem correta.
Além do mais, o UDP é um protocolo que não é voltado à conexão. Isso significa que
o "aperto de mão", ou, tecnicamente, _[**handshake**]_, não é necessário para que
se estabeleça uma comunicação.
Dessa forma, com o UDP é possível enviar, pela mesma saída, dados para diversas
máquinas diferentes sem problema algum.
> Podemos fazer um paralelo com aqueles anúncios em alto-falante. O anúncio

consegue sair em busca do destino, mas não temos certeza se o destinatário da
mensagem conseguiu ouvi-la.
Entendendo o UDP, fica claro nosso problema - a falta de confiabilidade dele fez
com que as mensagens trocadas pelo bate-papo se corrompessem de diversas formas!
Mas se isso é natural desse protocolo, por que alguém escolheria usá-lo?!
As características já descritas do UDP podem parecer contraprodutivas no geral, mas

elas formam um outro atributo que dá muito poder ao protocolo: a velocidade! No
geral, o protocolo UDP permite uma comunicação bastante rápida, o que é muito
vantajoso.
Velocidade alta mas confiabilidade baixa, ainda parece suspeito - não funcionou no
nosso caso. Acontece que o UDP justamente não é feito para esse tipo de caso! Na
verdade, o UDP tem sua grande vantagem quando se trata de serviços cuja velocidade
é fundamental e a perda mínima de dados não muito desvantajosa.
Um exemplo é com jogos online, em que é normal alguns _bytes_ se perderem na

comunicação,mas que é sempre importante que a aplicação continue rodando com
rapidez (sem se importar tanto com as perdas e falhas), para que não ocorra o
famigerado _[**lag**]_.
Mas e agora? Se o UDP não serve para a gente, o que podemos usar em seu lugar?
## O protocolo TCP
O protocolo TCP é, talvez, o mais utilizado na camada de transporte para aplicações

na Web. Diferente do UDP, o TCP é voltado à conexão e tem como garantia a
integridade e ordem de todos os dados.
Para manter a confiabilidade dos dados, o TCP utiliza um aperto de mãos de três
vias, o _[**three way handshake**]_, também chamado de **SYN,SYN-ACK,ACK**.
O nome **SYN,SYN-ACK,ACK** é uma resumida descrição de como esse _handshake_

funciona. A conexão entre dois hosts começa com o primeiro enviando ao segundo um
pacote de sincronização (**SYN**chronize).
O segundo host recebe esse pacote e responde com a confirmação do sincronização

(**SYN**chronize-**ACK**nowledgment). O primeiro host, por fim, manda uma
confirmação (**ACK**nowledge) para o segundo, assim estabelecendo a conexão.
Com o TCP, de fato temos uma conexão entre um ponto e outro, comumente chamados de
**servidor** e **cliente**. É interessante notar que o TCP permite o envio
simultâneo de dados de ambos os pontos ao outro, durante todo o fluxo de
comunicação.
Desse modo, o TCP é ideal para casos em que a confiabilidade dos dados é essencial,
como quando se trata de mensagens de texto! Trocando o uso do UDP pelo TCP em minha
aplicação,tudo vai funcionar bem, mesmo que com uma velocidade possivelmente um
pouco menor.
Afinal, o importante é que a troca de dados, ou seja, de mensagens, seja efetuada

com sucesso, de modo que quem está se comunicando consiga se entender!
## UDP ou TCP?
É certo que não existe um protocolo certo ou errado, nem um melhor ou pior que
outro por essência. O que existe são situações diferentes, e essa é a chave para
trabalhar com aplicações que se comunicam com diferentes máquinas.
Nesse post, entendemos algumas das diferenças entre os dois principais protocolos
da camada de transporte dos modelos da Internet: o UDP e o TCP. Assim, entendemos a
importância de ambos os protocolos e quando devemos preferir um ou outro.
Ao final, como resumo, podemos entender que o UDP serve melhor casos em que a
integridade constante dos dados não é essencial (é menos importante que a
velocidade da comunicação), como em livestreams de vídeos e jogos online.
Por outro lado, o TCP funciona melhor em casos que a confiabilidade do transporte
de dados é o foco, como quando trabalhamos com comunicação em texto ou com
documentos.
O mais importante, portanto, é entender as diferenças entre os protocolos e, assim,

saber qual utilizar em cada caso. Assim, teremos uma aplicação mais funcional!
E aí, achou o tema do post interessante? Então dê uma olhada em nossa [**formação
de administrador de redes**], em que você se aprofundará ainda mais em redes de
computadores e como elas funcionam!
**Boa parte dos designers mais experientes ainda confunde esses dois conceitos.
Inclusive há muitas vagas por aí que pedem "designer UX / UI", o que leva a crer
que é a mesma coisa.**
E isso te dá um ótimo motivo para ler este texto: sabendo o que cada uma dessas
coisas significa, você vai estar à frente de muitos profissionais antigos no
[**mercado de design**], pelo menos nesse quesito.
Pronto para acabar com essa dúvida de uma vez por todas? Então confira o que UX e
UI têm de parecido e de diferente, entenda a aplicação dos conceitos e como atingir
bons resultados em cada um, nos seus [**futuros jobs de design**]! Vamos lá!
## Os significados de UX e UI
A confusão já começa pelo nome. São duas siglas parecidas, e isso, por si só, já
induz ao erro. Vamos esclarecer o significado em inglês, sua tradução e as
interpretações corretas:
### User Experience (UX)
[**UX significa user experience ou, em bom português, “experiência do usuário”**].

A palavra “usuário” aqui é muito importante, e pode ser a chave para que você nunca
mais confunda os dois termos.
Quando falamos de experiência do usuário, estamos falando de algo subjetivo.
Isto é, por mais que um designer ou web designer se esforce, ele não tem 100% de
controle sobre aquilo que as pessoas vão sentir quando experimentarem um produto
que projetou.
Uma parte da opinião das pessoas vai ser sempre emocional, momentânea e até
impulsiva, em alguns casos. Isso significa um certo grau de imprevisibilidade na
aceitação desse produto.
### User Interface (UI)
Já a sigla UI significa user interface, o que, traduzido para o português, ficaria

“interface do usuário”. Neste caso, estamos falando de algo bem mais objetivo e
controlável.
O UI Designer cuida daquela parte em que o usuário interage com um site (no caso do
web design), layout ou produto.
Os botões de ligar e desligar de um celular são visíveis? O layout e as cores de um

trabalho gráfico deixam à mostra todas as informações que o público deve
visualizar? O software é intuitivo? A ordem dos comandos se mantém na memória do
usuário entre uma utilização e outra?
Todos esses detalhes fazem parte do UI Design.
## Como esses dois conceitos são aplicados
UX e UI são utilizados juntos para melhorar os efeitos do design sobre quem tem
contato com ele. **Assim, uma forma didática de encarar suas diferenças seria
pensando que você melhora a interface do usuário (UI) e, com isso, tenta criar uma
melhor experiência do usuário (UX).**
Não custa repetir: você nunca mais vai fazer confusão se pensar que pode controlar
a interface de um produto ou site, mas não pode ter total certeza de quais efeitos
isso vai causar em quem está do outro lado.
Melhor dizendo, você não tem certeza antecipadamente desses efeitos. Mas, uma vez
que um produto é colocado em circulação, é interessante recolher feedbacks de quem
o utiliza e, a partir deles, entender o nível de experiência do usuário do seu
produto.
Se essa experiência não estiver no nível esperado, você faz novas alterações ou
cria uma nova interface, coloca essa nova interface em circulação e mede os
resultados dela na experiência mais uma vez.
Se for possível repetir esse processo várias vezes, é certo que o nível de
experiência do usuário do seu produto vai subir consideravelmente.
Esse é um processo bem simples e que faz parte da rotina de qualquer designer.
Automóveis, sapatos, roupas, artigos esportivos e qualquer outra coisa em que as
técnicas de interface do usuário podem ser aplicadas seguem essa lógica.
Até mesmo o design gráfico e o web design, com seus layouts de blogs e [sites],
material gráfico impresso ou para divulgação na internet.
## Como fazer uso de UX e UI para uma experiência completa do usuário
Se você parar para pensar, um produto com bom nível de experiência do usuário tem
enormes chances de se tornar um sucesso.
Por outro lado, ainda que obedeça a diversos critérios técnicos — isto é, técnicas
de UI como consistência, bons feedbacks, atalhos claros e mensagens de erros
compreensíveis — dificilmente ele vai emplacar se as pessoas não se envolverem
emocionalmente com ele.
Alguns exemplos mostram como essa relação é curiosa. Se pensar em uma plataforma de
armazenamento em nuvem, como o Dropbox ou o Google Drive, você vai ver que eles não
alcançaram lugar de destaque entre a concorrência apenas por requisitos técnicos.
Foi preciso um algo mais para cativar seus usuários. Já viu como foi o [**MVP do
Dropbox**]?
Muita coisa da experiência do usuário, por exemplo, não tem a ver tanto com as
funcionalidades.
O site da [**MailChimp**] é bem funcional, mas tem um aspecto do seu design — como
as interações com o chimpanzé, mascote da empresa — que transformam o envolvimento
com a marca em algo absolutamente emocional.
Essa plataforma, que oferece um software de e-mail marketing, brinca com as

expectativas das pessoas ao disparar e-mails. Por exemplo, ela exibe animações bem-
humoradas que suavizam o medo de que haja um erro num e-mail antes de um disparo
para milhares de pessoas.
Quem a utiliza tende a perceber essas brincadeiras como uma descontração em um

momento de tensão. Ou seja, a plataforma é vista como amigável e humana, o que vai
muito além do quanto seus botões ou layout são práticos.
É possível, aliás, que haja produtos com boa interface, mas uma experiência do
usuário pobre.
E vice-versa: um produto tecnicamente ruim pode ter boa aceitação e experiência do

usuário porque as pessoas o acham bonito ou porque ele é uma reedição de algo que
foi lançado quando elas eram crianças, por exemplo.
Mas tenha em mente que, embora subjetivo, o UX Design não é imprevisível. Há formas
muito eficazes de compreendê-lo e aplicá-lo com sucesso. Caso contrário, não
haveria especialistas nesse conceito, como é o caso de [Dain Miller]. Veja como
captar e prever a experiência do usuário:
- Estudando o gosto do consumidor por meio de pesquisas: sempre que uma empresa te
contratar para desenvolver um produto, pesquise as preferências das pessoas que vão
utilizá-los.
- Mantenha um canal aberto com os usuários, em que eles possam dar feedbacks
constantes. Criadores de software e aplicativos fazem uso desse recurso há um bom
tempo.
- Seja fiel aos resultados da experiência do usuário (UX), mesmo que elas
contrariem algumas regras básicas de praticidade. Como dissemos há pouco, nem tudo
no sucesso de um produto vem do lado racional do usuário.
Tomara que, depois de ler este texto, a confusão entre essas duas categorias seja
coisa do passado para você. E, que, além de tirar as suas dúvidas, você tenha se
divertido com a leitura!
Ao escrevê-lo, tentamos usar tudo que sabemos de interface do usuário: organizamos

o conteúdo e colocamos as informações numa linguagem que soasse o mais próxima
possível de você.
Será que deu para entender como é possível estender esses conceitos até para outras
áreas fora do design?
E que tal compreender essa diferença mais a fundo com o nosso curso [**UX: o que é
experiência do usuário?**] **Tire suas dúvidas sobre UX e UI, aprenda sobre
Gamestorming, usabilidade e muito mais!**
Descubra as **vantagens do Branding** para o seu negócio!
Se você está lançando a sua marca, se está pensando em empreender ou tem uma
empresa que está passando por dificuldades em se destacar entre os concorrentes,
você vai precisar de uma estratégia forte para que os seus produtos e serviços
entrem na mente e no coração dos futuros clientes.
Quando a sua empresa ou produto conseguem a lealdade dos consumidores, [**isso gera
um maior valor à sua marca e você pode aumentar a margem de lucro mais
rapidamente.**]
## Gestão de marca: por que você deve se preocupar com ela?
Para ganhar clientes fiéis é necessário gestionar a marca de maneira bem pensada:
considerar não só as funcionalidades dos seus produtos, mas também **elaborar
cuidadosamente algumas ideias que a marca quer transmitir ao seu público** e levar
em conta o estilo de vida ao qual ela estará ligada.
O que a empresa quer que as pessoas sintam ou façam ao usar os produtos e o que
elas podem conseguir com eles?
O conjunto de ações para se trabalhar a marca é chamado de **branding** ou _brand

management_. E não se deixe enganar: não só grandes empresas devem se preocupar com
o posicionamento de suas marcas, mas também **pequenos empreendedores e marcas
ainda novas precisam ter um excelente branding**, pois os consumidores cada vez
mais querem **relacionar-se com as marcas**, e não apenas comprar.
Ao diferenciar sua marca das demais, você consegue garantir uma conexão duradoura
com o seu público, tal como fizeram diversas marcas famosas. Mas como isso é
possível?
## O segredo para se construir uma marca forte
**Vamos imaginar agora que você criou a sua marca de capacetes e acessórios para
ciclismo de rua**, chamada _Urban lovers_.
Você tem ótimos produtos criados com materiais de alta qualidade e com um design
notável e está pensando em como vendê-los. O problema é que **a sua empresa não é a
única que oferece capacetes e as pessoas não conhecem as vantagens de usar os
seus**.
Nesse cenário, você tem que trabalhar a marca e construir a identidade dela.
Pare por um minuto e pergunte-se: o que os produtos da _Urban lovers_ podem trazer
para os amadores de ciclismo? Claro, no caso dos capacetes, o que vem em primeiro
lugar é a segurança, certo? **O fato de que um produto pode salvar a vida pois
protege contra lesões graves da cabeça já deve ser um ótimo argumento para a
compra, não é mesmo?**
Com certeza. Mas **os ciclistas não querem ter um acidente de bicicleta**. E as
empresas que fabricam capacetes também não. Então, precisaremos considerar outros
atributos de um capacete que podem ser importantes para o consumidor, e mais,
veremos quais ideais este acessório consegue trazer para ele.
Você já ouviu falar sobre o “Círculo dourado” do Simon Sinek? Ele é um especialista
de branding e _storytelling_ que se tornou conhecido após a sua palestra do TED,
chamada “_Comece com o porquê_” ou _Start With Why_ no original.
Sinek mostra que algumas marcas famosas e queridas pelos consumidores ao redor do
mundo, tais como a Apple, apostaram nas estratégias de **sempre pensar primeiro no
propósito da sua marca**, no porquê de sua existência. Confira na ilustração a
ideia do “Círculo dourado”, com o mais importante no centro.
imagem
E sim, você acertou: conseguir que a sua marca torne-se referência para seus
potenciais clientes requer esse **apelo emocional**, algo que move os consumidores
e deixe-os sentindo-se especiais.
Atenção aqui: **as boas práticas do branding não só envolvem o produto**! Você
também pode se destacar por seu atendimento na hora da compra e por fazer uma ótima
experiência no pós-venda.
### Receita de bolo?
Uma vez que cada marca é um pouco diferente e cada negócio tem suas
particularidades, **não existe um manual completo para se desenvolver uma marca de
sucesso**. Não há mágica de só brincar com as emoções dos consumidores, e uma ação
de branding que deu certo para uma empresa pode não funcionar para outra.
Entretanto, vale a pena investir em branding e desenvolver uma proposta única do

seu negócio, sem dúvida alguma. Uma marca verdadeira é a que tem alma e o público
consegue perceber isso muito bem.
Lembre-se: **todos compramos o porquê**.
## Branding: pessoas em primeiro lugar
Mesmo que a receita de bolo não exista no caso da gestão da marca, tem algo que,
sim, costuma funcionar para que a empresa ganhe a atenção dos consumidores: **antes
de falar sobre o seu produto, foque nas pessoas**. As marcas de sucesso fazem isso
muito bem. Veja o seguinte exemplo da **Starbucks**.
Quando visitamos qualquer franquia dessa rede de cafeterias, **nem precisamos

gostar de café**, de fato. Estamos lá nos divertindo com os amigos, lendo um livro
ou até fechando um negócio, comendo um lanche gourmet e tomando uma xícara de nossa
bebida preferida, personalizada com o nosso nome.
O espaço das cafeterias é quase um refúgio. E a Starbucks sabe disso, logo, o

posicionamento da rede é: “_Inspirar e nutrir o espírito humano_.”
Um colaborador da rede, Howard Behar, descreveu o negócio da empresa assim: “_Não

estamos no setor de café, servindo pessoas. Estamos no setor de pessoas, servindo
café.”_
Não é exatamente essa **preocupação com as pessoas** que faz da Starbucks uma marca
de sucesso?
![Branding - Como criar uma marca forte]
Outro caso de sucesso é o da **Heineken**. A marca fez com que milhares de pessoas
se tornassem suas fãs com um único vídeo, em que não vemos sequer uma única gota de
cerveja.
O filme curto _The candidate_ documenta a jornada de um candidato desde a primeira

entrevista até a contratação em um processo de recrutamento nada convencional,
mostrando que, antes de qualquer coisa, são as pessoas, suas ações e seus valores
que importam mais na realidade da empresa. Concorda que essa é uma ótima maneira de
se promover uma marca?
Como podemos ver, o branding não se limita aos atributos do produto. O segredo de
encantar os clientes - e torná-los, de fato, seus fãs - é **fazer o não esperado**,
causar **sentimentos novos** e oferecer **experiências inesquecíveis**.
Conheça as estratégias para construir uma marca forte no [**curso online Branding:
Criando uma marca forte**], em que a instrutora Tuany **cria uma marca do zero** e
mostra **cases inspiradores de empresas famosas por terem um ótimo relacionamento
com o seu público**, chamadas também de _Lovemarks_. Bora aumentar o valor da sua
marca e conseguir clientes apaixonados de verdade pelo que você oferece?
Essa combinação resultou em plataformas mais amigáveis, simplificando a

identificação dos elementos necessários, a interatividade e a navegação, sem falar
na versatilidade para adaptação aos diversos tamanhos e formatos das telas que
usamos hoje.
A [**usabilidade**] foi o principal combustível para tanta mudança, considerando

que a experiência do usuário é mais importante do que shows pirotécnicos aquelas
interfaces pesadas e cheias de recursos.
## Minimalismo
Em um passado recente, quando a internet começou a integrar o cotidiano das

pessoas, os profissionais de web design desenvolviam projetos com o visual mais
realista possível.
Os elementos tinham uma sobrecarga de sombreamentos, chanfros, relevos, formas

elaboradas, fundos poluídos e fontes rebuscadas. Era uma linguagem que tentava
transferir as sensações do mundo real para o digital a fim de criar uma atmosfera
familiar ao usuário.
Surgiu, então, o flat design como contraponto a todo esse movimento de ilustrações
chamativas e animações pesadas, que dificultavam o carregamento e a navegação dos
sites.
Além disso, os excessos de ornamentos em projetos digitais não possuem

funcionalidade, servindo apenas como distração ao usuário. Assim, sua experiência é
prejudicada, impedindo o alcance dos objetivos procurados.
É por essa razão que o caráter minimalista do flat design é tão importante. Ele tem
a finalidade de reduzir todo o excesso e contribuir para uma funcionalidade
efetiva.
Mas nem por isso o flat deve ser visto como um estilo monótono — ao contrário, para
compensar a ausência de adornos, os elementos recebem atenção especial,
principalmente nas cores.
## Cores
Ao minimizar os efeitos realistas dos layouts, as cores podem ser usadas sem
cerimônia — porém com bom senso, sempre. **Os tons vibrantes e sólidos (sem
degradê) são predominantes e, normalmente, usados em combinações alegres,
diversificadas e contrastantes.**
Aliás, o simples uso de contrastes entre as cores cumpre o papel de fazer com que
ilustrações e botões chamem a atenção e guiem o olhar do visitante pela tela.
Vale lembrar que as [**cores possuem a importante função de transmitir sensações e

emoções**], influenciando na forma como o usuário interage.
## Elementos geométricos
Botões, abas e campos com textos sofreram mudanças significativas nessa nova
tendência. Adquiriram formas geométricas simples como triângulos, quadrados,
círculos e retângulos combinadas com cores sólidas.
Com essas alterações, a ideia é comunicar mais com menos. Por isso, projetar esse
tipo de design não é tão fácil quanto parece. O resultado deve ser prático, mas
também atrativo, vibrante e agradável.
Em razão disso, os designers especialistas nessa área precisam cultivar um

conhecimento profundo sobre a dinâmica dos elementos empregados — cores e formas —
para dar um significado impactante e facilitar a compreensão das interfaces.
## Tipografia
Para compor uma interface perfeitamente alinhada com o flat design, as fontes devem
seguir a mesma linha dos demais elementos. As mais simples, limpas e sem serifas
são perfeitas para esses projetos.
Já as fontes mais elaboradas, como as serifadas, display e script (escritas à mão)

podem ser usadas, mas com cautela: apenas em projetos que estejam perfeitamente
ajustados a esses estilos.
A filosofia do flat design é simplificar e facilitar. Nesse sentido, os textos

devem ser compreendidos rapidamente — inclusive nas telas menores, como
smartphones.
## Compreensão rápida
A mudança na forma dos [**ícones**] é bastante expressiva. Eles passaram a ser

representados com imagens simples e limpas, para ajudar a transmitir as mensagens
de forma mais clara.
Levando em conta que esses elementos são projetados para indicar ações ou
propósitos universais de compreensão instantânea, a solução encontrada foi a
simplificação, embora a percepção da mensagem esteja sujeita à bagagem cultural de
cada pessoa. Dessa forma, desenhos simples com blocos de cores adequados ao
significado do ícone tendem a ser rapidamente percebidos.
## Reflexões sobre o uso
Conforme já dito antes, o flat design conquistou uma legião de adeptos pela sua
praticidade e usabilidade. Porém, será essa sempre a melhor forma de comunicar uma
ideia ao usuário? Façamos algumas pontuações sobre o assunto:
### Flat design é apenas uma tendência
É importante saber distinguir tendência de regra. As tendências chegam para dar uma
nova roupagem, um jeito diferente de fazer as coisas, com o intuito de despertar o
público para o consumo de algo inédito e sair da mesmice.
É nesse contexto que o design plano se encaixa. Por isso, é fundamental pensar bem
antes de aplicar tal conceito em tudo o que se quer realizar no mundo do design. Um
logotipo, por exemplo, pode estar defasado daqui a algum tempo, já que foi
concebido com apoio em uma tendência.
### A experiência sensorial pode ser afetada
A sensação visual de uma textura pode ficar consideravelmente prejudicada se

substituída por uma cor sólida. Imagine que uma paisagem cheia de natureza
verdejante seja representada por um desenho chapado e minimalista. Isso, sem
dúvida, muda completamente a percepção do usuário com o conceito e a atmosfera que
se pretende passar.
Nesses momentos críticos, é sempre bom ponderar sobre o uso do flat e aderir a uma
boa foto para ilustrar seu trabalho.
### A perspectiva espacial desaparece
Esse é um fator agregado à experiência sensorial. Novamente, a cor chapada

empobrece a experiência de sentir os diferentes planos e dimensões de profundidade.
É claro que o design plano trouxe uma revolução em termos de usabilidade, e seria
muito útil se o conceito continuasse a fazer parte dos projetos de design. No
entanto, é preciso estar atento ao equilíbrio e dar uma chance às alternativas que
podem enriquecer seu trabalho. A fotografia, aliada aos layouts limpos, é um
exemplo disso.
O uso excessivo do flat design deve ser ponderado, uma vez que o principal objetivo
dos designers despertar emoções e sensações no público-alvo precisa ser priorizado.
A experiência sensorial com imagens e fotografias causa uma impressão bastante
particular e muito positiva se bem aplicada.
Quer ficar por dentro do que há de melhor no design, na programação e na

tecnologia? Siga-nos no [Facebook], [Twitter], [LinkedIn] e [YouTube] para não
perder nenhuma novidade!
Afinal, as opções são tantas que costumam até ser motivo de discussões acaloradas
entre os profissionais da área de criação! E não é à toa: a escolha da fonte ideal
para cada trabalho é fundamental e não pode ser encarada como algo secundário.
Cada [**projeto de design**] é elaborado a partir de um conceito, e a fonte eleita

deve estar de acordo com ele. Em outras palavras, todo o conjunto do projeto
precisa interagir harmonicamente, o que inclui o uso certo da fonte tipográfica.
De fato, no Brasil, a falta de valorização do trabalho dos type designers ou

tipógrafos demonstra negligência com a tipografia. Com isso, muitos trabalhos
deixam evidente a necessidade de um acabamento melhor, comprometido pela falta de
importância dada a esse detalhe.
Mas, ao contrário do que muitos pensam, o design de tipos é uma especialidade. E,

nesse sentido, é importante que profissionais e leigos passem a rever sua postura e
entender que esse ramo do design é indispensável.
Então, se você quer entender de vez qual é a importância da tipografia para design
e conferir algumas dicas para escolher a fonte certa em seus projetos, continue
lendo este post!
## A evolução da tipografia
[**O processo de criação tipográfico**] é minucioso e milimétrico, em que as fontes

são desenhadas uma a uma. Um verdadeiro trabalho de “formiguinha”, do qual poucos
entendem o valor talvez por estarem habituados ao acesso fácil e uso corriqueiro.
Nesse sentido, a arte nem sempre foi descomplicada e, muito menos, acessível a
todos. No entanto, com a chegada da computação gráfica aos lares e escritórios, o
uso da tipografia realmente se popularizou.
Todos agora podem se servir das mais variadas fontes, compondo textos e layouts do
jeito que bem entenderem. E essa abundância de fontes disponíveis aos designers e
aos leigos é incalculável, se contarmos tanto os trabalhos altamente qualificados
quanto os amadores e experimentais.
Inclusive, muitas vezes, tipos criados exclusivamente para determinados projetos

podem acabar atendendo a outras finalidades. É o caso das fontes criadas para os
filmes Vida de Inseto e A fantástica Fábrica de Chocolate, por exemplo, usadas hoje
com frequência em títulos e até fachadas de comércio.
## A escolha ideal da tipografia para design
Bom, sabemos que o trabalho profissional sempre requer muito estudo e bom senso.
Quando chega a hora de lidar com a tipografia, todo designer se vê diante do
dilema: que fonte escolher agora? E não é raro que essa etapa consuma bastante
tempo e energia.
Como dissemos, as características essenciais de cada tipo devem estar alinhadas ao

conceito e imagens usadas nos projetos. Assim sendo, esse árduo (mas prazeroso)
processo de escolha da melhor fonte pode ter início no entendimento de questões
puramente técnicas relativas aos estilos que existem atualmente.
É o caso, por exemplo, da [**classificação dos tipos em grupos**], conhecidos como:
serifados, sem serifa, cursivos, display (decorativas) e suas variações. A partir
desse conhecimento, então, pode-se entender qual estilo se aplica melhor ao
trabalho que está sendo desenvolvido.
O caráter de uma composição deve ser definido pelo conjunto integrado da escolha da
fonte, [**as cores e técnicas de design**], para contribuir com a compreensão do
leitor a respeito do conceito empregado no projeto.
Além disso, lembre-se de que a interpretação da mensagem também está sujeita a

fatores psicológicos, filosóficos e culturais de uma época, bem como de quem a
percebe. Assim, é preciso relacionar tudo isso aos elementos gráficos do projeto e
ao público a ser alcançado.
### Tipografia em design gráfico
Em trabalhos de design gráfico, é muito comum vermos a criação de logotipos apenas

com a fonte, dispensando o uso de símbolos e desenhos representativos. Os exemplos
disso são incontáveis, mas podemos citar alguns famosos: Google, Dove, Canon,
Toyota e Faber-Castell.
Desses logotipos, alguns mantêm as formas originais das fontes tipográficas,

outros, modificam algumas linhas. É frequente também a criação de fontes exclusivas
para uma determinada marca, como a VAIO, da Sony, a Disney e a Coca-Cola.
E, nos layouts de peças publicitárias, o papel dos tipos não é menos importante.
Para cada tema é necessário adaptar o texto ao conceito empregado, e o uso de
imagens, ilustrações, cores e fontes também devem conversar de forma equilibrada.
Isso vale até para o projeto gráfico de um livro: o uso de uma fonte de
características clássicas como a "[**Garamond**]", por exemplo, complementa o
conceito de um romance do século XIX ou mais antigo. Já uma tipografia mais
irreverente como a "[**Brushstroke Plain**]" se encaixa melhor em um anúncio de
temática jovem e descontraída.
### Fontes para textos
Na composição de textos, é importante considerar os dois grandes grupos de fontes

disponíveis: as serifadas e as não-serifadas. Como o próprio nome diz, eles dizem
respeito à existência, ou não das serifas — pequenos prolongamentos posicionados no
final das hastes dos caracteres.
Isso pode até parecer uma constatação insignificante, uma vez que ninguém pensa
nesse detalhe enquanto está lendo. Porém, a fonte certa para cada tipo de texto
influencia muito na satisfação de quem está lendo.
A explicação para o uso de fontes serifadas em textos é o entendimento de que as

serifas deslizam o olhar do leitor pelas páginas, proporcionando maior conforto
visual. O exemplo mais usual desse tipo de fonte é a Times New Roman, muito
utilizada em blocos de textos longos, principalmente livros impressos.
Já as fontes não-serifadas são mais enxutas e retas. Assim, tendem a ser usadas em
textos curtos, títulos e legendas, valorizando as palavras individualmente.
Seja qual for o tipo, escolher a opção mais adequada permite que os leitores tenham
uma boa experiência de leitura. E, além dessas questões práticas, também é
conveniente adaptar o estilo ao gênero literário que está sendo abordado no livro.
No caso de jornais e revistas, por exemplo, a atenção tende a se voltar para o tema
desenvolvido. E tudo sempre amparado nas ilustrações e no contexto.
Atualmente, entre as fontes mais recomendadas para textos longos impressos, podemos
citar: Book Antiqua, Georgia, Adobe Garamond Pro, Goudy Old Style, e outras
similares.
### Tipografia para web
[**Na web, a mesma lógica do conforto visual**] deve ser levada em conta na hora de
compor os textos apresentados. Mas, nesse caso, as fontes mais limpas sem serifa
funcionam melhor para a experiência do usuário de internet, incluindo as telas
pequenas como as dos smartphones e tablets.
Os tipos mais comuns são Arial, Lato e Helvetica fontes mais limpas, fluidas, e que
permitem uma leitura leve, sem incômodos visuais para leitura em ambiente digital.
Na internet também é importante considerar os conceitos empregados em sites e tipos

de negócios para adequar as fontes ideais. Em sites institucionais, por exemplo, é
sugerido o uso das mais simples e básicas como Arial, Palatino e Verdana devido ao
seu desenho sóbrio.
Para sites de varejo, por outro lado, fontes com mais “personalidade” podem cumprir
melhor o papel desse segmento de negócio, como a Lucida Grande. Já em plataformas
referentes a entretenimento e artes, é possível ousar um pouco mais.
De toda forma, lembre-se sempre de garantir o melhor conforto visual ao visitante.

Afinal, no ambiente digital é muito mais fácil para o usuário desistir de uma
página para, imediatamente, escolher outra mais amigável.
Enfim, como vimos, a tipografia para design sempre teve um papel extremamente
importante ao longo da história.
Hoje, as possibilidades de uso criativo são infinitas, assim como são vastas as
regras e padrões a serem seguidos. Assim, escolha a sua e use com cuidado,
impulsionando cada vez mais seu trabalho e sua posição no mercado!
E aí, gostou deste post? Quer saber ainda mais sobre design lendo outros posts como
este?Então, siga-nos nas redes sociais e fique pode dentro das próximas novidades:
estamos no [Facebook], [Twitter], [LinkedIn] e [YouTube]!
Conversando com os alunos que mais estudam na plataforma, nosso aluno Henrique
Lopes me enviou três perguntas sobre a carreira de um desenvolvedor que está
começando.
Considerando as três perguntas, resolvi fazer um vídeo respondendo todas as dúvidas

com a minha experiência como programador.
Não perca tempo! Veja agora mesmo o vídeo:
https://www.youtube.com/watch?v=VL3XTtHJLJQ&feature=youtu.be
O que achou das dicas? Compartilhe nos comentários sua experiência :)
Está querendo fazer cursos para alavancar sua carreira porém não sabe por onde
começar? Pensando nisso preparamos [**Formações**] com diversos cursos tanto para
programadores que estão começando agora, como também para os mais experientes.
Quando desenvolvemos nossos sistemas, é normal que a gente faça pensando no usuario
final. Portanto, ao criar um formulário de login que verifica um email e senha no
banco de dados já temos em mente o que precisamos fazer no back-end:
- Escolher uma extensão para conectar com o banco de dados (Se você não sabe qual
usar, dê uma olhada no meu post sobre [**como acessar o banco de dados com PHP 7:
mysqli ou PDO?**])
- Escrever uma query buscando pelo email e senha
- Executar a query
Neste post vamos trabalhar com PDO. Com essa extensão, teríamos algo como:
php
Beleza, assim conseguimos verificar o email e a senha. Para um usuário comum, nosso
método funciona perfeitamente!
Mas, um usuário malicioso, com um pouco de conhecimento, pode tentar passar códigos
SQL nos inputs do form, como por exemplo:
- no campo email: qualquercoisa@aleatoria.com
- no campo senha: `' or id = '1`
Nossa query completa ficaria:
`SELECT * FROM Usuario Where Email = 'qualquercoisa@aleatoria.com' AND Senha = ''

or id ='1'`
Ou seja, estamos selecionando tudo da tabela Ùsuario` onde o email é igual a

"qualquercoisa@aleatoria.com" e senha é vazia OU o id igual a 1.
A setença ÒR ID = 1` será verdadeira se houver o registro no banco. Como os

valores de id, normalmente, são auto incrementados isso fará com que o usuário
malicioso entre no nosso sistema como o usuario de id = 1.
Mudar a query desta forma é o que chamamos de [**SQL Injection**]. Existem diversas
formas de lidar com isso, a mais comum é usar [**prepared statement**], uma forma
de escrever queries passando atributos ao invés de concatenar as variáveis com a
string.
Com PDO, nosso prepared statement ficará:
php
Ao invés de usar a função query da conexão, podemos usar a função `->prepare()` e

então passar os valores de Èmail` e `Senha` pelo método `->bindValue()` que
realizará uma verificação do conteudo das variáveis `$email` e `$senha` evitando os
casos mais comuns de SQL Injection.
Somente após, associamos aos atributos `:email` e `:senha` da query e, por fim, é
executada a query!
Além disso, aumentamos a semantica já que usamos parametros na query ao invés de

concatenar os valores das variáveis `$email` e `$senha` na string `$query`.
Nesse momento, nossa query está algo como:
`SELECT * FROM Usuario Where Email = 'qualquercoisa@aleatoria.com' AND Senha = ' or

id =1'`
Ou seja, estamos procurando na tabela Ùsuario` a instância de email

"qualquercoisa@aleatoria.com" e senha "or id =1". Logo, a senha não será validada e
nosso usuario malicioso não entrará em nosso sistema!
É extremamente importante pensarmos em todos os tipos de usuario quando

desenvolvemos nossos sistemas. Por isso, temos que estar sempre atentos ao
desenvolver nossas queries e nos proteger contra SQL Injection.
E você, o que achou de SQL Injection? Gostou de prepared statements? Compartilhe

sua opinião com a gente!
Quer aprender mais sobre PHP? Conheça a formação [**desenvolvedor PHP junior**]
aqui da alura! Ou então, que tal ir além e conhecer mais a fundo a extensão PDO,
suas vantagens e desvatagens? Faça o curso de [**PDO**] com a gente aqui na Alura!
imagem
Estou trabalhando em um projeto [**PHP**]. Só que quando tento acessá-lo pelo

navegador vejo o seguinte erro:
imagem, o grupo dono do arquivo (que pode conter vários usuários), e as dos demais
usuários que não pertencem ao grupo dono.
Essas permissões podem ser de leitura (`r`, read), escrita (`w`, write) e execução
(`x`, execute).
A permissão de leitura (`r`) permite visualizar o conteúdo de um arquivo ou

diretório, já a permissão de escrita (`w`) serve para alterar o conteúdo de um
arquivo e diretório.
A opção de execução serve para tornar o arquivo um executável, ou, em caso de

diretórios, para poder [acessá-lo] e usar comandos, como o `cd`.
Certo, já sabemos o que são e quais são as permissões, mas como podemos saber quais
estão sendo usadas neste arquivo?
## Visualizando as permissões
Para visualizar a permissão de um diretório, podemos ir até o local onde esse

diretório se encontra.
O comando `cd` (change directory) pode nos levar até esse local, que no meu caso
fica em `/var/www/html`. Portanto:
`$ cd /var/www/html/`
imagem o conteúdo deste diretório:

imagem.
`$ ls -l`
imagem ou um diretório (`d`).
Os nove caracteres restantes nos mostram as permissões do usuário dono, grupo dono
e outros usuários respectivamente:
imagem é apresentado.
Sabendo disso, já conseguimos dizer qual a permissão do nosso projeto loja. O

usuário dono tem todas as permissões (`rwx`), enquanto o grupo dono e o demais
usuários não possuem nenhuma permissão (`---`).
Mas, se eu criei os arquivos e tenho todas as permissões, por que não consigo
acessar a página pelo navegador?
Quando acessamos uma página pelo navegador, por padrão, o servidor não sabe quem é
o usuário, ou seja, quem acessa a página web utiliza a permissão **outros**.
Como o diretório do projeto não possui permissões disponíveis para o grupo de

usuários **outros** não conseguimos acessar a página pelo navegador.
Logo, precisamos alterar as permissões desse diretório para conseguir ter acesso
pelo navegador. Mas como podemos fazer isso?
## Alterando permissões
Para alterar as permissões de um arquivo ou diretório, temos que alterar o modo

(`chmod`, change mode) que elas estão organizadas.
Queremos que os outros usuários (ò`) tenham acesso de leitura (`r`) no diretório,
assim conseguirão visualizar os arquivos neles. Então podemos dizer para o
terminal:
`$ chmod o=r loja/`
imagem.
Já sabemos como alterar a permissão de uma pasta, então basta dizer que queremos
adicionar (`+`), a permissão de execução (`x`):
`$ chmod o+x loja/`
imagem no diretório `loja/`:
`$ chmod -R o=rx loja/`
imagem. O que fazer caso eu queira alterar as permissões do usuário e do grupo dono
do arquivo?
## Alterando a permissão do usuário e do grupo dono
Antes de mostrar como alterar a permissão do usuário e grupo dono de um arquivo ou

diretório, vamos criar um arquivo de texto em qualquer lugar do sistema para ser
usado como teste. No meu caso vou criar esse arquivo na área de trabalho:
imagem tenha, além dessas permissões, a permissão de executar o arquivo.

Então eu posso falar para o `chmod` acrescentar (`+`) a permissão de execução para
o usuário dono (ù`):
`$ chmod u+x teste.txt`
imagem a permissão de escrita do grupo dono (`g`):
`$ chmod g-w teste.txt`
imagem, acrescentar as opções de escrita e execução para o grupo dono (`g+wx`) e

deixar os demais usuários apenas com a permissão de execução (ò=x`):
`$ chmod u-x,g+wx,o=x teste.txt`
imagem, o `chmod` aceita também alguns números. Quando utilizamos números para
alterar as permissões, dizemos que estamos utilizando o **modo octal**.
## Entendendo o modo octal
O modo octal recebe este nome, pois utilizamos oito números, de 0 à 7, cada um
desses números correspondem a uma letra, ou a um conjunto de letras, no modo
simbólico:
- 1 → Representa a opção de execução (`x`) no modo simbólico;

- 2 → A opção de escrita (`w`);
- 4 → A opção de leitura (`r`).
Quando utilizamos o modo octal, podemos passar o modo de permissões de cada grupo
de usuários. A ordem é sempre: usuário dono, grupo dono e outros usuários.
Então eu posso falar para o `chmod`, por exemplo, colocar a permissão de leitura
para o usuário dono (`4`), para o grupo dono a de escrita (`2`) e a de execução
para os demais usuários (`1`):
`$ chmod 421 teste.txt`
imagem e escrita (`2`), basta somar o valor dessas permissões. Portanto teríamos
`6`.
Já se queremos tirar todas as permissões, basta colocar `0`.
Para fazer o usuário dono ter todas as permissões (`7`) no arquivo, o grupo dono
ter as permissões de leitura e escrita (`6`) e os demais usuários não tenham
nenhuma permissão (`0`). Basta dizer isso ao `chmod`:
`$ chmod 760 teste.txt`
imagem
## Para saber mais
Além do `chmod`, outro comando muito utilizado quando é o [**chown**] (change

owner). Esse comando consegue mudar o usuário e grupo dono de um arquivo ou
diretório e só pode ser executado pelo superusuário, ou pelo usuário administrador
utilizando o comando `sudo`.
**Devemos ter muito cuidado em dar permissões para os usuários que não fazem parte
do grupo dono**, ou não são donos dos arquivos ou pastas. Pois, dependendo da
permissão, esses usuários conseguem ter acesso a um diretório ou arquivo no
sistema. Conseguindo visualizar, alterar, ou até mesmo excluir seu conteúdo.
## Tem permissão de prosseguir?
Permissões fazem parte do sistema. Sem elas não conseguimos visualizar, alterar ou
executar arquivos, entrar em diretórios ou listar seu conteúdo. Até mesmo para
acessar um site na internet precisamos de permissões.
No Linux, conseguimos alterar a permissão de arquivos e diretórios usando um

comando próprio para isso, o `chmod`. Esse comando nos permite alterar as
permissões do usuário e grupo dono do arquivo ou diretório e dos demais usuários.
Mas antes de alterar, temos que entender quais são essas permissões e como podem
ser representadas.
Gosta de Linux? Aqui na Alura temos uma [**formação completa**] no sistema. Nela,
você aprenderá comandos do sistema, sobre a árvore de diretórios, alguns comandos
de rede, como adicionar usuários e grupos, além de muito outras coisas.
Bom, tanto em empresas, quanto no dia a dia de nossas vidas, nos deparamos com
diversas situações que demandam muito de um pensamento criativo e jogo de cintura.
Para isso, existe uma prática chamada **Design Thinking** que, assim como diz o
nome, nos faz "desenhar o pensamento", alinhando as condições reais de algum
contexto, que ajudam a compreender melhor as ações e resultados esperados.
É importante esclarecer que não se trata de um método fechado, pois é muito comum
associá-lo a fórmulas prontas e testadas para aplicar em qualquer situação, sem
distinção. Não é o que acontece nesse caso
## Como funciona o design thinking
Alguns profissionais possuem um jeito próprio de conduzir o pensamento, apontando

para o desconhecido e desafiando as regras convencionais aplicadas a tudo. Refletem
livremente, buscando soluções de forma colaborativa para uma determinada questão,
em fontes completamente distantes daquilo que pretendem criar ou resolver.
É uma condição que aprimora a criatividade, tornando-a mais completa e efetiva.

Sair da zona de conforto, sem medo dos obstáculos que possam surgir no trajeto, é
uma atitude necessária para conceber algo novo e melhor. Os designers são
especialistas nisso.
A intenção é criar o máximo de empatia com o público-alvo, uma vez que as pessoas
são o centro da preocupação durante o desenvolvimento de um projeto. O processo
inclui não apenas o usuário final, mas toda a equipe multidisciplinar envolvida.
Esse trabalho colaborativo é essencial para encontrar soluções inovadoras. Os

diversos ângulos abordados pelos membros da equipe oferecem interpretações variadas
sobre as questões e contribuem de forma mais assertiva para o resultado.
O objetivo durante o processo é mergulhar na experiência cultural dos indivíduos e

compreender sua visão de mundo e suas reais necessidades. Dessa forma, é possível
identificar as barreiras e encontrar alternativas acessíveis para derrubá-las.
Esse é o caminho para mudar em definitivo o jeito de buscar e encontrar novos rumos
para uma trajetória de sucesso e satisfação. Seu desdobramento ocorre em etapas.
Confira:
## Etapas de aplicação do design thinking
A aplicação do design thinking exige um conhecimento profundo sobre a abordagem

utilizada no design, de acordo com as seguintes fases aqui descritas resumidamente:
### Imersão
Nessa etapa, a equipe procura mergulhar na vida das pessoas e estudar seus padrões
e necessidades. São analisados perfis de usuários diferentes para viabilizar a
criação de soluções específicas.
As informações são coletadas pelos membros da equipe, que vão ao encontro do

público para interagir com ele. Os questionamentos se relacionam com o que as
pessoas falam, como agem, o que pensam e como se sentem.
Assim, é possível ganhar empatia, entender a visão do público, identificar suas

crenças e anseios para nortear a segunda fase do processo — a ideação.
### Ideação
Essa fase, normalmente, tem início com a equipe realizando um brainstorming

(técnica de geração espontânea de ideias). O objetivo é explorar o tema com a
participação dos indivíduos envolvidos no processo, ou seja, usuários e
profissionais de áreas pertinentes ao projeto em desenvolvimento.
As ideias eleitas são armazenadas para futura validação em reuniões com o cliente e
posterior utilização na fase de prototipação — produto de trabalho na fase de
testes de um projeto.
### Prototipação
Nesse momento, as ideias validadas na fase anterior passam da abstração à forma

física para representar a realidade. É a hora de verificar se o produto está de
acordo com o projeto e fazer ajustes, se for necessário.
Essa etapa é submetida à equipe multidisciplinar e ao usuário. Juntos, poderão

interagir com o modelo e avaliá-lo, contribuindo com informações para evolução e
aperfeiçoamento do protótipo.
Embora seja apresentada como a última fase do projeto, a prototipação pode

acontecer durante as fases anteriores. As ideias que forem surgindo podem ser
testadas e, até mesmo, implantadas.
### Realização
Por fim, a implementação do projeto é realizada nessa etapa, por meio do lançamento
do produto ou serviço.
Vale reforçar que o design thinking pode ser usado em qualquer setor de negócio, na
educação, na vida pessoal e em diversas outras áreas, por qualquer pessoa que
conheça bem a técnica.
## Design thinking nas relações empresariais
A forma original de pensar e de agir atribuída aos designers foi percebida por
gestores e administradores, que vislumbraram um novo horizonte para inovar no setor
empresarial.
Hoje, um dos maiores desafios das corporações é a crescente pressão por resultados
imediatos com o máximo de eficiência e mínimo de erros. Por exemplo: é muito comum
designers se depararem com uma forte pressão para desenvolver, em pouco tempo, um
projeto complexo que necessita de tempo e dedicação.
Nesses casos, não é raro que o resultado saia incompleto e precisando de diversos
ajustes. Se houvesse menos pressão para o término do projeto, as chances de
concluir um produto sem erros seriam bem melhores.
O maior problema, que ainda resiste em muitas empresas, é o cultivo de um método de

trabalho em que não prioriza as necessidades das pessoas, mas o produto final e
seus lucros. Essa prática é um resquício da primeira fase da [**revolução
industrial ocorrida entre os séculos XVIII e XIX.**]
Nos dias atuais, o cenário empresarial vem mudando rapidamente e as novas formas de
negócio trazem um perfil de [**profissional diferente**], mais participativo e
proativo.
A criação de lideranças sustentáveis requer mudanças fundamentais nas regras de

engajamento nos setores de trabalho. É preciso valorizar a empatia com as
necessidades humanas básicas.
Considerando as características do design thinking, sua contribuição nas

corporações pode servir para criar um ambiente mais cooperativo entre colegas de
trabalho e líderes. Esses novos valores tendem a gerar resultados diferenciados
para as empresas, partindo do desenvolvimento de soluções especialmente focadas nos
usuários.
## Como o design thinking pode ajudar na sua vida pessoal
O planejamento e a organização da vida pessoal podem adquirir uma qualidade

infinitamente superior com a adoção da abordagem do design thinking. Seu conceito
não linear tem a capacidade de auxiliar na descoberta de possibilidades nunca
consideradas antes.
É uma técnica muito útil para ajudar a otimizar melhor o cotidiano das pessoas
usando as mesmas etapas — imersão, ideação e prototipação.
Por exemplo: comece o processo fazendo um balanço entre sua vida pessoal, familiar
e profissional. Analise quanto tempo está sendo dedicado a cada uma das áreas da
sua vida. Quanto é dedicado ao trabalho, ao convívio familiar e ao cultivo de
atividades para sua própria satisfação e evolução pessoal.
Esse procedimento pode ser realizado por meio de anotações e esquematizações que
facilitem a análise posterior. O objetivo principal é aperfeiçoar o dia
harmoniosamente pensando no equilíbrio que essa abordagem pode trazer para a sua
vida.
O passo seguinte é analisar as informações da fase de imersão e, na geração de

ideias, criar a melhor solução para resolver os problemas encontrados. É uma forma
de questionar e rever o estilo de vida adotado até esse momento e tentar se
reinventar para ter uma vida mais plena.
## O design thinking aplicado na educação
Convém destacar a contribuição expressiva que o design thinking pode dar à

educação, ilustrando seus benefícios por meio de uma iniciativa da [**IDEO**]
empresa de consultoria global de design — que popularizou o termo ajudando
organizações empresariais em seus projetos. A IDEO criou e disponibilizou um
material para educadores e professores que, juntos, formularam um método denominado
“aprendizagem investigativa”.
Segundo esse método, o aluno deixa de ser um mero receptor de informações para
participar ativamente da formação do conhecimento. É um exemplo interessante de
como é possível reestruturar as salas de aula tanto fisicamente quanto nos
processos de aprendizagem.
Apoiada na premissa de que o design thinking é uma abordagem centrada nas

necessidades humanas, a IDEO fundamentou seu projeto no desenvolvimento da aptidão
de cada aluno de expressar seu pensamento e inovar.
A partir disso, ele será capaz de criar condições de contribuir melhor e com mais
independência para um mundo mais pleno, independentemente da profissão que exerça
na sociedade.
Entender o que é design thinking já faz parte das melhores práticas em todas as
áreas do conhecimento. Seu conceito e aplicação tornam todos os tipos de relações
mais dinâmicas e leves ao mesmo tempo. Agora, com base nas aplicações do design
thinking, você pode começar a inovar de forma diferenciada.
Quer ficar por dentro das novidades do mundo do design? Siga-nos no [Facebook],
[Twitter], [LinkedIn], [Google] e [YouTube] e mantenha-se atualizado!
Curtiu essa nova maneira de resolver problemas? Aqui a **Alura** temos uma
[**Formação em Design thinking**]. Nela você aprenderá sobre o processo de Design
thinking, como solucionar problemas de maneira assertiva, como trabalhar com sua
ideia e construir protótipos e muito mais.
Para realizar a comunicação entre os containers, podemos utilizar uma ferramenta do

próprio Docker chamada de [**Docker Compose**]. Com o Docker Compose podemos criar
um arquivo e especificar as propriedades de cada container, como comandos,
**variáveis de ambiente**,…
Estou com um **container** com uma aplicação PHP que se comunica com um **banco de
dados** para efetuar alguns testes antes de ir para produção. Então, fui rodar o
container, porém quando realizei o login me deparei com os seguintes erros:
imagem que o Compose vai subir**.
Temos dois serviços que queremos subir, o banco de dados e a aplicação web. Então
vamos começar especificando o serviço da nossa aplicação.
Neste caso, vou nomeá-la como àpp`.
sql
Nossa aplicação está baseada na **imagem** (ìmage`) `yuri/web`, e podemos dar o

nome (`container_name`) de àpp` por exemplo:
sql
Nós precisamos também mapear as **portas** (`ports`) que nosso container vai usar.
Neste caso, vou mapear a porta `8080` do nosso host, para a porta `80` do nosso
container:
sql
Bom, nosso **container depende (`depends_on`) de um banco de dados**, então vamos

falar isso em nosso arquivo do Compose. Neste caso, vou falar que ele depende do
serviço `db`:
sql
Mas o que é esse `db`?
**`db`** é o nome do nosso serviço de banco de dados. Ele nada mais é do que outro
container, logo, podemos especificar no mesmo arquivo `.yaml` do serviço de
aplicação.
sql
Se ele também é um container, então é igualmente baseado em uma imagem. Neste caso,
nosso banco de dados será baseado na [**imagem do MySQL**]. E vou nomeá-lo de `db`
sql
Mas como conseguiremos acessar nosso banco de dados? Ele precisa de um usuário,
correto?
Quando a imagem do MySQL está subindo como um container, ela lê algumas **variáveis
de ambiente (ènvironment`)**. Essas variáveis definem algumas informações como
usuário, senha, entre outras. Podemos especificar essas variáveis no próprio
arquivo do Compose.
Neste caso, por se tratar de um teste, vou utilizar o usuário \*\*root \*\
*(`MYSQL_USER=root`) e não vou alocar nenhuma senha
(`MYSQL_ALLOW_EMPTY_PASSWORD=yes`). Mas lembrando, nunca devemos usar isso em
produção por motivos de segurança:
sql
Também podemos falar para o Compose criar o banco de dados automaticamente quando
ele subir o container. Neste caso, vou criar o banco de dados `loja`:
sql
Pronto! Configurações terminadas. E agora como conseguimos fazer o Docker subir

esses dois containers?
No terminal conseguimos falar para o `docker-compose` baseado no arquivo (`-f`,

file) àplicacao.yaml`, subir (ùp`) os containers especificados:
imagem** um **terminal (`-t`) interativo (`-i`)** com o nosso container, `db` no

caso. Mas qual terminal vamos executar?
Neste caso, podemos executar o **`bash`**:
`docker exec -it db bash`
imagem `root` que teremos acesso ao banco de dados.
Nele, nós podemos criar nossas tabelas.

Agora se tentarmos logar em nossa aplicação, obteremos sucesso:
imagem** e atribuir nossos container a ela. Contudo, com o Docker Compose, temos
mais facilidade para a orquestração desses containers.
Aqui na **Alura** temos uma [**formação DevOps**] que nos mostra como utilizar o
Docker Compose, como criar nossas imagens, entre muitas outras coisas.
imagem
Agora que minha amiga começou a utilizar [**o processo de Growth Hacking no
marketing**] em seu clube de assinatura de chocolates e entendeu em [**qual fase do
funil do Growth Hacking**] ela deveria focar suas ações para resolver o problema do
clube, ela passou a documentar em uma planilha tudo relativo aos testes que seriam
realizados.
Ela colocou em linhas o objetivo, o período que o teste iria ficar na plataforma,
os resultados esperados e os experimentos que seriam feitos dentro deles.
- imagem;
- A métrica: indica quais dados que irão medir para avaliar se o experimento
funcionou. Nesse experimento é a quantidade de clientes que clicam no link para
começarem a pagar pelo clube.
Ao fim de cada explicação, como parte do **processo de avaliação dos

experimentos**, ela pediu para todos os membros da equipe darem uma nota de 0 a 10
para o experimento baseados em três parâmetros:
## Valor
Esse parâmetro significa, realmente, o **valor** que cada integrante acredita que
aquele experimento irá trazer para o negócio. Sendo zero nenhum valor e 10 muito
valor.
## Confiança
Representa o nível de **confiança** que cada pessoa tem de que esse experimento
realmente funcione e traga o resultado esperado por ele.
O zero indica que a pessoa não tem confiança que o experimento funcione e 10 que a
pessoa tem muita confiança que funcione.
## Facilidade
Por fim, cada pessoa tem que definir o nível de **facilidade** que acredita que
aquele experimento possui. Sendo zero muito difícil, e 10 muito fácil.
Como a equipe conta com cinco pessoas: Letícia, Yuri, Yan, Giovanna e Felipe, a
planilha com as notas dadas para cada parâmetro ficou assim:
imagem,** que calcula uma média de Valor, Confiança e Facilidade (VCF).
Dentro da estratégia, ela serve para indicar um maior sucesso ou fracasso de um

experimento utilizando esses três valores. **Quanto maior o valor do VCF, maior a
probabilidade do experimento dar certo**, quanto menor o valor, menor a chance.
Também, através desse número, podemos avaliar quais experimentos devemos fazer
primeiro, priorizando os que possuem um VCF maior.
Essa média se dá com a soma dos valores apresentados para cada parâmetro por todas
as pessoas da equipe de Growth Hacking.
Ou seja, o Valor representa a soma das notas dadas pela equipe a este item, da
mesma forma para Facilidade e Confiança. Depois soma-se esses valores e divide-se
por três, que é a quantidade de parâmetros.
A fórmula fica assim:
- ![]
Assim, toda a equipe de Growth Hacking do clube de assinatura de chocolate foi

calcular o **VCF**. A soma de Valor deu 32, a de Confiança 32, também, e a de
Facilidade 50. Assim, a fórmula para este experimento ficará assim:
- ![]
E continuando a conta:
- ![]
* ![]
Então, o valor final do VCF foi 38, o que adicionamos à planilha.
- ![]
E está pronto o VCF para este experimento!
Por fim, temos que avaliar esse número de acordo com a média máxima que poderia ser
dada pela quantidade de integrantes na equipe.
Como temos uma equipe com cinco pessoas, a média máxima seria 50. Se fosse uma
equipe com seis integrantes, a média máxima seria 60, se fosse de dez, a média
máxima seria 100, e por aí vai.
Desta forma, temos que verificar a porcentagem que demonstrará o quanto o

experimento poderá funcionar.
Para isso, podemos utilizar uma simples regra de três.
Se a média máxima é 50, esse número representa o 100%.
- ![]
Se a média dada para o experimento foi 38, então, temos que descobrir qual
porcentagem esse número representa, o que mostrará a probabilidade do experimento
funcionar. Como ainda não sabemos esse número, colocamos o x.
- ![]
Cruzando os números, iremos multiplicar o 38 por 100 e o 50 por _x_.
- ![]
O que resultará na seguinte fórmula, na qual 50 multiplica o _x_ e 3800 é o
resultado da multiplicação do 38 por 100.
- ![]
Para descobrir o _x_, que será a porcentagem que o VCF tem em relação à média
máxima, devemos passar o 50 que o está multiplicando para o outro lado do sinal de
igual, o que fará com o 3800 seja dividido por 50.
- ![]
Dividindo 3800 por 50, descobriremos a porcentagem do valor de VCF de dar certo.
- ![]
Então, descobrimos que esse experimento tem 76% de chance de funcionar!
Assim, analisando cada experimento e sua chance de dar certo, ao fim da reunião,
eles definiram quais deles deveriam ser priorizados, além de terem uma ideia de
quais poderiam dar mais certo.
# O que é VCF
Então, resumindo: o VCF é um cálculo utilizado para **analisar as probabilidades de

um experimento funcionar ou não**, por meio da percepção de todos os membros da
equipe de Growth Hacking.
Pois, todos darão uma nota para o **Valor**, **Confiança** e **Facilidade** de cada
experimento e a soma de todos as notas dividida por 3 determinará o valor do VCF.
Quanto mais próximo da média máxima, que é determinada pela maior média que
poderia ser dada pela quantidade de integrantes da equipe, maior a chance do
experimento funcionar e, por isso, deve ser priorizado em meio a tantos outros.
Se quiser saber mais sobre VCF, faça o nosso curso de [**Introdução ao Growth
Hacking: crescimento para negócios digitais**], que aborda cerimônias do Growth
Hacking e estratégias para algumas fases do funil de Growth Hacking.
No desenvolvimento de uma aplicação, é muito comum utilizarmos estruturas

condicionais como, por exemplo, ìf`s e èlse`s ou `switch case`. Porém, em algum
momento da nossa vida, provavelmente, um desses testes que realizamos é tão simples
que retorna um valor para apenas duas possibilidades.
Por exemplo, suponhamos que precisamos criar uma funcionalidade para gerar uma
bonificação e a regra para essa funcionalidade é a seguinte:
- Se o salário for maior que R$ 1000, o bônus é de 10%

- Se o salário for menor ou igual a R$ 1000, o bônus é de 15%
Uma solução seria utilizar um ìf` e èlse` como já conhecemos, como por exemplo no
Java:
java
Nesse exemplo o resultado é `150.0` pois o salário é menor que R$ 1000.0, ou seja,
bônus de 15%.
Entretanto, perceba que o que estamos fazendo é apenas um teste bem básico que tem
apenas uma única linha de código dentro do ìf` ou do èlse`. Será que não existe
uma maneira mais simples de resolver o mesmo problema?
Em um cenário similar a esse, podemos também utilizar o [**operador ternário**] que

funciona com o mesmo conceito do ìf` e èlse`, porém, a única diferença é que
precisamos devolver um valor após o teste **estritamente** em uma única linha!
java
Com esse código acima temos o mesmo resultado de antes, ou seja, `150.0`. Mas como
funciona esse operador ternário? A estrutura de um operador ternário é compreendida
da seguinte forma:
> **condição**? **valor se for verdareiro** : **valor se for falso**
Portanto, inicialmente temos um teste (podemos adicionar um teste qualquer), ou

seja, qualquer teste devolve um valor _booleano_, então, definimos o primeiro
parâmetro que é justamente o valor que será retornado caso o teste for verdadeiro e
o segundo que será retornado caso for falso!
Justamente pelo fato de realizar essas 3 operações, o chamamos de operador

ternário. Mas isso é só em Java? Não! Diversas linguagens implementam esse mesmo
recurso! Vejamos alguns exemplos:
**C**:
**Ruby**:
ruby
**C#**:
csharp
**JavaScript**:
javascript
**PHP**:
php
Observe que mesmo sendo linguagens diferentes, o recurso do operador ternário

contém a mesma estrutura! Entretanto, em algumas linguagens de programação, temos
algumas variantes, ou seja, o mesmo conceito do operador ternário que vimos, porém,
com algumas diferenças na syntax. Vejamos alguns exemplos:
**Lua**
js
**fortran
js
Achou interessante? Então dê uma olhada na quantidade de operadores ternários que a

linguagem python nos fornece resolvendo o mesmo problema:
python
Entretanto, é sempre importante lembrar que a utilização dessas variantes do

operador ternário pode ser problemático, pois dificulta a compreensão de
desenvolvedores que não estão acostumados ou simplesmente não conhece.
Portanto, recomendamos que evite o máximo possível a utilização dessas variantes. O

que achou do operador ternário? Está pronto para utilizá-lo no seu próximo
algoritmo?
**Que tal aprender mais sobre programação? Na Alura, temos diversos [cursos online
de programação] de diversas linguagens! Abordamos o conteúdo desde cursos mais
introdutórios, como [introdução a lógica com JavaScript] a cursos de
desenvolvimento de aplicações para [dispositivo móveis] (Android e iOS) ou
[aplicações web].**
Nesse artigo, enumeramos algumas dicas para quem está começando nessa carreira.
Pare tudo o que está fazendo e leia agora mesmo!
imagem
## 1\. Esteja sempre aberto ao novo
Em todos os momentos da sua vida, é sempre bom ver o mundo como um aprendiz e estar
aberto às novidades. Procure basear o seu trabalho em algum profissional que você
admira. Peça as opiniões dele, mande suas dúvidas e troque ideias. Mesmo que ele
seja de outro país, o Google Tradutor pode ajudar você nessa tarefa, certo?
Aproveite as facilidades da tecnologia para conhecer o trabalho de outros
profissionais da fotografia.
A humildade é fundamental em qualquer profissão, por isso, reconheça as suas

habilidades, mas tenha sempre em mente o que pode e deve ser melhorado. Para isso,
faça cursos e procure sempre se aprimorar na carreira. Além disso, procure sempre
conhecer a fundo o seu equipamento. No caso da máquina fotográfica, procure
fotografar nos diversos modos que ela apresentar, dando preferência ao manual, para
conhecer melhor as suas habilidades. No celular, busque conhecer os modos que ele
apresenta e veja qual o melhor para o seu estilo.
## 2\. Treine bastante e sempre
Pense em todos os seus amigos. Perceba o quanto eles são diferentes e cada um tem
uma beleza única. Que tal presentear eles com um ensaio fotográfico? Você poderá
treinar seus recursos fotográficos de forma abrangente e confortável, e a
intimidade entre vocês vai favorecer o momento.
Construa um conceito legal, busque uma locação bacana e vá com tudo! Aproveite
datas festivas e sugira ensaios temáticos — essa ação vai aumentar a exposição do
seu trabalho, além de possibilitar a montagem de um [**portfólio**] bacana, tanto
para você, fotógrafo, quanto para seus amigos modelos. Além disso, festas infantis
na família, viagens, seu quintal — tudo pode servir para você treinar o seu olhar.
## 3\. Invista em aprendizado
Antes de tudo, procure estudar um pouco de como funciona a fotografia, as

ferramentas disponíveis, as funcionalidades da câmera ou como controlar o resultado
que esperamos na fotografia final.
Por exemplo, saber as diferenças entre [**diafragma, obturador e ISO**] é

essencial. Estes são os conceitos mais básicos para entendermos um pouco melhor o
resultado que teremos.
Se você for trabalhar com celular, saiba antes se ele tem ferramentas parecidas com
essas.
Tente tirar algumas fotos para treinar. Além disso, pode ser bom investir em cursos
online, se você não tem muito tempo. Atualmente existem muitos cursos bons e
baratos de fotografia com os quais você pode aprender com praticidade e qualidade.
## 4\. Fotografe bastante
O tempo para desenvolver o olhar fotográfico depende de cada pessoa. Entretanto, se

você tiver uma boa câmera — profissional ou não — ou, até mesmo, a do seu celular,
já dá para começar a treinar. Faça experimentos com lentes, zoom, tempo de
exposição, brinque bastante com as luzes e formas e conheça o seu material de
trabalho a fundo.
**Use sempre uma mesma câmera, para você se familiarizar com ela, mas invente, ouse
e procure novos ângulos, lentes e lugares.** É ótimo saber dominar a técnica que é
necessária para o seu estilo. Saber exatamente como calcular a distância perfeita
do objeto e qual será o resultado disso faz uma enorme diferença.
Mesmo que você queira fazer fotos do seu celular, o seu olhar deve ser treinado do
mesmo jeito. Fique atento!
## 5\. Trabalhe a composição e a luz
Sabe a [**regra dos terços**]? Ela é fundamental para quem está começando no mundo
da fotografia conseguir compor uma foto de forma harmônica.
A regra se baseia em linhas que dividem a composição em terços na horizontal e na

vertical e que dão referências para a composição das imagens. Com o tempo, você
fará isso automaticamente, mas enquanto não pega o jeito, tente dividir,
mentalmente, a imagem que você quer fixar em três partes iguais e fotografe.
Agora vamos pensar na luz: **pode ser natural, como o sol, ou artificial, como
lâmpadas incandescentes e de led.** Procure sempre iluminar bem sua foto,
independentemente da luz utilizada.
Antes de fotografar, observe a intensidade e a distância da luz para a pessoa ou

objeto que deseja registrar. Isso interfere diretamente na imagem que você quer
fazer.
Luzes mais fortes e diretas tendem a gerar sombras mais contrastadas e marcadas. Um
bom exemplo é a luz do sol ao meio-dia. Ela é bem intensa e pode auxiliar ou
prejudicar as suas fotos. Por isso, fique atento a esses detalhes.
## 6\. Varie o local de trabalho
Procure explorar melhor esse ramo e comece trabalhando de forma individual. Lógico
que alguns fotógrafos preferem exercer seus serviços para uma empresa como um
profissional contratado, mas se esse não for o seu foco, você poderá facilmente
trabalhar como um fotógrafo [**freelancer**], prestando serviços por conta própria
a várias pessoas.
Assim, é possível oferecer seu trabalho de forma independente para vários clientes
diferentes sem ter nenhum vínculo com eles. Nesse caso, a melhor forma de ser visto
é fazer uma autopromoção, pois assim será possível encontrar potenciais clientes e
trabalhar com fotografia.
Procure fotografar cenas simples e do seu cotidiano, como crianças brincando no

parque, a natureza em um final de semana e seus amigos se divertindo. Isso tudo
pode gerar boas [**imagens**] para você começar a sua carreira. Não necessariamente
essas imagens vão ser o seu portfólio pra sempre, mas elas vão te auxliliar a
conhecer a camera melhor e assim saber as possibilidades que pode se obter.
Logo logo voce conhecerá o seu estilo e poderá apresentar um portflólio bem
trabalhado com base nos cursos que fez e em todo o conhecimento que foi adquirindo
fotografando as cenas simples do cotidiano.
Como você pode ver, para começar a trabalhar com fotografia não é necessário ter
equipamentos sofisticados ou fazer cursos no exterior. Basta ter disposição,
disciplina e, é claro, um grande amor pela profissão!
Gostou dessas dicas? Quer ler mais conteúdos interessantes? Então assine a nossa
newsletter e fique sempre por dentro das novidades do mundo por trás da câmera!
Todos os livros do meu sistema precisa de um nome, autor e um código de categoria.

Para identificar o código da categoria eu tenho a classe `CodigoCategoria` no
pacote _br.com.caelum.alura.codigo_:
java
E também tenho a minha classe `Livro` no pacote _br.com.caelum.alura.model_:
java
Certo, agora irei criar um livro novo na classe `Main` no pacote

_br.com.caelum.alura.main_:
java
Ué, não compila... Como podemos ver, a classe `Livro` e a `Main` estão em pacotes
diferentes, então precisamos importar a classe `Livro`.
java
Eu não sei qual é o código para livros de Java, então eu vou pedir para a classe
`CodigoCategoria`. Vamos importá-la:
java
Verificando as informações do livro:
```
> nome: Livro de Java autor: João da Silva codigoCategoria: 4
```
Ótimo, eu consegui criar meu livro, mas agora eu quero fazer uma lista de livros:
java
Consigo criar quantos livros eu quiser sem me preocupar com o código da categoria!
Porém ainda tem um detalhe... Veja que todas as vezes que queremos um código,
precisamos sempre utilizar o prefixo "CodigoCategoria.", não seria melhor
simplesmente digitar JAVA e a classe já saber qual é o código? Já que todas as
constante da classe `CodigoCategoria` são _static_, podemos fazer o _import
static_. Certo, da mesma forma que nos métodos, sempre usamos o _static_ antes,
então faremos static import também:
java
Ops! Não compila! Para fazer **qualquer import**, **SEMPRE** escreva a palavra
import antes:
java
Resolvemos o problema, porém agora eu terei que digitar uma a uma...poxa, muito
chato isso, né? Da mesma forma que importamos mais de uma classe usando o "\*",
podemos importar todas as constantes estáticas da classe `CodigoCategoria`:
java
O código continua funcionando da mesma forma! E se precisarmos de uma outra

categoria? Basta chamar pelo nome da categoria! Simples assim.
E aí, gostou do import estático? Quer aprender mais a fundo a linguagem Java?
Pensando nisso o instrutor Guilherme Silveira criou a [**certificação Java**] que
aborda todas as peculiaridades da linguagem Java com o intuito de preparar o aluno
para a certificação.
Como podemos criar um gráfico usando o Google Charts e obter os dados no Google
Spreadsheets?
Recebi dados de uma produtora de cinema em uma planilha do _Google Spreadsheets_, e

agora irei fazer um gráfico para visualizá-los:
imagem` que irá conter todo o nosso código, o primeiro passo será buscar os dados
da planilha do _Google_:
javascript
Esse objeto de busca irá buscar os nossos dados dentro da planilha.
Em seguida, envio esses dados para serem processados com o método `.send()` da API,
por uma função que irei chamar de `processaDados`.
javascript
A função `processaDados` vai receber o resultado da busca, que são os nossos dados
da planilha. Para popular a tabela, vamos usar o método `getDataTable()` do _Google
Charts_.
javascript
Até aqui já conectamos com a planilha do _Google_, buscamos, processamos os nossos
dados e os colocamos em uma tabela, agora vamos falar qual tipo de gráfico é esse.
Vou fazer um gráfico de linhas, para isso, dentro da variável gráfico, vou
instanciar outro objeto do _Google Charts_ e dizer que é um gráfico de linha, que
em inglês fica _line chart_. Também vou dizer que sua identificação no html é
`graficoFilmes`.
javascript
Em seguida, preciso pedir para que o _Google_ desenhe esse gráfico na tela do
navegador. Desenhar em inglês é _draw_, então vou digitar `grafico.draw()` e passar
a minha tabela para esse método da API.
javascript
Agora podemos visualizar o nosso gráfico.
imagem, largura (_width_) e título (_title_). Vou também passar essas opções para o
método `draw()` junto com a tabela.
javascript
Vou atualizar o navegador, e repare que já conseguimos ler o gráfico.
imagem` da API passando a função que desenha o gráfico:
html
E claro, para carregar as bibliotecas em JS usadas pelo _Google Charts_,

adicionamos também as tags script para o carregador de gráficos ou `loader.js` e
para o _jQuery_ na versão minificada:
html
## Como a empresa gerou o link para mim
Para que eu fizesse o gráfico, a empresa gerou o link do _Google Spreadsheets_ pra
mim. Para fazer isso, sei que eles clicaram no botão de **compartilhar**, e em
**avançado**.
![]
![]
Em seguida, clicaram em **alterar** na tela de configurações de compartilhamento.
![]
Ao fazerem isso, selecionaram a opção de **qualquer pessoa com o link** e clicaram

em **salvar**.
![]
Então, copiaram o link gerado pelo botão de **copiar link**.
![]
E, ao obterem este link

```
https://docs.google.com/spreadsheets/d/1BEtiBqFgOuFMe7K_9THV4vgaLCG8yRr-pQ-
HrkvxckE/edit?usp=sharing
```
alteraram o final do link a partir de
javascript
para
js
ficando com
```
https://docs.google.com/spreadsheets/d/1BEtiBqFgOuFMe7K_9THV4vgaLCG8yRr-pQ-
HrkvxckE/gviz/tq?range=A2:D16
```
## Carregando dados
Ao invés de carregar de um _Spreadsheet_, também podemos trazer os dados

manualmente usando o objeto `DataTable`:
js
## Para saber mais
Quer criar outros tipos de gráficos usando _Google Charts_? Dê uma olhada na
[documentação]. Há uma seção para cada tipo de gráfico.
Você também pode ver quais gráficos estão inclusos no pacote `corecharts` que
usamos [neste link].
Aproveite e faça os curso de [**Google Charts parte 1**] e [**Google Charts parte
2**] na Alura para aprender mais técnicas e reforçar o aprendizado.
imagem
Em um site de vendas online adicionaram um carrossel logo na primeira página do

site:
imagem segue também essa hierarquia de importância.
Isto é, costumamos deixar sempre os elementos principais logo no início para que,
quando o usuário decidir interagir com algo, passando para outra página interna ou
mesmo saindo do site, ele tenha ao menos visto o que consideramos mais importante.
Quando falamos em destacar muitos elementos de uma vez e utilizamos essa

distribuição, podemos acabar sacrificando alguns elementos que ficam mais ao final.
> _"Mas em um carroussel isso também não aconteceria?"_
Pois é, sim. O carrossel é uma alternativa legal quando queremos deixar os

destaques concentrados em um único lugar. **Mas**, desde que esses elementos sejam
em uma quantidade reduzida.
## Defina o que realmente é importante
Como já diziam por aí, "se tudo é importante, nada é importante". Grande verdade!
Nesse mar de informações que nós estamos imersos hoje em dia, queremos sempre
tentar capturar o máximo de pessoas possível atirando para todos os lados.
Mas aí vem o questionamento: Melhor uma quantidade x de conversões efetivas ou 10x

de pessoas que apenas visualizaram e pararam por aí?
Assim como [algumas pesquisa sobre carrossel apontaram], a maior parte das pessoas
não passa do primeiro banner até interagir com alguma outra coisa.
Justamente por isso, a primeira coisa antes de decidir usar um carrossel no seu
site é encontrar no máximo 3 ou 4 produtos ou chamadas a serem apresentadas ao
usuário.
No caso do exemplo anterior, conseguimos reduzir para estes anúncios:
imagem
imagem
Estava fazendo algumas alterações no meu sistema quando precisei alterar minha
senha de usuário. Como estou utilizando um Linux, abri o terminal e digitei o
comando para alterar a senha:
imagem para mim este arquivo com as informações sobre as permissões (`-l`).
`ls -l /usr/bin/passwd`
imagem? Será que ela indica que o dono do arquivo é o superusuário (`root`)?
## Conhecendo o SUID
Se listarmos outros arquivos cujo o superusuário é o dono, vemos que essa letra não
aparece.
imagem. Ela é uma propriedade para arquivos executáveis do sistema.
Quando um programa é executado, o dono deste processo é o usuário que executou o

programa. Porém, com arquivos com a propriedade SUID, esse comportamento é um pouco
diferente.
Quando executamos um arquivo com a propriedade SUID, o usuário dono do arquivo é

também o usuário dono do processo em execução.
Isso faz sentido quando pensamos no comando `passwd`. Apenas o superusuário tem
permissão para editar o arquivo `/etc/shadow`, que é o local onde ficam armazenadas
as senhas atuais de cada usuário.
Então, quando executamos o `passwd`, na verdade estamos executando o comando como

superusuário, por isso, conseguimos alterar a senha do nosso próprio usuário.
> Legal, mas se eu quiser criar um arquivo e atribuir nele o SUID?
Da mesma forma que atribuímos as permissões de leitura, escrita e execução, podemos

atribuir a propriedade SUID.
Por exemplo, eu criei um script para atualizar o sistema operacional. Porém, não
quero que qualquer usuário consiga executar este script pois apenas o superusuário
pode atualizar o sistema. Então vamos colocar o SUID nesse script.
Primeiramente, veremos como estão as permissões desse nosso arquivo:
imagem a propriedade SUID para esse arquivo (ù+s`).
Como estamos modificando as propriedades de uma arquivo, precisamos utilizar o

`sudo`, ou estar logado como superusuário.
`sudo chmod u+s atualiza-sistema`
imagem. Ela tem o mesmo comportamento que a SUID, porém funciona com grupos.
Sempre que um programa que tiver a propriedade SGID for executado, o grupo dono
daquele processo será o mesmo grupo dono do arquivo.
Da mesma forma que a propriedade SUID, os arquivos marcados com a propriedade SGID
apresentam um `s` nas permissões, porém na parte que corresponde ao grupo.
Então, podemos atribuir uma propriedade SGID nele para que quando ele for
executado, o grupo de desenvolvimento seja o dono do processo.
O processo de atribuição é parecido com o da propriedade SUID, porém, ao invés de

adicionarmos ao usuário, adicionamos ao grupo (`g+s`).
`sudo chmod g+s prepara-ambiente`
imagem. Para quem acrescentaremos essa propriedade? Para o usuário dono, para o
grupo dono, ou para os demais usuários?
Essa propriedade impede que os outros usuários apaguem arquivos que não lhe
pertencem então, temos que aplicar essa propriedade aos outros usuários (ò`). Mas
antes vamos ver como estão as permissões:
imagem.
Dessa forma, sua execução será mais rápida da próxima vez.
## Para saber mais
Além da forma simbólica, podemos também utilizar a forma octal para atribuir essas
propriedades.
Na forma octal, a propriedade SUID tem valor `4`, a SGID valor `2` e a Stick Bit
tem o valor `1`. Para utilizar essa forma, basta colocar esses valores antes das
permissões padrões.
Por exemplo, se quisermos atribuir o SGID e o Stick Bit para o diretório
desenvolvedores utilizando o modo octal, basta somar os números de suas formas
octais (2 + 1):
`sudo chown 3775 desenvolvedores/`
![]
As permissões e propriedades dos arquivos são muito importantes para quem quer
administrar sistemas Linux. Uma das bases do sistema são as propriedades e
permissões.
Aqui na Alura, temos uma carreira na [certificação LPI Essentials]. Nela você
aprenderá sobre a filosofia open source, sobre arquivos e diretórios, sobre como
buscar ajuda no sistema e muito mais.
Ao desenvolver um site para uma empresa, a equipe chega ao seguinte questionamento:
> Devemos desenvolver um site único, responsivo para diferentes tamanhos de tela,
ou um site dedicado especialmente para desktop e outro para mobile?
Para entender as diferenças em cada possibilidade, desenvolveram os seguintes

layouts:
imagem a esta conclusão.
## Site único responsivo vs. Site mobile dedicado
Para deixar mais claro quais são as diferenças encontradas em cada um, podemos
analisar o quadro a seguir:
**Design**, Os layouts acabam sendo mais simples para facilitar a adaptação dos
elementos em diferentes tamanhos de tela, Maior liberdade na criação do layout, uma
vez que cada um funcionará em paralelo
**Domínio**,Utiliza um único domínio, facilitando o compartilhamento de endereços

web,Utiliza subdomínios como _”m.”_, redirecionados do domínio principal, o que
pode resultar em um pouco mais de tempo para ser acessado pelo usuário.
**SEO**,Segundo o próprio [Google], recomenda-se a utilização de sites responsivos,

principalmente, porque economiza recursos quando o Googlebot rastreia o site.
Apesar de passar no teste do Google de Mobile Friendly Websites, os sites mobile
dedicado só serão [**bem ranqueados**] se todas as versões do site oferecerem uma
boa experiência de usuário. Além disso, com diversas URLs o rastreamento do
Googlebot pode ficar mais lento e comprometer a atualização frequente do
ranqueamento.
**UX**,Se as adaptações do layout não forem feitas cuidadosamente, pensando

exatamente nos ganhos e perdas que cada dispositivo pode ter, a experiência do
usuário na interação com o site pode ser comprometida,Uma vez que o layout será
criado focado para o dispositivo, as chances de conseguir aproveitar o máximo
possível dos recursos e limitações do dispositivo é muito maior, o que não
significa que a simples criação de um layout dedicado irá solucionar
automaticamente essa questão, dependendo muito de como isso foi pensado pelos
designers.
**Manutenção**,A manutenção é feita diretamente na estrutura do site principal, que

atualiza todas as versões aos mesmo tempo, facilitando a manutenção.,O fato de ter
mais de uma página para lidar faz com que a manutenção seja mais complexa.
Atualizar a página principal não tira a necessidade de atualizar as demais versões
do site.
Por último, temos um tópico muito importante a ser considerado: a Performance.

Justamente por isso, este tema ganhou um parágrafo dedicado especialmente para
deixar claras as diferenças para cada um.
De um lado, temos o site único responsivo, que possui longos códigos HTML/CSS,
conteúdo e imagens mais pesadas (uma vez que são utilizados tanto em desktop quanto
em mobile) e que podem prejudicar a velocidade de carregamento.
Contudo, sempre que falamos de performance temos que tomar cuidado (o Guilherme
Silveira aqui pega no pé de todos nós em relação a isso), o site _pode_ ter uma boa
performance melhor **se** o [código] e as [imagens] forem otimizados - no caso das
imagens, otimizadas para cada media query também.
Ou seja, podemos ter uma performance melhor, porém teremos um pouco mais de
trabalho.
Por outro lado, o site mobile dedicado é criado já para o contexto mobile e, além
de ter um código HTML/CSS menor, carrega imagens menores e, consequentemente, menos
pesadas, pensadas especificamente para este contexto, que tornam o carregamento
mais rápido.
Ainda assim, é importante lembrar que, mesmo sendo pensadas para este contexto, se
o designer não otimizar estas imagens corretamente, cairemos novamente no mesmo
problema de peso das imagens.
Então, depois de analisar o quadro comparativo e as últimas considerações, já

podemos chegar a uma conclusão, certo?
Será mesmo?
## Qual opção escolher, afinal?
Depois de todas essas definições e comparação, chegamos à conclusão de que não

existe uma resposta definitiva. O que existem são pesos e medidas a serem
analisadas antes da tomada de decisão final.
Isto é, sempre que formos escolher uma linha para a produção de um site é
importante fazer algumas considerações para entender o fator determinante para a
proposta do site, como:
- Qual o objetivo do site?

- Qual o perfil do público desse site: mais usuários de desktop ou mobile?
- Quanto temos de verba?
- Como funcionará a atualização do site? Demanda de atualização contínua?
Essas e muitas outras perguntas ajudam a entender melhor qual a melhor solução para
cada caso. Portanto, antes de iniciar seu projeto, é importante que tudo isso
esteja bem alinhado com a equipe e o cliente.
Você já passou por uma situação assim em seus projetos? O que pensa sobre o
assunto? Compartilhe suas ideias com a gente nos comentários abaixo!
Dentro do universo mobile existem ainda diversas outras questões a serem exploradas
e que podem ser muito interessantes para você que trabalha (ou pretende trabalhar)
nesta área.
Na Alura temos um curso muito legal sobre [**Web Design Responsivo**] e, para quem
quiser se aprofundar mais ainda nos estudos, a dica é ler o livro [**A Web
Mobile**] do Sérgio Lopes. ;)
Você é daqueles(as) que está sempre pensando com a tão sonhada oportunidade de
emprego na área? Se prepare que hoje temos algumas dicas que podem ser úteis para
sua carreira.
Ficou interessado em saber mais sobre a trajetória dele como: dificuldades,

desafios e estudos? Então não perca tempo e veja como foi:
imagem. Tenho um carinho enorme com essa linguagem. Foi através do RoR que consegui
a vaga de emprego. Quero me dedicar e aprender mais com essa linguagem.
O que achou da história do Fabiano? Bacana, né? Aproveite e deixe o seu

comentário :)
Quer compartilhar também a sua história conosco? Então entre em contato com a gente
por meio do e-mail **contato@alura.com.br**.
Estou desenvolvendo um sistema web que armazenará todos os livros que comprei para
poder realizar consultas e verificar se já tenho um livro ou não. Porém, preciso
criar um formulário de cadastro em HTML para enviar esses livros para o servidor.
Para fazer um formulário precisamos utilizar a tag `form`:
html
Já indicamos que estamos criando um formulário, agora vamos adicionar os campos

necessários para fazer o cadastro de um livro! Preciso do nome do livro, nome do
autor, data da compra, valor e ISBN. Mas como adicionamos esses campos no HTML?
Para adicionar campos de texto, podemos utilizar a tag input``
imagem
Fiz um teste de usabilidade com um app de compartilhamento de imagens que estava

desenvolvendo. O teste aconteceu com o protótipo, antes mesmo de ser lançado, e já
foi suficiente para que encontrasse alguns feedbacks muito relevantes sobre o
projeto.
Os usuários que testaram o protótipo identificaram que o processo de postar

arquivos na timeline não fazia muito sentido. Pareciam etapas muito repetitivas:
imagem, novas opções surgem: - Abrir câmera - Adicionar da galeria.

Se abríssemos a câmera poderíamos: - Tirar a foto, - Verificar e mandar para a
timeline.
Ao passo que adicionar da galeria seguiria os passos de **escolher pasta** e então

**escolher o arquivo** antes de lançar o post.
Note que, se esse é o mesmo roteiro que faríamos para tirar foto ou gravar um
vídeo, o processo se torna redundante, dado que faríamos os mesmos passos de ir
tanto para a câmera, quanto para a galeria.
Ao analisar novamente o app, fiz uma anotação do que precisava ser alterado:
> Retirar passos que se repetem e transformar em um único passo.
Só que, quando passei para a fase de prototipação, todos ficaram confusos. Tiveram
dificuldade em identificar onde e como colocar essas mudanças.
Pensei, então: Como poderia fazer com que essas mudanças ficassem mais claras para
toda a equipe? O correto seria deixar o planejamento mais redondo antes de passar
adiante!
## Esquematizando um fluxo
Voltamos para a etapa de sinalizar as alterações que precisávamos colocar no app.
Ao invés de simplesmente escrevermos que alterações deveriam ser feitas, colocamos

todas as telas desse processo problemático em uma tela:
imagem
E se você quiser entender um pouco mais sobre os [**processos de UX**], temos uma
formação muito legal que passa por diversos cursos e complementos de estudo!
Estou desenvolvendo um sistema para computar todas as vendas de uma empresa.

Atualmente, estou representando cada funcionário da seguinte forma:
java
O atributo `cargo` é um _enum_ que listará todos os cargos diferentes do sistema:
java
Além da representação do funcionário, eu também fiz a representação de uma venda,

que possui um funcionário e o valor da venda:
java
Porém, cada vez que uma compra for realizada, eu preciso calcular a comissão do
funcionário de acordo com o seu cargo, por exemplo, se o funcionário for um
atendente, a comissão será de 10% do valor da venda, se for vendedor 15% + 5 reais
e gerente 20% + 10 reais. Então vamos criar o método `calculaComissao()` na classe
`Venda`:
java
Certo, agora vamos implementar o método para calcular a comissão. Bom, podemos
pegar o cargo do funcionário e fazer um ìf` para verificar qual é o cargo dele e
então realizar o calculo da sua comissão:
java
Conseguimos calcular, porém precisamos retornar a comissão da venda, então vamos

alterar a assinatura de `void` para `double` e então, retornamos a variável
`comissao`:
java
Ótimo, agora precisamos fazer uma simulação para verificar se está funcionando!
Então vamos lá:
java
java
Para um atendente o valor da comissão é de 10%, e 10% de 200 é realmente 20! Então
está funcionando como esperado! E se tentarmos a mesma venda com um cargo de
vendedor?
java
15% de 200 é 30, mais 5 reais fica 35! Por enquanto tudo certo! Vamos verificar o
último cargo, ou seja, o de gerente:
java
Excelente! Conforme o esperado, foi impressa uma comissão de 20% que equivale 40,
somou 10 e resultou em 50! Aparentemente a minha implementação está impecável! Sem
nenhum problema! Só que não! :(
## Entendendo o problema dos ifs
Consegue imaginar o que está sendo tão problemático? Vejamos novamente a nossa
implementação da `calculaComissao()`:
java
Veja que, para cada cargo, estamos fazendo um ìf` que identifica qual cargo se
refere, e então, calculamos a sua comissão. Vamos supor que a empresa que solicitou
uma adição de 3 cargos diferentes, que são: ajudante (8% + 1 real), recepcionista
(5%) e diretor (25% + 20 reais):
java
Como ficaria o nosso método `calculaComissao()`? Vejamos:
java
Observe que o nosso método `calculaComissao()`, atualmente, **tende a crescer e

muito**! Com certeza essa é uma **má prática**, pois se um dia adicionarmos um novo
cargo e esquecermos de adicionar nesse conjunto gigantesco de ìf`s e èlse`s, o
nosso sistema apresentará um _bug_ facilmente...
Além disso, e se quisermos reutilizar esse método em uma outra classe qualquer?
Teremos que fazer um **_copy_ e _paste_ de todas essas condições** e, se um dia
mudar a regra de negócio e tiver um reajuste na comissão? Teremos que **mudar em
todos os pontos** do nosso sistema que está utilizando esse tipo de
implementação...
Veja quanta complicação! Com certeza é uma solução trabalhosa e não tão
inteligente! Sabendo desses problemas, como poderíamos resolver isso?
## Separando as responsabilidades
Que tal isolarmos a responsabilidade de calcular a comissão para cada cargo? Mas
como assim isolar a responsabilidade? Exatamente isso, fazer com que o próprio
cargo saiba calcular a sua comissão, ou seja, podemos fazer com o que cada enum já
implemente um método `calculaComissao()`!
java
Repare que, ainda existe um grande problema, pois da forma que está atualmente, o
nosso enum compila nesse instante, porém quebra todos os pontos do sistema que o
chama, pois não é garantido que todos os valores do enum tenham esse método!
Precisamos, de alguma forma, garantir que todos os cargos tenham um método

`calculaComissao()`!
## Garantido a chamada de métodos por meio de interface
E agora? Como podemos fazer isso? Da mesma forma que em classes, nós podemos fazer
com que o enum implemente uma interface que obrigue a implementação do método
`calculaComissao()`! Então vamos criar essa interface:
java
Agora que temos a interface `Comissao`, basta implementá-la no enum e sobrescrever

o método para todos os cargos:
java
Certo, definimos o método `calculaComissao()` para cada cargo, e como ficaria o

método `calculaComissao()` da classe `Venda`? Vejamos o que muda:
java public class Venda {
Cade aqueles ìf`s e èlse`s??? Será que ainda funciona como antes? Vamos testar
novamente, para todos os cargos para uma compra no valor de 200:
Atendente (10%):
java
Vendedor (15% + reais):

java
Gerente (20% + 10 reais):

java
Ajudante (8% + 1 real):

java
Recepcionista (5%):
java
Diretor (25% + 20 reais):
java
Excelente! Está funcionando conforme o esperado, porém agora, nós podemos calcular
a comissão de um funcionário chamando apenas 1 método e em qualquer lugar!
E se agora precisarmos fazer aquele reajuste?
Basta alterar apenas no enum e funcionará da mesma forma para todas as classes que
chamarem o método `calculaComissao()`!
## Todo conceito por de trás da nossa implementação
A solução que utilizamos não é uma invenção minha, isso é um **_Design Pattern_**
(na tradução, padrão de projeto) chamado **_Strategy_** que, por meio de
_polimorfismo_, nos permite adicionar/alterar implementações de um método em comum,
deixando-as [**encapsuladas**], sem que impacte as chamadas realizadas pelo
cliente.
Em outras palavras, podemos fazer diversas variações de um mesmo método em comum

(por exemplo, o `calculaComissao()`) que precise de um comportamento diferente para
cada situação, nesse caso, o calculo de comissão para cada cargo diferente!
A implementação demonstrada no artigo é **uma das possíveis implementações do

Strategy**, ou seja, existem diversas outras!
Isso significa que **é muito mais importante entender o conceito utilizado para
resolver o problema com o Strategy** do que apenas a implementação, ou melhor
dizendo, identificar uma situação que apresenta muitas variações para uma
determinada funcionalidade que por sua vez, são condicionais, como foi o caso do
calculo de comissão ser diferente para cada cargo diferente, e então aplicar o
Strategy!
E aí, o que achou do Strategy? Nunca havia pensado que os ìf` algum dia poderiam
sumir?
**Quer aprender mais sobre Design Pattern? Na Alura, temos o curso de [Design
Pattern em Java] que demonstra tanto o Strategy como outros Design Patterns,
explicando como cada um funciona e aonde podemos aplicar cada um deles!**
imagem
Copia, cola no editor de texto. E nós ganhamos tempo. Copia, cola na caixa de
mensagem. E nós perguntamos da festa para quem ontem estava no enterro. Copia, cola
acontece também no nosso comportamento.
No consultório, o médico me prescreveu anti-inflamatório. Levantei a questão se tal

remédio poderia ser ineficaz ou fazer-me mal:
“Doutor, fiz cirurgia por causa do câncer e me tiraram o estômago. O senhor acha
que…”
”Quando você for tomar o remédio", interrompeu-me o doutor, "sempre o faça com o
estômago cheio.”
“Com a barriga cheia, né, doutor?" comentei rindo. Não discuti com quem copia,cola.
Não havia nenhuma fresta para pensar. Somos todos iguais perante o copia,cola. Tudo
é igual perante o copia,cola.
Nas empresas onde trabalho, a Caelum e a Alura, damos forte ênfase à acolhida do
aluno. Esse acolhimento do aluno que chega para o início da turma ou que chega para
uma longa caminhada através de inúmeros cursos, foi construído por diversas pessoas
que participaram da história da **Caelum e da Alura**, e hoje tem uma estrutura.
Estrutura é como hábito. Muito bom. Muito ruim quando adota apenas o copia/cola.
[**Seth Godin**] diz... Já foi feito... Trabalhos, tarefas em que replicamos o

processo em vez de inventá-lo… Podemos criar importante valor para a tarefa quando
a fazemos num momento em que nos é exigido explorar a situação e criar nova
solução.
Rotina, não. Explorar, sim. Isso significa que faremos uma tarefa que não foi feita
antes, algo que pode até não funcionar. Essa simplesmente é a forma como devemos
implementar a tarefa, o trabalho.
Copia, cola não, e sim… ”a melhor aula da vida do aluno”.
Como andam seus hábitos? Entenda [**como criar metas que façam sentido para você**]
e melhore sua produtividade. :)
imagem
Fomos contratados para desenvolver um software em Java para uma empresa e a

instalação do nosso programa é feita via console.
Para conseguir usufruir do nosso produto o usuário precisa ler e aceitar os termos
de uso, caso contrário não podemos permitir que a instalação continue.
Além disso, para estatísticas internas da empresa, após aceitar os termos o usuário
também deve nos informar seu nome completo.
Vamos então começar criando a funcionalidade do usuário poder aceitar ou não os

termos de uso do nosso produto.
Após a criação, testamos e obtivemos o seguinte resultado:
imagem**]). Este método lê a próxima entrada do usuário.
java
Pronto, agora nosso `leitor` foi atribuído a um objeto e usamos o método `next()`
para pedir ao usuário que ele digite uma resposta. Vamos testar:
imagem` é chamado.
Para resolvermos essa situação vamos primeiro atribuir a resposta do nosso usuário
a uma variável para não perder a entrada lida pelo nosso `leitor`:
java
Hmm… já está melhor, mas isso ainda não resolveu nosso problema, ainda temos que
processar a informação recebida, pois nosso programa não é mágico, precisamos
mostrar pra ele qual direção seguir, ou seja, se ele continua a instalação ou não.
Para verificar a resposta, vamos criar uma condição que vai comparar se a
`resposta` é ‘S’ para que seja concluída a instalação. Como queremos [**comparar
dois objetos**], podemos usar o método èquals`, que faz exatamente isso:
java
Ao olhar o código, pode não parecer natural chamar o método equals a partir de uma
string [_hard coded_], mas fazer isso é uma boa prática, pois temos certeza que a
string ‘S’ não é nula, logo nos prevenimos contra `NullPointerException`.
Pronto, vamos testar e ver se tudo está funcionando:
imagem dentro de um método e apenas chamá-lo, inclusive é uma boa prática fazer
isso.
Para fazer essa refatoração, primeiro criaremos um método e jogaremos toda nossa
lógica de validação de resposta dentro dele:
java
Agora vamos apenas chamar esse método:
java
> Caso queira saber mais sobre refatoração, código limpo e etc, deixarei o link de
um [**artigo**] que trata exatamente sobre esse assunto, vale a pena dar uma
olhada.
Agora que já conseguimos implementar a primeira _feature_ que consistia em receber

uma resposta do usuário para aceitação ou não dos termos de uso, vamos para a
segunda parte, no caso, implementar uma função para receber o nome do nosso
usuário.
Começaremos pedindo ao usuário para nos fornecer seu nome, mas antes de implementar
tal funcionalidade, vamos pensar: Onde devemos escrever esse código?
Faz sentido pedir o nome do usuário que digitou ‘N’ ou o usuário que digitou uma
resposta inválida? Não, né? Logo, nosso programa só deve perguntar o nome para os
usuários que digitaram ‘S’, portanto, devemos codificar essa nova funcionalidade
dentro do bloco ìf` onde a condição verifica se a resposta é igual a 'S'.
Agora sim podemos implementar esse código. Como estamos fora do escopo do nosso
`leitor` teremos que instancia-lo novamente, já que só o usaremos uma vez podemos
instanciar a classe `Scanner` e já chamar o método que queremos, no caso o
`next()`, e já salvar em uma variável. Por enquanto nada novo né?
Logo, dentro de `validaResposta()`, teremos o seguinte código:
java
Repare no nosso resultado:
imagem e ver o que realmente está sendo armazenado.
java
Agora só falta testar:
imagem` lê apenas, e somente apenas, a próxima entrada, por isso, se o usuário

tiver um nome composto, não vamos conseguir o resultado esperado.
Para resolver tal problema podemos usar outro cara da classe `Scanner`.
## O método nextLine
Precisamos de um cara que leia a linha inteira e esse cara é o método

[`nextLine()`]). Sendo bem técnico, ele pula a linha que está e lê tudo o que foi
pulado. Vamos lá!
java
Agora nos resta testar:
imagem consegui entender o problema. Vamos destrinchar esse erro.
O método `next()` é o culpado da situação, como já foi falado ele lê a próxima

entrada e só. Nessa linha, onde o usuário aceita os termos, temos duas entradas a
ser lidas.
> "Tá doido? Só tem uma, ou é ‘S’ ou é ‘N’”
Concordo, só tem uma entrada visível a ser lida, mas após a resposta do usuário
temos uma quebra de linha certo? Essa quebra de linha é representada por `\n`, que
nada mais é do que uma sequência de escape para o compilador, isto é, quando o
compilador vê o `\n` ele pula para a próxima linha.
Então, esse `\n` não foi lido pelo `next()` e ficou para ser lido pelo `nextLine()`
que vem em seguida, logo o `nextLine()` lê o resto da linha vazia e termina a
execução do nosso programa, ele nem sequer chega a ler o nome.
Para exemplificar melhor vou mostrar com um desenho de qualidade:
imagem` para receber o nome.
Podemos abordar essa situação de duas formas:
Adicionando um `nextLine()` logo após o `next()` para que após a primeira resposta
do usuário o nosso `leitor` já seja posicionado na linha seguinte, deixando nosso
código desse jeito:
java
Vamos testar e ver se realmente essa abordagem funciona:
imagem` pelo `nextLine()`, ficando assim:
java
Novamente, vamos testar e ver se conseguimos o resultado esperado:
![]
Tudo certo aqui também. Nos dois casos, temos o mesmo resultado, mas a primeira
abordagem não é recomendada, pois estamos usando um método a mais sem necessidade.
Com a segunda abordagem nosso método fica mais limpo.
Parabéns!!! Conseguimos criar todas as funcionalidades pedidas e "blindamos" nossa

aplicação contra cenários problemáticos que podem surgir durante o uso do nosso
software.
Eai, já teve problemas em receber entradas dos seus usuários? Compartilhe sua
experiência aqui nos comentários.
## Expandindo seu conhecimento sobre a classe Scanner
Além de usarmos a classe `Scanner` para ler entradas do teclado, podemos usar
também para ler arquivos externos. Para saber mais a respeito acesse esse post onde
é mostrado [**como ler e processar arquivos externos**] usando a classe Scanner.
Aprenda outras funcionalidades bem úteis para o seu dia a dia na [**Formação
Java**], onde você vai aprender técnicas tanto básicas quanto avançadas para criar
suas aplicações.
Quando o site da startup Armazém de Ideias foi ao ar, perceberam que a página, ao
ser requisitada, apresentava o seguinte comportamento:
imagem, JPG, PNG e GIF, e o das imagens vetoriais, SVG.
Falando de forma simples e objetiva, as **imagens raster** são compostas de pixels,

que dependem da resolução e tamanho da imagem para ter qualidade na visualização,
enquanto as **imagens vetoriais** são baseadas em fórmulas que recalculam os
valores da forma sempre que redimensionada, preservando a qualidade.
imagem ou sem perda de qualidade (lossless).
Alguns sites de [compressão de imagem] já possibilitam esse tipo de escolha, mas

também temos como fazer essa alteração manualmente, no momento em que salvarmos o
arquivo no [Photoshop] ou até mesmo os arquivos SVG no [Ilustrator].
_"Mas o que, de fato, muda quando otimizo uma imagem?"_
Para entender melhor a ideia, vamos aplicar uma compressão lossy e uma lossless em
uma mesma imagem, para visualizar as diferenças em cada tipo:
imagem. :)
O que achou deste post? Conta pra gente suas experiências e sugestões sobre o tema!
Entenda mais sobre boas práticas e técnicas para melhorar a Performance Web neste
curso da Alura e deixe suas páginas muito mais rápidas e otimizadas. ;)
**`List` é uma coleção de objetos que mantém a ordem em que eles foram
adicionados**. Qual estrutura de dados estamos usando por trás de uma lista? Quando
utilizar? É o que veremos aqui com códigos direto em C#.
Fomos chamados para resolver o problema de uma loja que está com dificuldade de
armazenar os dados de seus produtos, pois eles já tem um sistema em produção. Porém
ele não engloba a parte de armazenamento de produtos
Por conta disso, acabam tendo dados perdidos ou incorretos como, por exemplo, a
quantidade de produtos no estoque não bate com as anotações. Analisando todo o
contexto, decidimos utilizar **C#** para ter compatibilidade com o sistema que a
empresa já tem.
A primeira coisa que vamos fazer é olhar como os dados estão armazenados do
caderno.
```
Nome | Quantidade
------------------
Maçã | 100
------------------
Abacaxi | 50
------------------
```
Quando olhamos esses dados pensamos: O que podemos utilizar para armazenar isto?
Assim como nas anotações, podemos utilizar um recurso parecido com essa tabela que,
no caso do C#, seriam as **listas**. Mas por onde devemos começar?
# Começando a implementação
Poderíamos começar criando uma aplicação console e analisando o que sabemos. No

caderno tem as propriedades: **Nome e Quantidade**.
Então vamos partir do ponto que temos que criar uma classe onde tenha os dois
atributos juntos.
Qual nome devemos dar para esta classe? Um bom nome seria Produto, pois, estamos
deixando claro o que a classe representa.
csharp
Esta classe vai ter que ter os atributos de nome e quantidade, com seus respectivos
**getters e setters**.
csharp
Com a nossa classe criada vamos começar a trabalhar com a listas, no nosso Arquivo
Program.cs.
Como queremos trabalhar com listas vamos primeiro criar uma lista de produtos para
conseguir armazenar da mesma forma que estava no caderno.
csharp
Com esta lista criada, precisamos colocar elementos dentro dela para ver se está
funcionando da melhor maneira possível, mas como podemos adicionar elementos a essa
lista?
Temos que instanciar o Produto e adicionar valores a cada atributo para adicionar a
lista
csharp
Bem agora só falta adicionar na lista para fazer isto temos que chamar o **método
add** dela.
csharp
Temos que mostrar os valores que estão na lista, e como vamos fazer isto?
Podemos utilizar o **foreach** para percorrer a lista a mostrar o valores que estão
contidos na lista. Vamos precisar falar que queremos que um produto que está em
lista fazendo.
csharp
# Alterando lista
Queremos além disso alterar os elementos que estão dentro desta lista, pois,
escrevemos maçã de forma errada, está escrito maca e não é desta forma que se
escreve, mas para alterar os dados, podemos fazer de qual maneira?
Quando criamos uma lista, ela tem uma coisa chamada **índice**, este índice é a
numeração que está dentro da lista ou seja sempre que criamos algum item dentro da
lista, ele vai ter um índice.
Vamos então fazer esta alteração a partir do índice, onde vamos mudar maca para
maçã, primeiro vamos pegar a nossa lista que contém apenas um índice e mudar o nome
que esta contido dentro da lista.
csharp
Com isso mudamos o nome que está na lista, mas precisamos ver está alteração foi
bem sucedida. Então vamos percorrer a lista novamente e mostrar os valores que
estão nela.
csharp
Após isto vamos fazer a análise do itens que estão no caderno, mas descobrimos que
pararam de vender maçã nesta loja. Então vamos ter que remover este item da nossa
lista, mas como podemos fazer isto?
# Removendo item da lista
Para fazer a remoção temos que duas maneira para se fazer isto, podemos remover
pelo índice ou podemos remover o produto direto. Então vamos mostrar das duas
maneiras.
Vamos começar adicionando mais um item na nossa lista para conseguir demonstrar dos
dois modos.
csharp
Com um novo item adicionado na nossa lista, vamos pensar de qual maneira nós já
conhecemos? Bem nós já conhecemos como os índices funcionam. Então vamos começar
removendo desta maneira, passando o índice que está na lista como parâmetro.
csharp
Aqui nós removemos pelo índice, agora vamos remover passando o produto que
queremos, para fazer isto temos que utilizar a função Remove está função nos espera
um dos objetos que estão dentro da lista.
csharp
# Conclusão
Com isto resolvemos o problema que tivemos em relação a perda de dados ou dados
errados.
Com listas aprendemos como podemos armazenar, alterar, remover.
Se ficou interessado em como o C# funciona e como você pode utilizá-lo melhor, aqui
na **Alura** temos uma [**formação .NET**]. Nela você verá como criar aplicações,
persistir os dados, dentre outras coisas.
imagem
Um site responsivo vende a ideia de se adaptar a todo tipo de resolução. Mas é

mesmo **todo** tipo? E os extremos? Telas muito pequenas e telas muito grandes?
Como lidar? Ou melhor, como adotar uma estratégia pragmática com relação a isso?
Essa excelente pergunta foi trazida ao [**fórum da Alura**] pela Luana que estava
fazendo nosso [**curso de Web Design Responsivo**].
## Entendendo os sites únicos e responsivos
Os sites únicos responsivos são uma resposta a prática que tínhamos antes de "criar
um site pra cada aparelho". A ideia era que antigamente pessoas faziam sites
diferentes pra mobile, pra desktop e até pra tablet (os famosos sites **m.**).
E isso na prática é impossível de se fazer. Há muitos dispositivos diferentes.

Então preferimos a ideia de um site único que se adapte a diferentes resoluções de
tela.
Essa adaptação é feita com **design responsivo**:

* um design base com pequenas adaptações feitas nas media queries.
## Sites responsivos no mundo ideal
No mundo ideal, todos os sites do mundo deveriam se adaptar a todas as resoluções

do mundo. Isso seria o mega responsivo ideal. Que ninguém faz.
Na prática, estabelecemos limites que nosso site deve suportar. Isso dentro dos
limites do nosso público e do que acreditamos ser prioridade hoje.
Vejo da mesma forma como nenhum site hoje suporta IE4 mais; não faz sentido. No
mundo ideal, suportaríamos todos os browsers e resoluções de tela possíveis.
## Então o que devo fazer no mundo real?
No mundo real, priorizamos pra suportar o máximo possível dentro dos critérios do
projeto.
Então como não dá pra suportar todos os tamanhos de tela (esse número seria
infinito) é comum fixar um valor máximo pra suportar.
Por isso o site da Alura por exemplo não fica legal em 2000px. E, se for ver, não
fica legal em telas pequenas de 200px também.
**O site é responsivo entre os limites de 320px e 1400px**. Fora deles, quebra.
Inclusive eu gosto de explicitar esses limites em código pra deixar bem claro o
intervalo de resoluções que aquele projeto suporta (e, de novo, cada projeto deve
priorizar do seu jeito):
css
Na **Alura** temos uma [**Formação Front-end**] que foi pensada para você começar
do zero e se tornar um profissional de ponta. É um guia de estudos com um passo a
passo pensado com carinho pela equipe da Alura.
imagem
No projeto de um app mobile de ecommerce, chegaram ao seguinte layout de busca de

produtos:
imagem.
imagem, que são separados como a atividade específica de cada usuário ou página.
Podemos curtir, compartilhar e comentar cada conteúdo específico.
Além disso, assim como no exemplo inicial, podemos utilizar cards como forma de
facilitar a busca do usuário quando navega por diversas informações diferentes.
imagem
imagem
Também conhecido como _M-learning_, ele é uma forma de aprendizado por meio de
dispositivos móveis e uma nova maneira para treinar e capacitar equipes de todas as
áreas.
Muitas organizações ainda enxergam o _smartphone_ como um inimigo para a

produtividade. Porém, esse dispositivo pode ser um grande aliado na hora de
capacitar seus funcionários.
O _Mobile Learning_ é um método de ensino que utiliza dispositivos móveis, como

smartphones e tablets, para treinamentos e cursos a distância. Isto é, o aluno
aprende a qualquer hora, em qualquer lugar e de maneira individual.
Esse modelo de aprendizagem traz diversos benefícios tanto para as empresas quanto
para os seus colaboradores, pois ambos ganham com o aproveitamento da mobilidade.
Mas afinal, quais são esses benefícios de implementação do _Mobile Learning_ dentro
de uma cultura empresarial?
**Para as empresas**
- **Equipe mais motivada** – Em treinamentos corporativos convencionais, é
frequente vermos uma sensação de obrigação por parte dos funcionários para realizá-
los, enquanto que, com o _Mobile Learning,_ essa sensação diminui por conta da
flexibilidade.
- **Capacitação de forma rápida** – O tempo é otimizado com treinamentos a
distância, pois o funcionário não precisa necessariamente estar na empresa para se
capacitar.
- **Diminuição de gastos** – Não são necessários materiais ou espaços físicos da
empresa para realizar os treinamentos. O colaborador pode aprender acessando a
plataforma direto de seu próprio celular, de qualquer lugar.
**Para as equipes**
- **Aprender onde quiser** – Situações que antes eram improdutivas, como esperar em
uma fila de banco ou o trajeto entre casa e trabalho, tornam-se grandes
oportunidades de aprendizagem com o _Mobile Learning_.
- **Dinamismo** – Com o _M-learning_, o colaborador tem uma participação ativa e
desafiadora, enquanto que, em treinamentos corporativos tradicionais, eles ficam
passivos diante das informações que recebem.
- **Individualidade** – Este método se adapta a qualquer estilo de vida, servindo
às mais variadas rotinas e dispensando planejamentos especiais para a realização
dos cursos.
Estes são apenas alguns dos muitos benefícios que o _Mobile Learning_ traz. Se você
deseja conhecer mais sobre o assunto e descobrir como explorar o poder desse
método, recomendo que leia o eBook gratuito [**Como explorar o poder do Mobile
Learning**].
Quer implementar essa cultura em sua empresa? Na [**Alura**], além da plataforma

web, temos um app com todos os nossos cursos e exercícios disponíveis. Inclusive,
ele conta com a possibilidade de download das aulas para você assistir offline,
assim é possível aprender a qualquer hora e em qualquer lugar. :)
Na Web, todas as vezes que entramos em um site, utilizamos o protocolo HTTP

(Hypertext Transfer Protocol) como por exemplo uma requisição para o [site do
Alura]:
imagem e clicar na aba **"network"**:
![pagina-do-alura-no-modo-network]
Se realizarmos uma nova requisição a página do Alura vejamos o que acontece:
![refresh-na-pagina-do-alura]
Observe que apareceram 3 items, ou seja, 3 requisições realizadas ao carregar a

página do Alura:
![items-da-requicao]
Ao clicarmos no item **www.alura.com.br**:
![informacoes-da-requisicao]
São exibidas um monte de informações sobre essa requisição, porém, por enquanto,
vamos verificar apenas a informação abaixo:
- **Request Method:** `GET`
O que significa esse **Request Method**? E esse valor `GET`? Parece bem confuso...
Quando falamos sobre request method, nos referimos aos verbos que utilizamos para
nos comunicarmos com o servidor, nesse caso, o servidor do Alura! Mas o que isso
significa?
O Request Method indica quais são as nossas intenções quando fazemos uma requisição
ao servidor, por exemplo, se estamos **apenas** pegando informações do servidor,
como foi o caso da requisição ao site do Alura, utilizaremos o verbo `GET`.
Porém, qual seria uma situação que não pegaríamos uma informação do servidor? Um
formulário de cadastro seria um bom exemplo! Vamos pegar um formulário de um site
qualquer na internet, por exemplo, a [página de cadastro do github]:
![pagina-de-cadastro-github]
No momento que chamamos pela primeira vez a página, estamos **apenas pegando** as
informações do servidor, ou seja, o verbo será o `GET`. Agora, vamos tentar criar
um novo cadastro colocando um e-mail que já existe no sistema deles:
![pagina-de-cadastro-github-no-post]
**Observe que, ao clicarmos no botão "Create an account" o request method utilizado

foi o `POST`! Mas porque agora foi o `POST` e não o `GET`? É justamente porque nós
queremos criar, adicionar, enviar informações ao servidor!**
**Além do `GET` e do `POST`, existem outros verbos como o `PUT` que indica uma
alteração de um recurso existente, `DELETE` para deletar um recurso existente.**
Esses e demais verbos são definidos com mais detalhes na [especificação da W3C]
para definição de métodos.
Não tinha nem ideia que existia toda essa padronização por de baixo dos panos em
aplicações Web? Que tal aprender mais sobre o protocolo HTTP? Pensando nisso,
criamos o [**curso de HTTP**] que explica com mais detalhes o protocolo HTTP e seu
funcionamento no mundo Web.
Entender o que significa "mais popular é um desafio" que descrevo já já, primeiro
vamos aos resultados. Utilizei o número de alunos inscritos dividido pelo tempo de
existência de um curso na plataforma em 2015:
10. [MySQL 1: Iniciando suas consultas]
9. [Bootstrap: velocidade no front-end]
8. [Gestalt: desmistificando o Design]
7. [Java I: Primeiros passos]
6. [Oracle II: Consultas Complexas]
5. [Refatorando na prática]
4. [Spring MVC I: Criando aplicações web]

E o top 3, todos com mais de 10 novos alunos inscritos por dia:
3. [HTML5 e CSS3 I: Suas primeiras páginas da Web]
2. [Android I: Crie sua App fantástica]
1. [NodeJS: Inovando com Javascript no backend]
Ficou curioso em relação ao conteúdo e depoimentos dos alunos sobre estes cursos?
Basta seguir o link deles para encontrar informações sobre cada um deles.
### As grandes áreas de tecnologia
A grande sacada? Diversas áreas da carreira na tecnologia estão representadas

nesses 10 cursos: o mundo mobile, o frontend, o backend tradicional, o backend
moderno, os bancos relacionais e o design (Gestalt, já falei que é um curso
genial). Uma área muito recente,de SEO e Marketing Digital ainda não aparece nos
top 10... mas aposto em mudanças para 2016.
### Desafios ao buscar o Top 10
Como essa é uma normalização, essa tabela não indica os cursos mais estudados ou
terminados, que também são dados interessantes, mas é uma maneira razoavelmente
justa de indicar a popularidade de um curso através de um ano.
O ramo de estudo desses tipos de estatística é chamado de learning analytics, e

existem diversos detalhes extremamente importantes para se levar em consideração
antes de julgar um curso como sucesso/fracasso na educação da população (lembra?
nosso objetivo é alavancar a qualidade do mercado de trabalho!).
A conta que usei, inscritos/dias_de_curso_no_ano, é justa pois indica a

popularidade do curso nesse período, mas um pouco injusta pois um curso sempre tem
um boom inicial logo após lançado - um pouco refletido nos cursos de NodeJS e
Gestalt, lançados mais próximo do final do ano.
**Toda medida tem suas vantagens e desvantagens, seus erros e muito mais. Neste ano
de 2016 teremos nossos primeiros cursos de machine learning e data analysis. Sempre
focando na prática, mostraremos como levar em consideração diversos desses
problemas de medição e como corrigi-los para entendermos realmente o que
acontece.**
### Parabéns!
**Mas este era um artigo de mais populares do ano? Sim! Então parabéns a todos os
dez cursos,seus criadores e mantenedores, além dos alunos que fazem parte da
revolução da educação através da didática Caelum, aplicada na Alura.**
Quais cursos você esperava ver entre os mais populares? E quais espera ver em 2016?
Que o mercado de trabalho tem mudado por causa da tecnologia, você já deve saber.
Nos últimos 20 anos, pelo menos, ela se tornou um grande diferencial competitivo e
aumentou a importância da capacitação profissional, principalmente para quem
trabalha mais diretamente com as inovações.
O que quase ninguém comenta é o quanto as pessoas também mudaram com essa
modernização.
Se é por causa dela que todos temos de passar por aprimoramento profissional, é
também ela o fator que simplifica esse aprimoramento e pode te transformar não
apenas em um profissional de tecnologia melhor, mas em uma pessoa mais produtiva,
dinâmica e proativa, no geral.
Pronto para aprender sobre novas tendências, [**ferramentas importantes**] e

entender por que o Ensino a Distância (EAD) revoluciona o mercado profissional e
pessoal, interferindo até mesmo na busca por melhores empregos e na
competitividade? Então siga a leitura até o fim!
## 1\. Estar por dentro das tendências do mercado de tecnologia
A primeira necessidade que o mercado de trabalho dos dias de hoje coloca é a de nos
atualizarmos constantemente.
Afinal, as novidades não param: quase todos os dias há novos aparelhos, softwares e
soluções desenhadas para deixar a vida e o trabalho das pessoas mais práticos. Isso
significa mais comodidade, mas também pode deixar muitos profissionais perdidos.
Afinal, como é que você vai escolher, dentre tantas opções, as melhores ferramentas
para executar suas tarefas profissionais? Esse é um bom exemplo de como precisamos
aprender a lidar produtivamente com as tendências do mercado de tecnologia.
### 1.1 Tecnologia muda pessoas e pessoas mudam o trabalho
O desenvolvimento tecnológico imprimiu uma velocidade muito grande de transformação

na sociedade. E quando dizemos sociedade, não queremos dizer apenas mercado de
trabalho, mas, principalmente, pessoas.
Use a si mesmo como exemplo: quando você compra alguma coisa, hoje em dia, são
grandes as chances de que faça isso direto do seu computador.
Por meio dele, você pesquisa um novo produto, compreende seus benefícios e
limitações e até colhe opinião de gente que já comprou. [As vendas pela internet
aumentam a cada ano], e você se assustaria de saber quanta gente já escolhe e
compra um produto direto do celular, sem nem mesmo usar um computador de mesa ou
notebook.
Tantas facilidades e transformações têm uma consequência principal: tornar o

consumidor mais exigente. E se o consumidor fica mais exigente, o mercado de
trabalho também fica. Afinal, serão necessárias pessoas mais qualificadas nas
empresas para atender a esse novo tipo de consumidor.
O resultado disso é que as empresas adotam um modelo de marketing mais qualificado

(e substituem o marketing tradicional pelo digital, mais barato e funcional), um
processo de venda mais atento à necessidade dos clientes e todos os serviços acabam
precisando ser aprimorados.
E sabe como isso chega até você? Simples: todas essas mudanças acirram a
concorrência no mercado de trabalho e aumentam a importância da capacitação
profissional e tecnológica, transformando-a em um diferencial precioso para o
primeiro emprego.
Para responder a essas necessidades, a primeira coisa que você deve fazer é se
manter atualizado.
### 1.2 Novas habilidades são valorizadas

Quer mais um exemplo de mudança que ocorre por causa das novas tecnologias? Mais do
que qualquer outra coisa, [o trabalho freelancer vem sendo cada vez mais
valorizado].
Uma boa parte das tarefas das empresas que mais crescem no país é desempenhada por
esse tipo de autônomo, que costuma responder melhor a mudanças, ser mais
independente e gerar menos custos empregatícios.
Mas, não é só pelos [**freelancers**] ganharem melhor e gerarem menos custos que o
trabalho deles vem crescendo.
A verdade é que as pessoas que trabalham por conta própria, muitos deles de casa
mesmo, costumam apresentar algumas das qualidades mais valorizadas pelas empresas
nos dias de hoje. Eles são dinâmicos, bem informados e, principalmente, proativos e
independentes. Antigamente, as instituições adotavam modelos de equipes muito pouco
proativas e que apenas executavam o que era proposto pelo chefe.
Nesses tempos de mudanças constantes, o perfil do “funcionário ideal” mudou muito.

Ele passou a ser aquele que sabe cumprir o que é exigido, mas que questiona regras
e propõe soluções que façam mais em menos tempo e gastando menos.
Esse novo colaborador pensa por si próprio, participa nas decisões da empresa e tem
um senso de trabalho em equipe muito grande. O sonho de todo empresário é que todos
os membros do seu time tenham espírito crítico e que cada um entenda bem o todo da
empresa, de forma que suas opiniões contribuam pra melhorá-la.
Se o que você busca é um diferencial competitivo, fique de olho nessas novas

habilidades. Não pense nelas como qualidades com as quais as pessoas nascem. Elas
podem e devem ser treinadas no dia a dia, em casa ou no trabalho.
### 1.3 Novidades devem ser acompanhadas
Designers, profissionais de marketing e programadores além de outros tantos

trabalhadores que dependem mais diretamente da tecnologia para trabalhar devem se
manter informados sobre as novidades tecnológicas da sua área.
A mídia digital e impressa dá destaque para essas inovações, e não é difícil ficar
antenado. Se você já sabe em que área pretende trabalhar, pode focar suas pesquisas
na direção certa, buscando informações sobre o mercado em que atua e as ferramentas
tecnológicas mais usadas, por exemplo.
Junte as informações que conseguir lendo jornais e revistas com as de blogs

especializados e você vai ter bons critérios para direcionar, testar, decidir e
melhorar suas aptidões nos softwares e ferramentas que vai utilizar
profissionalmente.
E por falar em softwares e ferramentas, essa é uma questão crítica para se

aperfeiçoar tecnologicamente e criar um poderoso diferencial competitivo.
## 2\. Ter mais domínio das ferramentas importantes para o trabalho
Boas ferramentas tecnológicas são as maiores responsáveis pela sua produtividade.

Embora o uso delas seja abordado durante os anos de universidade, o mais comum é
que os formandos saiam de lá se sentindo despreparados.
Há algumas razões para isso: softwares de computador são ferramentas complexas em

muitos casos, e apenas uma abordagem genérica — a única possível na ampla grade
curricular dessas instituições — não prepara os alunos para a sua utilização.
Além do mais, nem sempre as disciplinas instrumentais no ensino superior são
desenvolvidas por especialistas no uso desses softwares. Veja algumas dicas para
melhorar suas aptidões com as principais ferramentas do seu trabalho:
### 2.1 Evite trocar de ferramentas o tempo todo
O que não faltam são boas ferramentas tecnológicas para todas as profissões. Se
você é do tipo apaixonado por novidades, isso pode se transformar num problema:
quem não fica tentado a usar sempre o software mais atual, os aparelhos mais
recentes e que disponibilizam mais funcionalidades e opções?
Se deixar ser levado pela impulsividade, pode ser que isso afete seu rendimento
negativamente. Pergunte aos especialistas da área que você pretende seguir e eles
vão te responder que as melhores ferramentas tecnológicas são aquelas que você
domina.
Claro, há alguns critérios para se levar em conta: quanto mais intuitivo e fácil de
aprender um software for, melhor.
Mas, no fundo, o que mais importa é que você escolha a ferramenta que melhor se
adapta às suas necessidades e continue trabalhando com ela por muito tempo, o que
permite criar uma rotina e dominá-la de verdade.
### 2.2 Invista em cursos para se aprofundar nessas ferramentas
Uma coisa é fato: não dá pra escolher um software desses só lendo a respeito.
Também não é muito recomendável decidir com base apenas em umas poucas experiências
em casa, tomando uma decisão rápida sobre um programa com milhares de
possibilidades.
Se você quiser chegar a uma decisão consciente e escolher a melhor opção — que, por
sinal, vai te acompanhar por anos a fio — o melhor é mesmo fazer cursos e
aproveitá-los para experimentar cada uma dessas ferramentas.
Vamos tomar a [**profissão de designer**] como exemplo: alguns profissionais dessa

área preferem criar todo o material gráfico no [**CorelDraw**]. Outros argumentam
que algumas funcionalidades desse programa o tornam ultrapassado e preferem usar
opções como o [Adobe Illustrator] ou o [**Adobe InDesign**].
Há também quem prefira aliar o que cada um desses softwares tem de melhor com
funcionalidades básicas do Adobe Photoshop, por exemplo. Eles argumentam que
aprender um pouco de cada software — em vez de dominar apenas um — torna seus
trabalhos mais versáteis.
E como você vai ter a sua própria resposta para uma pergunta dessas? Só mesmo
experimentando cada uma dessas ferramentas de forma orientada, com organização
didática e podendo contar com a ajuda de professores que são especialistas.
## 3\. Adquirir um forte diferencial competitivo
Se você é como a maioria das pessoas, só de ler o título deste tópico uma palavra
bem específica veio à sua mente: “currículo”.
Não há como negar que ele ainda é importante. A seleção de um bom profissional de
tecnologia mudou muito por causa dos motivos que discutimos anteriormente.
Entretanto, essas mudanças não foram tão radicais a ponto de a velha fase da
“análise de currículo” ser extinta do processo seletivo das empresas..
E, convenhamos: a maior parte dos currículos é bem parecida.
Se formos nos ater apenas aos candidatos como você, que estão prestes a iniciar no
mercado de trabalho, eles são quase idênticos. Mesmo nível de escolaridade, pouca
ou nenhuma experiência profissional, idade e objetivos bem parecidos.
Sabe onde um diferencial competitivo mais pesa nessa etapa? Naqueles cursos
específicos na área de tecnologia.
E esses, quanto mais objetivos forem, melhor: você aprende novas habilidades
tecnológicas valorizadas pelos seus empregadores, estudando em cursos que realmente
te capacitam e vão direto ao ponto.
Saiba um pouco mais a respeito de como fazer da capacitação profissional na [**área

de tecnologia**] um diferencial competitivo de verdade:
### 3.1 Mostre que você é um profissional de tecnologia que gosta de aprender
Como dissemos, as empresas querem profissionais qualificados para responder às

mudanças constantes pelas quais o mercado de trabalho passa e vai continuar
passando.
Por outro lado, qualquer diretor de Departamento Pessoal sabe o quanto é difícil
recrutar gente que realmente gosta de aprender. As pessoas, por mais capacitadas
que sejam, acabam sempre se acomodando e tratando o conhecimento que têm como
verdade inquestionável.
Em uma época em que a tecnologia muda as coisas da noite para o dia, esse passa a
ser um péssimo defeito.
E é por isso que o seu empregador vai entender claramente como você tem sede pelo
conhecimento, quando ele tiver em mãos o seu currículo com pouca experiência de
trabalho, mas já com diversos cursos tecnológicos concluídos.
Um dado interessante e que vai te convencer disso é que, via de regra, sai muito
mais barato para uma empresa investir na qualificação dos seus funcionários do que
contratar novos colaboradores, por mais qualificados que sejam.
Resumindo: faça vários cursos tecnológicos, melhore o seu currículo e ainda tenha a
certeza de estar entre os nomes que ultrapassam essa etapa e são chamados para uma
primeira entrevista.
### 3.2 Trabalhe em empresas que são a sua cara
É sempre bom lembrar que o principal critério de seleção das organizações, hoje, é
o quanto um candidato aparenta apresentar os mesmos valores pessoais e
profissionais que ela.
O que queremos dizer com isso é que os exames frios baseados em dinâmicas de grupo
genéricas tendem a acabar. Os profissionais da área de Recursos Humanos têm
desenvolvido a percepção de que todo candidato apresenta defeitos e qualidades, e
que não é isso que define a sua escolha, mas sim a afinidade dele com aquela
instituição.
Isso é uma ótima notícia para você: se souber passar a impressão certa em um exame
de seleção, você será o escolhido para trabalhar em uma empresa que é a sua cara!
E se o seu conhecimento e aptidões tecnológicas forem treinados o suficiente, isso

é garantia de trabalhar em uma empresa tão apaixonada pelo mundo digital e
tecnológico quanto você. Quer coisa melhor?
## 4\. Facilitar a recolocação profissional
Se você encontrar de primeira a empresa dos seus sonhos para trabalhar, ótimo! Mas,
o mais provável é que você precise passar por várias experiências profissionais
antes de isso acontecer. Pode ser também que o seu destino seja abrir o seu próprio
negócio ou [**atuar como freelancer**].
Não importa. Se investir na sua capacitação profissional na área tecnológica,

estará um passo à frente quando precisar de uma recolocação profissional.
Avalie desta forma: hoje é difícil encontrar mão de obra qualificada para atuar nos
diversos segmentos ligados direta ou indiretamente à tecnologia.
E, uma vez que as mudanças sociais e do mercado de trabalho estão em aceleração

constante, isso deve se acentuar daqui a uns anos.
Se quiser tirar esse problema de letra quando for mudar de emprego, invista na sua
capacitação agora e continue trabalhando nela mesmo quando estiver empregado. Do
jeito que o mundo do trabalho mudou, é bem provável que seja do interesse da
próxima empresa em que você for trabalhar investir na sua formação.
Tire proveito disso e direcione seus esforços de aprendizado para a área de

tecnologia. Compreenda o mundo digital, as ferramentas mais usadas no seu ramo e
também a lógica de pensamento por trás das novidades tecnológicas como um todo.
Independentemente da área em que você atue, há certos conhecimentos que começam a

fazer parte de uma formação mais geral para o mercado de trabalho. Saber conceitos
básicos de [programação], [design], webdesign e até mesmo noções elementares de
[**marketing digital e empreendedorismo**] só têm a acrescentar à carreira de
qualquer profissional.
E vão te deixar anos-luz à frente dos concorrentes quando, por um motivo ou outro,
precisar de recolocação profissional!
## 5\. Entenda por que investir em capacitação por EAD
Se a sua rotina de estudos é corrida ou se você mora longe dos grandes centros
urbanos, pode ser que tenha acompanhado tudo o que falamos até aqui com um pé
atrás.
E é justamente em casos como o seu que o Ensino a Distância cai como uma luva. A
desconfiança que esse tipo de instrução despertou nos seus primeiros anos já caiu
por terra há um bom tempo. Hoje, os cursos a distância são vistos com muitos bons
olhos pelos empregadores e funcionários..
Podemos mesmo falar que ele seja uma das mais promissoras mudanças que a tecnologia
tem promovido no aperfeiçoamento profissional.
Se você é do tipo que só se convence com [números], aqui vão alguns bem animadores:
a estimativa é que o Ensino a Distância (EAD) dobre no Brasil em apenas 5 anos.
Além disso, eles são, em média, 4 vezes mais baratos que o ensino tradicional.
Nada mal, não é mesmo? Confira outros benefícios do EAD que podem te convencer de
que esta é uma excelente alternativa de capacitação:
### 5.1 Os horários são flexíveis

Até nisso o mundo mudou. Por assim dizer, é como se o dia das pessoas tivesse menos
horas. Transitar pelas cidades grandes ou mesmo pequenas é demorado, cansativo e
estressante.
E nada disso condiz com um bom aprendizado, que requer concentração e resistência
mental. A dica de ouro é estudar sem precisar sair de casa, na frente de um
computador, smartphone ou tablet.
Pela forma como os cursos à distância são elaborados, você não perde o contato com
professores experientes e material de primeira qualidade. E ainda pode contar com
flexibilidade total de horário. Basta uma senha de acesso à plataforma onde estão
os seus cursos e você decide se estuda de manhã, tarde, noite ou madrugada.
Se precisar se deslocar por algum motivo, basta uma boa conexão de dados móvel para
fazer os seus cursos de dentro do carro ou ônibus.
### 5.2 Os cursos são econômicos
Como dissemos, o EAD custa, em média, um quarto do que você pagaria em um curso
convencional.
E a economia não para por aí: o material didático é digitalizado, evitando os

gastos com as fotocópias que tanto consomem os recursos dos alunos. Outros custos
pesados do ensino tradicional também podem ser evitados com o EAD, como é o caso do
transporte e da alimentação.
Coloque tudo isso na ponta do lápis e você vai entender por que a cada ano mais
gente adere à praticidade e economia dos cursos à distância.
### 5.3 A rotina de estudos se adequa ao seu ritmo
Tem gente que detesta acordar cedo. Outros não têm resistência mental à noite e, se
tiverem que frequentar um curso nesse horário, fatalmente terão seu desempenho
comprometido. Há, ainda, os que preferem estudar todo o conteúdo diário de uma vez
para ficarem livres. Outros, assimilam melhor fazendo pequenos turnos de meia ou
uma hora e descansando em seguida.
Como você deve ter notado, uma sala de aula jamais vai atender as necessidades de
todos os alunos, já que eles são tão diferentes entre si.
Este talvez seja o maior benefício dos cursos a distância: só eles podem se adaptar
ao ritmo de cada estudante, possibilitando um rendimento melhor e também a
oportunidade de ele conhecer e testar seus próprios limites no aprendizado.
### 5.4 A interação entre alunos e professores não é necessariamente menor
Da forma como a maioria das plataformas de EAD é concebida, a interação entre

alunos e professores acaba sendo bastante incentivada, ao contrário do que se
imagina.
A troca de opiniões, materiais e informações sobre os cursos também é parte

integrante do Ensino a Distância. Afinal, o aprendizado é muito mais efetivo se
feito em conjunto, não é verdade? E o conhecimento é algo construído socialmente.
A tecnologia não mudou o mercado de trabalho. Ela mudou as pessoas e as pessoas

mudaram o mercado de trabalho. A maneira como compramos, vendemos, trabalhamos e
estudamos é um reflexo de quem somos.
É por isso que tantos entre nós são tão apaixonados, a um tempo, pela tecnologia e
pelo conhecimento. Porque sabem que ambos são muito parecidos na forma como podemos
usá-los para nos transformarmos em pessoas melhores e, por consequência, em
profissionais melhores.
Como toda certeza, compreendendo a importância da capacitação profissional e

fazendo uso do ensino a distância, você vai caminhar junto com as tendências do
mercado de tecnologia. O que, no futuro, será o seu maior diferencial competitivo e
humano.
A ByteBank - uma empresa que faz cartões sem tarifa, como a [Nubank] - está
começando a produzir marketing de conteúdo focado no B2B (empresa para empresa,
Business to Business). [O setor de marketing já escreveu um texto] onde explica as
diversas maneiras para a empresa economizar usando o cartão de crédito.
Além disso, **a equipe de marketing escreveu diversos conteúdos**, como casos de
empresas que conseguiram alavancar sua renda com a economia feita utilizando os
cartões, infográficos da expectativas do setor financeiro e de prospecções de
investimento.
A empresa também criou textos com passo a passo de como definir os limites de
gastos com as categorias relativas à empresa, apresentando as novidades do setor
econômico e outros com dicas de como organizar as finanças da empresa.
Apesar de possuir diversos conteúdos prontos, a equipe de marketing da empresa de

cartões não está sabendo como melhor entregá-los para os clientes e possíveis
clientes que ainda não conhecem o cartão de crédito sem tarifas.
> E agora? Como e por onde pode-se entregar essas informações para as empresas?
[**No Marketing de conteúdo existem diversos canais para entregar o conteúdo**] da

nossa empresa para as pessoas. Porém, isso vale tanto para B2B quanto para B2C?
Sim! E os mesmos canais podem ser utilizados! Só é necessário se atentar ao nicho

da empresa que irá criar o conteúdo e às fases no funil de marketing de conteúdo
das empresas que são suas clientes.
A ByteBank, que é do nicho financeiro, pode criar diversos conteúdos e imagens para
diversos canais, eles pensaram em utilizar os mesmos que já usavam para o B2C,
analisando quais já eram usados e como podem usar essas formas na entrega de
conteúdo B2B.
Caso fosse uma empresa pequena, de desenvolvimento de software, no qual não possuem
tanta interação com seus clientes ou até mesmo questões visuais, eles poderiam
empenhar-se mais em blogs com conteúdos de como o porquê softwares que otimizam o
trabalho de uma empresa são importantes.
## Blog
Mesmo que o **blog** seja focado para conteúdo B2C, foi criada uma tag "**para
empresas**" no menu, na qual ficariam reunidos todos os textos e conteúdos focados
para as empresas.
Dessa forma, os textos focados para as corporações ficam agrupados e possuem um

espaço no menu, sem ser necessário que a pessoa fique buscando esse conteúdo por
muito tempo.
Assim, nessa parte, podem ser publicados todos os textos criados para o B2B, desde
o texto sobre como economizar com o cartão de crédito, até outras dicas,
infográficos, novidades e curiosidades sobre o uso do cartão por uma empresa.
## Whitepapers
Percebeu-se também que muitas empresas tinham diversos problemas financeiros que
poderiam ser resolvidos, ou pelo menos poderiam receber uma ajuda, com um material
que possuísse um conteúdo mais completo e que solucionasse uma dificuldade.
Assim, começaram a disponibilizar no **site um conteúdo diagramado** para as

pessoas baixarem no qual é apresentado um problema e sua solução.
Eram diversos conteúdos sobre as principais dificuldades financeiras de empresas:

como fazer fluxo de caixa, investir o dinheiro da empresa, como criar um sistema de
gestão financeira, organizar as contas da empresa, fazer diversos cálculos para
analisar se está havendo lucro ou não.
Além disso, também foram publicados casos de sucesso, de outras empresas que
conseguiram economizar usando o cartão. Para mostrar que, realmente, usar o produto
traz resultados e benefícios.
Mesmo sendo muito semelhantes ao e-book, a principal diferença é que em vez de

somente apresentar um tema, os [**whitepapers**] ajudam a solucionar um problema.
Para fazer o download, as pessoas devem disponibilizar algumas informações para

entrarmos em contato com elas, como nome, e-mail, tamanho e segmento da empresa.
Assim, podemos enviar por meio de newsletter um conteúdo mais segmentado.
Se quiser ver na prática, [**a Alura tem vários whitepapers**] para ajudar as
empresas que assinam nossos cursos e apresentar como podemos ajudar as empresas que
ainda não contrataram a alura :)
## E-mail/Newsletter
Depois de obter os contatos das pessoas das empresas, por meio do whitepapers, e-
books e compras do cartão, a ByteBank começou a enviar uma newsletter semanal para
diversas listas, que dispunham as empresas de acordo com o segmento de cada uma
delas, com as novidades no cartão e no setor financeiro que melhor se enquadra a
elas.
As listas também eram organizadas [**pela fase do funil do marketing de conteúdo no

qual a empresa se encontrava**]:
- se ela estava atraída pelo produto

- se já havia se inscrito na newsletter e/ou feito o download dos whitepapers,
quase sendo convertida
- se já havia começado o processo de pedir o cartão
- ou se estavam quase pedindo o cartão e se já haviam pedido - e já estavam usando
Também foram enviados alguns links dos últimos posts do blog da empresa de cartão e
alguns links de veículos de comunicação que falavam sobre o setor financeiro, para
a pessoa ler.
Os conteúdos escolhidos para cada e-mail variavam de acordo com o tamanho da

empresa e com a fase em que estavam, reunindo dicas às formas de economizar e
lucrar, como o cartão poderia ajudar e quais as novidades para quem ainda não era,
e para quem já era, cliente.
Assim, os e-mails foram disparados de uma forma mais segmentada e com os assuntos
que interessavam para aquele grupo de empresas. Assim poderíamos acompanhar a
empresa, fornecendo um conteúdo certo para ela, para que ela possa ver nossos
serviços e querer contratar, ou continuar usando.
## Redes sociais
A ByteBank começou a publicar alguns conteúdos **B2B nas redes sociais**, as quais
antes eram focadas no B2C. Os posts B2B eram feitos uma vez a cada 15 dias.
De forma sutil, as publicações eram acompanhadas da frase "sua empresa" como se

estivesse falando com uma pessoa que, por um acaso, possui uma empresa que poderia
se beneficiar com os serviços.
Entretanto, no Linkedin, que possui um foco maior para questões empresariais e de

carreira, a maior parte das publicações eram voltadas ao B2B, sempre compartilhando
os posts do blog, novidades, dicas e passo a passos.
## Planejamento e resultados
A ByteBank, então, criou um planejamento de conteúdo e publicações em cada um

desses canais. Mesmo assim, não realizaram vendas B2B logo no início.
Porém, lembrando que [**o processo de compra B2B é mais longo**], não desistiram e
continuaram com o planejamento.
Depois de alguns meses, compartilhando conteúdo em posts do blog, whitepapers,

newsletters e publicações no Linkedin, conseguiram aumentar, pouco a pouco, as
vendas B2B. E, com um pouco mais de tempo, começaram a notar um bom retorno do
marketing de conteúdo focado para B2B.
Caso a sua empresa utilize outros canais, e funcione, é melhor ainda!
O principal objetivo é se comunicar com o público e mostrar as vantagens do seu

serviço e produto. Lembre-se que o processo é demorado, mas pode trazer ótimos
resultados a longo prazo!
Quer saber mais sobre como você pode alavancar o seu negócio e ter sucesso com o
marketing de conteúdo? Conheça [**o curso de Marketing de Conteúdo**]. E também
confira o livro da Casa do Código, [**Marketing de Conteúdo: Estratégias para
entregar o que seu público quer consumir**].
# Introdução
Se você conhece alguém ou é da área de **data science**, já deve ter escutado sobre
um tal de [Jupyter Notebook]. O **Jupyter é uma aplicação web interativa que
permite a criação e compartilhamento de documentos com código dinâmico**,
amplamente usada na área de dados, facilitando sua visualização, limpeza e
exploração. Além de permitir a mescla de células de código e texto, otimizando a
criação de apresentações e relatórios, já que pode se fazer tudo em um só local.
Jupyter se mostra tão relevante para a comunidade que em 2017 foi agraciada com o
prêmio [ACM Software System Award], um dos mais importantes na área da computação.
Entre os projetos que também já foram agraciados, estão nada mais, nada menos que
Java, Unix, TeX e a “pouca” utilizada Web, isso mesmo, o famoso www. Mas o Jupyter
que se “cuide”, pois não é apenas o Google com o Colaboratory que está nessa briga.
A **Netflix** entrou em campo lançando no dia 23/10/2019 o [**Polynote**], um

notebook poliglota com a intenção de simplificar a ciência de dados e o workflow de
**machine learning.**
Neste artigo vamos realizar um overview sobre os aspectos mais interessantes dessa
nova ferramenta que já está fazendo barulho na comunidade e empolgando muitos(as)
cientistas de dados por aí.
# Um notebook Poliglota
A Netflix é uma das defensoras da **programação poliglota**, isso é, da **prática

de escrever códigos em múltiplas linguagens para capturar funcionalidade e
eficiência adicionais** que não estão disponíveis em uma única linguagem de
programação. Visando facilitar a vida dos adeptos a programação poliglota, o
Polynote permite codar em diferentes linguagens em um mesmo notebook, até o momento
apresentando suporte a Scala, Python e SQL. Como as células compartilham um mesmo
contexto, as variáveis declaradas em linguagem podem ser utilizadas uma em outra e
vice versa.
imagem
**Referência:** https://towardsdatascience.com/trying-polynote-from-netflix-a-
better-notebook-for-data-engineers-5107277ff2e5
# Um notebook com “jeito” de IDE
Se você está habituado com IDEs como Pycharm e editores como VScode, deve estranhar
um pouco codar em um notebook. Já ví muita gente por aí codando em IDE e só colando
o código em um notebook como o Jupyter e Colab (apelido carinhoso do Colaboratory)
da google. Claro que o Polynote não tem a intenção de ser um uma IDE completa, mas
traz um design diferente dos notebooks “tradicionais” e mais próximo de uma IDE,
não é apenas o design que está próximo de uma IDE.
Algumas funcionalidades como auto-complete, [**lint**]) e e um rico editor de texto

com suporte a Latex torna mais evidente a diferença entre Polynote e o Jupyter.
Por trás do editor do Polynote está o [**Monaco**], que está por trás do
**VScode**, então ainda podemos ter um avanço incrível nas melhorias do notebook.
Na parte visual, o **Polynote** pretende deixar os processos que ocorrem no kernel

mais transparentes, evitando a necessidade de se aprofundar nos logs. Com esta
finalidade o Polynote fornece uma variedade de informações visuais sobre o kernel,
por exemplo, uma lista de tasks a serem executadas pelo kernel facilitando
acompanhar o progresso de execução e uma tabela das variáveis e seus tipos.
imagem
imagem
**Referências das duas imagens acima:** https://polynote.org/
# Reprodutibilidade
Nós já falamos sobre a visibilidade (transparência dos processos) que é um dos

grandes princípios do Polynote, mas tem outro princípio que guiará o
desenvolvimento do notebook da Netflix, a reprodutibilidade. Se você já trabalhou
com algum notebook, seja o Jupyter ou o Colaboratory do Google, provavelmente se
deparou com a situação onde desenvolveu seu modelo ou análise sem nem um problema.
A surpresa vem só quando reiniciar a execução desse notebook e do “nada” ele está
quebrado. Se já passou por isso, fique calma(o) que você não foi a(o) primeira(o),
eu garanto!
Relembrar o que são os notebooks é importante para compreender o porquê são tão
suscetíveis a erros. Os notebooks são uma coleção ordenada de células, cada uma das
quais pode conter código ou texto. O conteúdo de cada célula pode ser modificado e
executado independentemente. As células podem ser reorganizadas, inseridas,
excluídas e podem depender da saída de outras células no notebook.
Muitas vezes, quando declaramos uma variável em um notebook, ela precisa ser
acessada em outra célula mais à frente na execução do código. Para isso, a máquina
salva essa variável na memória RAM do computador. Podemos rodar as células
individualmente e essa memória não é limpa depois que "finalizamos a execução", o
que causa alguns problemas. Se por acaso eu mudar o nome de uma variável, o
notebook apenas cria uma nova variável na RAM e não deleta a referência antiga. Mas
então, quando é que ela limpa a memória do notebook?
Os notebooks vão limpar a memória quando você interromper o kernel ou interromper

o servidor web que roda o notebook. Após limpar a memória é que o problema
realmente pode aparecer.
Lembra que comentamos de uma variável que teve seu nome modificado, porém manteve
as duas referências? Se você não modificou o nome de todos os locais onde a
variável é utilizada, ocorrerá um erro (“variável” is not defined). Pode parecer
algo simples de corrigir, mas garanto que depois de alguns dias sem olhar para
aquele notebook você dificilmente lembrará qual é a variável modificada. Você pode
estar questionando que isso quase nunca deve ocorrer… Mas te garanto que ocorre
muito mais vezes do que gostaríamos.
Polynote diminui o risco desse tipo de erro mantendo o controle das variáveis
definidas em cada célula. Polynote constrói o estado de entrada para uma
determinada célula com base nas células que foram executadas acima dela. O Polynote
constrói o input para uma célula com base nas células executadas anteriormente, o
que torna a posição das células mais importante do que em outras ferramentas.
Isso permite que os usuários executem os notebooks de cima para baixo, sem grandes
surpresas quando o runtime é reiniciado. Garante a reprodutibilidade, tornando
muito mais provável que a execução sequencial do notebook funcione.
imagem
**Referência:** https://medium.com/netflix-techblog/open-sourcing-polynote-an-ide-
inspired-polyglot-notebook-7f929d3f447
# Considerações
Claro que nem tudo são flores, **Polynote é um projeto grande que está começando e
tem um caminho longo** (e na minha visão promissor) para percorrer. O processo de
instalação não é muito otimizado, apresenta suporte apenas para macOS e Linux.
Com pouco tempo de uso, já foi possível observar alguns bugs como não funcionar
auto-complite em funções lambda. No processo de instalação em Linux a maior
dificuldade que passei foi ao instalar uma lib python chamada jep, que é uma das
dependências do Polynote. Jep é instalado pelo pip e como pip necessita de
permissão sudo, jep não localizava o java_home já configurado. Se passar por
problema semelhante, é só colocar a flag -E no sudo, assim fica, sudo -E pip
install jep e problema resolvido.
Apesar dos contratempos, são vários pontos positivos (alguns que nem citei, como a
configuração de ambiente por notebook e a ferramenta de visualização de dados) e as
inovações trazidas pelo Polynote está deixando a comunidade empolgada.
As melhorias e ideias agregadas ao notebook da Netflix afeta substancialmente o dia

a dia de cientistas de dados, engenheiros(as) de machine learning e de dados.
Agora, a ideia é aprender mais sobre a nova ferramenta, contribuir para seu
desenvolvimento, aguardar pelas próximas versões e esperar que os outros notebooks
como Jupyter e Colaboratory adotem as boas ideias advindas pelo Polynote.
**Vou deixar o link alguns links para quem quiser ler mais sobre o assunto:**
[Projeto no github]
[Site do projeto]
[Artigo oficial (em Inglês) de lançamento do projeto].
Uma das [**decisões arquiteturais**] que tomamos no desenvolvimento do novo site

lançado no dia 1º de Março, foi deixar o site de vendas separado da plataforma de
curso e também sem acesso ao banco de dados.
Devido a decisão de retirar o acesso do site de vendas ao banco de dados,

precisávamos passar as informações necessárias para o site de alguma forma. Optamos
então por expor uma API que é consumida pelo site.
Vamos pegar um endpoint da API como exemplo:
Um dos endpoints da nossa API é responsável por listar apenas o nome (nome do curso
na plataforma) e o slug (nome da url do curso formatado para efeito de SEO) de
todos os cursos.
Já tínhamos uma classe que representa um curso com as informações necessárias:
java
Porém, repare que a classe `Course` tem informações que não precisávamos expor
neste endpoint.
A princípio, era só excluir os campos desnecessários na hora de montar o **JSON**

para a **API**. Porém, havia um detalhe nessa abordagem: todas as vezes que
acrescentássemos um campo novo na classe `Course`, teríamos que lembrar de excluir
esse novo campo nos endpoints desnecessário, ou seja, uma solução problemática...
Percebendo que a nossa **API** iria ficar muito sensível a qualquer alteração no
nosso modelo de curso, resolvemos criar uma classe nova que conteria somente
informações necessárias para o endpoint.
java
Com esse pequeno ajuste, conseguimos gerar o nosso _JSON_ com apenas os campos
necessários. E se for necessário adicionar/modificar algum campo no _endpoint_?
Basta apenas ajustar o campo na classe `SimpleCourse` que o JSON será construído
apenas com os campos dessa classe! Uma solução simples que nos livra de toda
responsabilidade de ficar se preocupando com qualquer tipo de modificação!
Essa solução é um **Design Pattern** chamado **DTO** (Data Transfer Object), que
tem apenas a finalidade de armazenar os dados necessários que precisamos
transferir, ou seja: uma classe sem qualquer regra de negócio que será utilizada
apenas para transferir os dados que queremos!
O que acharam da nossa solução? É a primeira vez que viu sobre o _DTO_? Deixe seu
comentário sobre o que achou dessa abordagem para resolver esse _endpoint_.
**Você pode aprender isso e mais com nossos [cursos de programação].**
Estive me preparando para a certificação da Oracle e surgiu a seguinte situação:
Vamos verificar a classe Livro:
java
Agora se eu testar o meu código:
java
Resultado:
java
Funciona como o esperado. Analisando um pouco o nosso código... Podemos ver que o
nosso construtor não retorna nada, e em Java quando um **método** não retorna nada
é `void`, então que tal criarmos um novo construtor com um retorno `void`?
java
Agora vamos criar um livro que tenha apenas um nome:
java
Ué? Não compilou? Que estranho...
java
Em tempo de compilação o construtor não é um **método**! Por isso não podemos

retornar valores, ou seja, não podemos assinar como `void`, ìnt` ou qualquer valor
em específico,mesmo sabendo que, por de baixo dos panos (em bytecode), ele é um
método. Para diferenciar com mais facilidade podemos pensar o seguinte:
O construtor é um "tipo de método" sem nome que retorna a própria classe:
java
Podemos pensar dessa forma para facilitar a compreensão, porém **NUNCA** confunda
método com construtor... (apesar de, bem debaixo dos panos, no bytecode, o
construtor é representado como um método que é invocado após o objeto ser criado,
um tópico bemmm avançado). Sabemos que métodos, mesmo sendo `void`, possuem o
`return`, mas e os construtores? Também possuem! Vamos adicionar um `return` no
construtor:
java
Porém, o `return` do construtor **não pode retornar nada**! Legal, ele tem um
retorno que não retorna, então por qual motivo eu usaria um retorno desse? Simples!
Usamos esse tipo de retorno para interromper o construtor se for necessário, por
exemplo, vamos criar um construtor que só recebe o valor:
java
E se o valor for menor ou igual a 1000 quero **apenas atribuir** e se for maior eu
preciso aplicar várias regras de impostos e depois atribuir:
java
Vejam que no momento em que o valor é menor ou igual a 1000 temos o return, ou
seja, todo o código abaixo não será executado! Parece bizarro, porém funciona!
E aí, o que achou do retorno do construtor? Nem fazia ideia que existia? Pensando
nisso o instrutor Guilherme Silveira [**criou a formação de certificação Java**]
que aborda com muitos detalhes todas as peculiaridades que podemos encontrar na
linguagem Java, com o intuito de preparar o aluno para a certificação da Oracle!
O 256º dia do ano é o dia que comemoramos a profissão dos que programam. Muitas
vezes é o dia 13 de setembro, como neste ano, mas nos anos bissextos isso cai no
dia 12 de setembro. Na Rússia esse é um dia reconhecido pelo governo, e foi por lá
que essa data foi, digamos, instituída. Mas por que 256?
imagem
# 256
256 é emblemático por vários motivos. É o total de combinações que podemos fazer
com 8 bits. Para cada bit, temos 2 opções: ligado ou desligado. Então temos no
total `2x2x2x2x2x2x2x2` que vale 256, ou `2ˆ8` (algumas linguagens usam o
chapeuzinho para indicar a potência).
Pra ficar mais interessante: na notação hexadecimal, aquela que além do 0-9
aparecem A-F pois temos a base 16, `256` é escrito `100`. Então esse seria o
"centésimo" dia em hexadecimal do ano.
imagem
Algumas sites [confundem um pouco] e induzem que, todos os bits ligados de um byte,
o `11111111`, representa o número 256. Na verdade com todos os bits ligados,
considerando o binário positivo, temos 1+2+4+8+...+128, que é a soma de uma
progressão geométrica que vale `255`! O 256 é o número total de possibilidades
(pois ainda há o zero!).
# Notação binária e hexadecimal
Quer brincar um pouco com números e enxergar sua representação em binário,

hexadecimal, octal ou outra base maluca? Você pode usar o [método] `toString` do
`Number` no JavaScript:
<p class="codepen" data-height="265" data-theme-id="0" data-default-tab="js,result"

data-user="paulo-silveira" data-slug-hash="gOYzQKb" style="height: 265px; box-
sizing: border-box; display: flex; align-items: center; justify-content: center;
border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="gOYzQKb">
<span>See the Pen <a href="https://codepen.io/paulo-silveira/pen/gOYzQKb/">
gOYzQKb</a> by Paulo Silveira (<a href="https://codepen.io/paulo-
silveira">@paulo-silveira</a>)
on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>
# Dia do programador na China
Não é em todo lugar que comemoramos esse dia assim. Na China, a data escolhida foi
o dia 24 de outubro. O Motivo? Pois datas comumente aparecem na programação na
ordem àno-mês-dia`, ou melhor, `YYYY-MM-DD`, considerando apenas o mês e o dia, o
24 de outubro seria `10-24`, ou `1024`, que é `2ˆ10`! `1024` é quantos bytes temos
em 1 kilo byte, o `1kb`.
# Existem 10 tipos de pessoas: as que entendem binário e as que não entendem
Essa é outra piada infame. A explicação aqui é a mesma. Na base 2

Espero que aproveite o seu dia, a sua semana, e a base dois!
Quando estamos implementando uma rede de computadores, uma das coisas que
precisamos pensar é em como conectar os computadores.
Podemos conectar computadores utilizando [**cabos de metal**], de fibra óptica,

[**utilizando Wi-Fi**], entre outras maneiras.
A maneira que os computadores se conectam na rede, é chamada de topologia, existem

diversas maneiras de conectar computadores por meios físicos, utilizando cabos ou
redes sem fio, por exemplo.
Quando estamos falando da maneira que os computadores estão conectados fisicamente,

dizemos que esta é a topologia física. Porém, não basta dois computadores estarem
conectados fisicamente para poderem se comunicar. Para isso, devem existir
[**regras de comunicação**] que falam como os computadores devem se comunicar.
Ou seja, dependendo da regra podemos ter meios diferentes dos computadores

comunicarem uns com os outros, neste caso falando sobre as conexões lógicas que os
computadores fazem, ou falando sobre as topologias lógicas.
## Conhecendo algumas topologias
Quando íamos jogar nas lan houses com nossos amigos, nossos computadores eram
conectados uns com os outros (senão não jogaríamos uns com os outros).
Existem vários meios dessa conexão acontecer, porém, uma muito comum de ser
utilizada, é ter os computadores conectados juntos sem nenhum outro dispositivo
concentrador, como [**hubs ou switches**]:
imagemcentral que conecta os computadores. Nesse tipo de rede é muito utilizado o

[**cabo coaxial**], e era uma topologia muito utilizada antigamente.
Nesta topologia, todas as máquinas na rede são conectadas a um barramento central.

Todo o pacote que elas enviam, passa por esse cabo. Portanto, se o cabo central
apresentar um problema, a rede inteira fica comprometida.
Esse não é o único problema da rede em barramento. Como as máquinas têm apenas um
único meio para enviar pacotes, se duas máquinas se comunicarem ao mesmo tempo, a
informação é perdida, já que uma informação "se mistura" com a outra. Ou seja, uma
em uma rede em barramento quando uma máquina fala, todas as outras escutam.
Porém, mesmos com esses problemas a topologia em barramento foi muito usada
antigamente em redes corporativas e, mesmo nos dias de hoje, é possível encontrar
algumas redes nesse modelo, principalmente legados.
Mas então, qual a topologia mais usada nos dias de hoje?
## Conhecendo a topologia estrela
Nas redes atuais, é muito comum utilizarmos [**switches para concentrar os

computadores**] em um único ponto. Todos as informações enviadas por um computador
passam pelo switch antes de chegar ao destino.
imagem.
Esse tipo de topologia é muito utilizado em redes de grande porte, já que isolando
as sub-redes, isolamos também os problemas que podem acontecer.
## Para saber mais
Além dessas, existem outros tipos de topologia. Como por exemplo a topologia Anel,
também chamada de Token Ring. Nela os computadores são conectados em série uns com
os outros, um desses computadores recebe um token que lhe garante a comunicação.
Esse token é passado para outros computadores seguindo uma ordem, por exemplo no
sentido horário. Só pode realizar a comunicação o computador que está com o token.
O pacote enviado pelo computador deve seguir a mesma ordem do **token**.
Ou seja, ele passa por todos os computadores até chegar ao destino. Essa também é
uma rede na qual quando um computador fala os outros escutam. E sua principal
desvantagem é que quando existem muitos computadores na rede, a comunicação fica
muito lenta.
Outra topologia muito utilizada, é a chamada rede Mesh. Ela são muito utilizadas em
redes muito grandes e em redes sem fio. Nela cada um dos nós, computador ou
roteador, se comportam como uma única rede.
Conhecer as topologias é uma boa coisa para quem trabalha com redes. Já que
consegue implementar a melhor topologia para cada situação, otimizando assim a
comunicação na rede.
Aqui na Alura temos uma [**formação em redes**]. Nela você aprenderá a implementar
uma rede de computadores, a configurar equipamentos de rede como switches e
roteadores, além de questões de segurança da informação.
Quando estamos apresentando resultados, além dos números, podemos nos utilizar de
outros elementos para passar melhor a mensagem. Uma boa forma de apresentar dados é
utilizando a biblioteca **matplotlib**.
Quando estamos analisando dados, é comum vermos e manipularmos muitos números.

Números de vendas, de acessos, de taxa de retorno entre muito outros.
Podemos analisar esses dados de muitas formas, podemos utilizar uma planilha
eletrônica, como o **Excel**, ou o **Google Sheets**, podemos utilizar linguagens
como **Python** e **R** para lerem nossos dados e armazená-los em **estruturas de
dados como listas, vetores, data frames**, entre outros.
Estava utilizando o Python para analisar os dados de venda de uma loja de produtos
eletrônicos. Em um momento, estava analisando os dados de venda no semestre me
deparei com a seguinte planilha:
python
Sabemos que essa tabela são mostrados os dados de venda do semestre, mas o que
esses dados estão indicando? Tivemos um aumento nas vendas? Elas estão em queda?
Não temos uma noção clara do que esses dados significam, não conseguimos
interpretá-los facilmente. O que podemos fazer para interpretar melhor esses dados?
## Uma imagem vale mais que mil palavras
Ficar vendo os dados na tabela pode não ser a melhor forma de visualizá-los. Temos
que ficar analisando linha por linha, valor por valor, o que pode ser bem
trabalhoso.
Claro, os números são importantes para a gente fazer uma análise precisa, porém,
quanto estamos apresentando os resultados, além dos números, podemos nos utilizar
de outros elementos gráficos para passar melhor a mensagem.
Uma boa forma de apresentar dados é utilizando gráficos. Com gráficos podemos ter
uma ideia geral do que os dados estão nos dizendo.
Por exemplo, nossa planilha de vendas por semestre, nós podemos criar um gráfico
que mostra as **progressões** das vendas em cada mês.
Mas como podemos criar um gráfico?
### Conhecendo a biblioteca
No Python, existe uma biblioteca muito famosa para criarmos gráficos, é a

[**Matplotlib**]. Com ela, podemos montar diversos tipos de gráficos. Para começar
a usar a biblioteca, temos que instalá-la. Portanto:
`pip install matplotlib`
Legal! Já instalamos a biblioteca, vamos começar a usá-la.
Nossa biblioteca é a `matplotlib`. Nós queremos utilizar ela para criar, isto é,
plotar, gráficos. Então, falamos para o Python importar (ìmport`) da biblioteca
`matplotlib` a parte de plotar gráficos com o Python (`pyplot`).
python
Vamos criar um gráfico com a nossa planilha de vendas semestrais. Para isso,
precisamos falar para o **`pyplot`** quais são os meses e quais são os valores de
cada mês. Uma maneira de fazer isso é criar duas listas, uma com os meses e outra
com os valores:
python
Agora, basta falarmos para o `pyplot` plotar (`plot`) o nosso gráfico:

python
Falamos para o `pyplot` criar o nosso gráfico, mas onde ele está? O nosso gráfico
não apareceu. Quando falamos para o `pyplot` criar o gráfico, ele constrói o
gráfico e o guarda em uma região da memória. Para conseguirmos ver o gráfico,
precisamos falar para o `pyplot` mostrá-lo (`show()`):
python
imagem`**):
python
imagem a ele:
python
Podemos também pedir para o `pyplot` escrever quais os significados dos valores no
eixo **X** e no eixo **Y**. Ou seja, podemos pedir para ele rotular os dados desses
eixos (**`xlabel`**, **`ylabel`**):
python
Agora, quando pedimos para o `pyplot` mostrar nosso gráfico, veremos o título e o
rótulo de cada eixo:
![]
Temos um gráfico muito mais descritivo agora. Sabemos sobre o qual o assunto que
ele trata, além de sabermos o significado dos eixos **X** e **Y**.
## Para saber mais
Veja que da maneira que importamos o módulo do `pyplot`, sempre que precisamos
chamar alguma função da biblioteca, temos que passar o caminho completo até o
módulo, isto é, `matplotlib.pyplot`. Um nome um pouco grande, não?
Por isso, uma prática comum é darmos apelidos aos nossos imports. Por exemplo,
podemos falar para o Python que estamos apelidando o módulo `pyplot` de `plt`, por
exemplo:
python
Dessa forma, sempre que quisermos chamar esse módulo, basta chamá-lo pelo apelido:
python
Além do gráfico de linhas, o `pyplot` pode criar também outros tipos de gráficos,
como gráficos de barras, gráficos pizza, de dispersão, entre alguns outros.
Além de criar o gráfico e adicionar título e rótulos a ele, podemos também alterar
a cor da linha e a cor de fundo. Aumentar o tamanho das letras, entre diversas
outras customizações.
A parte de visualização de dados é umas das tarefas mais importantes de um

cientista de dados, pois com ela, além de compreendermos os dados de uma maneira
mais intuitiva, ela nos ajuda a transmitir o que os dados falam para outras
pessoas.
Aqui na Alura, temos um [**curso de data visualization**]. Nele, você aprenderá
qual o melhor gráfico para cada situação. Como construir um gráfico com um bom
esquema de cores para facilitar a leitura, entre muitas outras coisas.
Também temos um [**curso de Google Charts**]. Com ele você aprenderá como criar
gráficos para a web, utilizando a API do Google. Nele, você verá como criar
gráficos de linhas, colunas, barras, entre vários outros.
É bem comum no **Linux** utilizarmos o terminal para realizar algumas tarefas.

Atualizar os sistema, preparar ambientes para programar, instalar programas, entre
outras.
Algumas dessas tarefas são repetitivas, atualizar o sistema por exemplo. Se estamos
utilizando alguma distribuição baseadas no [**Debian**], como o **Ubuntu**,
geralmente temos que atualizar a lista de repositórios, antes de atualizar os
pacotes. Ou seja, executamos dois comandos para uma única tarefa.
Ou então, quando temos que preparar o ambiente para começarmos a desenvolver. Se

compramos uma máquina nova, ou formatamos, temos que instalar todos os programas,
interpretadores, compiladores e tudo mais.
Seria legal se pudéssemos digitar um comando no terminal como àtualizar` e

`preparar_ambiente` e ele já fizesse isso para a gente. Mas como dizemos para o
terminal o que ele deve fazer quando esse comandos forem executados?
## Criando apelidos
Nas distribuições Linux, quando digitamos um comando pelo terminal, estes passam
por um **interpretador**. É esse interpretador que executa os comandos que
digitamos.
Existem vários interpretadores, um dos mais usados é o **Bash**, interpretador

padrão na grande maioria das distribuições Linux. Tudo que digitamos no terminal, o
Bash interpreta, se ele conhecer o comando ele o executa, senão ele fala que o
comando não foi encontrado.
Nós queremos dizer para o terminal o comando àtualizar`, portanto, precisamos

ensinar o Bash o que fazer quando nós digitarmos esse comando.
Existem algumas formas de ensinarmos um comando para o interpretador. Podemos criar

um programa em linguagens como Java, C, Python, com o próprio Bash, entre outras.
Mas, veja bem, os comandos para atualizar os repositórios e pacotes já existem no
sistema. Faz sentido criarmos um novo programa que executará a mesma função desses
dois comandos?
Se nós criarmos um comando que faça essas funções, ele seria redundante no sistema.
Esses comandos já existem, nós apenas queremos chamar ele com outro nome, ou seja,
queremos dar um **apelido (alias)** para eles.
Podemos dizer para o terminal que àtualizar` é um apelido para os comandos `sudo
apt-get update && sudo apt-get upgrade`:
àlias atualizar='sudo apt-get update && sudo apt-get upgrade'`
imagem.
Logo, podemos colocar esse arquivo em um desses diretórios, ou então, adicionar o
seu diretório como um local de arquivos executáveis. No Linux, essas informações
ficam armazenadas em uma variável chamada `PATH`. Nós podemos pedir para o terminal
imprimir seu conteúdo, para isso, devemos colocar o `$` na frente do nome:
imagem para a variável `PATH` o conteúdo da própria variável `$PATH` junto (`:`)
com nosso diretório `/home/yuri/Scripts`:
èxport PATH=$PATH:/home/yuri/Scripts`
imagem, então, nós entramos no seu diretório e digitamos `./prepara-ambiente`, por

exemplo. O `./` indica que queremos executar aquele script.
O comando èxport` funciona de uma forma parecida com o comando àlias`. Ou seja,
ele só é válido para aquela instância do terminal. Se quisermos que ele esteja
sempre disponível, podemos colocar sua instrução dentro do arquivo `.bashrc` da
mesma forma que fizemos com o comando àlias`.
Criar comandos pode ser uma forma de automatizar tarefas, ou então, deixar o
sistema mais semântico para algum usuário, como no caso do comando àtualizar`.
Além do Bash, é possível criar comando para outros Shells, como o `ZSh`, um Shell
muito utilizado por desenvolvedores.
Apesar de os comando utilizados para atualizar o **sistema serem de distribuições

baseadas no Debian, como Ubuntu e Linux Mint**, os modos de criar apelidos e
comandos são parecidos em praticamente todas as distribuições Linux.
Automatizar tarefas é uma das tarefas de administrador de sistemas, aqui na Alura,

temos um curso sobre como [**automatizar tarefas com o Shell Scripting**].
Nele você aprenderá sobre a sintaxe do Shell, sobre como criar um script que
converte muitas imagens de uma vez, como enviar um emails pelo shell e até como
fazer **backup na Amazon**.
imagem
Busquei os livros e a quantidade de vendas, mas meu novo livro de introdução a

computação não apareceu:
sql
Meus livros (tabela da **esquerda**) são usados com um **join** com suas vendas
(tabela da direita).
O join padrão só traz linhas quando existem valores equivalentes nas duas
tabelas... se o livro é novo e não possui venda... não tem linha na tabela da
direita... uma pena!
Se quero um join que traga todo mundo da esquerda (meus livros), independentemente
de ter alguém na direita, basta usar um join canhoto, o `LEFT JOIN`:
sql
Sempre que escrever a palavra `JOIN`, pare e pense: que tipo de join você deseja?
Será que não queria um `LEFT JOIN`?
Desafio para a próxima dica: o que tem de horripilante na tabela a seguir?
sql
imagem
Usando **Shell Script** vou monitorar um **servidor web Apache, automatizar tarefas
e rotinas**
Nesse servidor temos uma aplicação com alguns serviços, como o sistema de vendas da
empresa. Ou seja, temos alguns serviços críticos rodando nesse servidor.
Logo, ele deve sempre estar funcionando, pois caso aconteça algum problema e o
serviço saia do ar, a empresa pode ter prejuízos.
Uma das possibilidade é monitorar esse servidor web e sempre que ele cair nós vamos
reiniciá-lo… mas como sabemos que o servidor caiu?
## Lendo o status do servidor
Quando acessamos uma página na internet, na verdade, o que estamos fazendo, é uma
requisição para o servidor. Uma **requisição** nada mais é do que um pedido.
Neste caso, estamos pedindo uma página na web. Se tudo ocorrer bem, nosso servidor
nos devolve a página que requisitamos e devolve também um código de status. Esse
código informa o estado da requisição.
Se ele retornar **`200`** significa que tudo ocorreu bem. Já se o código for
**`404`** significa que o que pedimos na requisição não foi encontrado. Esse erro é
comum quando tentamos acessar uma página que não existe no servidor. Além desses
[existem outros códigos], como o **`500`** que é um erro interno no servidor.
Sabendo que o servidor retorna um código quando recebe uma requisição, podemos
ficar monitorando esse código e sempre que ele for diferente de `200` reiniciamos o
servidor.
## Checando o código HTTP
Para checar o **status do HTTP**, nós podemos utilizar o comando `curl`. Este
comando permite a transferencia de dados entre o **servidor** e o **host**.
Queremos que o `curl` mostre para gente (`--write-out`) o código HTTP (`%
{http_code}`) da nossa requisição ao servidor:
`curl --write-out %{http_code} www.multillidae.com.br`
imagem, que é o código HTTP, e jogá-la no [buraco negro do Linux], o `/dev/null`.
`curl --write-out %{http_code} --output /dev/null www.multillidae.com.br`
imagem** e nos mostrar apenas o status:
`curl --write-out %{http_code} --silent --output /dev/null www.multillidae.com.br`

imagem` para que o `bash` execute:
bash
Vamos pedir para o script imprimir a variável e ver se o comando funcionou como o
esperado:
bash
Agora, para o Bash interpretar este script:
`bash verifica_servidor.sh`
imagem o código for diferente (`-ne`, not equal) de `200`, tente reiniciar o
servidor Apache HTTPD (`systemctl restart httpd`).
bash
Pronto, dessa maneira sempre que nosso servidor tiver uma resposta diferente de
`200` ele tentará reiniciar.
Só que, dessa forma não sabemos quando ele foi reiniciado. Nós podemos querer saber
quando ele foi reiniciado para descobrir o motivo disso ter ocorrido.
Vamos falar para nosso script para que ele escreva (ècho`) uma mensagem quando
antes de tentar reiniciar o servidor.
Para manter um log mais organizado, vou colocar a mensagem, a data e hora do
ocorrido.
Conseguimos pegar a data do sistema utilizando o comando **`date`**. Podemos pedir

para ele nos mostrar a data completa passando o parâmetro `%F` (full date). Se esse
parâmetro for o primeiro, temos que passar o sinal de `+` antes:
`date +%F`
imagem.
`date +%T`
imagem. Logo, o comando fica:
`date +%F\ %T`
imagem`.
bash
Só que, dessa maneira, a mensagem será impressa na tela. Precisamos [**redirecionar

a saída**] do comando **ècho`** para o nosso arquivo.
Então vamos falar para o Bash redirecionar (`>>`) para o arquivo onde ficarão
salvos nossos logs. No meu caso, esse arquivo fica na pasta `/logs/servidor.log`.
Uma coisa bacana é que se esse arquivo não existir, o Bash o cria.
bash
Agora, se o servidor apresentar um problema, basta executarmos o script que ele

tentará reiniciar o servidor e ainda irá gravar uma mensagem no log para a gente.
imagem. Para isso basta colocar (`*/1`) na coluna de minutos e o asterisco (`*`) em
todos os demais campos.
No caso do comando, vamos passar o caminho para ele, no meu caso está em
`/scripts/`.
`*/1 * * * * bash /scripts/verifica_servidor.sh`
Pronto! Agora nosso script será executado a cada minuto e, caso tenha algum
problema, o script tentará reiniciar o servidor.
## Para saber mais
Existem versões mais curtas dos parâmetros que utilizamos com o comando `curl`. O
`--write-out` pode ser substituído por `-w`, o `--silent` por `-s` e o `--output`
por `-o`.
Além do Bash, existem muitos outros interpretadores Shells, como o Korn Shell e o Z
Shell.
Esse foi apenas um exemplo de automatizar tarefas com o Shell Scripting, existem
muitas outras, como por exemplo enviar um e-mail sempre que o servidor web cair.
Aqui na Alura temos dois [**cursos sobre Shell Scripting**] que além de ensinar
como enviar emails automaticamente, ensina como monitorar o consumo de memória,
como converter imagens automaticamente, fazer backups na nuvem e muito mais.
Além dos scripts em Shell, existem outras ferramentas que ajudam a monitorar os
servidores. Um exemplo é o Kubernetes, um serviço que gerencia [**containers como o
Docker**].
O Kubernetes consegue monitorar os containers de nossa aplicação e garantir que

caso algum container caia, outro suba em seu lugar.
Na Alura temos um [**curso sobre o Kubernetes**]. Nele você aprenderá como o

Kubernetes gerencia os containers, como realizar técnicas como o balanceamento de
carga e até como implementá-lo na nuvem. Um recurso muito utilizado nos dias de
hoje.
Serviços como Amazon EC2 ou Google Cloud são muito utilizados quando queremos fazer
o deploy da sua webapp. A vantagem é que o próprio serviço monitora o estado do
servidor e garante que sua aplicação fique sempre disponível.
Aqui na Alura, temos um [**curso sobre Amazon EC2**]. Nele você aprenderá sobre
como colocar sua aplicação na nuvem, sobre os tipos de clouds que existem, como
escalar automaticamente sua aplicação, entre outras coisas.
Recentemente, recebi uma mensagem de um amigo me indicando um site que parecia ser
muito interessante - era um fórum com discussões sobre programação. A única questão
é que eu nunca havia ouvido falar desse site, então fiquei com um pouco de receio
de acessá-lo.
Acontece que existem [sites maliciosos por aí que visam pegar os dados de quem
acessa para atacar os usuários de alguma forma]. Contei meu receio para esse amigo,
que então me recomendou usar o modo privado do meu navegador (também conhecido como
modo anônimo). Segundo ele, dessa forma eu estaria protegido e o site não teria
acesso aos meus dados.
Como eu não conhecia esse modo de navegação, resolvi me informar pesquisando antes.
Afinal, como funciona o modo privado do navegador? O que ele faz?
## Como os navegadores funcionam
Por padrão, é muito comum que os [navegadores web mais utilizados]) (como Firefox e
Chrome) guardem vários registros dos usuários. Quando entramos em algum site, por
exemplo, ele fica armazenado em um histórico dentro do navegador.
Quando pesquisamos alguma coisa, a pesquisa também é armazenada no histórico de

pesquisas. Até quando fazemos login em determinada plataforma, é comum que os
navegadores armazenem os dados que nos mantêm logados, os chamados _[cookies])_.
Tudo isso pode ser recuperado e visualizado por algum usuário que acessar a web
através do meu navegador, no meu computador. Por um lado, isso pode ser bastante
conveniente, trazendo mais conforto na nossa navegação, com as sugestões de
_autocomplete_ e destaque dos sites que mais usamos.
Por outro lado, nossa privacidade fica, de certa forma, prejudicada. Afinal, nem
sempre queremos que nossas pesquisas ou sites visitados fiquem registrados, muito
menos que nossos perfis continuem abertos para qualquer um utilizar depois de nós.
Além dos registros que os navegadores web armazenam sobre nós, eles também costumam
dar aos websites que entramos acesso a muitos dados particulares nossos, como o IP
da nossa rede, informações sobre o software e hardware do nosso computador e até a
velocidade da nossa conexão.
O desenvolvedor Robin Linus, em meio a discussões sobre privacidade na web, criou

um [site mostrando várias informações que qualquer site pode saber sobre você], por
padrão. Nele, vemos que isso vai desde uma estimativa poderosa de nossa localização
(sem necessidade de qualquer permissão de GPS, através de uma [API do Google]), até
dados de login de redes sociais aleatórias e nível de bateria do notebook!
Se quisermos esconder algumas dessas informações, será que a opção de navegação

privativa de alguns navegadores pode nos ajudar, como meu amigo havia indicado?
## O que o modo privado de navegação faz
Afinal, o que é que o modo privado dos navegadores esconde? Como ele colabora com a
nossa privacidade?
O modo privado dos navegadores, no geral, tem uma filosofia principal - a de não
guardar dados. Isto é, aquele comportamento padrão dos navegadores de armazenar o
máximo de informações possível para o conforto na usabilidade é suprimido em prol
de uma privacidade mais forte.
O que acontece, então, é uma espécie de instalação temporária de uma outra

instância do navegador. Quando encerramos a navegação privada e fechamos as abas,
essa instalação é removida, de modo que nem o histórico, nem os _cookies_ e esse
tipo de informação ficam salvos.
No geral, esse modo de operação da navegação privativa serve apenas para esconder
alguns dados de outras pessoas que possam usar o mesmo computador. Mas e quanto
àquele monte de informações que a gente descobriu que os sites têm acesso através
do navegador?
## O que o modo privado de navegação NÃO faz
Apesar de esconder localmente algumas informações a respeito da navegação, como o

histórico e informações de login (registrada nos cookies), o modo de navegação
privativa **não** esconde nada dos sites que visitamos.
Isso significa que todas aquelas informações contidas no navegador continuam

disponíveis aos sites e plataformas que acessamos online. Do IP, à localização, às
informações referentes ao software e hardware utilizados pelo usuários, tudo isso
ainda é acessível.
Para esconder esse tipo de informação dos sites que acessamos, outras ferramentas
são necessárias - desde configurações específicas no navegador, até aplicações
externas, como uma [VPN], que consegue esconder seu endereço IP verdadeiro.
## Consciência da efetividade
Por muitas vezes que acessamos a Internet, só queremos esconder um pouco as

informações de nossa navegação. Afinal, nem sempre queremos que os outros saibam
que sites andamos acessando, por diversas razões que envolvem o nosso direito de
privacidade.
Nesse comum e importante caso, o modo privado de navegação, que entendemos com mais
cuidado nesse post, é de muita utilidade. Entretanto, é muito importante que
entendamos como essa ferramenta funciona, para não cairmos na ilusão de que ela
pode fazer coisas que na realidade não pode!
A consciência da efetividade das ferramentas que utilizamos, principalmente quando

tratamos de privacidade e segurança online, é essencial. Por isso, estudar e
entender o funcionamento delas acaba sendo de extrema importância para todos nós!
Gostou do post? Se quiser entender mais sobre questões de segurança na web, dê uma
olhada em [nossos cursos na Alura]!
imagem
Estou criando um banner para uma nova promoção que o Guilherme vai fazer para o seu
restaurante, em que você escolhe um dos pratos prontos do menu e ganha um suco de
brinde. Eis que temos as seguintes imagens:
imagem deixando à mostra apenas o que queremos que apareça e depois se retirarmos o
papel de cima, a imagem completa continua lá!
Para conseguir esse efeito de máscara, temos três opções boas para isso:
- Pincel (Brush)
- Ferramenta de Laço Poligonal (Polygonal Lasso Tool)
- Caneta (Pen Tool)
## 1\. Ferramenta de Laço (Lasso Tool)
**A primeira maneira que temos para fazer esse efeito de máscara é realizando uma
seleção mais precisa**, exatamente no contorno do elemento que queremos manter,
isto é, o que não estiver selecionado será "recortado", ou melhor, mascarado:
imagem.
imagem a máscara nas áreas que queremos mostrar mais ou ocultar mais.
imagem
## 3\. Caneta (Pen Tool)
A ferramenta de [**Caneta**] é parecida com a de Laço, porém a Caneta tem duas

diferenças: Ela permite você fazer a alteração de pontos e também te deixa fazer no
formato FreeForm (não precisa ficar clicando e criando ponto por ponto, pode
desenhar livremente):
imagem sobre qual das duas usar.
O restante do processo é o mesmo, faça a marcação que deseja, alterando os pontos

quando necessário para aumentar a precisão da demarcação, e crie uma New Mask.
E para que todas essas opções?
A **ferramenta de seleção** é melhor para projetos e elementos mais simples de

recortar, porque, diferente da pen tool, não conseguimos refinar e alterar os
pontos, deixando o menos preciso. Ou seja, uma ferramenta para uso rápido e
simples.
Para projetos e imagens mais detalhadas, a **brush** é uma boa escolha, mas que
toma bastante tempo para ajustar os detalhes, uma vez que é à mão livre. Apesar de
ser mais detalhada é mais difícil de refinar.
E a **Pen Tool** é uma boa ferramenta para recortes mais precisos pelo fato de
conseguirmos alterar os ângulos e curvaturas dos pontos da forma. É mais preciso e
temos mais controle das formas, porém mais demorado também.
Vale lembrar que você deve escolher a ferramenta que mais se adequa ao seu projeto!
Quer aprender mais sobre o Photoshop? Temos diversos cursos na nossa plataforma da
Alura como este de tratamento de imagens com [**Photoshop para iniciantes**]!
imagem
Há algum tempo, desenvolvi um projeto em Python de gerador de dados aleatórios de

um cidadão brasileiro, chamado [cidadaobr]. O intuito do projeto era que outros
desenvolvedores pudessem usar para testes de aplicações, como em simulações de
cadastros de clientes de algum serviço, por exemplo.
Para compartilhar com a comunidade, coloquei o código em um [repositório no

GitHub], para que todo mundo pudesse usar… ou era isso que eu pensava!
Meu código ganhou um pouco de popularidade e logo recebi mensagens de alguns

desenvolvedores pedindo permissão de uso do programa.
Na hora que li as mensagens, fiquei confuso! Mas ué, eu até pus no GitHub para todo
mundo usar, por que será que eles estão vindo me pedir permissão? Perguntei e me
explicaram: **o código não tinha licença**!
# A necessidade de uma licença
Quando passamos pelo processo de [**publicar um pacote Python no PyPI**],

entendemos um pouco a necessidade de se ter uma licença definida para nosso
projeto.
Na verdade, em algumas jurisdições, é até proibido usar um **software** que não

tenha licença definida sem a autorização expressa do dono dele! Bem, isso realmente
não é o que queremos…
Então vamos definir uma licença! Mas… qual? Será que vamos precisar contratar um
advogado para isso? Bom, tratando-se de temas jurídicos, pode ser o caso procurar
ajuda de um advogado, mas não é necessário!
O pessoal do [GitHub], com o apoio da comunidade, criou uma ferramenta web muito
bacana, que nos ajuda a escolher uma licença para nosso projeto - o
[choosealicense.com]. Nele, temos uma breve explicação de algumas das principais
licenças que podemos usar, o que já nos ajuda muito! De cara, vi três que me
chamaram a atenção:
# GNU General Public License v3.0 (GNU GPLv3)
A [GNU GPLv3] permite que meu software seja usado e distribuído, contanto que,
quando distribuído, o código fonte esteja abertamente disponível.
Essa licença também exige uma cópia dela mesma, com um aviso de _copyright_, sempre
que o software for distribuído de alguma forma.
Se houver alguma modificação no código de nosso software, essa licença faz com que
essas modificações tenham que ser lançadas com uma licença no mínimo similar. Além
do mais, qualquer mudança no código tem que ser documentada.
Achei a licença interessante, mas com regras demais. Será que existem outras mais
livres?
# The Unlicense
[The Unlicense] é uma licença cheia de permissões, com nenhuma condição. Qualquer
pessoa é livre para copiar, modificar, publicar, usar, vender ou distribuir nosso
software de qualquer maneira possível, sem nenhuma pendência.
Apesar de não trazer mais as complicações de muitas regras da GNU GPLv3, senti que
essa licença poderia ser um pouco prejudicial para mim, já que ela não exige nem
mais um aviso de copyright ou cópia dela mesma. E agora?
# Licença MIT
A [MIT] é uma licença que se encaixa muito bem nos meus objetivos. No geral, é bem
permissiva, sendo o requisito uma atribuição de volta a mim, com um aviso de
_copyright_, e uma cópia dela incluída.
Essa licença não carrega muitas regras e também não chega a me prejudicar em nada,
atribuindo meu trabalho a mim. Assim, percebi que era, de fato, a que melhor se
encaixa para meus objetivos. Em [meu projeto], então, defini o uso dela!
# Licenciando o projeto em prol da comunidade!
No começo do post, tínhamos um projeto público que queríamos compartilhar com a

comunidade de desenvolvedores do Brasil. O projeto já até estava disponível
publicamente no GitHub.
Depois de publicado, entretanto, acabei recebendo mensagens de desenvolvedores

experientes pedindo minha autorização para usar o software! Isso é porque ele não
tinha uma **licença** definida…
Assim, dei uma olhada no site [**choosealicense.com**]. Ao final da pesquisa,

decidi que a Licença MIT era a que mais se encaixava em meu projeto! Adicionei ela
no GitHub e agora está tudo certo ;)!
E aí, o que você achou do post? Deixe um feedback nos comentários! Dê uma olhada em
nossos [**cursos de programação na Alura**], para criar (e licenciar!) seus
próprios projetos!
Temos uma App Android que permitirá que os usuários consigam realizar compras via
celular. A primeira tela para essa App é justamente exibir todos os livros
disponíveis na [**Casa do Código**]:
imagem**], porém, esse mesmo serviço ~~está sofrendo~~ sofreu um _upgrade_ para o
[**Firebase**].
E aí, o que achou do **push notification**? Está ansioso para implementá-lo na sua
App? Então dê uma olhada no [**post tutorial**] onde mostro, passo-a-passo, como
podemos configurar o Firebase e integrar um Push Notification em uma App Android.
Que tal aprender a desenvolver uma App Android desde o zero hoje mesmo? Na Alura,
temos [**uma formação Android**], onde você será capaz de construir suas próprias
Apps do começo ao fim!
Imagine que você está em sua timeline no Instagram e encontra uma imagem que
gostaria de curtir, comentar ou mesmo enviar para outra pessoa, mas se depara com
esta tela:
imagem são peças fundamentais para uma boa user experience, uma vez que são os
responsáveis pelo início da interação.
Mas, como trabalhar com gatilhos realmente eficientes?
## Gatilhos em UI
Se retomarmos a dúvida que tivemos antes, "Onde clico para curtir a imagem?",
notamos que o gatilho necessário neste momento é um que deixe evidente uma das
principais funcionalidades do app: Curtir.
Para resolver esta situação poderíamos simplesmente adicionar algum recurso que
orientasse nossa ação. No caso do Instagram, usam os famosos botões em forma de
ícone:
imagem, pressionar, arrastar**], e uma série de outras possibilidades.
**Contudo, não só de gatilhos manuais se faz a interação!**
Existe uma outra forma de facilitar a vida do usuário, fazendo com que o sistema
preveja algumas necessidades e antecipe a entrega de um gatilho para uma nova ação.
## Triggers de sistema
Os **[gatilhos de sistema]**, ou seja, gatilhos ativados automaticamente segundo

padrões pré-determinados são mais um tipo de trigger que podemos utilizar.
Para compreender melhor essa ideia temos um exemplo dentro do próprio Instagram:
imagem
Importante! Antes de mais nada, faça sempre protótipos dos seus projetos, tanto do
app como um todo, quanto das microinterações que possam ser desenvolvidas nesse
caminho. Na Alura, inclusive, temos um curso legal de [**Prototipação com Axure**]
para projetos mobile que poderá te ajudar muito nesse processo. ;)
Estava estudando algumas **funcionalidades do Scratch**. Por isso, resolvi criar um

jogo baseado no Fruit Ninja para testar meus conhecimentos. Nele, teremos alguns
balões voando pela tela e, quando o jogador clicar nos balões, eles estouram.
Vamos criar um novo projeto no Scratch. Então vamos adicionar nosso ator:
![]
Bacana! Já temos nosso balão na tela. Mas, quando iniciamos o jogo, ele não está
fazendo nada! Ele fica parado nesse canto da tela.
Quando o jogo começar, o balão tem que estar em baixo na tela, logo, vamos falar
para o nosso ator, ir para a posição `0` em **X** e `-400` em **Y**.
![]
Legal! Nosso balão já começa na posição inferior da tela e lá se mantém. Não é isso
que queremos. O que nós queremos é que nosso balão deslize de uma posição para
outra da tela.
Logo, vamos falar para o nosso ator para que, quando o jogo começar, ele vá para a
posição inicial e deslize até a posição `300` em **Y** por dois segundos:
![]
![]
Nosso balão já está deslizando pela tela, contudo, temos alguns problemas. Ele está
sempre surgindo no mesmo lugar e para quando chega ao final na tela. Bem, nós
podemos falar para ele sempre repetir esses comandos. Dessa forma, ele sempre que
ele chegar ao final da tela, voltará ao começo.
![]
![]
Resolvemos um problema. Mas ainda temos que fazer o balão surgir em outras posições
da tela. Atualmente, nosso balão aparece apenas no centro da tela, o que nós
queremos é falar para ele aparecer em qualquer posição aleatória do eixo `x`. Por
exemplo, entre a posição `-220` e `220`:
![]
![]
Bacana! Agora nosso balão começa sempre em um ponto diferente da tela. Porém, veja
que ele não segue em linha reta. Ele sempre começa em um ponto, mas vai sempre para
o mesmo ponto em `x`.
Isso acontece porque, quando pedimos para o nosso ator deslizar pela tela, falamos
para ele ir para a posição `0` no eixo **X**. Não queremos que o nosso balão faça
essas mudanças de percurso. Então, vamos falar para o nosso ator manter sua posição
**X**.
![]
![]
Show! Nosso balão está seguindo uma linha reta agora e sempre aparece na tela em
uma posição aleatória. Agora, temos que colocar o comportamento para estourá-los.
## Estourando os balões
No nosso jogo, quando um balão for clicado, este será estourado. Ou seja, o que
acontecerá, de fato, é quando clicarmos no balão ele trocará sua fantasia para uma
de balão estourado.
Então, vamos adicionar mais uma fantasia para o nosso ator, dessa vez uma fantasia
de um balão estourado:
![]
Nosso ator já possui a segunda fantasia. Vamos falar para ele que quando ele for
clicado mude a sua fantasia para a próxima:
![]
![]
Conseguimos estourar o balão. Mas ele continuou na tela após ser estourado e, não
só isso, ele continuou estourado, mesmo após voltar ao começo da tela.
Temos que falar para o nosso ator que, quando ele voltar para o começo, mude também
a fantasia para a do balão inteiro:
![]
![]
Legal, quando clicamos no balão para estourá-lo mudamos sua fantasia e, quando ele
retorna ao começo da tela, muda novamente a fantasia.
Nosso jogo já está com um comportamento inicial bem legal, mas podemos melhorá-lo
um pouco escondendo o balão pouco tempo depois dele ser estourado:
![]
E dessa forma quando clicamos no ator, ele espera meio segundo e desaparece… e não
aparece mais. Se nós escondemos nosso ator, temos que pedir para ele aparecer
novamente. Podemos fazer isso falando para ele se mostrar após trocar a fantasia:
![]
![]
## Para saber mais
Já conseguimos um comportamento muito bacana para o nosso jogo. Mas podemos fazer
muito mais, podemos colocar um contador que mostra quantos balões foram estourados.
Podemos alterar o fundo do nosso jogo, e [adicionar mais balões] para deixar o jogo
mais dinâmico.
Além dos eventos de click, o Scratch no permite adicionar outros eventos para o
nosso ator, podemos falar para o ator executar uma ação quando determinada tecla
for precionada, quando receber uma mensagem, entre alguns outros.
O Scratch é uma ferramenta muito utilizada para ensinar lógica de programação em

muitos lugares do mundo. Com ele, conseguimos construir jogos, diálogos, animações
e tudo mais que nossa imaginação pedir.
Na [**Alura Start**] temos vários cursos que utilizam o Scratch. Neles são
ensinados desde como [**criar seu jogo de naves espaciais 2D**], até como criar um
[**jogo de cobrança de pênaltis**], e até como [**criptografar mensagens**].
Se você possui um e-commerce ou realiza vendas online, é fundamental que você tenha
um gateway de pagamento para fazer a ligação dos lojistas com as operadoras. Mas
isso só é válido se você realiza vendas pontuais. Se você quer vender através da
**recorrência** é interessante ler as opiniões do Rodrigo Dantas, CEO da [Vindi] e
com quem gravo o podcast do Like a Boss.
**Paulo Silveira**: Qual é a diferença de um gateway de pagamento e uma plataforma

de pagamentos?
**Rodrigo Dantas**: Os gateways atuam online da mesma forma que as maquininhas

funcionam nas lojas. Por isso, sua entrega acaba se tornando um tanto limitada
quando o assunto é a venda recorrente. Eu explico mais sobre o [funcionamento de
gateways nesse artigo].
Sim, gateways como Braspag e Adyen são ótimos para transações, para emissão de nota
fiscal automatizada e são bem flexíveis na hora de contratar uma adquirente. Mas,
para a cobrança de planos e mensalidades, alguns recursos a mais podem te ajudar.
Os gateways de pagamento transmitem a informação para as adquirentes e as

bandeiras, como Vista e Master. Eles também são os responsáveis por notificar a
empresa se houve aprovação ou não de um pagamento. Já as plataformas de pagamento
são as responsáveis por gerenciar os planos e assinaturas. Ou seja, qualquer
pagamento recorrente. Através delas é possível estabelecer alguns pontos da
cobrança, como vigência e reajuste dos planos, renovação, tarifas, descontos,
frequência das cobranças e muito mais.
Ou seja, com uma [plataforma de pagamento recorrente como a Vindi] você consegue
personalizar as cobranças do jeito que você quiser. Já com os gateways clássicos
isso não é possível.
**Paulo Silveira**: Quando preciso mudar o preço de uma mensalidade, qual é a

facilidade?
**Rodrigo Dantas**: Neste quesito, nem há muito o que ser falado. Os gateways só
conseguem trabalhar com um valor fechado no carrinho, não permitindo a mudança de
valores para planos ou acréscimos de up-selling ou cross-selling.
Mas, com uma plataforma de pagamento, as coisas são bem diferentes! Nela, o preço
do plano ou serviço pode sofrer alterações de valores ou ser fixo. Você pode
personalizar os valores de acordo com o volume ou por faixas de uso dos seus
clientes.
**Paulo Silveira**: A taxa de rejeição pode ser menor com uma plataforma de
pagamentos?
**Rodrigo Dantas**: Os gateways só podem fazer uma única coisa para o seu negócio
quando o assunto é redução de inadimplência. O roteamento de adquirentes. Quando
uma transação não é aprovada, eles trocam a operadora do cartão. Já é um avanço,
mas podemos fazer mais.
Se você escolher uma plataforma para oferecer o pagamento recorrente para os seus
clientes, a coisa muda de figura. É possível criar alertas de boletos não lidos,
além do seu reenvio um dia antes do vencimento. Você também pode atualizar as
multas e juros automaticamente, além de ativar notificações por e-mail e SMS.
Também existem ferramentas de renovação de cartão, que fazem a renovação automática
dos dados do cartão de crédito ou a retentativa simples, que efetua a cobrança 3
dias depois do pagamento não ter sido identificado. Essas ações são essenciais para
melhorar o [churn rate] (o índice de retenção).
# Modelo Saas e subscription
Nesse vídeo conversamos sobre o modelo SaaS e recorrência, e toda a economia de

assinatura e subscriptions:
https://www.youtube.com/watch?
v=Raws1GcCR4Q&list=PLh2Y_pKOa4Ufs_KwjTdGBFH6b65ChApyD&index=19&t=0s
imagem
Quero criar um jogo no **Scratch** com o objetivo de pular os zumbis que passam e
ir ganhando pontos. Podemos ver o projeto sem o pulo do personagem neste [link].
Porém, não queremos um pulo qualquer. Queremos um pulo com efeito da gravidade. No
Scratch, não existe um efeito da gravidade padrão ou já implementado, assim como em
outras linguagens como Unity, Godot ou Construct. Porém isso não significa que não
podemos criar nosso próprio código da gravidade!
Para começar, vamos atribuir um valor à força que a gravidade fará sobre o nosso
personagem. Como a gravidade leva nosso ator para baixo, seu valor deve ser
negativo. Com o código `mude gravidade para`, vamos atribuir o valor `-2`.
![]
Para deixar a gravidade parecida com a realidade, quando o personagem pular,

conforme ele vai caindo, afinal a gravidade é uma aceleração, a velocidade varia.
Precisamos criar mais uma variável chamada `velocidade`, e podemos mudar seu valor
para `0`, sempre que o jogo ligar.
![]
Agora precisamos fazer nosso ator pular. No bloco de código que movimenta o
personagem, vamos verificar `se` a tecla èspaço` está pressionada. Para não deixar
o código que verifica as teclas pressionadas junto com o código que faz nosso
personagem pular, podemos dividir as funções para manter o código organizado
criando em **Mais blocos**, um novo chamado `pular`.
![]

No bloco pular, vamos mudar o valor da `velocidade`, para representar o tamanho do
pulo do personagem. Vamos mudar para `25` por exemplo.
![]
Como a força da gravidade nunca para, vamos incluir um código `sempre` e àdicionar
a y` o valor da variável `velocidade` e adicionar na `velocidade` o valor da
`gravidade`.
![]
Vamos testar apertando a tecla espaço e ver o pulo do nosso ator?
![]
O personagem pulou, vimos a ação da gravidade, porém, ele passou o chão!
Precisamos fazer nosso personagem parar quanto tocar no chão. Para isso, vamos
verificar `se` o personagem está tocando o `chão`. Se estiver, nós `paramos esse
script`.
![]
Vamos testar agora o pulo do personagem?
![]
**Agora ficou bem legal!**
Portanto, vimos uma forma de implementar a gravidade em um jogo, utilizando o

Scratch.
E ai, o que achou?
Você gostou do Scratch? Na [**Alura Start temos diversos cursos que usam o Scratch
como ferramenta de desenvolvimento**].
Lá você aprenderá como criar vários jogos usando a plataforma.
Você pode encontrar este projeto com a gravidade, clicando neste [link].
imagem
Durante os 5 anos da sua existência, a Alura se tornou uma referência da educação
online em tecnologia no Brasil. Todo o time está com muito orgulho de poder ajudar
a transformar as carreiras de muitos e muitas profissionais através do
conhecimento, e sempre buscamos trazer aprendizados novos de acordo com o mercado.
Contudo, aqui na Alura não nos atentamos apenas aos sucessos individuais. Também
queremos estar presentes nas empresas e **fazer parte do crescimento das equipes**.
## Como ter sucesso nos treinamentos online na sua empresa
Já tivemos alguns cases de sucesso com os treinamentos corporativos e por isso

decidimos montar um modelo replicável que contenha os fundamentos necessários para
que **as empresas extraiam o máximo da educação corporativa à distância**.
O resultado é a **Jornada Alura de Educação Corporativa,** que visa acompanhar

passo a passo a aprendizagem dos times, trazendo ações específicas a serem
completadas e assim tornar a capacitação uma base estratégica do negócio.
A metodologia que acabamos de lançar é baseada na _Metodologia dos 6D_, que é uma
referência em educação corporativa. Entretanto, ao mesmo tempo, ela não deixa de
**ser inspirada nas empresas que já tiveram resultados com a gente**.
## Apresentando a Jornada Alura de Educação Corporativa
Em nossa visão, os pilares para as ações da capacitação corporativa bem-sucedida

são: foco em resultados para a empresa e o seu desenvolvimento, apoio dos líderes,
engajamento dos participantes e diagnóstico da entrega prática.
imagem assunto(s) escolhido(s).
Por último, nesta fase divulgaremos o futuro treinamento para a equipe.
imagem**.
Para termos uma imagem completa sobre as vantagens que a capacitação na empresa
trouxe, devemos também enfatizar aqueles **benefícios que costumam não ser
facilmente convertidos em resultados comerciais mas que ainda assim têm um grande
impacto no negócio**, ou _ativos intangíveis_.
Entre eles, estão, por exemplo, um maior engajamento dos funcionários,

reconhecimento do mercado e da comunidade profissional ou redução das queixas dos
clientes.
![Treinamentos corporativos Alura Fase 3]
### Pontos de ação para a conclusão da Fase 3:
3.1 **Primeiras aplicações do conhecimento**
3.2 **Diagnóstico de entrega prática**
3.3 **Mensuração do impacto no negócio**
## Fase 4: Multiplicação do conhecimento
Chegamos à fase final, que, na realidade, é **o começo de uma aprendizagem contínua
na empresa**.
Com a primeira multiplicação, a empresa incentiva a criação de uma cultura forte de
aprendizado, que é um dos requisitos para o crescimento das pessoas e,
consequentemente, do negócio como um todo.
A próxima missão da empresa é **planejar futuras capacitações da equipe**, pensando

em novos projetos, novas oportunidades e novas pessoas chegando à equipe.
Em outras palavras, **o desenvolvimento das pessoas deve ser uma ação recorrente**,
sempre interligada aos resultados comerciais esperados.
![Treinamentos corporativos Alura Fase 4]
### Pontos de ação para a conclusão da Fase 4:
4.1 **Mapeamento de multiplicadores**
4.2 **Primeira ação de multiplicação**
## E agora… Que tal criar um plano de treinamentos para a sua empresa?
Demonstramos uma estrutura sistemática para escalar passo a passo as fases

primordiais em um treinamento corporativo, convertendo-o numa função
**estratégica** que consegue **gerar vantagem competitiva** no mercado.
Queremos sempre estar **estar o mais próximo dos nossos clientes**, por isso a
nossa equipe de _Customer success_ acompanha o avanço nas fases da metodologia,
norteando o caminho dos resultados específicos para cada empresa.
**E agora fica com você**: se você pensa em aplicar um conceito de treinamento
corporativo de alto impacto nas metas do negócio, veja o [**Guia completo da
Jornada Alura de Educação Corporativa**], em que explicamos todos os pontos de ação
de forma detalhada.
imagem
Um recurso que nos permite "dizer" aos elementos onde queremos que eles fiquem,
qual vai ser o tamanho deles, quanto de espaçamento vai existir, criar "lacunas" ou
"buracos" que serão preenchidos por nossas tags HTML. Com CSS Grid Layout é
exatamente isso que conseguimos.
Imagine que um amigo, chegou em você e disse:
> Eu preciso criar um layout com um cabeçalho, um menu lateral, o conteúdo

principal e um rodapé
Se você está acostumado a criar páginas HTML5 com CSS3 já deve ter imaginado toda a
estrutura, algo parecido com:
html
Até ai tudo bem, certo? Certo. Montar a estrutura das tags é a parte mais fácil...
Porém,agora precisamos posiciona-las da seguinte maneira:
- Header: Em cima da página

- Aside: Na parte esquerda da página
- Main: Na parte direita da página
- Footer: Em baixo da página
Com isso iremos ter a seguinte estrutura:
imagem ou _column_(coluna) devem ter, precisamos também dizer ao nosso template:
css
Repare novamente que tanto nossas columns ou rows, estão sendo informadas três
vezes, isso porque temos um _layout_ de três colunas e três linhas, veja também que
apenas para a segunda linha declaramos o valor `100vh` que corresponde a altura
total da _[**viewport**]_, as demais linhas serão automáticas.
Por padrão, o valor será àuto`, mas apenas descrevi para você saber que pode estar
mudando. Para saber quais valores podem ser setados, consulte a documentação:
[**grid-template-columns**] e [**grid-template-rows**].
Com isso, devemos ter o seguinte resultado:
<iframe src="//jsfiddle.net/mahenrique94/L90zmunL/5/embedded/result,html,css/"
width="100%" height="300" frameborder="0"
allowfullscreen="allowfullscreen"></iframe>
Bem próximo relacionado à necessidade de nosso amigo.
### Dando os toques finais
Para sanar a necessidade de nosso amigo e entregar o _layout_ para ele, vou fazer
apenas algumas melhorias no design:
<iframe src="//jsfiddle.net/mahenrique94/L90zmunL/6/embedded/result,html,css/"
width="100%" height="300" frameborder="0"
allowfullscreen="allowfullscreen"></iframe>
Pronto, agora já podemos realizar a entrega do projeto. Caso tenha necessidade, o

projeto pode ser baixado [aqui].
Conheça também a [**Formação Front End**] da **Alura** e entenda um pouco mais a

fundo desse mundo do Front End. :)
Precisei virtualizar dois sites diretamente de um servidor Apache, atualmente temos

a seguinte arquitetura nos servidores:
imagem, por exemplo, ele se chama [Virtual Hosts].
## Entendendo os Virtual Hosts
Os hosts virtuais funcionam dessa maneira:
- Um computador faz a requisição para acessar um site pelo seu nome de domínio;
- Esse pedido chega ao nosso servidor web que encaminha para o host virtual da
requisição, podendo ser uma pasta ou outro servidor:
imagem e escutará na porta que é o padrão para websites (`80`), portanto ,antes da
última linha do arquivo, vamos escrever o seguinte trecho:
bash
Também é preciso informar a pasta onde estarão os arquivos do nosso site. Vamos
listar (`ls`) nossas pastas e saber quais temos disponíveis:
`# ls`
imagem, isto é, onde se localizam nossos arquivos, seguido do caminho até o

diretório:
bash
Vamos dizer agora qual é o domínio do nosso site, ou seja, o nome do servidor
(`ServerName`)
bash
Por fim, para que o Apache consiga ver os arquivos em nossa pasta, vamos dar a ele
todas as permissões. Informaremos então nosso diretório e o caminho até ele
(`<Directory "/www/acmetoon.com.br">`), em seguida, indicaremos que ele pode ler
todos os arquivos **(`Require all granted`)**:
bash
O site da AcmeToon está configurado. Vamos então atualizar as instruções do Apache

para que ele reconheça nossas configurações. Para isso, vamos restartar o serviço,
o comando **àpachectl restart`** faz isso para a gente:
imagem que funcionará apenas para o blog da AcmeToon. Nossos hosts virtuais também
podem ser utilizados para criar subdomínios.
A configuração seguirá o padrão das configurações anteriores, também teremos uma

pasta para especificar esse website:
imagem será `blog.acmetoon.com.br`, também daremos ao Apache a permissão de acessá-

la.A configuração completa fica assim:
bash
Vamos tentar acessar o blog agora e ver se está funcionando nossa configuração:
imagem, o que resolve muitos problemas.
## Pontos de atenção
Estamos fazendo a configuração como superusuário, por isso **cuidado** para não
executar um comando indevido e causar problemas no sistema.
Vale lembrar também que para nosso sites ficarem no ar, precisamos registrar os
nomes em um [DNS].
## Conclusão
Inicialmente estávamos com o problema de hospedar mais de um site no mesmo

servidor. Vimos como podemos fazer isso utilizando hosts virtuais. Também,
entendemos como é possível realizar a configuração de subdomínios dentro do
servidor.
Além disso, conhecemos que uma possibilidade seria a virtualização do servidor do

próprio servidor. Mas nesse caso ela não seria muito viável, já que teríamos que
dar manutenção replicada em ambas as virtualizações.
Contudo, a virtualização é muito utilizada em hospedagem, devido a alguns

benefícios de economia de energia, pelo fato de existir apenas uma máquina física.
E aí, o que achou? Conhecia essas técnicas? Conhece outras? Compartilhe conosco nos
comentários.
Gosta da parte de servidores? Essa é só uma pequena parte do mundo de

infraestrutura. Aqui na **Alura** temos uma [formação completa] em redes. Nela você
aprenderá sobre protocolos de redes, **VLans**, segurança e muito mais!
imagem
Talvez até conheça alguém que tenha sido. O fato é que essa técnica, chamada de
phishing,ainda é uma das mais efetivas maneiras de se conseguir acesso a
informações sensíveis.
Recentemente, recebi um email estranho, **supostamente** da equipe de suporte do

[**Paypal**]. Como sempre, abri o email no celular. O email dizia que o endereço de
entrega principal da minha conta havia sido alterado para um na África do Sul!
Obviamente, fiquei espantado.
imagem que visa obter dados secretos e pessoais de alguém, se passando por uma
personalidade ou entidade confiável.
Tentativas de _phishing_ podem ser feitas desde chamadas telefônicas, ao mais

comum, que são os emails e sites falsos. Tais sites podem ter uma aparência
idêntica ao site real (como foi o caso do Paypal, comigo) e mesmo assim serem
fraudulentos!
Mas se as coisas podem ser tão parecidas, como podemos evitar cair nesse golpe?
Afinal, como foi que eu percebi que estava sendo enganado?
## Desvendando as tentativas de phishing
Apesar de todas as similaridades que uma tentativa de _phishing_ possa ter com
alguma plataforma real, ainda há alguns sinais que podemos prestar atenção para
evitar o comprometimento de nossos dados com esse golpe.
Pensando no exemplo do email que eu recebi, o que podemos fazer? Aparentemente,

está tudo certo. O padrão de escrita do email parece verídico e a interface do site
é correta. E agora?
### O remetente do email
A primeira informação que devemos checar é a mais óbvia - quem foi que nos enviou o
email? No nome apareceu **Paypal Support**, mas e o endereço de email? Chequei, e o
que aparecia era `service-team121@outlook.com`. Dei uma pesquisada e descobri que
esse endereço nem ao menos é do Paypal! Normalmente, os do Paypal terminam com
`@paypal.com.br` ou `@mail.paypal.com.br`.
De cara, então, descobrimos que o email era falso. Mas então é isso? Basta o
endereço remetente ser oficial, como `service@paypal.com.br`, que podemos confiar?
Infelizmente, não é bem assim…
Através da técnica de **_[email spoofing]_**, alguém pode facilmente abusar das

características do protocolo de email **[SMTP]** para alterar, isto é, falsificar,
o remetente de um email. Ou seja, com algumas ferramentas, ou um pouquinho de
código, nós mesmos podemos mandar um email com o endereço remetente marcado de
`phishing@paypal.com`, ou qualquer outra coisa.
Desse modo, apesar de muitas vezes ser importante verificar o remetente do email
(como foi em meu caso), ele não é garantia de nada. Quais outras características de
todo esse processo podemos tomar como base para tirar uma conclusão?
### O corpo do email
Logo quando vi o email, concluí que o texto nele contido parecia legítimo, como um
desses enviados automaticamente pelas empresas. Será que essa análise foi correta?
Que indícios de fraude podemos obter do corpo do email?
Com um olhar mais atento, podemos procurar por algumas características incomuns
quando se tratam de emails enviados por empresas ou instituições.
Um exemplo são anexos inesperados - empresas não costumam enviar dados por anexo,
afinal para que precisaríamos disso?! Claro, às vezes de fato esperamos por um
anexo, quando for o padrão usado sempre, como com boletos e recibos, mas são casos
mais específicos. O maior problema dos arquivos anexados é que eles podem conter
algum _malware_ escondido.
Outro ponto a se observar é o caráter de urgência do email. Tudo bem, urgência não
significa mentira, mas emails com mensagens muito estranhas, exigindo alguma ação
do usuário, são bastante suspeitos. Um email com marcação de **prioridade alta**,
ou **importante**, também é fora do comum, sendo assim recomendável fazer mais
algumas verificações.
Mas e além desses pontos mais genéricos, o que podemos saber?
### Identificando características do email mais específicas do serviço
Para essa investigação, precisamos de alguma base. Afinal, como vamos saber se o
corpo do email condiz com o verdadeiro, se nem sabemos as características dos
emails verdadeiros?
Se estivermos com paciência, podemos verificar emails anteriores do suposto

remetente, para analisarmos as semelhanças e as diferenças, o que poderia ser
(bastante) cansativo. Alguns sites, [como é o caso do Paypal], listam algumas
características básicas dos emails que enviam, para ajudar na identificação.
No caso do Paypal, uma característica interessante de se prestar atenção está nos

cumprimentos. O email que recebi começava com "_Dear **<meu@email>**_", mas o
Paypal deixa claro que seus emails nunca terão esse tipo de tratamento genérico, e
sempre se referirão ao usuário pelo nome.
Mas e se eu ainda ficar em dúvida? A partir daí, a melhor solução é contatar a

empresa pelos meios oficiais e perguntar diretamente a eles. O Paypal pede para
que, caso isso aconteça, encaminhemos o email para o endereço
[alerta@paypal.com.br](mailto:alerta@paypal.com.br).
Já temos uma boa base para conseguirmos desvendar tentativas de _phishing_, mas o
que mais podemos analisar? No nosso caso, tivemos um email base e, a partir dele,
já conseguimos descobrir toda a fraude. Às vezes, porém, o que chega na gente é
ainda mais convincente, e quase sempre acompanha um link que nos levará para um
site falso. Como devemos agir frente a esses links?
### O link de recuperação da conta
Na pior das hipóteses, vamos acabar encarando o link que nos foi mandado. Mas não
precisamos nos apressar! Vamos com calma, para ver o que conseguimos descobrir
antes de entrar de fato nele.
Em primeiro lugar, qual é a URI do link? Isto é, para que site ele nos leva? Dei
uma olhada e a URI era uma daquelas encurtadas, ao estilo `linkcur.to/AbCdE`. Links
encurtados, nesse caso, são bastante suspeitos, afinal não fazem muito sentido - a
URI não estava exposta, não havia o porquê disso. É muito mais comum, em emails, as
empresas usarem suas próprias URIs completas.
### O destino verdadeiro do link
Fiquei com um pouco de receio de enfim acessar o link, por causa disso. Decidi,
então, usar [**um serviço de "desencurtador" de links**] para descobrir para onde a
URI encurtada levava. Outra surpresa, o destino era
`securepaypal.login.paypal.com.websebwebseb.xyz/signin`. Espera… o quê? Que coisa
confusa é essa?
A URI verdadeira até continha `paypal.com` no meio dela, mas tinha outro monte de
coisa junto. Por um lado, parece do Paypal, por outro, é bastante confusa. O que
acontece é que a URI tenta nos enganar - na verdade, se pararmos para analisar, o
domínio desse site é apenas `websebwebseb.xyz`, e `securepaypal.login.paypal.com`
são, de fato, somente subdomínios dentro do site!
Só por curiosidade, dei uma pesquisada e concluí o que já esperava - esse domínio
não tem nenhuma relação com o Paypal, que era o que alegava! Com todas essas
evidências que juntamos, podemos afirmar com convicção que isso tudo era uma
tentativa de _phishing_.
Note que, afinal, nem precisamos acessar o site para verificar a veracidade disso
tudo, como eu fiz inicialmente. Isso é bom, pois esse tipo de site pode usar de
algumas técnicas de JavaScript, por exemplo, para nos enganar ainda mais.
No nosso caso, conseguimos tirar uma conclusão com clareza. Entretanto, sabemos que
nem sempre isso vai acontecer. É importante lembrarmos que podemos (e devemos) nos
comunicar com o determinado serviço, caso a dúvida se mantenha. Desse modo, e com
essas dicas, conseguimos uma navegação muito mais segura!
## Na dúvida, desconfie
Hoje em dia, somos bombardeados com tentativas de _phishing_ a todo o instante. São
sites estranhos, emails suspeitos e até mensagens no celular que não reconhecemos.
Às vezes parece até bobo, mas pelo contrário, é perigoso. A curiosidade pode não
ter matado o gato, mas pode comprometer seus dados sensíveis em um piscar de olhos.
De qualquer jeito, a dúvida sempre fica - quando devemos confiar?
Com as dicas que aprendemos nesse post, fica bem mais fácil identificar por conta
própria se estamos frente a uma tentativa de golpe. Analisamos desde o email em si,
até o link e o site, traçando os aspectos suspeitos para, enfim, conseguirmos
chegar em uma conclusão.
Vimos o quão importante pode ser desconfiar, e como é mais importante ainda quebrar
essa desconfiança, investigando. Uma saída mais simples para esses casos pode ser,
simplesmente, perguntar diretamente para os responsáveis oficiais de determinado
serviço se aquele site, ou aquela mensagem, é verdadeira. Além de poupar trabalho
nosso, nos dá uma garantia de veracidade, o que é ótimo!
Depois de tudo, podemos, em vez de paranoicos (o que não devemos ficar!), nos
sentir mais seguros, sabendo que agora nós mesmos somos capazes, até certo ponto,
de identificar mensagens e sites maliciosos!
E aí, o que achou das dicas do post de hoje? Deixe um comentário aqui com a sua
opinião! Se quiser conhecer mais das tecnicidades da área de segurança da
informação, que tal dar uma olhada em nossa [**Formação em Segurança de
Aplicações**], lá na **Alura**?
Uma das funcionalidades mais interessantes que implementamos no Alura foi a

possibilidade do próprio aluno enviar a correção de um erro nas explicações, afinal
mesmo com diversas fases de revisão, alguns errinhos passam.
Os principais problemas reportados eram pequenos como _typos_ ou erros simples de

gramática, o que demandava um trabalho extra de abrir o painel de administração,
procurar pelo curso, pela seção e ai sim editar o erro. Mesmo sendo algo simples,
acabava por quebrar o fluxo de trabalho do dia-a-dia de toda a equipe.
Sempre preferimos a abordagem do aluno participar da construção do aprendizado,

seja através do forum de discussões ou da sugestão de cursos, nada mais justo do
que o aluno possa participar também deste ponto de maneira mais simples.
Nossa preocupação inicial foi como implementar o front-end, principalmente do lado

do administrador/moderador, que deveria ver de forma clara e rápida o que foi
editado:
imagem, pois assim poderíamos customizar o que fosse necessário, sem ter que
mergulhar em centenas de linhas de código.
Repare que seu uso é bem básico, você fornece o texto original, o texto modificado
e o local onde deve ser gerada o elemento que mostra a diferença:
javascript
Agora é só indicar onde a diferença deve aparecer:
javascript
Algo simples, mas que tem nos ajudado bastante, nas duas primeiras semanas, tivemos
mais de setenta sugestões!
O usuário que mais contribuiu foi o [Lucas Felix Sampaio], um de nossos

moderadores.
Em segundo lugar temos o [Filipe] e o [Guilherme Sodre]
E que em 2016 venham mais sugestões de correção de typos, assim nos sentimos mais
seguros de que nosso produto melhora todo dia, desde a qualidade dos vídeos, a
didática que usamos, e o texto de explicação e exercícios que compartilhamos. Cada
dia que passa, melhor do que o anterior.
Considerando uma tabela de dados Àlunos`, com campo `nome` e campo èmpresa`, somo
trazer quem não preencheu o campo èmpresa`? Uma das soluções é procurar pela
string vazia:
sql
Mas eu sei que tenho mais de 1000 alunos que ainda não preencheram este campo, onde
estão eles?
sql
O que acontece que alguns alunos estão em branco, outros estão nulos?
Muito cuidado quando criar suas tabelas. Em geral fazemos como com qualquer
linguagem de programação: definimos uma variável e não damos valor padrão a ela.
Isso acontece direto em orientação a objetos, definimos variáveis membro sem valor
padrão. Resultado?
Algumas pessoas não editaram o perfil, e continuam com o valor padrão do

banco(`NULL`). Outras editaram mas não preencheram e estão agora com valor em
branco. E agora toda query que você vai fazer na tua vida você tem que verificar:
sql
Pior ainda, além do fato que já vimos que o ÒR` é um horror na Terra, temos que
lembrar de colocar ele entre parenteses pra não dar um resultado errado:
sql
Usa o valor padrão. Usa o default e pare de se preocupar:
sql
Agora sim você tem certeza que todas as queries só precisam verificar por valores
vazios. A chance de errar? Bem menor!
**Estudando! Rá!**
Meio óbvio, né? Porém, qual foi a sacada para o meu aprendizado? Bora desvendar o
mistério :)
## Estudar um pouco todos os dias
Estudar um pouco todos os dias é cientificamente comprovado como eficaz. Faço isso
todos os dias da minha vida. Se está gostando de aprender assim, junte-se a mim
também na lista do expert Sérgio Lopes sobre [**boas práticas de Javascript**].
Seja um de nós.
## Faça cursos
Você já começou com essas boas práticas, mas não deixe de fazer cursos, claro :)
Criei [**mais de 50 cursos na Alura**], e **já assisti literalmente mais de 150**.

Haja estudo!
30 minutos por dia é uma meta animal!
## Discuta as práticas com seus amigos
Questionar e ser questionado faz parte do aprendizado. Manda um whatsapp para um

amigo agora. Isso agora. Fala "nunca mais vou usar stored procedure". Ou "se lembra
aquele delete que eu fiz ano passado?". Puxa o assunto! [Me conta o que aconteceu]?
E aí, mandou? [Já mandei pro meu irmão], estou esperando a resposta dele.
Hoje em dia as animações nos websites vão muito além de simples detalhes, algumas
marcas tem nas animações sua marca registrada, tal como o próprio Google após o seu
último rebrand.
imagem on <a href='https://codepen.io'>CodePen</a>.

</iframe>
Na prática o `transition` pode ser aplicado para todos os valores que mudam entre
os estilos padrões de um elemento e alguma variação aplicada seja via alguma ação
de pseudo seletor (:hover e :focus) ou algum atributo ou classe que seja adicionada
em uma tag e exista um seletor CSS aplicando alguma variação de estilo.
> Somente valores quantificáveis podem ser animados. Isso quer dizer que não é
possível fazer uma animação de display indo de none para block, mas sim de opacity
de 0 para 1;
Focando na ideia de que Animações são trocas de estados onde podemos visualizar
como algo foi de um ponto A para um ponto B, animar o background é só uma
possibilidade, podemos manipular a largura e altura dos elementos, sua posição na
página e uma propriedade que casa super bem com o transition é o `transform`.
Como o [transform] pode aplicar diferentes comportamentos a um elemento como mudar

sua escala, alterar sua posição na página ou mesmo aplicar uma distorção com
`skew()` isso abre todo um leque de possibilidades.
<iframe height="265" style="width: 100%;" scrolling="no" title="Transition: Exemplo

2" src="https://codepen.io/omariosouto/embed/jOOLKxO?height=265&theme-id=0&default-
tab=css,result" frameborder="no" allowtransparency="true" allowfullscreen="true">
See the Pen <a href='https://codepen.io/omariosouto/pen/jOOLKxO'>Transition:
Exemplo 2</a> by Mario Souto
</iframe>
## Formas comuns de utilizar o transition:
- `transition: 1s;`: aplica uma animação de 1 segundo para TODAS as propriedades de

um seletor, é importante específicar quais propriedades vão ser animadas para
evitar alguns gargalos de performance ou propriedades desnecessárias consumindo
recursos em animações (que normalmente podem exigir bastante de computadores de
usuários com hardwares menos potentes).
- `transition: transform 1s, opacity 0.3s;`: Aplica uma animação de 1 segundo para
a propriedade transform, e uma de 0.3 segundos para o opacity. Todas as outras
propriedades não são afetadas.
- Também é possível especificar um delay para o transition com `transition-delay`,
tal como específicar a duração e as propriedades via propriedades separadas, no dia
a dia acabamos utilizando a forma dos exemplos anteriores, mas [deixo a dica para
você olhar na MDN como trabalhar com essas variações]
# Animation: Animando automaticamente e com mais etapas
Como vimos anteriormente, para animarmos algo com transition, dependemos de alguma
ação do usuário agora e se quisermos algo nesse estilo?
<iframe height="265" style="width: 100%;" scrolling="no" title="Animation: Exemplo

1" src="https://codepen.io/omariosouto/embed/XWWaBPY?height=265&theme-id=0&default-
tab=result" frameborder="no" allowtransparency="true" allowfullscreen="true">
See the Pen <a href='https://codepen.io/omariosouto/pen/XWWaBPY'>Animation:
</iframe>
Repare que a animação está acontecendo sozinha de forma contínua, bem semelhante a
alguns itens que existem para chamar a atenção como setas indicando que algum ponto
é clicável em alguns sites. Para isso ser possível estamos utilizando a propriedae
ànimation`.
Para entendermos como fazer a animação do exemplo, precisamos primeiramente

entender a ideia de trabalhar com `keyframes`. Basicamente iremos definir que dado
um espaço de tempo entre o começo e o fim do mesmo determinadas propriedades CSS
serão aplicadas.
css
E para associarr esses keyframes em um elemento do HTML, precisamos adicionar essa

animação `go-back`, ou qualquer outra, através da propriedade animation:
css
<iframe height="265" style="width: 100%;" scrolling="no" title="Animation: Exemplo

2" src="https://codepen.io/omariosouto/embed/zYYdLem?height=265&theme-id=0&default-
tab=result" frameborder="no" allowtransparency="true" allowfullscreen="true">
See the Pen <a href='https://codepen.io/omariosouto/pen/zYYdLem'>Animation:
</iframe>
Porém dessa forma a animação só acontece uma vez, caso tenhamos interesse em fazê-
la acontecer de forma infinita podemos adicionar a propriedade ànimation-
iteration-count: infinite;` ao invés de infinite, podemos passar um número máximo
de vezes que nossa animação irá se repetir, e caso você queria fazer a animação ir
e voltar do ponto final para o começo e vice-versa é só adicionar a propriedade
ànimation-direction: alternate;`.
# Dicas de animações comuns em sites:
## Bounce
css
- FadeIn:
css
## Interceptando animations e transitions via JavaScript
Como vimos anteriormente, é possível ter vários níveis de controle nas animações
com CSS, porém caso você queria ter um controle mais fino via JavaScript via um
èlemento.addEventListener` é possível monitorar quanto uma transition ou um
animation termina:
- https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/animationend_event
- https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/transitionend_event
## Melhorando a performance de animações com CSS
Esse post é mais introdutório, mas ainda sim acho válido citar que trabalhar com
performance em animações pode exigir um pouco de conhecimento de [como o browser
funciona](youtube.com/watch?v=kDy62zaCHZE), e um pouco de como o [CSS funciona nos
navegadores].
Já adianto que existe uma propriedade que pode fazer milagres em alguns casos para
melhorar performance de animações, mas que deve ser usado somente em último caso:
- [will-change]
E se você quiser ter uma [introdução mais profunda do tema de performance em

animações, confere essa talk do Sérgio Lopes].
> Caso você encontre alguma animação que realmente esteja prejudicando a
experiência de usuários em devices menos potentes, você pode desabilitá-la
utilizando o [@prefers-reduce-motion]
## Libs extras
- [animate.css]: Essa provavelmente foi a lib que mais me ajudou na época de

agência e o mais legal é que existem ports dela para trabalhar com os frameworks da
moda via componentes e é uma forma bem legal tanto de fazer algo ficar animado bem
rápido ou de abrir o código fonte e aprender [como algumas animações são feitas
como por exemplo o bounceIn]
- [Tweenmax - Greensock]: Caso você queira fazer algo que possua um controle mais
fino de o que é animado em cada tempo ou de acordo com X alteração do usuário a
melhor alternativa é correr para uma lib que ti ajude a preparar essas "cenas". O
Tweenmax é uma ótima pedida, só deixo um ponto de observação pois ela possui
algumas restrições de uso gratuito.
- [Lottie do Airbnb]: Essa é a lib do momento, aquela [animação do logo do google
que citei no começo do vídeo, você pode aprender a fazer nesse alura mais],
utilizar o plugin para premiere e exportar para utilizar na web, mas isso podemos
abordar em um outro artigo.
Por hoje é isso,espero que tenha gostado, em breve trarei mais dicas, não deixe de
me seguir nas minhas redes sociais e acompanhar meus outros artigos em meu site
pessoal https://mariosouto.com. E você pode achar muito conteúdo nos nossos cursos
de [html e css] e de [bootstrap].
Estamos desenvolvendo um sistema web para venda de automóveis usados. Uma das
informações necessárias para cadastrar um automóvel no sistema é o número da placa
do veículo.
Precisamos criar uma funcionalidade que valide as placas do carro, para que os
usuários não saiam enviando para o servidor dados incorretos. Uma placa de carro
válida por exemplo seria "FXZ-9846" e uma inválida “FX4-Z432”. Para fazer tal
validação precisamos seguir algumas regras, sendo elas:
- Número de caracteres tem que ser igual a 7

- Os 3 primeiros caracteres são letras
- Os 4 últimos caracteres são dígitos
## Validando a placa
Primeiro, criaremos um método que recebe uma placa e devolve um `boolean` para
fazer a verificação do que foi inserido.
java
Podemos colocar uma variável do tipo `boolean` que será nosso retorno após as
validações:
java
A primeira validação que vamos fazer será referente ao tamanho da `String`. O

número de caracteres de uma placa de carro deve ser igual a 7. Colocando essa regra
no código:
java
Os três primeiros caracteres tem que ser letras. Para validar isso vamos,
primeiramente, usar o método [**substring()**] da classe `String`. Este método cria
uma `String` contendo todos os valores desde o primeiro índice passado até o
segundo índice menos 1. No nosso caso vamos usar para pegar apenas os três
primeiros caracteres da nossa placa. Por enquanto temos isso:
java
Agora precisamos verificar se essa nova `String` contém apenas letras, para fazer
tal verificação vamos usar o método [**matches()**], também da classe `String`, e
passar uma expressão regular como parâmetro. Este método devolve um `boolean`. Ele
verifica se a `String` que chamou este método se equipara com o parâmetro passado.
No nosso caso, vamos passar a seguinte expressão regular `[A-Z]*`. Essa expressão
só permite as letras de A a Z e todas as letras tem que estar em maiúsculo.
Portanto, se a `String` conter algo diferente do que o permitido pela expressão
regular ele retornará `false`
Vamos usar o método `matches()` em conjunto com o `substring()` e encapsular dentro

de um ìf`:
java
Para finalizar essa validação, vamos negar essa condição, ou seja, só vai entrar no
ìf` caso o `matches()` retorne `false`, para que possamos alterar o valor de
`valido` para `false`:
java
Por fim, vamos usar exatamente os mesmos métodos, `substring()` e `matches()`, para
validar se os últimos quatro caracteres são dígitos.
A diferença será apenas nos parâmetros passados, para o `substring()` vamos passar
apenas o valor 3, com isso ele pegará o caractere da `String` com índice 3 e como
não passamos um valor final ele irá até o final da `String`.
Já para o `matches()`, vamos passar essa expressão regular: `[0-9]*`, ela só

permite números de 0 a 9. Assim, temos:
java
Pronto, todas as validações foram feitas, nosso método ficou assim:
java
Para testarmos, usaremos uma placa válida:
java
Como resultado, temos:
imagem**] da classe `String`, que, por sua vez, substitui todos os caracteres
passados no primeiro parâmetro pelos caracteres passados no segundo parâmetro.
No nosso caso vamos usar outra expressão regular, essa: `[â-zA-Z0-9]`. Com ela no
primeiro parâmetro do `replaceAll()` estamos dizendo que tudo que não for letra de
A a Z, seja maiuscula ou minuscula e não for número deve ser substituído. Mas
substituído pelo que? Bom, por nada, só queremos tirar esses caracteres da nossa
`String`. Usando esse método nosso código fica assim:
java
Vamos testar novamente usando a mesma placa, FXZ-4765:
![]
Pronto, agora funcionou do jeito que queriamos.
## Early Return
Só mais um detalhe, olhando nosso método perceba que não importa como venha a
placa, passamos por todos os ìfs`, isso não é muito legal. Por exemplo, se o
tamanho da placa for diferente de 7 eu quero que o método acabe aí e retorne
`false`, não tem motivo para passar pelas outras condições, a placa já é inválida.
Então é exatamente isso que vamos fazer. Se a placa for inválida vamos retornar
`false` logo de cara. Isso se chama [**early return**]. Vamos refatorar nosso
método usando essa técnica:
java
Pronto, fizemos nosso método de forma elegante e enxuta.
## Conclusão
Validar uma placa é uma tarefa simples, mas vários detalhes podem causar resultados
inesperados. Temos, sempre, que prevenir nosso código, pois quando interagimos com
o usuário, no nosso caso, recebendo informações vindas dele, não sabemos como o
dado chegará para nós.
Também percebemos que não é necessário passar pelo método todo para ter o resultado
esperado. Early return é uma boa prática de programação, pois impede que código
desnecessário seja executado.
Agora que conhecemos o early return me digam vocês. Quantas vezes vocês já se
depararam com códigos desnecessários sendo executados por não fazer uso de tal
técnica?
Para conhecer outras técnicas e mais sobre boas práticas no Java, você pode dar uma
olhada na [**Formação Java**] da **Alura**, lá você irá se deparar com vários
cursos a respeito da linguagem.
**O Adobe Illustrator é uma excelente ferramenta para edição de vetores, ideal para
produzir layouts com os mais diversos objetivos e complexidades. Impressão, web
design e criação de logotipos são apenas algumas das possibilidades que um designer
tem ao usar o Illustrator.**
Entretanto, como a maioria dos aplicativos da Adobe, ele tem um custo razoavelmente
alto e uma curva de aprendizagem que pode acabar desencorajando parte dos
iniciantes. Por isso, listamos aqui alguns dos principais aplicativos e softwares
para quem quer começar a mexer com gráficos vetoriais de maneira descomplicada e
por um custo bem menor ou completamente _free_.
## 1\. Inkscape
**Plataformas:** Windows, Linux e Mac
**Faixa de preço: **grátis
Um dos melhores softwares gratuitos como alternativa ao Illustrator é o Inkscape,

voltado para aqueles que precisam criar gráficos vetoriais, mas ainda não estão
prontos para investir num software do pacote Adobe.
Apresentando uma interface de usuário limpa, intuitiva, mas repleta de recursos

avançados (como misturas alpha, clonagem de objetos e um preciso rastreamento
bitmap) o [Inkscape] é uma alternativa completamente livre e altamente recomendada
para iniciantes.
Trabalhando principalmente com o formato aberto SVG, o Inkscape tem benefícios

exclusivos que a suíte da Adobe não consegue entregar: funciona no Linux e é
totalmente gratuito para baixar, utilizar e distribuir. Além disso, ocupa menos
espaço em seu computador e é consideravelmente mais rápido.
**Por oferecer suporte a diferentes modos de cores é uma alternativa viável para
execução de trabalhos comerciais, sejam eles de web design ou destinados a meios
impressos. Além disso, oferece recursos de importação nativa para arquivos do
Illustrator.**
## 2\. SVG Edit
**Plataformas:** online
Para trabalhar com arquivos SVG, temos algumas alternativas online que sequer
exigem a instalação de um programa em seu computador. Editores como o [SVG
Edit] funcionam direto no browser e tem arquitetura construída inteiramente em
HTML5, CSS3 e JavaScript.
Por se tratar de um software de código aberto, além de editar gráficos, é possível

fazer o download do seu código fonte e alterá-lo como quiser, criando sua própria
ferramenta de edição vetorial.
A velocidade é um dos grandes destaques desses software, que opera com um

desempenho superior ao de ferramentas instaladas localmente, usando a capacidade de
processamento da nuvem para lidar com a edição de gráficos.
## 3\. Serif DrawPlus
**Plataformas:** Windows
**Faixa de preço: **grátis na versão básica, ou $24.99 na versão _premium_
[O DrawPlus] é um aplicativo extremamente intuitivo e poderoso para edição de

gráficos vetoriais. Em sua versão gratuita, integra uma série de ferramentas que
espelham as principais funcionalidades do Illustrator.
Apesar de não parecer um software destinado a profissionais devido a sua

simplicidade, o DrawPlus é um software amigável com funções para lidar, inclusive,
com [**desenhos 3D.**] Possui uma coleção de pincéis e modelos pré-definidos que
facilitam a vida dos novos usuários, o que é um grande diferencial.
Além de trabalhar com modos de cores RGB, a aplicação tem perfis CMYK e faz a
leitura de cores Pantone, possibilitando o desenvolvimento de layouts impressos. O
DrawPlus ainda oferece uma versão paga, com mais ferramentas e recursos, pelo custo
de $24.99.
## 4\. Karbon 14
**Plataformas:** Windows, Linux e Mac
[Karbon 14] é outro aplicativo de desenho vetorial com uma interface simplificada,
altamente personalizável e extensível. Seja para quem está começando a trabalhar
com vetores agora ou usuários profissionais, o software gratuito tem ferramentas
específicas para tarefas como desenho, pintura a dedo, manipulação de imagem e
edição de ícones, tipografias e logotipos.
O pacote Calligra, do qual ele faz parte, inclui também um aplicativo de edição de
imagens similar ao Photoshop.
## 5\. Gravit
Que tal uma ferramenta de desenho vetorial completamente online, pronta para fazer
basicamente o que o Illustrator faz em suas principais funções? Com [o Gravit],
basta criar uma conta e começar a usar! Além de criar formas, o aplicativo tem
um _pathfinder_ e ferramentas de alinhamento muito parecidas com as que você
encontra no software da Adobe.
É possível trabalhar com camadas, adicionar textos e imagens aos seus projetos e
desenhar livremente. Além disso, na hora de criar um novo documento, os usuários
têm a opção de escolher formatos dentre muitas predefinições úteis, como tamanhos
de impressão padrão e modelos para capa de Facebook e Twitter.
Quando terminar de criar suas imagens, você pode salvar em JPG, PNG ou o formato
vetorial livre SVG para continuar editando depois. Todas as imagens podem ser
também armazenadas online, para que você não perca seu trabalho.
## 6\. Sketch
**Plataformas:** Mac
**Faixa de preço: **$99.00
Esse editor de vetores para Mac é uma alternativa bem acabada e de fácil
usabilidade para usuários que buscam ferramentas poderosas de edição por um preço
inferior ao da Creative Cloud. Incluindo um rico conjunto de opções web (foco do
Sketch), permite, até mesmo, copiar estilos em CSS diretamente para a área de
transferência e reproduzi-los em seus arquivos.
Com suporte a múltiplos_ artboards_ e repetição de efeitos, como sombras,

preenchimentos e gradientes, além do corte automático de elementos para web,
o [Sketch] é focado no desenvolvimento de layouts[**para meios digitais.**]
## 7\. Youidraw
[Youidraw] é um poderoso editor de vetores online que não exige cadastro ou nenhum
tipo de download para funcionar. Desenvolvido na nuvem, é perfeito para amadores e
profissionais e tem ferramentas de desenho similares ao Illustrator com perfeição.
Na criação de logos ou pintura digital, usar Youidraw permite que você trabalhe com
camadas e utilize sua biblioteca de estilos e templates para agilizar o
desenvolvimento de novos layouts. Possui uma série de efeitos de fácil aplicação e
bibliotecas de vetor pré-selecionadas. O aplicativo também inclui a
ferramenta _pathfinder_ e integra-se perfeitamente com suas contas no Google Drive
ou Dropbox.
Exporte layouts em SVG e obtenha um _preview_ automático dos seus desenhos graças a
uma intuitiva área de trabalho construída em HTML5.
Não é preciso investir muito dinheiro para obter ferramentas de desenho vetorial
que façam papéis quase tão funcionais quanto à que integra a suíte da Adobe.
Animado para [**começar sua carreira de designer**] e aprender a lidar com gráficos

vetoriais?
Estou estudando **Scratch**. Para testar meus conhecimentos, estou fazendo vários
mini projetos e em um deles resolvi criar um jogo onde controlamos um avião.
Nosso jogo vai se passar, basicamente, no ar. Logo, vamos alterar nosso palco para
que apareça um céu:
imagem deve ser `0` e sua posição vertical (`y`) deve ser `-120`, no meu caso:
imagem. Para mover nosso ator, vamos utilizar as setas do teclado.
Então vamos falar para o Scratch mover o nosso ator alguns passos para a esquerda
quando a tecla seta para esquerda for pressionada:
![]
Como estamos movendo nosso ator para a esquerda, o valor dos passos é negativo.
Podemos falar para ele se mover para direita também quando a seta para direita for
pressionada, só que, neste caso, o valor dos passos é positivo:
![]
Agora quando digitamos algumas dessas teclas, nosso ator se movimenta:
![]
Nosso ator está se movimentando, mas o que vocês acham desse movimento? Ele está um
pouco estranho, travado. Como podemos deixar ele mais fluido?
## Melhorando a movimentação
Quando apertamos uma tecla no computador e a mantemos pressionada, o computador

executa uma vez e espera um pouco para executar as demais ações. Por isso, o
movimento do ator fica travado.
Mas nós precisamos saber quando o usuário pressiona a tecla para mover nosso ator,
como podemos fazer isso sem fazer com que a movimentação pareça travada?
Quando apertamos uma tecla, um sensor localizado no teclado captura essa informação
e a envia para ser processada. Nós podemos falar para o Scratch utilizar um sensor
e sempre ficar verificando se a tecla foi acionada.
Logo, vamos apagar os comandos do evento de click e falar para o Scratch que,
quando o jogo começar, ele fique `sempre` perguntando **se** **as teclas de
movimento estão pressionadas**, se estiverem, ele deve mover o personagem:
![]
Agora quando pressionarmos as teclas, nosso ator terá um movimento mais fluido:
![]
## Continuando nosso jogo
Nosso ator principal já está com um comportamento muito legal. Agora precisamos
adicionar mais elementos, como obstáculos para o nosso avião desviar, criar um
efeito de para simular o movimento do voo, entre diversas outras coisas para deixar
nosso jogo mais divertido.
Aqui na **Alura**, temos um [**curso de Scratch onde você criará um jogo de naves
espaciais**]. Nele você aprenderá sobre como funciona o Scratch, como adicionar
inimigos e como dar comportamentos a eles. Como adicionar efeitos e muito mais.

Artigos

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Artigos

Enviado por

Direitos autorais:

Formatos disponíveis

imagem

Temos a seguinte classe que representa um usuário no nosso sistema:

No Java 5 um novo recurso foi introduzido à linguagem, as anotações. Elas permitem

_elementos do código. Essas informações podem ser definidas em qualquer meio,_

_bastando que o software ou componente as recupere e as utilize para agregar novas_

_informações nos elementos do código."_

Agora que já especificamos o contexto da nossa anotação, precisamos falar qual a

Nossa anotação está completa, vamos agora anotar o atributo `dataNascimento` da

Fazendo apenas isso, receberemos um erro de compilação. Precisamos passar a idade

Agora vamos criar o método `validador()` que retornará um `boolean`

Precisamos descobrir, em tempo de execução, informações a respeito do objeto que

Vamos usar o método [**isAnnotationPresent()**]. Esse método verifica se o campo

Para conseguir pegar a nossa anotação usaremos o método [**getAnnotation()**]

Para finalizar, vamos comparar para ver se o período entre `dataNascimento` e a

A data de nascimento do usuário criado é 13/01/2005, logo, comparado com a data

imagem` consegue validar qualquer classe que tenha nossa anotação.

Vamos ver como ficaria o código para armazenarmos tudo isso :

Nada muito díficil, agora temos que restaurar tudo isso :

Legal, já trazemos a API agora vamos utiliza-la.

Através desses métodos todo aquele procedimento de colocar ou retirar o objeto do

Nos dias 25 e 26 de agosto em Porto Alegre e nos dias 01 e 02 de setembro em

No episódio de hoje do Alura Live, convidamos Erick Krominski, apresentador do

Conheça alguns cursos e carreiras do mundo web:

- Avance e evolua com JavaScript e Typescript: [**JavaScript avançado I:**] ES6,

Como formatar uma moeda utilizando o Python?

Sou programador de uma loja online brasileira e, recentemente, decidimos

Vamos testar nosso código:

Precisamos tornar o valor convertido mais legível, formatá-lo. Queremos transformar

## Arredondando um número com a função `round()`

E já temos o valor arredondado em 2 casas decimais:

## Substituindo um caractere de uma string com o método `replace()`

Vamos testar o `replace()`:

Opa! Recebemos uma exceção!

Vamos ver como fica nosso valor agora:

Ótimo! Realmente conseguimos formatar nosso valor no padrão português de moeda.

## Suportando mais de uma moeda e seguindo padrões diferentes

Se tivéssemos um número maior, como **1000.50**, e quiséssemos agrupar o número

## Conhecendo o módulo `locale`

O Python nos oferece um módulo inteiro dedicado a serviços de internacionalização -

No nosso caso, podemos usar a função `locale.currency()`, passando o nosso valor

O `C` é o `locale` mais simples, sem as definições específicas para realizarmos a

## Definindo um _locale_ específico com a função `setlocale()`

- `locale`: Uma string que representa o _locale_ que queremos

- `locale.LC_CTYPE` - Funções relacionadas a caracteres

- `locale.LC_COLLATE` - Ordenação de strings

- `locale.LC_TIME` - Formatação de tempo

- `locale.LC_MONETARY` - Formatação de valores monetários

- `locale.LC_MESSAGES` - Exibição de mensagens

- `locale.LC_NUMERIC` - Formatação de números

- `locale.LC_ALL` - Combinação de todas as categorias

Como estamos tratando de formatação de moedas, usaremos a categoria `LC_MONETARY`.

No caso do parâmetro `locale`, as strings aceitas dependem do sistema em que o

## Formatando moeda com a função `currency()`

Agora sim, basta usarmos a função `currency()`:

E temos como retorno:

O parâmetro `grouping` espera receber um boolean, que, por padrão, é **False**.

Exatamente como o padrão estadunidense!

Tentamos, em primeiro lugar, funções como `round()`, para arredondar o valor, e

Conhecemos, por fim, o módulo `locale`, que consegue solucionar os problemas de

## Para saber mais

Então começamos desenvolvendo esse código para adicionar produto.

Se considerarmos isso, ao final teríamos um código imenso e, consequentemente,

E como poderíamos resolver esse problema?

Vamos usar o método [isAnnotationPresent()]. Esse método verifica se o campo

Para conseguir pegar a nossa anotação usaremos o método [getAnnotation()]

- Avance e evolua com JavaScript e Typescript: [JavaScript avançado I:] ES6,

Se tivéssemos um número maior, como 1000.50, e quiséssemos agrupar o número

O parâmetro `grouping` espera receber um boolean, que, por padrão, é False.

O Spring é um [framework] que facilita bastante o desenvolvimento, ou seja com

Quando pensamos em inserir, pesquisar, alterar dados, logo pensamos em DAOS ou

Iremos fazer isto nós [repositórios], pois facilita demais o processo do

Bem podemos criar um pacote chamado controller e uma classe chamada

Podemos fazer duas anotações @Controller e o @RestController. O @Controller é

No processo de upload é realizado a transferência do arquivo local em nossa

Para realizar a cópia do arquivo enviado pelo usuário e posteriormante

Repare que declaramos a origem do tipo [InputStream] pois é o objeto

Para maior facilidade no exemplo irei utilizar o framework [VRaptor], capaz de

## 1\. Tornando-se um profissional de marketing digital

Acompanhar blogs como o [SEOGadget], o [Social Media Examiner] e o

### Quais são os conceitos básicos do marketing digital?

### Quais são os principais componentes?

### Por onde começar a aprender marketing digital?

Eles ensinam [fundamentos], e alguns dos conceitos avançados da prática, mas

#### 1\. Crie um blog

#### 2\. Aprenda a ler dados e identificar oportunidades

#### 3\. Mantenha suas páginas e redes sociais atualizadas

#### 4\. Experimente criar pequenas campanhas de publicidade

#### 6\. Monetize seu conteúdo

## 2\. As cinco competências fundamentais do profissional de marketing digital

### Um excelente texto e as certificações adequadas