Virtual Math Teams (VMT) provides a collaboration infrastructure for visual math and geometry tools, such as Geogebra and Desmos. To provide this infrastructure, this version uses React.js and Redux.js, express and sockets.io. see 'Installation' below.
- For non-commercial uses, this application is licensed under the AGPL license.
- Any use of VMT for commercial purposes is subject to and requires a special license to be negotiated with Mathematical Thinking.
- See VMT license details
To provide the collaboration infrastructure, this application uses a combination of:
In its current state, VMT is tightly linked with EnCOMPASS. When a user signs up with VMT, they also receive an EnCOMPASS account which has the same username (and vice versa). If a user is logged in to one app, they will also be logged in to the other app. As a result, you must also be running mt-sso (EnCOMPASS is not required) for user registration and login to work properly. If you do not need signup functionality while developing, then you do not need to be running EnCOMPASS.
If you wish to run VMT separately, then you just need to remove the existing auth routes (server/routes/auth) and middleware (server/middleware/mt-auth) and put in your own system. There are also routes used solely by EnCOMPASS that could be removed (server/routes/enc).
- Fork this repo (instructions)
$ cd vmt/server && npm install$ cd ../client && npm install$ cd ..$ cp .env.example .envNote that the client .env contains very little and will soon be deprecated. Instead, client environment variables are provided by the server. In the server .env file, prefix client variables with REACT_APP_. They will be available in the client code via window.env.REACT_APP_XXX (global variables).- Make sure you have mongodb installed. instructions here
- From anywhere on your computer run
$ mongod --dbpath <some-new-dir-for-db>where<some-new-dir-for-db>is a directory for MongoDB data then cd back to the vmt/ and... $ npm run devThis will start the react development server on port 3000 and the express server on 3001 N.B., you'll need to have nodemon and concurrently installed these are included in the dev dependencies but you may need to install them globally.$ npm i -g nodemon concurrently- We utilize prettier for formatting.
To deploy this project to staging or production go to the root level directory and run
$ sh deploy-mac.sh <username> <environment> where environment = production || staging
This can only be done by the core contributors.
git checkout maingit pull --rebase upstream maingit push origin maingit checkout -b feature-branchgit add/git commit(on feature branch)- To close an issue, add 'closed #[github issue number]' to commit message
git pull --rebase upstream main(on feature branch)git push origin feature-branch- Submit pull request (your feature branch to upstream main)
- Go to Step 5 in Git Rebase flow.
git checkout maingit pull --rebase upstream maingit push origin main
git checkout maingit branch -d feature-branch
git remote -vto see remote originsgit remote add upstream https://github.com/mathematicalthinking/encompass.git- if existing upstream
git remote rm upstream
We use Prettier Add the VS code extension and configure it to format on save.
We utilize Cypress for end to end testing
To run the tests restart the server in test mode npm run test
A cypress window will open allowing you to run one or all the integration tests.
There are one million and one ways to structure a react app. I've found the following structure to work well enough.
App.js serves as the entry point of the application and exposes the Redux store and react-router to the rest of the application.
There are two primary routes. / for
guest users and /myVMT for logged in users.
Containers come in one of two forms. Either they inject props into a component from the redux store. Or they manage shared local (i.e. non-redux) state for two or more react components (or they do both).
The layout directory is for organizing...layouts. Each file roughly corresponds to a page.
The shared/reusable UI parts of the app live here
This project was bootstrapped with this template refer to its README for additional information regarding the directory structure.