[pt-BR] 5 dúvidas comuns de iniciantes em desenvolvimento Front-end
Published: 2021-05-27 00:52:56

Uma das coisas que mais gosto e que mais tem feito eu me apaixonar pela área de desenvolvimento é aprender uns com os outros. 

Esse senso de comunidade é muito bacana e nos últimos tempos tenho tido conversas sensacionais tanto com pessoas experientes quanto com pessoas que me chamam pelo Linkedin perguntando sobre meu dia-a-dia no trabalho ou procurando algum tipo de mentoria.

E apesar de eu estar a pouco tempo na área, tenho sido surpreendida com feedbacks positivos de que tenho ajudado a esclarecer algumas dúvidas, principalmente dos iniciantes como eu. 

Portanto, decidi resumir nesse artigo 5 dúvidas que já recebi, e são essas:

**1. Quais são os primeiros passos para o desenvolvimento front-end?**
**2. Como posso consolidar meus conhecimentos de maneira eficaz?**
**3. Para ser um bom front, é necessário ser criativo?**
**4. Quando posso sentir que estou pronto para o mercado de trabalho?**
**5. Como conseguir boas oportunidades como front-end junior?**

Lembrando que essas são sempre opiniões baseadas na minha experiência e na minha realidade, ou seja, não significa que seja o certo! Mas mesmo assim, meu desejo é que esse artigo possa ajudar e que possa incentivar a troca de experiências! 

Então, vamos começar?

# 1. Quais são os primeiros passos para o desenvolvimento front-end?

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7ayk6rxxsttdq84btbxx.png)

É sempre importante não pular etapas, então, na minha opinião antes mesmo de começar a estudar um framework moderno do JavaScript como o React por exemplo, é interessante obter uma boa base de codificação em HTML e CSS e pelo menos saber alguns conceitos de JavaScript.

No meu caso, antes de ser front-end, eu fui web designer por aproximadamente 7 anos. Na época, grande parte do meu trabalho como web designer era desenvolver sites estáticos utilizando apenas HTML, CSS e Jquery. 

Quando fui estudar programação front-end, esse meu background me permitiu focar e gastar mais tempo em aprender a programação em JavaScript e os conceitos do React. E as partes de estruturar e estilizar os layouts dos sistemas eu conseguia passar mais rápido.

Por esse motivo eu acredito que gastar um tempo estudando e praticando a estruturação e estilização de interfaces, vai te dar uma vantagem quando você for realmente começar a programar e lidar com a lógica. 

# 2. Como posso consolidar meus conhecimentos de maneira eficaz?

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lt7afms6cjmhzyygibji.gif)

Acredito que a melhor forma de consolidar conhecimento é pela prática. Mas não apenas praticar muito, mas praticar com qualidade!

Vamos pensar que estamos nos preparando para o mercado de trabalho certo? Quando você for trabalhar em uma empresa, vai ser muito difícil alguém te pedir para estilizar um card usando glassmorphism, ou para desenhar um Minion utilizando apenas CSS.  

Estudar esse tipo de coisa é válido e divertido, mas é pouco usado na vida real. Existem 3 critérios que eu uso para estudar hoje e que vejo como uma dica especial para quem quer realmente evoluir mais rápido:

### 2.1. Foque em estudar coisas que se parecem o máximo possível com o mundo real do desenvolvimento. 

- Crie uma página de login, que necessite de usuário e senha e que tenha acessos específicos para cada tipo de usuário.

- Treine o consumo de dados vindos de uma API real, crie mocks de back-ends ou fakes APIs.

- Vasculhe plataformas como Dribbble ou Pinterest procurando por UIs bem atrativas e transforme isso em uma interface navegável!

- Faça recriações de páginas reais (UI Clones) como Twitter, Facebook, Pinterest. Tente sozinho, mas também consulte vídeos no youtube para ajudar a criar repertório.

Como você pode perceber, esses tipos de exercícios vão te dar um ótima prévia de como seria desenvolver um site ou sistema para uma empresa real, pois são coisas utilizadas na maioria dos sites e sistemas.

### 2.2. Trabalhe com pequenos projetos do começo ao fim e não apenas em itens isolados. 

É bom mostrar o quanto você é capaz de integrar componentes e construir projetos que façam sentido entre suas partes. 

É muito legal aprender a fazer um menu responsivo, mas melhor ainda se ele for um dos diversos componentes que compõe um site one-page por exemplo. Ou um uma página de dashboard que consuma uma api e exiba informações de diferentes usuários.

Mas muito cuidado para não deixar seus projetos ficarem muito grandes! Lembre-se, crie pequenos projetos que mostrem que você realmente está se preparando para trabalhar de verdade!

### 2.3. Crie boas documentações e descreva muito bem as funcionalidades

- Essa documentação pode ser o próprio Readme do Github. Descreva as funcionalidades, requisitos e as regras de como, onde e porque cada coisa funciona. 

- Clone mini projetos dos seus colegas, navegue neles e mapeie as regras de negócio. Compartilhe isso com o dono do projeto e estude juntos formas de melhorar ou implementar mais regras. 

Esse é uma capacidade muito importante a ser desenvolvida pelo desenvolvedor front-end, pois não tem só a ver com interfaces e sim sobre a maneira que ela deve se comportar. Para saber mais, convido para ler um outro artigo que escrevi, chamado ["A programação além do código"](https://dev.to/dxwebster/a-programacao-alem-do-codigo-3eem)

### 2.4  Crie uma rotina de estudos

É muito importante criar uma rotina de estudos consistente. Isso vai variar de pessoa para pessoa e o ideal mesmo, se você realmente estiver interessado bem bacana você procurar uma mentoria especializada nisso ou algum curso de Gestão do Tempo.

Indico esse gratuito da Udemy que eu fiz e achei os métodos bem interessantes: [Produtividade e Gestão de Tempo]( https://www.udemy.com/share/103fZyBEMadF9VQ3g=/).

De maneira simples e resumida, um dos métodos muito conhecido e até difundido entre os devs é o Pomodoro. Nele você faz pausas de 5 a 20 minutos a cada 1h de estudos por exemplo. É uma boa maneira de equilibrar a produtividade, tendo momentos de relaxamento mental e não aumentar demais o estresse cognitivo.

# 3. Para ser um bom front, é necessário ser criativo?

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wekzovfavxbqn634zlno.jpg)

Se você diz criativo no sentido de saber design ou UX, a resposta é não. Você não precisa necessariamente ter esse estilo de criatividade para ser um bom desenvolvedor front-end.

Se você for trabalhar em uma empresa boa, haverá muito bem a separação entre ás áreas de desenvolvimento, das de experiência de usuário (UX), tendo pelo menos um profissional para cada área.

Em resumo, o UX faz o protótipo da aplicação, e o frontend transforma esse prototipo em codigo, em algo usável pelo usuário. Então, pensando nesse sentido, o frontend não precisa ser um UX, pois isso seria como falar que um médico teria que necessariamente também ser um veterinário.

Entretanto, existe um outro ponto da criatividade que todo desenvolvedor preecisa ter. Essa criatividade está mais ligada a qual tipo de solução você vai dar pra determinado problema, no sentido lógico e também na estrutura de código por exemplo. E como isso pode se dá na prática?

Uma das coisas mais práticas que posso dizer é o fato de existirem diversas formas de se resolver um determinado problema. Existem diversas tecnologias, ferramentas, frameworks e lógicas como solução para um problema.

E assim, quanto mais você estuda, quanto mais você vê soluções, mais você vai ser criativo no seu código!

# 4. Quando posso sentir que estou pronto para o mercado?

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/owzjyjmjzkneczz906qd.jpg)

Essa pergunta é realmente muito boa e muito comum, acredito que e diversas áreas. A resposta não é simples, mas ao meu ver um bom caminho é separar esse "se sentir pronto" em dois sentidos, um técnico e outro psicológico.

Pensando no sentido técnico do desenvolvimento front-end, vou usar novamente a minha experiência. De maneira prática eu acredito que a pessoa já esta pronta para procurar uma oportunidade como front-end junior quando tiver os seguintes conhecimentos:

### 4.1. Codificação em HTML e estilização com CSS

- Estilizações com Flexbox e Grid
- Pré-processadores como Sass
- Semântica do html e hierarquias
- Criação de components como headers, footers, cards, sliders, menus, tooltips, badges, modais.

### 4.2. Base de JavaScript

- Variáveis e seus tipos (string, number, boolean)
- Trabalhar com functions e sabendo receber a passar parâmetros
- Entender como funciona objetos e consumo de dados JSON
- Mapear e varrer arrays por meio de funções como map e forEach.
- Manipulação da DOM

### 4.3. Pelo menos um framework de JS, como por exemplo o React
 
- Estado, efeitos colaterais, hooks, rotas, .
- Components, styled components e parâmetros
- Context API ou Redux

Esses pontos técnicos vão te ajudar bastante no sentido psicológico pois vão te dar mais confiança em se candidatar para vagas e fazer entrevistas, mas não vai necessariamente te fazer sentir PRONTO.

Digo isso porque ja vi muitos devs experientes falarem que nunca se sentem prontos, por mais conhecimento técnico que tenha.

Então minha super sugestão é: Não espere se sentir pronto psicologicamente para entrar no mercado. Confie nos conhecimentos que você tem e dê as caras! Candidate-se pras vagas, tenha experiências em processos seletivos, e o mais importante, seja sempre sincero com tudo!

Um bom recrutador vai ver aquilo que você sabe, e caso você deixe claro, vai perceber que o que você ainda nao sabe e que você estará sempre disposto a aprender.

# 5. Como conseguir boas oportunidades como front-end junior?

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gsdkwi66tmzjo1ntw4l5.png)

As principais armas do dev iniciante hoje em dia são: Linkedin e Github!

### 5.1. Resignifique o Linkedin

Hoje em dia o uso do Linkedin é essencial para você ser visto e destacada entre tantas pessoas em busca de uma oportunidade. E essa foi uma das coisas que me surpreendeu muito quando eu soube pois não levava muita fé nisso. Eu tinha até um preconceito com o uso do Linkedin.

Entretanto, aos poucos fui entendendo que hoje em dia, estar no Linkedin de maneira ativa é uma ferramenta incrível para facilitar o networking e não apenas isso, mas principalmente aprender!

E uma das dicas que eu dou é: não pense no Linkedin apenas como uma rede para conexão, mas pense nele como uma plataforma de aprendizado e atualização constante! E melhor do que isso, é uma forma incrível de você oferecer às pessoas algum tipo de conhecimento! 

E não tem maneira melhor de aprender do que ensinar! Muita gente acha que não tem o que ensinar, mas sim, um código, um hack, um vídeo, um tutorial, um artigo, uma experiência. Todo mundo tem o que ensinar, se estiver estudando alguma coisa! 

Por isso, use e abuse do Linkedin. Ajeite seu perfil, descreva os cursos e experiências profissionais que você ja teve e principalmente: Seja sincero! Não descreva nada além daquilo que você é. Encontre suas melhores hard e soft skills e divulgue-as!

E caso tenha alguma dificuldade, não hesite em pedir ajuda. As pessoas são mais dispostas a ajudar do que você imagina, principalmente os devs! 

E uma coisa que talvez nem todo mundo saiba, é o que o se você for uma pessoa ativa no Linkedin, isso significa de maneira resumida, postar coisas relevantes constantemente, fazer boas conexões, comentar, curtir, compartilhar, o algoritmo te coloca na frente quando você se candidatar para alguma vaga. 

Confira esse ebook gratuito de [Introdução ao Linkedin](https://s3.us-west-2.amazonaws.com/secure.notion-static.com/d9eb42b4-ed58-40b6-a0cc-ebf7439e9b80/E-book_Introducao_ao_LinkedIn.pdf?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAT73L2G45O3KS52Y5%2F20210524%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20210524T030658Z&X-Amz-Expires=86400&X-Amz-Signature=e0d8e9dcb3834a134076676a2bfca7cd7291b440d3182e8e83ffa638803b09f5&X-Amz-SignedHeaders=host&response-content-disposition=filename%20%3D%22E-book%2520Introduc%25CC%25A7a%25CC%2583o%2520ao%2520LinkedIn.pdf%22)

### 5.2 O melhor aliado do dev iniciante: Github

Vale até a pena fazer algum mini-curso para aprender a mexer o Github. Digo isso porque confesso que demorei um pouquinho pra entender como funciona. 

Mas uma vez que você aprende, vai ver como é fácil versionar seus projetos e mantê-los visíveis para os recrutadores verem. Sim, os recrutadores olham se você está subindo coisas no seu github, e isso mostra que você está estudando todos os dias!

E é por meio dele que você vai compartilhar seus projetos e deixa-los disponíveis para colaboração de outros devs. Vai por mim, fazer ou aceitar um Pull Request é muito legal! Pois isso traz uma sensação de contribuição e de aprendizado!

Também tem um curso gratuito de Github na udemy: [Git e Github para iniciantes](https://www.udemy.com/course/git-e-github-para-iniciantes/)

# Conclusão

Bom, eu acredito que hoje em dia a área de desenvolvimento se tornou muito apaixonante! O mundo mudou, as profissões mudaram, e a tecnologia está vindo com tudo e principalmente de uma forma mais humanizada. 

Entretanto, se eu puder dar algumas últimas dicas para os iniciantes, eu diria para alinhar suas expectativas sempre percebendo o mundo real a nossa volta. Digo em buscar um equilíbrio de não se deslumbrar tão facilmente com tudo de novo que aparece pela frente, e também não achar que as coisas são impossíveis de acontecer.

Encontre um foco e mergulhe de cabeça. Jogue o jogo, e dê sempre seu melhor. E, não se mate. Faça tudo dentro dos seus limites, dedique-se de modo que não comprometa sua saúde mental e física. Esteja sempre na comunidade, compartilhe, converse, pergunte e pergunte muito!

E por fim, não torne o trabalho o alvo da satisfação pessoal, pois opiniões e planos mudam ao longo da vida. Curta a jornada. Esta sim vale a pena ser curtida, pois tem a ver com amadurecimento, relacionamento, ganhos, perdas. Se esforce para sempre permanecer em propósitos que transforme o hoje e que plante sementes para o futuro.