gaurav-gogia/index.html

## index.html
<!DOCTYPE html>
<html lang="en">

<head>
    <script src="https://cdn.jsdelivr.net/npm/@aspnet/signalr@1.0.2/dist/browser/signalr.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>SignalR 2018</title>
</head>

<body>
    <div id="app">
        <form v-on:submit.prevent="addMessage">
            <input type="text" v-model="newMessage" />
            <input type="submit" value="Send" />
        </form>
        <ul>
            <li v-for="message in messages">{{ messages }}</li>
        </ul>
    </div>

    <script>
        (async () => {
            const url = "/app";
            const send = "Send";
            const recieve = "Recieve";
            const connection = new signalR.HubConnectionBuilder().withUrl(url).build();

            const app = new Vue({
                el: "#app",
                data: {
                    messages: [],
                    newMessage: null
                },
                methods: {
                    async addMessage() {
                        await connection.invoke(send, this.newMessage);
                        this.newMessage = null;
                    }
                }
            });

            connection.on(recieve, message => {
                app.messages.push(message);
            });

            await connection.start();
        })();
    </script>
</body>

</html>
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<script src="https://cdn.jsdelivr.net/npm/@aspnet/signalr@1.0.2/dist/browser/signalr.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>SignalR 2018</title>
	</head>

	<body>
	<div id="app">
	<form v-on:submit.prevent="addMessage">
	<input type="text" v-model="newMessage" />
	<input type="submit" value="Send" />
	</form>
	<ul>
	<li v-for="message in messages">{{ messages }}</li>
	</ul>
	</div>

	<script>
	(async () => {
	const url = "/app";
	const send = "Send";
	const recieve = "Recieve";
	const connection = new signalR.HubConnectionBuilder().withUrl(url).build();

	const app = new Vue({
	el: "#app",
	data: {
	messages: [],
	newMessage: null
	},
	methods: {
	async addMessage() {
	await connection.invoke(send, this.newMessage);
	this.newMessage = null;
	}
	}
	});

	connection.on(recieve, message => {
	app.messages.push(message);
	});

	await connection.start();
	})();
	</script>
	</body>

	</html>