Não dependa de frameworks, seja um programador baunilha 👨‍💻

Você deve estar se perguntando: "o que é um programador baunilha?". Porém, antes de mais nada, precisamos entender o que é um framework. Bem, pense em tecnologias como React, Vue e Angular. Esses frameworks, assim como qualquer outro, são uma estrutura pré-construída que fornece diretrizes, componentes e funcionalidades comuns para acelerar o processo do desenvolvimento de software.

No entanto, a armadilha é depender exclusivamente desses frameworks, sem entender completamente a linguagem de programação subjacente. Nesse contexto, um programador baunilha (ou vanilla, do inglês) é aquele que utiliza apenas a linguagem de programação pura, sem bibliotecas e frameworks.

O título do presente artigo se trata de uma brincadeira, pois é de extrema importância utilizar de frameworks para não ser um profissional limitado, tendo em vista que a maior parte das vagas requerem esse tipo de conhecimento. Porém, quero trazer à tona uma reflexão importante.

Caso você ainda esteja conhecendo o vasto universo da programação, fique tranquilo, tudo que mostrarei a seguir será explicado, para que ninguém fique por fora dessa reflexão.

Observe o seguinte trecho de código em Javascript:

const vetor = [1,2,3,4,5]
const vetorDuplo = []
vetorDuplo[0]=vetor[0]*2
vetorDuplo[1]=vetor[1]*2
vetorDuplo[2]=vetor[2]*2
vetorDuplo[3]=vetor[3]*2
vetorDuplo[4]=vetor[4]*2

console.log(vetorDuplo)
//Resultado esperado: [2,4,6,8,10]

Se você conhece a sintaxe das principais linguagens de programação, você deve saber o que o código acima faz. Basicamente, ele atribui o dobro do valor de cada elemento dentro do vetor para a variável vetorDuplo. Porém, se você já tem um pouco de experiência, sabe que essa é uma péssima prática. Imagine se houvessem dezenas, centenas ou milhares de elementos dentro do vetor. Você teria coragem de fazer um código com dezenas, centenas ou milhares de linhas? É muito provável que não. Portanto, vamos fazer de outra forma:

const vetor = [1,2,3,4,5]
const vetorDuplo = []

for (let indice = 0; indice < vetor.length; indice++) {
  vetorDuplo.push(vetor[indice]*2)
}

console.log(vetorDuplo)
//Resultado esperado: [2,4,6,8,10]

Ok, agora temos um algoritmo mais interessante. Ele utiliza de uma estrutura de repetição (for) para fazer o mesmo que o código anterior, mas garante que não importa quantos elementos existam dentro de um vetor, ele vai funcionar em apenas três linhas. Porém, há outras formas de chegar ao mesmo resultado com um código mais enxuto. Por exemplo:

const vetor = [1,2,3,4,5]
const vetorDuplo = []

for (let item of vetor) {
  vetorDuplo.push(item*2)
}

console.log(vetorDuplo)
//Resultado esperado: [2,4,6,8,10]

O código parece um pouco mais legível, e ao invés de manipularmos um item por meio de um índice, conseguimos manipular o próprio item. No entanto, ainda existem outras formas de fazer isso. Vejamos:

const vetor = [1,2,3,4,5]
const vetorDuplo = []

vetor.forEach(function(item) {
   vetorDuplo.push(item*2)
})

console.log(vetorDuplo)
//Resultado esperado: [2,4,6,8,10]

Nesse caso, usamos o método forEach, passando uma função anônima de callback (função passada como parâmetro de outra função), para dobrar o valor de cada item do vetor. Porém, será que não é possível reduzir o tamanho do código?

const vetor = [1,2,3,4,5]

const vetorDuplo = vetor.map(function (item) {
  return item*2    
})

console.log(vetorDuplo)
//Resultado esperado: [2,4,6,8,10]

Aqui está. Nós conseguimos reduzir, vejamos... 1 linha! Parece uma vitória. Usando o método map, nós manipulamos cada elemento do vetor e retornamos por meio de uma função anônima de callback o resultado dentro de vetorDuplo, sem nem ao menos declararmos ele anteriormente. Contudo, há muito código desnecessário aí. O quê? Não acredita?

const vetor = [1,2,3,4,5]

const vetorDuplo = vetor.map(item => item*2)

console.log(vetorDuplo)
//Resultado esperado: [2,4,6,8,10]

Uau! Chegamos no mesmo resultado com apenas 1 linha de código? O que ocorreu nesse código é que, como ele possuia apenas 1 parâmetro sendo passado e realizava apenas um retorno, os parênteses, as chaves e até mesmo o return eram desnecessários para o Javascript. Mas, espera aí... onde está a function? E o que seria aquele "=>"? Nessa linguagem, quando usamos uma função anônima, ou seja, uma função sem identificador, podemos substituir por algo muito mais amigável, a chamada arrow function, como visto no código acima.

Se você ainda é iniciante, deve ter achado isso um máximo, não é mesmo? Bom, agora vem a minha reflexão. Isso é uma parcela ínfima do que o Javascript pode fazer, sem a necessidade de frameworks ou bibliotecas, quaisquer que sejam. E isso vale para qualquer linguagem de programação.

Nesse universo, é fácil se perder na empolgação dos inúmeros frameworks, bibliotecas e ferramentas disponíveis. A busca pela última novidade ou pela ferramenta mais popular muitas vezes se torna o foco principal. No entanto, é essencial lembrar que a verdadeira essência da programação reside na compreensão profunda da linguagem que dá vida a esses frameworks.

A proficiência em uma linguagem de programação é alcançada por meio da compreensão profunda dos fundamentos da linguagem. Além disso, a expertise na linguagem permite que você escolhe os frameworks de acordo com as necessidades, em vez de depender cegamente das funcionalidades pré-estabelecidas e das tendências efêmeras de fóruns.

Não me leve a mal, os frameworks são ótimas ferramentas e evitam muitas dores de cabeça no desenvolvimento (eu, inclusive, utilizo frequentemente). Todavia, frameworks vem e vão. Já os conceitos fundamentais das linguagens de programação se mantém por muito tempo. Portanto, não DEPENDA de tecnologias, seja um programador que UTILIZA de frameworks e linguagens de programação para resolver problemas.

Fique à vontade para compartilhar sua opinião a respeito do tema.