This is a rewrite of the original Musare in NodeJS, Express, SocketIO and VueJS. Everything is ran in it's own docker container, but you can also run it without Docker.
The site is available at https://musare.com.
The frontend is a vue-cli generated, vue-loader single page app, that's served over Nginx or express. The Nginx server not only serves the frontend, but also serves as a load balancer for requests going to the backend.
The backend is a scalable NodeJS / Redis / MongoDB app. Each backend server handles a group of SocketIO connections. User sessions are stored in a central Redis server. All data is stored in a central MongoDB server. The Redis and MongoDB servers are replicated to several secondary nodes, which can become the primary node if the current primary node goes down.
We currently only have 1 backend, 1 MongoDB server and 1 Redis server running for production, though it is relatively easy to expand.
Option 1: (not recommended for Windows users)
Option 2:
npm install -g nodemon
Once you've installed the required tools:
git clone https://github.com/Musare/MusareNode.git
cd MusareNode
cp backend/config/template.json backend/config/default.json
Values:
The secret
key can be whatever. It's used by express's session module.
The domain
should be the url where the site will be accessible from, usually http://localhost
for non-Docker.
The serverDomain
should be the url where the backend will be accessible from, usually http://localhost:8080
for non-Docker.
The serverPort
should be the port where the backend will listen on, usually 8080
for non-Docker.
isDocker
if you are using Docker or not.
The apis.youtube.key
value can be obtained by setting up a YouTube API Key.
To set up a GitHub OAuth Application, you need to fill in some value's. The homepage is the homepage of frontend. The authorization callback url is the backend url with /auth/github/authorize/callback
added at the end. For example http://localhost:8080/auth/github/authorize/callback
.
The apis.recaptcha.secret
value can be obtained by setting up a ReCaptcha Site.
The apis.github
values can be obtained by setting up a GitHub OAuth Application.
The apis.discord.token
is the token for the Discord bot.
The apis.discord.loggingServer
is the Discord logging server id.
The apis.discord.loggingChannel
is the Discord logging channel id.
The apis.mailgun
values can be obtained by setting up a Mailgun account.
The redis.url
url should be left alone for Docker, and changed to redis://localhost:6379/0
for non-Docker.
The redis.password
should be the Redis password you either put in your startRedis.cmd
file for Windows, or docker-compose.yml
for docker.
The mongo.url
needs to have the proper password for the MongoDB musare user, and for non-Docker you need to replace @musare:27017
with @localhost:27017
.
The cookie.domain
value should be the ip or address you use to access the site, without protocols (http/https), so for example localhost
.
The cookie.secure
value should be true
for SSL connections, and false
for normal http connections.
cp frontend/build/config/template.json frontend/build/config/default.json
Values:
The serverDomain
should be the url where the backend will be accessible from, usually http://localhost:8080
for non-Docker.
The recaptcha.key
value can be obtained by setting up a ReCaptcha Site.
The cookie.domain
value should be the ip or address you use to access the site, without protocols (http/https), so for example localhost
.
The cookie.secure
value should be true
for SSL connections, and false
for normal http connections.
Now you have different paths here.
####Docker
docker-compose build
Set up the MongoDB database
Disable auth
In docker-compose.yml
remove --auth
from the line command: "--auth"
for mongo.
Start the database
docker-compose up mongo
Connect to Mongo
docker-compose exec mongo mongo admin
Create an admin user
db.createUser({user: 'admin', pwd: 'PASSWORD_HERE', roles: [{role: 'userAdminAnyDatabase', db: 'admin'}]})
Connect to the Musare database
use musare
Create the musare user
db.createUser({user: 'musare', pwd: 'OTHER_PASSWORD_HERE', roles: [{role: 'readWrite', db: 'musare'}]})
Exit
exit
Add back authentication
In docker-compose.yml
add back --auth
on the line command: ""
for mongo.
Start the databases and tools in the background, as we usually don't need to monitor these for errors
docker-compose up -d mongo mongoclient redis
docker-compose up backend frontend
You should now be able to begin development! The backend is auto reloaded when
you make changes and the frontend is auto compiled and live reloaded by webpack
when you make changes. You should be able to access Musare in your local browser
at http://<docker-machine-ip>:8080/
where <docker-machine-ip>
can be found below:
Docker for Windows / Mac: This is just localhost
Docker ToolBox: The output of docker-machine ip default
####Non-docker
Steps 1-4 are things you only have to do once. The steps to start servers follow.
In the main folder, create a folder called .database
Create a file called startMongo.cmd
in the main folder with the contents:
"C:\Program Files\MongoDB\Server\3.2\bin\mongod.exe" --dbpath "D:\Programming\HTML\MusareNode\.database"
Make sure to adjust your paths accordingly.
Set up the MongoDB database
Start the database by executing the script startMongo.cmd
you just made
Connect to Mongo from a command prompt
mongo admin
Create an admin user
db.createUser({user: 'admin', pwd: 'PASSWORD_HERE', roles: [{role: 'userAdminAnyDatabase', db: 'admin'}]})
Connect to the Musare database
use musare
Create the musare user
db.createUser({user: 'musare', pwd: 'OTHER_PASSWORD_HERE', roles: [{role: 'readWrite', db: 'musare'}]})
Exit
exit
Add the authentication
In startMongo.cmd
add --auth
at the end of the first line
In the folder where you installed Redis, edit the redis.windows.conf
file. In there, look for the property notify-keyspace-events
. Make sure that property is uncommented and has the value Ex
. It should look like notify-keyspace-events Ex
when done.
Create a file called startRedis.cmd
in the main folder with the contents:
"D:\Redis\redis-server.exe" "D:\Redis\redis.windows.conf"
And again, make sure that the paths lead to the proper config and executable.
####Non-docker start servers
Automatic
windows-start.cmd
or just double click the windows-start.cmd
file and all servers will automatically start up.Manual
Run startRedis.cmd
and startMongo.cmd
to start Redis and Mongo.
In a command prompt with the pwd of frontend, run npm run development-watch
In a command prompt with the pwd of backend, run nodemon
Below is a list of helpful tips / solutions we've collected while developing MusareNode.
Docker Toolbox usually only gives VirtualBox access to C:/Users
of your
local machine. So if your code is located elsewere on your machine,
you'll need to tell Docker Toolbox how to find it. You can use variations
of the following commands to give Docker Toolbox access to those files.
docker-machine stop default
"C:\Program Files\Oracle\VirtualBox\VBoxManage.exe" sharedfolder add default --name "d/Projects/MusareNode" --hostpath "D:\Projects\MusareNode" --automount
docker-machine start default && docker-machine ssh default
Tell boot2docker to mount our volume at startup, by appending to its startup script
sudo tee -a /mnt/sda1/var/lib/boot2docker/profile >/dev/null <<EOF
mkdir -p /d/Projects/MusareNode
mount -t vboxsf -o uid=1000,gid=50 d/Projects/MusareNode /d/Projects/MusareNode
EOF
docker-machine restart default
Some people have had issues while trying to execute the docker-compose
command.
To fix this, you will have to run docker-machine env default
.
This command will print various variables.
At the bottom, it will say something similar to @FOR /f "tokens=*" %i IN ('docker-machine env default') DO @%i
.
Run this command in your shell. You will have to do this command for every shell you want to run docker-compose
in (every session).
npm install nodemon -g
npm install webpack -g
npm install node-gyp -g
.
In both frontend
and backend
folders, do npm install
.
nodemon backend/index.js
You can call Toasts using our custom package, vue-roaster
, using the following code:
import { Toast } from 'vue-roaster';
Toast.methods.addToast('', 0);
There are multiple ways to contact us. You can send an email to musaremusic@gmail.com or krisvos130@gmail.com.
You can also message us on Facebook, Twitter or on our Discord.