Skip to content
Interactive & Free Developer Roadmap

Learn to code
from absolute scratch.

A structured roadmap across progressive phases, featuring interactive exercises, terminal workflows, and modern tools. Free, no sign-up, saved securely in your browser.

Start Phase 0
  • Free & no sign-up required
  • Progress stored in your browser
  • Hands-on practical exercises
developer-roadmap—
  1. 00Preparar o Terreno
  2. 01Lógica de Programação
  3. 02Variáveis, Tipos e Operadores
  4. 03Controlo de Fluxo
  5. 04Arrays, Funções e POO
  6. 05Web Básico
  7. 06Bases de Dados e SQL
  8. 07Git e GitHub
  9. 08IA Aplicada a Coding

Everything you need to succeed

Self-directed learning usually falls apart without clear structure and a place to track doubts. DevPath solves both.

100% Local & Private

All completed exercises and notes stay in your browser’s localStorage. No accounts, no emails, no remote tracking.

Learner’s Notebook

Jot down doubts on every exercise and resolve them as you progress. Filter by phase, status, or search query.

Pedagogical AI Prompts

Carefully formulated prompts ready to copy into Claude, ChatGPT, or Cursor to guide your learning without giving away spoilers.

Distraction-Free Focus Mode

A clean reading interface per exercise with fluid keyboard and forward/back navigation.

Gradual Milestone Progression

Each topic is rated by complexity so you build confidence steadily without jumping over critical basics.

Architectural Flow Diagrams

Step-by-step visual breakdowns of how frontend, backend, and databases communicate in production.

Your step-by-step path

9 progressive phases. Each builds on the foundation of the previous one.

  1. Phase 0Começa Aqui

    Preparar o Terreno

    O teu primeiro contacto com as ferramentas reais de um programador

    O que é afinal "programar"?O teu editor de código: VS CodeO Terminal: a linha de comandosO motor de execução: Node.js+1
    5 topics · 3 exercisesExplore
  2. Phase 1A Base de Tudo

    Lógica de Programação

    Aprende a pensar como um programador antes de escreveres sintaxe

    O que é um algoritmo?Pseudocódigo: escrever lógica sem sintaxeFluxogramas: desenhar a decisãoOs três blocos de construção: sequência, decisão, repetição+1
    5 topics · 4 exercisesExplore
  3. Phase 2Sintaxe Real

    Variáveis, Tipos e Operadores

    A primeira sintaxe real: guardar dados e fazer contas com eles

    Variáveis: const e letOs tipos de dados principaisOperadores aritméticosOperadores de comparação e lógicos
    4 topics · 4 exercisesExplore
  4. Phase 3Decisões & Repetições

    Controlo de Fluxo

    Fazer o programa decidir e repetir — o if/else e os loops em JavaScript

    if / else: a primeira decisão em códigoelse if e switch: mais de dois caminhosO loop for: repetir um número conhecido de vezesO loop while: repetir enquanto uma condição for verdadeira+1
    5 topics · 4 exercisesExplore
  5. Phase 4Organização

    Arrays, Funções e POO

    Organizar dados em coleções, reutilizar lógica e agrupar dados com comportamento

    Arrays: coleções de valoresMétodos úteis de arrayFunções: reutilizar lógica sem a repetirArrow functions: uma sintaxe mais curta+1
    5 topics · 4 exercisesExplore
  6. Phase 5O Frontend

    Web Básico

    HTML, CSS, o protocolo HTTP e o JavaScript a correr dentro do navegador

    HTML: a estrutura de uma páginaCSS: dar estilo ao HTMLO protocolo HTTP: como a web comunicaJavaScript no navegador: o DOM
    4 topics · 4 exercisesExplore
  7. Phase 6Persistência

    Bases de Dados e SQL

    Guardar dados de forma permanente e profissional, e falar com eles em SQL

    O que é uma base de dados?Estrutura: tabelas, colunas e chavesSQL de leitura: SELECT, WHERE, ORDER BYSQL de escrita: INSERT, UPDATE, DELETE+1
    5 topics · 4 exercisesExplore
  8. Phase 7Controlo de Versões

    Git e GitHub

    Guardar o histórico do teu código, trabalhar em paralelo e fazer backup na nuvem

    Porque precisamos de controlo de versõesGit local: init, add, commitBranches: trabalhar em paralelo sem medoGitHub: backup na nuvem e partilha
    4 topics · 4 exercisesExplore
  9. Phase 8Fronteira Tecnológica

    IA Aplicada a Coding

    Usar agentes de IA como copiloto, sem deixares de perceber o que o teu código faz

    Agentes de coding: o que mudouMCP e Skills: ligar a IA a ferramentas externasEscolher o modelo certo para cada tarefaComo pedir bem: prompt engineering para código+1
    5 topics · 4 exercisesExplore

The first step is the only hard one

Phase 0 takes about one hour. By the end, your local development environment is set up and ready to code.

Start Phase 0