diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..b512c09
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+node_modules
\ No newline at end of file
diff --git a/dist/dicas/github.md b/dist/dicas/github.md
new file mode 100644
index 0000000..e69de29
diff --git a/dist/dicas/javascript.md b/dist/dicas/javascript.md
new file mode 100644
index 0000000..e69de29
diff --git a/dist/index.html b/dist/index.html
new file mode 100644
index 0000000..5507fca
--- /dev/null
+++ b/dist/index.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+ Document
+
+
+ Hello
+
+
+
\ No newline at end of file
diff --git a/dist/js/dicas.js b/dist/js/dicas.js
new file mode 100644
index 0000000..5fab373
--- /dev/null
+++ b/dist/js/dicas.js
@@ -0,0 +1,52 @@
+const DIRETORIOS_ROOT_ELEMENT_ID = '#section-diretorios';
+/**
+ * Obtém automaticamente os arquivos contidos em /dicas e os identifica como diretórios
+ */
+function obtemDiretorios() {
+ return fetch('/dicas', {
+ headers: [['Content-type', 'text/html']]
+ // extrai o texto da página
+ }).then(
+ (data) => data.text()
+ // manipula a string para obter a arvore HTML que lista os diretórios
+ ).then(
+ (text) => {
+ const dicasBodyContent = text
+ .replace(/\n/g, '')
+ .replace(/\s{2,}/g, '')
+ .replace(/^.*(.*?)<\/body>.*$/, '$1');
+ const virtualDOM = document.createElement('div');
+ virtualDOM.innerHTML = dicasBodyContent;
+ let files = virtualDOM.querySelectorAll('li');
+ // o primeiro filho é sempre um elemento vazio de retorno
+ [_, ...files] = files;
+ // extrai apenas o dado importante, o nome do arquivo
+ files = files.map(( file ) => file.firstChild.firstChild.innerText.replace('.md', ''))
+ return files;
+ }
+ );
+}
+
+/**
+ * Pega uma lista de diretórios e transforma em HTML para renderizar como navegação
+ * @param {Array} diretorios - ex: [github.md, javascript.md]
+ * @returns
+ */
+function renderizaDiretorios(diretorios) {
+ const navElements = diretorios.map(diretorio => {
+ const navElement = document.createElement('nav');
+ navElement.innerHTML = `Dicas de ${diretorio[0].toUpperCase()+diretorio.substring(1)}`;
+ return navElement;
+ });
+ const diretorioRootElement = document.querySelector(DIRETORIOS_ROOT_ELEMENT_ID);
+ navElements.forEach((element) => diretorioRootElement.appendChild(element));
+}
+
+/**
+ * Assim que o arquivo é carregado, os diretórios são lidos e renderizados
+ */
+function onLoad() {
+ obtemDiretorios()
+ .then(renderizaDiretorios)
+ ;
+}
\ No newline at end of file
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..8da5818
--- /dev/null
+++ b/package.json
@@ -0,0 +1,28 @@
+{
+ "name": "feminisdicas",
+ "version": "0.0.1",
+ "description": "Um repositório open source contendo dicas da feministech para diversas áreas de tecnologia",
+ "main": "index.html",
+ "repository": {
+ "type": "git",
+ "url": "git+https://github.com/feministech/feminisdicas.git"
+ },
+ "keywords": [
+ "feministech",
+ "dicas",
+ "tecnologia",
+ "opensource"
+ ],
+ "author": "Feministech",
+ "license": "ISC",
+ "bugs": {
+ "url": "https://github.com/feministech/feminisdicas/issues"
+ },
+ "homepage": "https://github.com/feministech/feminisdicas#readme",
+ "scripts": {
+ "serve": "npx live-server ./dist --host=localhost"
+ },
+ "devDependencies": {
+ "live-server": "^1.2.2"
+ }
+}