From be8b9459f1ff510d0af39254ad4b286fbc97f26f Mon Sep 17 00:00:00 2001
From: Fran <fran@xyvs.io>
Date: Wed, 29 Dec 2021 10:56:23 -0600
Subject: [PATCH] Update README.md

---
 README.md | 57 +++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 53 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index c0793a8..6400159 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,56 @@
-# Vue 3 + Vite
+<div id="top"></div>
 
-This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+<!-- PROJECT LOGO -->
+<br />
+<div align="center">
 
-## Recommended IDE Setup
 
-- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
+  <h3 align="center">VisualTree</h3>
+  <img src="https://user-images.githubusercontent.com/30842498/147685192-7071225f-34bf-46fb-9c3f-a00f946addd8.png" alt="Preview" >
+  <p align="center">
+    A tool that allows you to visualize and interact with the output of your tree command.
+    <br />
+    <a href="https://github.com/othneildrew/Best-README-Template">View Demo</a>
+  </p>
+
+</div>
+
+
+<!-- ABOUT THE PROJECT -->
+## About The Project
+
+This tool allows you to interact with the output of you tree command, which is pretty useful in case you want to archive your file structure at some point and be able to interact with it later.
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+<!-- GETTING STARTED -->
+## Getting Started
+
+To get a local copy up and running follow these simple example steps.
+
+### Installation
+
+1. Clone the repo
+   ```sh
+   git clone https://github.com/xyvs/visualtree.git
+   ```
+2. Install NPM packages
+   ```sh
+   npm install
+   ```
+3. Run the server
+   ```sh
+   npm run dev
+   ```
+4. Go to [localhost:3000](https://localhost:3000)
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
+<!-- LICENSE -->
+## License
+
+Distributed under the MIT License. See `LICENSE.txt` for more information.
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+