Change events naming convention and split js code

Public/index.html

@@ -38,7 +38,7 @@
                 <div class="pt-4">
                     <form id="chat">
                         <div class="form-group">
-                            <label for="exampleInputEmail1">Username</label>
+                            <label for="exampleInputEmail1">Name</label>
                             <input type="text" class="form-control" name="username">
                         </div>
                         <div class="form-group">
@@ -73,38 +73,7 @@
             integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
             crossorigin="anonymous"></script>
 
-        <script type="text/javascript">
+        <script src="./socket.js"></script>
-            var socket = io('http://192.168.0.25:3333');
-
-            function renderMessage(message) {
-                $('#messages').append(`<li class="list-group-item"><strong>${message.author}:</strong> ${message.content}</li>`);
-            }
-
-            socket.on('previousMessages', function (messages) {
-                for (message of messages) {
-                    renderMessage(message);
-                }
-            });
-
-            socket.on('receiveMessage', function (message) {
-                renderMessage(message);
-            });
-
-            $('#chat').submit(function (event) {
-                event.preventDefault();
-
-                var author = $('input[name=username]').val();
-                var content = $('textarea[name=message]').val();
-
-                if (author.length && content.length) {
-                    var messageObj = { author, content }
-                }
-
-                renderMessage(messageObj);
-
-                socket.emit('sendMessage', messageObj);
-            })
-        </script>
     </body>
 
 </html>

Public/socket.js

@@ -0,0 +1,30 @@
+var socket = io('http://192.168.0.25:3333');
+
+function renderMessage(message) {
+    $('#messages').append(`<li class="list-group-item"><strong>${message.author}:</strong> ${message.content}</li>`);
+}
+
+socket.on('previous-messages', function (messages) {
+    for (message of messages) {
+        renderMessage(message);
+    }
+});
+
+socket.on('receive-message', function (message) {
+    renderMessage(message);
+});
+
+$('#chat').submit(function (event) {
+    event.preventDefault();
+
+    var author = $('input[name=username]').val();
+    var content = $('textarea[name=message]').val();
+
+    if (author.length && content.length) {
+        var messageObj = { author, content }
+    }
+
+    renderMessage(messageObj);
+
+    socket.emit('send-message', messageObj);
+});

Source/Server.js

@@ -29,11 +29,11 @@ let messages = [];
 io.on('connection', socket => {
     console.log(`Socket ${socket.id} connected`);
 
-    socket.emit('previousMessages', messages);
+    socket.emit('previous-messages', messages);
 
-    socket.on('sendMessage', data => {
+    socket.on('send-message', data => {
         messages.push(data);
-        socket.broadcast.emit('receiveMessage', data);
+        socket.broadcast.emit('receive-message', data);
     })
 })