Crie um Gerenciador de Arquivos do Zero em .NET Core e VueJS

Image for post
Image for post

Fala devs, blz ?

No artigo de hoje trago uma versão de um gerenciador de arquivo feito em .NET Core + Vue + Vuetify ♥.

O artigo de hoje foi desenvolvido em parceria com o meu mentor Fabio Silva Lima.

Onde ele desenvolveu uma Web API em .NET Core para listar todos os diretórios de um OS e seus arquivos usando alguns designs patterns.

Te convido a baixar o e-book do Fabio Silva Lima, onde ele explica os principais designs patterns e com certeza vai te dar outra perspectiva sobre desenvolvimento de software.

Image for post
Image for post

Projeto

Vamos criar um gerenciador de arquivos em vue + vuetify, e consumir um serviço REST que lista todos os diretórios informados do OS que você está.

Web Api

Você pode ver como a Web Api foi desenvolvida, os designs patterns utilizados diretamente no artigo que o Fabio Silva Lima publicou em seu blog.

Fonte

Você pode baixar o font direito do github clicando aqui

Resultado Final

Desafios

1- Consumir um serviço HTTP

2- Entender como o component de tree-view do vuetify funciona.

3- Aplicar lógica necessária para conseguirmos fazer nosso gerenciador ❤

1- Consumir a API — AXIOS

Image for post
Image for post
Métodos para retornar os items

2 — Treeview vuetify

Image for post
Image for post
Component de treeview vuetify

3 —Component Treeview do vuetify

O component de treeview que utilizamos faz todo o trabalho sujo por debaixo dos panos,

cuidando de toda a parte de recursão que é necessária para um treeview funcionar.

Cada vez que expandimos um node o componente chama a função fetchChildrens novamente.

Considerações Finais

Vue + vuetify, oferece o que há de mais atual para desenvolvermos SPA e PWA com uma facilidade absurda, reduzindo tempo e linhas de código. Vuejs tem uma comunidade gigantesca que só vem crescendo ainda mais com a popularização do vue.

Achou algum erro? Curtiu? Não curtiu?

Por favor comente e compartilhe!

Obrigado e até a próxima.

Written by

Desenvolvedor .NET, apaixonado por JS, fifa e um bom e velho rock n roll .

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store