SvelteKit

Recursos Web Development

Introdução

O mundo da engenharia de software, e em particular do web development é extremamente extenso, e apoia-se noutras áreas como a engenharia de redes, arquitectura de computadores e sistemas operativos

Quanto à web, eu começaria a abordar o assunto pelos básicos, arquitecturas cliente-servidor, o modelo request-response do HTTP

Depois aprofundar a parte mais específica do browser, como é que funciona mais ou menos o processo de render de uma página web, o papel do HTML, CSS e JavaScript e como é que se harmonizam entre si

E depois aprofundar a parte mais do lado do servidor, bases de dados, SQL vs NoSQL, como é que se desenha um modelo de dados, e arquitectura de sistemas

Roadmaps

Isto é um excelente ponto de entrada, com imensas referências, mas mais focado em frontend

Front-end Developer Handbook 2019 - Learn the entire JavaScript, CSS and HTML development practice!

Este roadmap também está bem feito, tem diagramas para cada uma das especialidades, frontend, backend, etc

kamranahmedse/developer-roadmap

apptension/developer-handbook

Outras colecções deste tipo de roadmaps, orientados para diferentes áreas

Developer Roadmaps

orsanawwad/awesome-roadmaps

Build software better, together

Tutoriais

O Mozilla Developer Network é um excelente sítio de documentação de referência, desde HTTP, HTML, JavaScript, CSS, é o que uso no dia a dia para consultar como funcionam funções, APIs do browser, etc.

MDN Web Docs

Para além disso têm bastantes tutoriais, muitos orientados para iniciantes

Learn web development | MDN

Tutorials | MDN

Understanding client-side JavaScript frameworks - Learn web development | MDN

No geral, os próprios sites das linguagens e frameworks costumam ter tutoriais muito bons e completos, muitas vezes dirigidos a principiantes

The Python Tutorial - Python 3.9.6 documentation

Tutorial: Intro to React - React

Introduction | Vue.js

Svelte tutorial

Angular

Cursos online

O freeCodeCamp e o Codecademy são bastante bons, à base de pequenos exercícios que vão evoluindo em dificuldade e complexidade, e incluem projectos bastante completos (é preciso criar conta)

freeCodeCamp.org

Learn to Code - for Free | Codecademy

Mesmo para além do curso estruturado deles, têm imensos artigos porreiros a explicar as coisas de forma bastante acessível

Outra plataforma muito interessante é o Scrimba, que mistura vídeo com programação interactiva em tempo real, só visto!

Learn to Code with Interactive Tutorials - Scrimba.com

Para aulas em vídeo mais tradicionais, dos mais populares é o Udemy (também é preciso criar conta, e os cursos normalmente pagam-se, cerca de ~15€ por cada)

Online Courses - Learn Anything, On Your Schedule | Udemy

Outra muito popular é o Egghead, tem bastantes coisas à borla, mas no geral é pago

Build the portfolio you need to be a badass web developer.

Este é um agregador de várias plataformas de aprendizagem, é só pesquisar o tema de interesse, e aparece quase tudo o que há disponível por aí

Discover Free Online Courses & MOOCs * Class Central

Agora com o COVID há muitas destas plataformas de aprendizagem online que estão a disponibilizar cursos à borla

Udemy Free Resource Center: Find Free Online Courses

Coursera Together: Free online learning during COVID-19

For Individuals

Frontend

A nível de linguagens de programação, no frontend é essencial aprender HTML, CSS, e JavaScript, porque é o que os browsers compreendem nativamente.

Há muita muita coisa por aí sobre JavaScript, é neste momento a linguagem de programação mais popular do mundo

Eloquent JavaScript

The Modern JavaScript Tutorial

JavaScript for impatient programmers

Deep JavaScript

Speaking JavaScript: An In-Depth Guide for Programmers

getify/You-Dont-Know-JS

Também tens outras linguagens que são construídas em cima dessas 3 e acrescentam alguns features interessantes

TypeScript, acrescenta um type system ao JavaScript, acaba por ficar mais parecido com C#/Java

Typed JavaScript at Any Scale.

Sass, um pré-processador de CSS, que já foi mais relevante há uns anos, entretanto o CSS evoluiu bastante

Sass: Syntactically Awesome Style Sheets

Pug, um template engine de HTML, que simplifica bastante a sintaxe

Pug

Frameworks de frontend

Depois tens várias frameworks que te dão um esqueleto e um conjunto de boas práticas para ser mais fácil desenvolver aplicações

As mais populares hoje em dia são React, Vue e Angular

React - A JavaScript library for building user interfaces

Vue.js

Angular

E outra bastante interessante mas que ainda está a começar a ganhar popularidade é o Svelte, que tem performance incrível:

Svelte

Dessas as mais acessíveis para começar são provavelmente o Vue e o React. Apesar do Svelte ser mais simples, ainda não é tão popular nem a documentação é tão extensa

Deployment

Develop. Preview. Ship. For the best frontend teams - Vercel

Netlify: Develop & deploy the best web experiences in record time

Surge

GitHub Pages

Registo de nome de domínio

Buy a domain name - Register cheap domain names from $0.99 - Namecheap

Backend e linguagens de programação

Agora, a nível de linguagens para usar no servidor, o mundo é infinito!

As mais tradicionais e com mais peso no mundo empresarial são decididamente Java e C#

Pessoalmente não gosto nada de Java, C# é bastante melhor, mas ainda assim não seria a minha escolha, são ambas muito direccionadas para uma forma de pensar object-oriented empresarial, é preciso muito código para fazer coisas simples

Entretanto na última década surgiram várias linguagens com o objectivo de mitigar os problemas do paradigma exclusivamente orientado a objectos, linguagens mais modernas e multi-paradigma

Tens linguagens como o Scala e o Clojure, que são construídas em cima da JVM, a máquina virtual do Java, mas que adoptam uma perspectiva muito mais funcional

The Scala Programming Language

Clojure

E tens o equivalente para a plataforma .NET, a máquina virtual do C#, tipo o F#

F# Software Foundation

A grande vantagem dessas linguagens é que é possível tirar proveito do ecossistema gigante à volta do Java e do .NET, tens libraries para fazer tudo o que quiseres, e normalmente de muito boa qualidade, e as ferramentas base tipo editores de texto e ambiente de desenvolvimento também são bastante poderosas

Kotlin também é uma linguagem para a JVM que se tem tornado bastante popular nos últimos anos, porque foi adoptada pela Google para desenvolvimento em Android: https://kotlinlang.org/

Uma linguagem que se tem tornado extremamente popular nos últimos anos, é o Go, da Google:

The Go Programming Language

Ao contrário das outras, que correm em cima de uma VM, o Go é uma linguagem compilada

E tem um modelo de concorrência bastante bom, excelente performance, e foi criada na Google por malta com muito caparro (Rob Pike, Ken Thomson)

Para além dessas, tens as chamadas linguagens de scripting, que à partida são mais flexíveis e dinâmicas, sacrificando um bocadinho a performance, tipo Python, Ruby, e Node (JavaScript no servidor), ou mais recentemente o Deno, uma versão mais moderna do Node

Welcome to Python.org

Ruby

Node.js

Deno - A secure runtime for JavaScript and TypeScript

Uma linguagem dinâmica e funcional de que gosto bastante é Elixir

elixir-lang.github.com

Está construída em cima de uma VM de outra linguagem que já tem bastante tempo, o Erlang, que foi desenhada para sistemas altamente concorrentes e distribuídos, em tempo real

Por exemplo, os servidores do WhatsApp são maioritariamente em Erlang, permite-lhes ter um serviço altamente robusto e tolerante a falhas, com poucos servidores e engenheiros, é impressionante

Todas estas linguagens têm frameworks para facilitar a criação de aplicações web no servidor, algumas simples e outras mais complexas, mas com mais features

Express (JavaScript)

Express - Node.js web application framework

Koa (JavaScript)

Koa - next generation web framework for node.js

Django (Python)

Django

Flask (Python)

Flask

Ruby on Rails (Ruby)

Ruby on Rails

Sinatra (Ruby)

Sinatra

ASP.NET (C#)

ASP.NET | Open-source web framework for .NET

Phoenix (Elixir)

Phoenix Framework

Bases de Dados e Infraestrutura

Quanto a bases de dados, as mais populares neste momento devem ser o PostgreSQL, que é uma base de dados relacional, mas com bastantes features fora do tradicional, e os outros SQLs mais old-school tipo MySQL, ou embedded nas próprias aplicações tipo SQLite

PostgreSQL

Para além disso, desde há uns 10 anos para cá que começaram a aparecer bases de dados muito populares, mas que fogem ao modelo relacional, as chamadas NoSQL

The basics of NoSQL databases - and why we need them

Por exemplo, MongoDB foi uma das primeiras e mais influentes, e ainda é das mais populares

The most popular database for modern apps

Outra que também é bastante interessante, com um modelo de dados um bocadinho diferente, é a Apache Cassandra

Apache Cassandra |

Para além disso, muitas vezes os serviços utilizam “bases de dados” mais simples, só para funcionar como cache e diminuir o tempo de resposta, normalmente Redis ou equivalente

Redis

Ou os chamados message brokers, tipo o Apache Kafka, que servem como filas onde vais despejando eventos, e depois as aplicações vão reagindo a esses eventos

Apache Kafka

Depois tens muitas questões de infraestrutura, gestão de servidores, containers, load balancers, os vários serviços que são disponibilizados pelas Clouds tipo Azure, AWS, Google Cloud, etc.

Cada uma destas partes tem de ser bem pensada, em cada uma delas tens as abordagens mais tradicionais e lentas, mas que levam a software mais fácil de manter num contexto empresarial (ou seja, equipas grandes, com grande rotatividade, e que tem de ser desenhado a pensar nos próximos anos e consequentes alterações de requisitos), e tens abordagens mais modernas e rápidas, que se popularizaram bastante pela cultura de startups que se impôs no mundo da tecnologia nos últimos anos, onde o que mais importa é o time-to-market

Eu sou mais apologista da segunda abordagem, para uma equipa pequena, e onde o que mais interessa é montar um MVP o mais rapidamente possível, de forma a validar o produto

Se a coisa escalar e houver mais gente envolvida, e os requisitos se tornarem evidentemente diferentes, também rapidamente se muda de stack, ou vai-se gradualmente trocando uma peça aqui e ali

Comparações de performance e benchmarks

Frameworks de frontend:

Interactive Results

Frameworks de servidores:

TechEmpower Web Framework Performance Comparison

Bases de dados:

DB-Engines Ranking

Arquitectura

Uma coisa que tenho estado a ver, sobre arquitectura de sistemas:

donnemartin/system-design-primer

Arquitectura é uma tema muito vasto, numa perspectiva muito mais high-level do que pormenores de linguagem e framework

Uma questão que se põe à cabeça é por exemplo, usar uma arquitectura à base de micro-serviços, monolítica, ou serverless

Tendências e panorama actual

Surveys do Stack Overflow

Stack Overflow Developer Survey 2020

Stack Overflow Developer Survey 2019

Equivalente do GitHub

The State of the Octoverse

Equivalente do Jetbrains

The State of Developer Ecosystem in 2021 Infographic

The State of Developer Ecosystem in 2020 Infographic

The state of Developer Ecosystem in 2019 Infographic

Panorama actual no mundo do JavaScript

The State of JavaScript Survey

Outra sobre o panorama no mundo de JavaScript

2020 JavaScript Rising Stars

2019 JavaScript Rising Stars

Panorama actual no mundo do CSS

The State of CSS Survey

Este site também é giro, mostra os stacks usados por várias empresas

What is a Tech Stack? What tools do popular tech companies use in 2021?

Popularidade relativa das várias linguagens

Github Language Stats