diff --git a/client/app/domain/negociacao/Negocioacao.js b/client/app/domain/negociacao/Negocioacao.js
new file mode 100644
index 00000000..fc732e6c
--- /dev/null
+++ b/client/app/domain/negociacao/Negocioacao.js
@@ -0,0 +1,24 @@
+class Negociacao {
+    constructor (data, quantidade, valor) {
+        this._data = data;
+        this._quantidade = quantidade;
+        this._valor = valor;
+        Object.freeze(this);
+    }
+
+    get valor() {
+        return this._valor;
+    }
+
+    get data() {
+        return this._data;
+    }
+
+    get quantidade() {
+        return this._quantidade;
+    }
+
+    get volume() {
+        return this._quantidade * this._valor;
+    }
+}
diff --git a/client/app/index.js b/client/app/index.js
new file mode 100644
index 00000000..af3337a6
--- /dev/null
+++ b/client/app/index.js
@@ -0,0 +1,37 @@
+
+var campos = [
+    document.querySelector('#data'),
+    document.querySelector('#quantidade'),
+    document.querySelector('#valor')
+];
+
+console.log(campos);
+
+var tbody = document.querySelector('table tbody');
+
+document.querySelector('.form').addEventListener('submit', function(event) {
+    event.preventDefault();
+    var tr = document.createElement('tr');
+    
+    campos.forEach(function(campo) {
+        var td = document.createElement('td');      
+        td.textContent = campo.value;       
+        tr.appendChild(td);
+
+    })
+    
+    var tdVolume = document.createElement('td');
+    tdVolume.textContent =  campos[1].value * campos[2].value;
+    tr.appendChild(tdVolume);
+    tbody.appendChild(tr);
+    
+    campos[0].value = '';
+    campos[1].value = '1';
+    campos[2].value = '0';
+    campos[0].focus();
+    
+    
+});
+
+
+
diff --git a/client/css/bootstrap-theme.css b/client/css/bootstrap-theme.css
index ebe57fbf..2d46917c 100755
--- a/client/css/bootstrap-theme.css
+++ b/client/css/bootstrap-theme.css
@@ -584,4 +584,4 @@ fieldset[disabled] .btn-danger.active {
   -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
           box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
 }
-/*# sourceMappingURL=bootstrap-theme.css.map */
+# sourceMappingURL=bootstrap-theme.css.map
diff --git a/client/css/bootstrap.css b/client/css/bootstrap.css
index 42c79d6e..f7898853 100755
--- a/client/css/bootstrap.css
+++ b/client/css/bootstrap.css
@@ -6757,4 +6757,4 @@ button.close {
     display: none !important;
   }
 }
-/*# sourceMappingURL=bootstrap.css.map */
+# sourceMappingURL=bootstrap-theme.css.map
diff --git a/client/index.html b/client/index.html
index 32698782..dc4a326b 100755
--- a/client/index.html
+++ b/client/index.html
@@ -58,6 +58,11 @@ <h1 class="text-center">Negociações</h1>
         <tfoot>
         </tfoot>
     </table>
+    <script src='app/domain/negociacao/Negocioacao.js'></script>
+    <script>
+        var n1 = new Negociacao(new Date(), 5, 700);
+        console.log(n1.data, n1.quantidade, n1.valor, n1.volume);
     
+    </script>
 </body>
 </html>
\ No newline at end of file