Repositório oficial da Plataforma de Exercícios da Formação Typescript

Este repositório será a base da plataforma onde os estudantes irão praticar typescript

Roadmap

v0 - Definição - PoC Mock

• Estabelecer modelo de dados.
  • Optamos por: "Trilhas/Jornadas" macro, que dentro tem vários "Tópicos/Temas" menores, cada um com várias "Atividades/Exercícios" mão na massa.
• Renderizar exercícios a partir de arquivos .md (Markdown)
• Renderizar atividades de código usando o Monaco Editor
• Definir sistema de estilização padronizado e customizável
• Definir sistema de roteamento e aninhamento de rotas da aplicação.
  • Optamos por: React Router DOM com no máximo 2 níveis de aninhamento, para evitar problemas com a integração do Monaco Editor. Portando a navegação principal fica: base-url/journey/ts-pra-iniciantes/topic/tipos-primitivos?activityId=string-e-boolean
• Estabelecer modelo de dados persistidos do usuário
  • Permitir tracking de quais atividades o usuário já fez
  • Permitir armazenamento de badges/conquistas e XP (estratégias a definir)
  • Implementar armazenamento local (usuários não-autenticados).
• Definir integração utilitária com local storage

v1 - Lançamento - deploy

• Definir estratégia de indexação e consumo dos exercícios em Markdown a partir do github
• Implementar uso da indexação e metadados do github na plataforma
• Implementar carregamento de Jornadas, Tópicos e Atividades sob demanda
• Implementar renderização de exercícios com base na versão disponibilizada no github
• Implementar deploy no Github Pages
• Definir estratégias de Login/SSO
  • Integração com SSO do discord
• Ajustar navegação/usabilidade da aplicação
  • Refatoração do consumo de metadados em JSON e Markdown
  • Implementar skeleton loading nas páginas principais (dasboard e listagem de tópicos)
  • Implementar skeleton loading na página de atividades
  • Permitir usuário marcar/desmarcar atividade feita
  • Alterar card de jornada
  • Adicionar animação de transição de página na jornada
  • Alterar card de tópicos
• Alterar área do usuário
  • Widget "minha conta"
  • Login rápido com discord
  • Mostrar nome do usuário
• Definir integração com storage em nuvem (Deno Kv)
• Ajustar renderizador de exercícios
  • Remover frontmatter antes do rendering

v2-vX - Melhorias (escopo a definir)

Backlog da v1:

• Alterar área do usuário
  • Mostrar foto do usuário (requer integração com discord)
• Ajustar renderização dos códigos (Aplicar melhorias sugeridas)
  • Mais espaço pro editor no container
  • Permitir resize da atividade e/ou editor em fullscreen
• Refatorar para melhor manutenção

A definir:

• Salvar alterações no código localmente em base64?
  • compensa salvar elas em nuvem?
• Adicionar suporte pra dispositivos móveis?
• Showcase da comunidade e contribuições dos alunos

  Brainstorm rápido a ser discutido no futuro: Salvar as soluções de cada aluno pras atividades? Talvez só pras atividades mais complexas no futuro? Permitir que os alunos compartilhem/vejam as soluções, tipo num “fórum stackoverflow de soluções”?

Sobre o projeto

Idéia geral

A idéia é construir uma plataforma de resolução de exercícios Typescript que:

• Sirva como um material de apoio direto ao curso (afinal um dos grandes pontos positivos do curso em si é ter a organização do conteúdo e uma estrutura definida pra seguir)
• Seja um projeto open-source da comunidade, Incentivando os alunos a aprender a colaborar em projetos open-source (e, consequentemente, usar o github. Ou seja: forks, issues, PRs. O ideal é documentar esses processos no projeto e na comunidade do discord, trazendo algumas atividades que incentivem os alunos - mais detalhes abaixo)
• Seja aberta à todos (alunos ou não), “free-forever” e 100% código aberto

Uso da plataforma e funcionalidades

• Plataforma aberta:

  • Sem login necessário, porta de entrada da comunidade, simples e rápido, acesso direto ao conteúdo com os exercícios
  • Acesso a todos os exercícios
  • Linkar material de apoio aberto (artigos públicos e/ou do Lucas)
  • Linkar material de apoio extra (links - ou somente menções - pra aulas relevantes da formação pra quem for aluno ter acesso fácil)
  • Organização de conteúdo por módulo
  • Aulas escritas + exercícios. Os exercícios não serão somente um “codepen”, mas sim uma mini-aula voltada a um assunto, possivelmente com várias sessões de exercícios numa mesma “aula”

• Área persistente:

  • Login da plataforma
  • Salvar checklist de atividades feitas
  • Contagem arbitrária de pontos (XP)
  • Possibilita estratégias de gamificação e criação de comunidade com a resolução dos exercícios no futuro

• Showcase da comunidade:

  • Área(s) onde incentivamos as contribuições open-source dos alunos, trazendo áreas que reflitam atividades passadas pra fomentar a parte da colaboração
  • Exemplo 1: Uma área chamada “membros da comunidade”, onde mostramos um badge com a imagem de cada entusiasta(não aluno)/aluno, e redes como linkedin, discord e github dele, mas o diferencial é que essa é uma atividade “hello world” onde o aluno forka o projeto e submete um PR colocando o card dele na comunidade - ou seja: Só quem aparece na área de membros da comunidade é quem interagiu com o projeto e subiu um PR!
  • Exemplo 2: Seguindo o mesmo conceito de “o aluno cria o próprio card com algumas informação e submete”, podemos ter uma área chamada “projetos da comunidade”, onde o aluno pode expor algum projeto que ele fez (exemplo: pokedex em React com TS), mas pro card estar lá o aluno precisa submeter um PR onde ele mesmo monta o card com algumas imagens do projeto, descrição, um tutorial breve de como foi feito (opcional), e outras informações úteis (deixando tipo uma “steam de projetos dos alunos/não alunos” - que pode ser ótimo pra quem tiver começando e quiser buscar inspirações de projetos pessoais pra fazer)

Como contribuir?

TODO: Adicionar tutorial sobre forks/PRs e outras estratégias necessárias pra contribuir com o projeto

Como executar o projeto?

TODO: tutorial de como executar o projeto

FAQ

TODO: Adicionar FAQ se necessário