{"id":25602749,"url":"https://github.com/p4dd9/template-phaser-devvit","last_synced_at":"2026-05-05T06:40:52.563Z","repository":{"id":278565286,"uuid":"934849153","full_name":"p4dd9/template-phaser-devvit","owner":"p4dd9","description":"A Devvit Template with Phaser Webview","archived":false,"fork":false,"pushed_at":"2025-03-25T22:29:12.000Z","size":314,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-01T09:52:29.014Z","etag":null,"topics":["devvit","phaser","typescript","vite"],"latest_commit_sha":null,"homepage":"https://www.reddit.com/r/HammertimeStudio/comments/1itxfg9/my_phaser_devvit_app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/p4dd9.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-02-18T14:00:26.000Z","updated_at":"2025-03-25T22:29:15.000Z","dependencies_parsed_at":"2025-02-20T13:40:46.203Z","dependency_job_id":"538da420-3c5f-43dc-bf02-cd0cb76c7210","html_url":"https://github.com/p4dd9/template-phaser-devvit","commit_stats":null,"previous_names":["p4dd9/template-phaser-devvit"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/p4dd9/template-phaser-devvit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/p4dd9%2Ftemplate-phaser-devvit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/p4dd9%2Ftemplate-phaser-devvit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/p4dd9%2Ftemplate-phaser-devvit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/p4dd9%2Ftemplate-phaser-devvit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/p4dd9","download_url":"https://codeload.github.com/p4dd9/template-phaser-devvit/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/p4dd9%2Ftemplate-phaser-devvit/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":273782459,"owners_count":25167134,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-05T02:00:09.113Z","response_time":402,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["devvit","phaser","typescript","vite"],"created_at":"2025-02-21T17:23:53.488Z","updated_at":"2026-05-05T06:40:47.544Z","avatar_url":"https://github.com/p4dd9.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Devvit x Phaser Template\n\nThis is a Devvit project template to create a Webview App with Phaser that uses Vite for bundling. It supports hot-reloading for quick development workflow and includes scripts to create production-ready builds to publish on Reddit.\n\nLive-Demo: https://www.reddit.com/r/HammertimeStudio/comments/1itxfg9/my_phaser_devvit_app/.\n\n![Cute Cube shaped Animal Heads on blue background, as a Splashscreen for a Reddit App Post](./assets/splash_preview.png 'Splashscreen Preview')\n\n### Versions\n\nThis template has been updated for:\n\n- [Devvit 0.11.11](https://www.npmjs.com/package/devvit)\n- [Phaser 3.88.2](https://www.npmjs.com/package/phaser)\n- [Vite 6.1.0](https://github.com/vitejs/vite)\n- [NodeJS 22.12.0](https://nodejs.org/en/blog/release/v22.12.0)\n\n## Before you begin\n\n### Step 1. Register App on Devvit\n\nSkip this step if you have the App identifier at hand. This template assumes you have setup your app on Devvit and installed the Devvit CLI. This means you have an App identifier at your hand. If you do not have this, follow the Devvit instruction via [Intro to Devvit](https://developers.reddit.com/docs/showcase/tutorials/intro-to-devvit) and either select an empty CLI template or initiate a new project **outside** of this project to retrieve the necessary App identifier that we need in the next step.\n\n### Step 2. Setup App in this template\n\nChange the `devvit.yaml` to match your app name you have created in the previous step.\n\n```\nname: \u003cyour-app-identifier\u003e\nversion: \u003cyour-app-version-number\u003e\n```\n\nExample for [Riddonkulous](https://www.reddit.com/r/riddonkulous) Reddit App:\n\n```\nname: riddonkulous\nversion: 1.18.0\n```\n\n### Step 3. Verify\n\nRun `devvit --version` to verify your Devvit CLI is setup correct. The output looks something like this:\n\n```\n$ devvit --version\n@devvit/cli/0.11.11 win32-x64 node-v22.12.0\n```\n\nTo test your App is working properly with the template, run `devvit upload` to upload your current version. Hooray! If that works, you are ready to write code.\n\n## NPM Script\n\n| Command         | Description                                       |\n| --------------- | ------------------------------------------------- |\n| `npm install`   | Install project dependencies                      |\n| `npm run vite`  | Launch local development Server                   |\n| `npm run build` | Create a production build in the `webroot` folder |\n| `npm run dev`   | Start developing in watch mode                    |\n\n## Devvit CLI Commands\n\n| Command                       | Description                                 |\n| ----------------------------- | ------------------------------------------- |\n| `devvit login`                | Log into your current developer account     |\n| `devvit upload`               | Upload your Devvit App to the App directory |\n| `devvit playtest \u003csubreddit\u003e` | Start playtest session in subreddit         |\n\n## Writing Code\n\nAfter cloning the repo, run `npm install` from the projects root directory. Then, you can start the local development server by running `npm run dev`.\n\nThe local development server runs on `http://localhost:5173` by default. This development server is useful to develop your game's webview without the Devvit context, making quick changes and hot-reloading.\n\nOnce the server is running you can edit any of the files in the `src` folder. Vite will automatically recompile your code and then reload the browser.\n\nNote that the Devvit Public API is not available for local development. Instead running the Devvit App in playtest mode will allow you to test your development version.\n\n## Template Project Structure\n\nLet's get started, shall we? This is the basic template project structure :\n\n- `/src/` - Your Devvit and webview code lives inside this directory.\n- `/webroot/` - When you build the webview, productions files are located here.\n- `/assets/` - Contains static assets you can use within Devvits Blocks easily.\n\n---\n\n- `/src/app/` - Devvit related sourcecode to utilize the Devvit Platform features.\n- `/src/game/` - Any Game's Webview related code is inside this directory.\n- `/src/shared/` - You might want to share code between the Devvit and Webview code such as PostMessage types. This is the directory!\n- `/src/main.tsx` - The main entry point for the Devvit App.\n\n## Make your first Build\n\nWether you have written your code or not, it's finally time to create a build that you can upload. Rrun the `npm run build` command, your typescript code is transpiled, assets copied and saved to the `webroot` folder.\n\nOnce you see all your files are transpiled and saved to the `webroot` directory, you want to use `devvit publish` to publish your App version.\n\n## Vite\n\nIf you want to customize your build, you can modify the `vite.config.ts` file. By default the config is configured to work with the `webroot` directory as the build target folder and the `src/game` folder as the webview project directory\n\n## Credits\n\nThe awesome exmpliary assets from this repository are from [Kenney.nl](https://kenney.nl/). Check it out if you are looking for more.\n\nIf you do like working with this template, please give it ⭐.\n\nThis template is created by me [Hammertime Studio](https://hammertime.studio) 🔨\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fp4dd9%2Ftemplate-phaser-devvit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fp4dd9%2Ftemplate-phaser-devvit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fp4dd9%2Ftemplate-phaser-devvit/lists"}