{"id":18317479,"url":"https://github.com/telegram-mini-apps/solidjs-js-tsdk-template","last_synced_at":"2025-08-25T18:30:37.332Z","repository":{"id":246106600,"uuid":"820097147","full_name":"Telegram-Mini-Apps/solidjs-js-tsdk-template","owner":"Telegram-Mini-Apps","description":"Telegram Mini Apps application template using Solid, JavaScript and Vite.","archived":false,"fork":false,"pushed_at":"2024-07-16T15:04:40.000Z","size":429,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2024-11-05T18:06:10.939Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Telegram-Mini-Apps.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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":"2024-06-25T19:44:29.000Z","updated_at":"2024-09-02T16:24:13.000Z","dependencies_parsed_at":"2024-06-25T22:17:56.511Z","dependency_job_id":"9698045e-f1cb-4338-b17e-db3964cc4ec3","html_url":"https://github.com/Telegram-Mini-Apps/solidjs-js-tsdk-template","commit_stats":null,"previous_names":["telegram-mini-apps/solidjs-js-tsdk-template"],"tags_count":0,"template":true,"template_full_name":"Telegram-Mini-Apps/solidjs-js-template","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telegram-Mini-Apps%2Fsolidjs-js-tsdk-template","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telegram-Mini-Apps%2Fsolidjs-js-tsdk-template/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telegram-Mini-Apps%2Fsolidjs-js-tsdk-template/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telegram-Mini-Apps%2Fsolidjs-js-tsdk-template/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Telegram-Mini-Apps","download_url":"https://codeload.github.com/Telegram-Mini-Apps/solidjs-js-tsdk-template/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":230931198,"owners_count":18302304,"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","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":[],"created_at":"2024-11-05T18:06:18.396Z","updated_at":"2025-08-25T18:30:37.320Z","avatar_url":"https://github.com/Telegram-Mini-Apps.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Telegram Mini Apps Solid.js Template\n\n\u003e [!WARNING]\n\u003e This template is archived and is more likely to be out of date.\n\nThis template demonstrates how developers can implement a single-page application on the Telegram\nMini Apps platform using the following technologies and libraries:\n\n- [Solid](https://solidjs.com/)\n- [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript)\n- [TON Connect](https://docs.ton.org/develop/dapps/ton-connect/overview)\n- [Telegram SDK](https://core.telegram.org/bots/webapps#initializing-mini-apps)\n- [Vite](https://vitejs.dev/)\n\n\u003e This boilerplate was created using [pnpm](https://pnpm.io/). Therefore, it is required to use\n\u003e it for this project as well.\n\n## Install Dependencies\n\nIf you have just cloned this template, you should install the project dependencies using the\ncommand:\n\n```Bash\npnpm install\n```\n\n## Scripts\n\nThis project contains the following scripts:\n\n- `dev`. Runs the application in development mode.\n- `build`. Builds the application for production.\n- `lint`. Runs [eslint](https://eslint.org/) to ensure the code quality meets the required\n  standards.\n- `deploy`. Deploys the application to GitHub Pages.\n\nTo run a script, use the `pnpm run` command:\n\n```Bash\npnpm run {script}\n# Example: pnpm run build\n```\n\n## Create Bot and Mini App\n\nBefore you start, make sure you have already created a Telegram Bot. Here is\na [comprehensive guide](https://docs.telegram-mini-apps.com/platform/creating-new-app) on how to\ndo it.\n\n## Run\n\nAlthough Mini Apps are designed to be opened\nwithin [Telegram applications](https://docs.telegram-mini-apps.com/platform/about#supported-applications),\nyou can still develop and test them outside of Telegram during the development process.\n\nTo run the application in the development mode, use the `dev` script:\n\n```bash\nnpm run dev\n```\n\nAfter this, you will see a similar message in your terminal:\n\n```bash\nVITE v5.2.12  ready in 237 ms\n\n➜  Local:   http://localhost:5173/solidjs-js-tsdk-template\n➜  Network: http://172.18.16.1:5173/solidjs-js-tsdk-template\n➜  Network: http://172.19.32.1:5173/solidjs-js-tsdk-template\n➜  Network: http://192.168.0.171:5173/solidjs-js-tsdk-template\n➜  press h + enter to show help\n```\n\nHere, you can see the `Local` link, available locally, and `Network` links accessible to all\ndevices in the same network with the current device.\n\nTo view the application, you need to open the `Local`\nlink (`http://localhost:5173/solidjs-js-tsdk-template` in this example) in your browser.\n\n### Run Inside Telegram\n\nAlthough it is possible to run the application outside of Telegram, it is recommended to develop it\nwithin Telegram for the most accurate representation of its real-world functionality.\n\nTo run the application inside Telegram, [@BotFather](https://t.me/botfather) requires an HTTPS link.\n\nThis template already provides a solution.\n\nNavigate to the `vite.config.js` file and uncomment the usage of the `basicSsl` function. This\nfunction utilizes\nthe [@vitejs/plugin-basic-ssl](https://www.npmjs.com/package/@vitejs/plugin-basic-ssl) plugin, which\nenables the creation of an HTTPS link. Note that this plugin generates a self-signed certificate,\nwhich browsers will recognize as unsafe, resulting in a warning when accessing the app.\n\nAfter uncommenting the function, run the `dev` script again and observe the output in your terminal:\n\n```bash\nVITE v5.2.12  ready in 265 ms\n\n➜  Local:   https://localhost:5173/solidjs-js-tsdk-template\n➜  Network: https://172.18.16.1:5173/solidjs-js-tsdk-template\n➜  Network: https://172.19.32.1:5173/solidjs-js-tsdk-template\n➜  Network: https://192.168.0.171:5173/solidjs-js-tsdk-template\n➜  press h + enter to show help\n```\n\nVisiting the `Local` link (`https://localhost:5173/solidjs-js-tsdk-template` in this example) in your\nbrowser, you will see the following warning:\n\n![SSL Warning](assets/ssl-warning.png)\n\nThis browser warning is normal and can be safely ignored as long as the site is secure. Click\nthe `Proceed to localhost (unsafe)` button to continue and view the application.\n\nOnce the application is displayed correctly, submit one of the `Network` links as the Mini App link\nto [@BotFather](https://t.me/botfather). Then, navigate\nto [https://web.telegram.org/k/](https://web.telegram.org/k/), find your bot, and launch the\nTelegram Mini App. This approach provides the full development experience.\n\n\u003e **Important**\n\u003e\n\u003e Because we are using self-signed SSL certificates, the Android and iOS Telegram applications will\n\u003e not be able to display the application. These operating systems enforce stricter security\n\u003e measures, preventing the Mini App from loading. To address this issue, refer\n\u003e to [this guide](https://docs.telegram-mini-apps.com/platform/getting-app-link#remote).\n\n## Deploy\n\nThis boilerplate uses GitHub Pages as the way to host the application externally. GitHub Pages\nprovides a CDN which will let your users receive the application rapidly. Alternatively, you could\nuse such services as [Heroku](https://www.heroku.com/) or [Vercel](https://vercel.com).\n\n### Manual Deployment\n\nThis boilerplate uses the [gh-pages](https://www.npmjs.com/package/gh-pages) tool, which allows\ndeploying your application right from your PC.\n\n#### Configuring\n\nBefore running the deployment process, ensure that you have done the following:\n\n1. Replaced the `homepage` value in `package.json`. The GitHub Pages deploy tool uses this value to\n   determine the related GitHub project.\n2. Replaced the `base` value in `vite.config.js` and have set it to the name of your GitHub\n   repository. Vite will use this value when creating paths to static assets.\n\nFor instance, if your GitHub username is `telegram-mini-apps` and the repository name\nis `is-awesome`, the value in the `homepage` field should be the following:\n\n```json\n{\n  \"homepage\": \"https://telegram-mini-apps.github.io/is-awesome\"\n}\n```\n\nAnd `vite.config.js` should have this content:\n\n```ts\nexport default defineConfig({\n  base: '/is-awesome/',\n  // ...\n});\n```\n\nYou can find more information on configuring the deployment in the `gh-pages`\n[docs](https://github.com/tschaub/gh-pages?tab=readme-ov-file#github-pages-project-sites).\n\n#### Before Deploying\n\nBefore deploying the application, make sure that you've built it and going to deploy the fresh\nstatic files:\n\n```bash\nnpm run build\n```\n\nThen, run the deployment process, using the `deploy` script:\n\n```Bash\nnpm run deploy\n```\n\nAfter the deployment completed successfully, visit the page with data according to your\nusername and repository name. Here is the page link example using the data mentioned above:\nhttps://telegram-mini-apps.github.io/is-awesome\n\n### GitHub Workflow\n\nTo simplify the deployment process, this template includes a\npre-configured [GitHub workflow](.github/workflows/github-pages-deploy.yml) that automatically\ndeploys the project when changes are pushed to the `master` branch.\n\nTo enable this workflow, create a new environment (or edit the existing one) in the GitHub\nrepository settings and name it `github-pages`. Then, add the `master` branch to the list of\ndeployment branches.\n\nYou can find the environment settings using this\nURL: `https://github.com/{username}/{repository}/settings/environments`.\n\n![img.png](.github/deployment-branches.png)\n\nIn case, you don't want to do it automatically, or you don't use GitHub as the project codebase,\nremove the `.github` directory.\n\n### GitHub Web Interface\n\nAlternatively, developers can configure automatic deployment using the GitHub web interface. To do\nthis, follow the link: `https://github.com/{username}/{repository}/settings/pages`.\n\n## TON Connect\n\nThis boilerplate utilizes the [TON Connect](https://docs.ton.org/develop/dapps/ton-connect/overview)\nproject to demonstrate how developers can integrate functionality related to TON cryptocurrency.\n\nThe TON Connect manifest used in this boilerplate is stored in the `public` folder, where all\npublicly accessible static files are located. Remember\nto [configure](https://docs.ton.org/develop/dapps/ton-connect/manifest) this file according to your\nproject's information.\n\n## Useful Links\n\n- [Platform documentation](https://docs.telegram-mini-apps.com/)\n- [Telegram developers community chat](https://t.me/devs)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftelegram-mini-apps%2Fsolidjs-js-tsdk-template","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftelegram-mini-apps%2Fsolidjs-js-tsdk-template","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftelegram-mini-apps%2Fsolidjs-js-tsdk-template/lists"}