With this app you can search a song from your favorite artist. After finding the song you were looking for, you can click on the song and it will send you to a chatroom. Here you can live chat with other users about the song.
- Combine birthdates of artist/icons to the currentdate on the homepage and link that to a chat
- Create a sticy scroll for the chat
- Show how many users are online
- http
- express // Express web server framework
- body-parser // parses the body of an http-request to JSON
- express-session // to save information in a session
- superagent // to make a http request
- shortid //Produces an id
- socket.io // for real-time communication
- node-vibrant // Color extracter
I used the spotify api to gain access to all the songs and artists.
I used express-session to create an access token that only last a session. This way every user can access multiple chats with the same ID and nickname.
if(req.session.userID === undefined){
// generate id for new user
var userID = shortid.generate();
// save id to session
req.session.userID = userID;
// save id to users "database"
users[userID] = {
name: 'Ano niem'
}
}I used Socket.io for the real time connection for sending messages.
// Receive a message from the message form
socket.on('message', function(messageData) { // [2]
var trackID = messageData.trackID;
var message = messageData.message;
var userID = messageData.userID;
var username = users[userID].name;
var message = {
userID: userID,
message: message,
date: new Date()
};
// Update "database"
chatrooms[trackID].messages.push(message);
// Add the username to the message before we send it to the other clients
message.username = username;
// Send message to all clients without sender
socket.broadcast.emit('message', message); // [3]
});First clone the repo:
git clone https://github.com/GiuliaM/rtw.git
After that:
npm install
Now start up the server:
npm start
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent