diff --git a/src/components/chat/chat.js b/src/components/chat/chat.js
new file mode 100644
index 00000000..3b84bd3d
--- /dev/null
+++ b/src/components/chat/chat.js
@@ -0,0 +1,26 @@
+const chat = {
+ data () {
+ return {
+ messages: [],
+ currentMessage: '',
+ socket: this.$store.state.users.socket,
+ channel: null
+ }
+ },
+ created () {
+ this.channel = this.socket.channel('chat:public')
+ this.channel.on('new_msg', (msg) => {
+ this.messages.push(msg)
+ this.messages = this.messages.slice(-19, 20)
+ })
+ this.channel.join()
+ },
+ methods: {
+ submit(message) {
+ this.channel.push('new_msg', {text: message}, 10000)
+ this.currentMessage = '';
+ }
+ }
+}
+
+export default chat;
diff --git a/src/components/chat/chat.vue b/src/components/chat/chat.vue
new file mode 100644
index 00000000..9d3ab39c
--- /dev/null
+++ b/src/components/chat/chat.vue
@@ -0,0 +1,49 @@
+
+
+
+
+ {{$t('chat.title')}}
+
+
+
+
+
+
+
+ {{message.author.username}}:
+
+
+ {{message.text}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+