Create a socket after the user authenticated -> Node.js / Socket.io / Mongodb

I'm currently trying to create a socket after the authenticated himself using his credentials.

The current flow is the following:

1. User visits website which is rendered using node.js -> express.
2. User registeres a account -> Account will be saved in a mongodb.
3. User logs in to the website and gets redirected to the authenticated site.

Now I want to create a socket, after the user authenticated himself.

But I'm kind of stuck how to realize this. I've been looking at some kind of tutorials since im new to socket.io such as: https://www.youtube.com/watch?v=tHbCkikFfDE

But this did not work out for my current code.

Question: How could I create the socket.io socket after the user authenticated himself?

My current package.json:

{
    "name": "name",
    "version": "1.0.0",
    "description": "description",
    "main": "app.js",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
    },
    "author": "author",
    "license": "ISC",
    "dependencies": {
        "bcryptjs": "*",
        "body-parser": "*",
        "connect-flash": "*",
        "cookie-parser": "^1.4.1",
        "express": "*",
        "express-handlebars": "*",
        "express-messages": "*",
        "express-session": "*",
        "express-validator": "*",
        "mongodb": "*",
        "mongoose": "*",
        "passport": "*",
        "passport-http": "*",
        "passport-local": "*",
        "socket.io": "*"
    }
}

My current app.js:

var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var exphbs = require('express-handlebars');
var expressValidator = require('express-validator');
var flash = require('connect-flash');
var session = require('express-session');
var passport = require('passport');
var LocalStrategy = require('passport-local'), Strategy;
var mongo = require('mongodb');
var mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/zworld');
var db = mongoose.connection;

var routes = require('./routes/index');
var users = require('./routes/users');
var zworld = require('./routes/zworld');

// Init App
var app = express();

// View Engine
app.set('views', path.join(__dirname, 'views'));
app.engine('handlebars', exphbs({defaultLayout:'layout'}));
app.set('view engine', 'handlebars');

// BodyParser
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use(cookieParser());

// Static Folder
app.use(express.static(path.join(__dirname, 'public')));

// Express Session
app.use(session({
    secret: 'secret',
    saveUninitialized: true,
    resave: true
}));

// Passport Init
app.use(passport.initialize());
app.use(passport.session());

// Express Validator
app.use(expressValidator({
    errorFormatter: function(param, msg, value){
        var namespace = param.split('.'),
        root = namespace.shift(),
        formParam = root;

        while(namespace.length){
            formParam += '[' + namespace.shift() + ']';
        }

        return{
            param : formParam,
            msg : msg,
            value : value
        };
    }
}));

// Connect Flash
app.use(flash());

// Global Vars
app.use(function (req, res, next){
    res.locals.success_msg = req.flash('success_msg');
    res.locals.error_msg = req.flash('error_msg');
    res.locals.error = req.flash('error');
    res.locals.user = req.user || null;
    next();
});

app.use('/', routes);
app.use('/users', users);
app.use('/zworld', zworld);

// Set Port
app.set('port', (process.env.PORT || 3000));

app.listen(app.get('port'), function(){
    console.log('Server started on port ' + app.get('port'));
});

Current dashboard.js:

var express = require('express');
var router = express.Router();

// Get Site
router.get('/dashboard', ensureAuthenticated, function(req, res){
    res.render('dashboard', {username: req.user.username});
});

function ensureAuthenticated(req, res, next){
    if(req.isAuthenticated())
    {
        return next();
    }
    else
    {
        req.flash('error_msg', 'You are not logged in');
        res.redirect('/users/login');
    }
}

module.exports = router;

Current Dashboard HTML:

<body>
    <div class="navbar navbar-inverse">
        <div class="navbar-header">
            <a class="navbar-brand" href="index.html"><img src="/images/logo_light.png" alt=""></a>

            <ul class="nav navbar-nav pull-right visible-xs-block">
                <li><a data-toggle="collapse" data-target="#navbar-mobile"><i class="icon-tree5"></i></a></li>
            </ul>
        </div>

        <div class="navbar-collapse collapse" id="navbar-mobile">

            <ul class="nav navbar-nav navbar-right">
                <li><a href="#">Support</a></li>

                <li>
                    <a href="#">
                        <i class="icon-cog3"></i>
                        <span class="visible-xs-inline-block position-right">Icon link</span>
                    </a>                        
                </li>

                <li class="dropdown dropdown-user">
                    <a class="dropdown-toggle" data-toggle="dropdown">
                        <span></span>
                        <i class="caret"></i>
                    </a>

                    <ul class="dropdown-menu dropdown-menu-right">
                        <li><a href="#"><i class="icon-user-plus"></i> My profile</a></li>
                        <li><a href="#"><i class="icon-coins"></i> My balance</a></li>
                        <li class="divider"></li>
                        <li><a href="#"><i class="icon-cog5"></i> Account settings</a></li>
                        <li><a href="../authenticate.php"><i class="icon-switch2"></i> Logout</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
    <div class="navbar navbar-default" id="navbar-second">
        <ul class="nav navbar-nav no-border visible-xs-block">
            <li><a class="text-center collapsed" data-toggle="collapse" data-target="#navbar-second-toggle"><i class="icon-menu7"></i></a></li>
        </ul>
        <div class="navbar-collapse collapse" id="navbar-second-toggle">
            <ul class="nav navbar-nav">
                <li class="active"><a href=""><i class="icon-display4 position-left"></i> Dashboard</a></li>
                <li><a href="world.php"><i class="icon-heart6 position-left"></i> Enter World</a></li>
                <li><a href=""><i class="icon-user-tie position-left"></i> Wardrobe</a></li>
                <li><a href=""><i class="icon-price-tag position-left"></i> Store</a></li>
                <li><a href=""><i class="icon-cart2 position-left"></i> Shop</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#"><i class="icon-cash3 position-left"></i> 0 Zbucks</a></li>
                <li><a href="#"><i class="icon-credit-card2 position-left"></i> 0 Zcard</a></li>
            </ul>
        </div>
    </div>
    <div class="page-container">
        <div class="page-content">
            <div class="content-wrapper">
                
            </div>
        </div>
    </div>
    <div class="footer text-muted">
        © 2017 pr0b.com
    </div>

    <script>
        $(function(){
            var socket = io.connect();
        });
    </script>

</body>
</html>

Ps: I'm not asking for anyone to code anything for me. I'm literally only asking for some wise words to give me some informations on how to get this working.

I appreciate any kind of help.

via heyitsqueon