Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
ec67e72
chore: bootstrap NestJs project
LucasGenova Feb 17, 2026
d711c3c
feat: add boards, columns and cards modules
LucasGenova Feb 17, 2026
42fae9a
feat: implement boards feature and tests
LucasGenova Feb 17, 2026
c1c789e
chore: bootstrap Angular frontend
LucasGenova Feb 17, 2026
558e505
feat: add basic boards component
LucasGenova Feb 17, 2026
48f42a6
chore: enable cors
LucasGenova Feb 17, 2026
e153319
feat: implement columns and cards features with tests
LucasGenova Feb 19, 2026
b3f6250
refactor: snake case to camel case
LucasGenova Feb 19, 2026
39c6f3f
feat: add findByBoard and findByColumn features and associated tests
LucasGenova Feb 19, 2026
8026088
chore: lint project
LucasGenova Feb 19, 2026
36e9977
refactor: frontend project structure
LucasGenova Feb 20, 2026
58477a0
fix: backend modules
LucasGenova Feb 21, 2026
97cf84b
fix: naming issues and config problems
LucasGenova Feb 21, 2026
03b8bb6
feat: add board details component
LucasGenova Feb 21, 2026
2ccc4f0
refactor: boards list component
LucasGenova Feb 21, 2026
cb76a58
feat: add column and cards to board details
LucasGenova Feb 22, 2026
642a1df
feat: add card modal for creating cards
LucasGenova Feb 22, 2026
8bc84d6
fix: minor css tweaks
LucasGenova Feb 22, 2026
fca0b46
feat: add delete endpoints for all entities
LucasGenova Feb 22, 2026
0b0c188
test: add tests for deleting cars, columns and boards
LucasGenova Feb 22, 2026
6259dd1
fix: delete request param
LucasGenova Feb 22, 2026
45c331b
feat: add delete buttons
LucasGenova Feb 23, 2026
197a273
chore: update README.md
LucasGenova Feb 23, 2026
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
251 changes: 37 additions & 214 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,230 +1,53 @@
👨‍💻 Vaga para apaixonados por criação de software
===========================================
# Kanban
Sistema Kanban com frontend em Angular e backend em NestJS.

A empresa
----------
## Pré‑requisitos
- Node.js
- npm (ou yarn)

Somos um [SaaS (Software as a service)](https://pt.wikipedia.org/wiki/Software_como_servi%C3%A7o) para empresas que possuem prestadores de serviços externos.
## Instalação e Execução
### Backend

Entregamos **controle**, **organização** e **melhor relacionamento com o cliente** para empresas de Climatização, Segurança eletrônica, Telecom, Provedores de internet, Montadoras de móveis, Empresas de limpeza, enfim, qualquer empresa que possui uma equipe de campo para realização de serviços.

Nossa missão é melhorar a prestação de serviços no Brasil.

Te convido a conhecer um pouco mais da Field e da nossa **cultura** pelo nosso instagram: [@FieldControl](https://www.instagram.com/fieldcontrol/)

<p>
<img src="assets/fielders.jpeg" width="855"/>
</p>

Origem
----------

Um ponto importante é que a Field foi fundada por desenvolvedores, só por esse motivo você pode **TER CERTEZA** que aqui as coisas são muito diferentes das empresas tradicionais.

Aqui utilizamos [princípios ágeis](http://www.manifestoagil.com.br/) **DE VERDADE** para criação de software. Veja bem, não estou falando de post its ou reuniões em pé.. E sim de: Pair programming, Continuous Integration, Continuous Deployment e claro, testes automatizados.

Condições
----------
- Período: Integral
- Onde: Qualquer lugar :)
- Benefícios: Alimentação, Plano de saúde, Seguro de vida, [Pluralsight](https://www.pluralsight.com/), [Alura](https://www.alura.com.br/), [Amazon Books](https://www.amazon.com/books-used-books-textbooks/b?ie=UTF8&node=283155) <3

:house_with_garden: Você pode ler sobre nossa cidade no [G1](http://g1.globo.com/sao-paulo/sao-jose-do-rio-preto-aracatuba/especial-publicitario/prefeitura-de-rio-preto/rio-preto-noticias/noticia/2015/12/rio-preto-e-melhor-cidade-do-estado-e-segunda-do-pais-para-se-viver.html), [Infomoney](http://www.infomoney.com.br/minhas-financas/consumo/noticia/6391352/melhores-cidades-brasil-para-viver-veja-ranking) ou aqui na [Exame](https://exame.com/brasil/o-ranking-do-servico-publico-nas-100-maiores-cidades-do-brasil/).

Trabalhamos com uma boa infraestrutura, nosso hardware é muito bom (você vai ter um notebook f#d@ com ssd e dois monitores :computer: :computer:) e possuímos um ambiente de trabalho agradável:

<p float="left">
<img src="assets/field3.jpeg" width="215"/>
<img src="assets/field1.jpeg" width="382"/>
<img src="assets/field4.jpeg" width="215"/>
</p>

A empresa não possui hierarquias e você é convidado e desafiado a colaborar com todas as frentes de trabalho. Ou seja, aqui todas sugestões são bem vindas!

Ah, e quando a Field bate meta (quase sempre) o frigobar fica assim:

<p>
<img src="assets/frigobar-da-field-quando-meta-eh-batida.jpeg" width="400" />
</p>

Queremos a cada dia mais flexibilidade e continuar animados a evoluir nossas aplicações.

Nosso trabalho é baseado em autogestão. Só existe uma regra de convivência: É proibido murmurar! Aqui as opiniões são discutidas, resolvidas e sempre chegamos a um consenso para melhorar a nossa convivência. Isso não foi descrito por um gerente de RH e sim por um desenvolvedor de software.

Oportunidade
----------

Estamos em busca de desenvolvedores **Frontend** FODAS e APAIXONADOS para fazer parte do nosso time de produto.

Na Field, o seu dia-a-dia será repleto de:

```javascript
[
'GitHub & Git <3',
'Muito, muito e muito JavaScript',
'Object-oriented programming, SOLID Principles & Design Patterns',
'Práticas e princípios ágeis (Pair programming, Continuous Integration, Continuous Deployment)',
'Testes de software (unitários, integração, e2e..)',
'Desafios de escalabilidade',
'Desafios de alta disponibilidade',
'Micro services e aplicações distribuídas',
'Amazon Web Services',
'PAAS & Cloud Services',
'Serverless apps',
'AngularJS, Angular',
'REST APIs',
'GraphQL APIs',
'Material Design',
'Open source software'
]
```bash
cd kanban\backend
npm install
npm run start:dev
```
A API estará disponível em http://localhost:3000.

Nossa stack tecnológica é predominantemente JavaScript, abrangendo Node.js, Single Page Applications (SPA) e Hybrid Mobile Apps.

Acreditamos firmemente que excelentes desenvolvedores são capazes de selecionar a ferramenta mais adequada para cada desafio. Por essa razão, para resolver problemas específicos, recorremos às melhores alternativas disponíveis, o que nos leva a incluir uma pitada de C#, Java e PHP em nossas soluções.

Nossos servidores residem na AWS, onde utilizamos a nuvem como nossa plataforma principal. Temos aplicativos funcionando com Elastic BeanStalk, armazenamento em S3 e arquiteturas serverless com AWS Lambda.

Antes mesmo de avaliar o conhecimento técnico, valorizamos o perfil pessoal dos candidatos. Para nós, a determinação, o interesse e a curiosidade são qualidades essenciais. Se você é alguém proativo, interessado e que busca constantemente aprender, é isso que realmente importa para nós! 😊

---

## Requisitos Principais

🌟 **Sem Ego**: Acreditamos que ninguém é melhor que ninguém e que todos podem aprender uns com os outros. Promovemos um ambiente onde a humildade, o respeito e a abertura para aprender e ensinar são valorizados.

📈 **Evolução Contínua**: Encorajamos o crescimento pessoal e profissional de todos os membros da equipe. Estamos comprometidos em fornecer oportunidades de aprendizado e desenvolvimento, permitindo que cada indivíduo evolua constantemente em sua jornada.

🚀 **Proatividade**: Buscamos indivíduos proativos, capazes de antecipar problemas e buscar soluções de forma autônoma.

🔑 **Sentimento de Dono**: Valorizamos profissionais que assumem responsabilidade pelo seu trabalho e estão comprometidos com o sucesso do projeto como se fossem os donos.

🤝 **Boa Comunicação e Trabalho em Equipe**: Habilidades de comunicação eficaz e colaboração são essenciais para trabalhar de forma eficiente em equipe.

💻 **Proficiência em JavaScript e TypeScript**: Experiência sólida em JavaScript e TypeScript, demonstrando habilidade em desenvolver soluções robustas e escaláveis.

🎨 **Experiência com CSS e HTML Semântico**: Conhecimento prático em CSS e HTML Semântico para criar interfaces atraentes e acessíveis.

🔧 **Experiência Sólida com Angular e Ionic**: Capacidade comprovada no desenvolvimento com Angular e Ionic, demonstrando habilidade em construir aplicações web e mobile de alta qualidade.

🖌️ **Familiaridade com Princípios de UX**: Compreensão dos princípios de User Experience (UX) para criar interfaces intuitivas e amigáveis aos usuários.

🌐 **Familiaridade com APIs REST, GraphQL e WebSockets**: Conhecimento em APIs REST, GraphQL e WebSockets para comunicação eficiente entre cliente e servidor.

🧪 **Prática em Testar Software**: Experiência prática em testes de software, incluindo testes unitários, integrados e de aceitação, garantindo a qualidade e a confiabilidade do sistema.

Estes requisitos refletem nossa busca por profissionais qualificados e comprometidos, capazes de contribuir de forma significativa para o sucesso de nossos projetos.

O desafio de programação
----------

Se você é apaixonado por desenvolvimento de software e busca desafios para impulsionar sua carreira, este teste é para você! Realize o desafio abaixo e faça um fork deste repositório para começar a codificar. [Let the hacking begin](https://www.youtube.com/watch?v=Dvrdxn0kHL8)! 🚀

# Teste de Programação: Kanban

Este é um teste de programação que consiste em implementar um Kanban, utilizando Angular para o client side e NestJs para o back-end.

O objetivo é avaliar a capacidade do candidato em estruturar um projeto seguindo as boas práticas de ambos os frameworks e implementar um fluxo básico de colunas e cards dentro do Kanban.

## Critérios de Avaliação

Os critérios de avaliação para este teste são os seguintes:

1. **Código Limpo e Organização**: Avalia a clareza, legibilidade e organização do código fonte.

2. **Testes de Software**: Serão avaliados os testes unitários e integrados para garantir a robustez do sistema.

3. **Semântica**: A utilização de nomes significativos para variáveis, funções, classes, etc., será observada.

4. **Documentação do Projeto (README)**: A qualidade e completude da documentação do projeto, que inclui informações sobre como executar, testar e utilizar o sistema.

5. **Segurança**: A adoção de práticas de segurança apropriadas, como proteção contra ataques comuns, será considerada.

## Instruções

1. Implemente um Kanban básico que permita a criação de colunas e cards.
2. Utilize Angular para o desenvolvimento do cliente e NestJs para o desenvolvimento do servidor.
3. Siga as boas práticas de desenvolvimento de software recomendadas pelos frameworks.
4. Implemente testes unitários e integrados para garantir a qualidade e robustez do sistema.
5. Documente o projeto de forma clara e completa neste arquivo README.
### Frontend
```bash
cd kanban\frontend
npm install
npm start
```
A aplicação estará disponível em http://localhost:4200.

## Entrega
## Funcionalidades
- Criar, visualizar e excluir quadros.
- Adicionar e remover colunas em um quadro.
- Adicionar cartões com título e descrição.
- Excluir cartões.

Você deve enviar a resolução do desafio via pull request nesse mesmo repositório ;)
## Tecnologias
- Frontend: Angular (standalone components), RxJS, Tailwind CSS
- Backend: NestJS

## Estrutura do Projeto
### Backend (NestJS)
- `boards (id, name)`: Endpoints para criar, listar todos e deletar.

A estrutura do projeto deve seguir as convenções padrão do Angular e do NestJs, com os arquivos de configuração e código-fonte organizados de maneira lógica e intuitiva.

## Observações

- Certifique-se de que o código está devidamente comentado e documentado para facilitar a compreensão e manutenção futura.
- Evite a utilização de bibliotecas ou frameworks que não sejam necessários para a implementação do Kanban básico.
- Qualquer dúvida ou problema encontrado durante a execução do projeto, entre em contato com os avaliadores.

## Referências

### Angular

- Documentação Oficial do Angular: [Angular Docs](https://angular.io/docs)
- Repositório do Angular no GitHub: [Angular GitHub](https://github.com/angular/angular)

### NestJs

- Documentação Oficial do NestJs: [NestJs Docs](https://docs.nestjs.com/)
- Repositório do NestJs no GitHub: [NestJs GitHub](https://github.com/nestjs/nest)

Estes recursos fornecem uma base sólida para aprender e se aprofundar nos frameworks Angular e NestJs.

## Para Iniciantes

Se você é um iniciante nesta jornada de desenvolvimento, queremos encorajá-lo a participar deste teste e fazer o seu melhor. Na Field, valorizamos a força de vontade, a iniciativa e o desejo de aprender.

Não se preocupe se você não conseguir entregar um projeto perfeito ou completo. O objetivo é que você ganhe experiência, aprenda com o processo e se desafie a ir além do que já conhece.

Aqui estão algumas dicas para ajudá-lo durante o teste:

1. **Comece com o Básico**: Concentre-se em entender os conceitos fundamentais do Angular e do NestJs. Explore tutoriais, documentações e exemplos de código para se familiarizar com as tecnologias.

2. **Divida o Projeto em Etapas**: Em vez de tentar implementar tudo de uma vez, divida o projeto em etapas menores e gerenciáveis. Concentre-se em uma funcionalidade de cada vez e avance gradualmente.

3. **Não Tenha Medo de Errar**: O processo de aprendizado envolve tentativa e erro. Não se preocupe com os erros ou obstáculos que encontrar ao longo do caminho. Eles fazem parte do processo e são oportunidades de aprendizado.

4. **Celebre suas Conquistas**: Cada pequeno progresso é uma conquista. Celebre suas realizações, por menores que sejam, e reconheça o esforço e a dedicação que você está dedicando ao projeto.

Lembre-se, o importante é tentar e aprender durante o processo. Valorizamos sua iniciativa e estamos aqui para apoiá-lo em sua jornada de desenvolvimento. Boa sorte e divirta-se codificando! 🌟

## Diferenciais

Além dos requisitos básicos do teste, a inclusão dos seguintes diferenciais pode agregar valor ao projeto:

### Aplicação Publicada e Rodando

- Configurar e publicar a aplicação em um ambiente de hospedagem como Heroku, Netlify, AWS, Azure, etc., para demonstrar a capacidade de implantar e disponibilizar o sistema para uso real.

### Testes Integrados e E2E

- Implementar testes integrados e end-to-end (E2E) utilizando ferramentas como Jasmine, Protractor, Jest, etc., para garantir a qualidade e estabilidade do sistema em diferentes níveis de teste.

### API em GraphQL ao Invés de REST

- Utilizar GraphQL como interface de programação de aplicativos (API) em vez de REST para oferecer uma forma mais flexível e eficiente de consultar e manipular dados entre o cliente e o servidor.

### Realtime com Socket.io
- `columns (id, boardId, name)`: Endpoints para criar, listar por board e deletar (remove também os cartões vinculados).

- Implementar funcionalidades em tempo real utilizando Socket.io para fornecer uma experiência interativa e dinâmica aos usuários, permitindo atualizações instantâneas e sincronizadas entre os diferentes clientes conectados à aplicação.
- `cards (id, columnId, title, body?)`: Endpoints para criar, listar por coluna e deletar.

A inclusão destes diferenciais demonstrará uma compreensão mais avançada e a aplicação de tecnologias modernas e práticas de desenvolvimento de software, elevando a qualidade e a experiência do usuário final.
### Frontend (Angular)
- `board-list`: Componente que lista todos os boards. Permite criar um novo board e deletar existentes.

- `board-detail`: Componente de detalhes de um board. Exibe as colunas e gerencia a criação/remoção de colunas e cartões.

Dúvidas?
----------
Abra um issue ou me mande um e-mail em **luiz@fieldcontrol.com.br**, fechou? :)
- `column`: Componente que representa uma coluna. Recebe a lista de cartões, exibe os cartões e permite adicionar/deletar cartões.

Gostariamos de entender como você pensa e as decisões que você tomou durante o desenvolvimento. Então, quando for enviar seu pull request, por favor responda:
- `card`: Componente que exibe um cartão (título e corpo) e permite exclusão.

- Qual ferramentas e bibliotecas (libraries, framework, tools etc) você usou
- Porque você optou pela tecnologia X e não a Y
- Quais princípios da engenharia de software que você usou?
- Desafios e problemas que você enfrentou e como você resolveu
- O que você entende que pode ser melhorado e como fazer isso
- `add-card-modal`: Modal para criar um novo cartão com título e descrição.
56 changes: 56 additions & 0 deletions kanban/backend/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
# compiled output
/dist
/node_modules
/build

# Logs
logs
*.log
npm-debug.log*
pnpm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*

# OS
.DS_Store

# Tests
/coverage
/.nyc_output

# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace

# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json

# dotenv environment variable files
.env
.env.development.local
.env.test.local
.env.production.local
.env.local

# temp directory
.temp
.tmp

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
4 changes: 4 additions & 0 deletions kanban/backend/.prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"singleQuote": true,
"trailingComma": "all"
}
Loading