A game on top of Azure Automatic Grading Engine project.
Students have to finish task to create or configure Azure resources and wins the coins.
You need to create the service principal of reader role for 1 subscription.
az ad sp create-for-rbac --role="Reader" --scopes="/subscriptions/<Your Subscription ID>"
Install nvm and use node 16 https://github.com/nvm-sh/nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh | bash
Close terminal, and use a new terminal
nvm install 16
nvm use 16
npm i
npm install -g @azure/static-web-apps-cli
Reference https://learn.microsoft.com/en-us/azure/static-web-apps/local-development
npm run build
cd api && npm i
cd ..
swa start build --api-location api
You can skip build command if you are just modifed the managed function.
And, you can deploy the reactjs website to Azure Blob Storage Static Website or use Azure Static Web Apps
You have to deploy
- AzureAutomaticGradingEngine_Assignments
- AzureAutomaticGradingEngine And, record down Azure Function Urls and function key.
The Codespace includes Terraform and this project constain a CDK-TF project for deployment.
Rename .env.template to .env
.
GITHUB_TOKEN=<GitHub Token (classic) with repo and delete_repo permission for Terraform.>
COURSE=<Your course partition key>
GAME_TASK_FUNCTION_URL=<Azure Game Task Function Url with function key.>
GRADER_FUNCTION_URL=<Azure Grader Function Url with function key.>
GET_API_KEY_FUNCTION_URL=<Azure Function Url with function key to get student's service principal.>
For local development, Rename local.settings.template
to local.settings.json.
And update it as .env
{
"IsEncrypted": false,
"Values": {
"AzureWebJobsStorage": "",
"FUNCTIONS_WORKER_RUNTIME": "node",
"course":"devops",
"getApikeyUrl":"https://xxx.azurewebsites.net/api/GetApiKeyFunction?code=",
"graderFunctionUrl":"https://xxx.azurewebsites.net/api/AzureGraderFunction",
"gameTaskFunctionUrl":"https://xxx.azurewebsites.net/api/GameTaskFunction?code=",
"storageAccountConnectionString": ""
}
}
Login your Azure and set the default subscription.
az login --use-device-code
az account set -s <subacription id>
az account show
Run CDK-TF
./deploy.sh
There is a better version of this project here: https://github.com/blopa/top-down-react-phaser-game-template
Made with an ejected Create React App.
Read moe about this project:
- https://pablo.gg/en/blog/coding/how-to-create-a-top-down-rpg-maker-like-game-with-phaser-js-and-react
- https://pablo.gg/en/blog/coding/i-made-a-top-down-game-version-of-my-blog-with-phaser-and-react/
This game would not be possible without the help of some amazing people and their work, so here is my list of special thanks.
- Pablo Benmaman for the project.
- photonstorm, for creating Phaser.io.
- Annoraaq, for creating the grid-engine plugin.
- ArMM1998, for the characters sprites and tilesets.
- PixElthen, for the slime sprites.
- pixelartm, for the pirate hat sprites.
- jkjkke, for the Game Over screen background.
- KnoblePersona, for the Main Menu screen background.
- Min, for the open book sprite.