O que estudar em 2018 como front-end?

Provavelmente, assim como eu, você já deve ter se perdido em que estudar com tantas linguagens de programação e ferramentas sendo criadas todos os dias. A boa notícia é que existem algumas tecnologias que possuem alta chance de se bombarem em 2018 facilitando seus estudos.

Nesse post eu reúno algumas ferramentas que, na minha opinião, se tornarão muito mais fortes durante esse ano estando, cada vez mais, dentro da grade de tecnologias das maiores empresas de tecnologia do mundo.

GraphQL

Se você ainda não deu atenção ou não conhece essa ferramenta, a hora é agora! O GraphQL é uma Query Language que veio para substituir o REST que é a maneira comum que utilizamos para manipular dados entre front-end e back-end. O intuito desse post não é definir vantagens e desvantagens dessa tecnologia, mas com o GraphQL você:

Possui um único endpoint

Ao invés de possuir várias rotas para consumir os recursos da sua API como por exemplo:

https://api.github.com/users/diego3g
https://api.github.com/users/diego3g/repos

Você possui um único endpoint (chamado via POST) e todas demais informações como o recurso que está sendo consumido e os parâmetros ficam no corpo da mensagem, por exemplo:

POST https://api.github.com/graphql

query { 
  user(login:"diego3g") { 
    id
    login
    repositories(last: 20) {
      nodes {
        name
      }
    }
  }
}

Na chamada acima utilizamos o GraphQL, que possui uma sintaxe similar a de um objeto no Javascript (exceto pelos parâmetros nos parênteses), para buscar dados de ID, login e repositórios do usuário com login “diego3g”.

O GraphQL se aplica tanto para softwares web quanto mobile.

Pode escolher o que precisa pelo front-end

Com o GraphQL, a responsabilidade de dizer quais informações você precisa do back-end, assim como paginação e filtros, é do front-end.

Imagine um software que possua versões web, mobile e API pública, controlar quais informações devem ser enviadas para cada plataforma a partir de uma única API é extremamente estressante.

Utilizando o GraphQL, você define quais campos sua requisição irá trazer ou quais campos irá alterar, os filtros da sua requisição, parâmetros de paginação, etc.

Tem facilidade para gerir requisições múltiplas

Outra grande vantagem do GraphQL é a facilidade para gerir múltiplas requisições simultâneas, mas como assim? Imagine um aplicativo de calendário offline-first, onde o usuário realiza diversas ações offline e assim que conectado à internet tudo é sincronizado, nesse caso se o usuário criar 20 eventos e marcar presença em outros 4, assim que conectado à internet precisaríamos fazer 24 requisições à API, ou se modificarmos nosso back-end poderíamos no máximo fazer com que isso se torne duas requisições (uma para cada recurso), com o GraphQL podemos realizar apenas uma requisição com todas alterações.

Para começar a estudar o GraphQL recomendo começar pela documentação e assistir essa live que fiz no CodeQuinta:

React Native

Não acredito que você ainda não conheça o React Native, mas vou explicar um pouco sobre essa ferramenta mesmo assim. A biblioteca disponibilizada de forma open-source pelo Facebook permite a criação de aplicações móveis com interface nativa para iOS e Android utilizando Javascript.

Diferente de tecnologias híbridas como Ionic Framework e Cordova, o React Native faz o dispositivo entender Javascript (o código não é transpilado/convertido em código nativo) e manipular a interface nativa diretamente do código feito em React.

Como eu sempre digo, o mundo é mobile e cada vez mais irão surgir oportunidades para quem tem conhecimento nessa área. Não vou compará-la com as concorrentes Flutter (lib do Google semelhante ao RN) e Weex (parecida com RN porém com VueJS), pois na minha opinião não tem porquê focar seus estudos ainda nessas outras libs, concentre-se no React Native.

Algumas vantagens em relação ao desenvolvimento nativo

Apenas um código tanto para iOS/Android;
Utiliza Javascript e React para criação da interface;
Utiliza o FlexBox Layout do CSS3 para criação dos estilos;

Comece estudar React Native hoje mesmo com o minicurso grátis da RocketSeat.

ReactJS

Apesar de já ter estourado e ser alib front-end mais utilizada por grandes empresas do mercado de desenvolvimento, complementando seus estudos no React Native cabe muito bem focar suas forças para se aperfeiçoar no ReactJS para desenvolvimento web já que grande parte dos conceitos utilizados no RN são compartilhados com a versão para navegador da lib.

Novamente não vou comparar o ReactJS ao VueJS, Angular ou qualquer outra biblioteca, o principal motivo dos estudos do ReactJS aqui é aproveitar seu conhecimento do React Native.

Concluindo

Nesse post falei sobre 3 tecnologias que acho indispensáveis para um bom front-end em 2018, além disso, você pode unir o GraphQL ao React Native e ReactJS para tornar seus estudos mais completos.

Tem alguma outra sugestão de linguagem ou biblioteca que você acha que vai bombar nesse ano? Deixa aí nos comentários e vamos trocar uma ideia.