Skip to content

thebatclaudio/ton-dapp-vue-template

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

4 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸš€ TON DApp Vue Template

Welcome to the TON DApp Vue Template! This project is a powerful template designed for creating a Telegram Mini App (TMA) with seamless integration of the TON blockchain using Vue.js. It comes fully equipped with Tailwind CSS for styling and includes a GitHub Actions workflow to automate deployment to GitHub Pages.

Demo: https://thebatclaudio.github.io/ton-dapp-vue-template

Vue.js TailwindCSS TON Telegram GitHub_Pages

🌟 Features

  • Vue.js: Build reactive and powerful UIs with the Vue.js framework.
  • TON Integration: Easily connect and interact with the TON blockchain.
  • Telegram Mini App: Create and deploy your application as a Telegram Mini App.
  • Tailwind CSS: Utility-first CSS framework for rapidly building custom designs.
  • GitHub Pages Deployment: Automatically deploy your app with GitHub Actions.

Explore these resources to extend and deepen your integration with TON and Telegram.

πŸ› οΈ Getting Started

Prerequisites

  • Node.js: Ensure you have Node.js version 20 or higher installed.
  • NVM (Node Version Manager) (optional): Recommended for managing Node.js versions. If you don't use NVM, ensure you manually switch to Node.js version 20 or higher.

Installation

  1. Clone the repository:

    git clone https://github.com/thebatclaudio/ton-dapp-vue-template.git
    cd ton-dapp-vue-template
  2. Set the Node.js version (if using NVM):

    nvm use
  3. Install dependencies:

    npm install
  4. Set up environment variables:

    cp .env.example .env
  5. Edit the .env file:

    • Open the .env file and replace the placeholder values with your actual environment variables.
  6. Run the development server:

    npm run dev

🌍 Deployment

This project includes a GitHub Actions workflow that automates deployment to GitHub Pages. To deploy your project:

  1. Activate GitHub Pages:

    • Go to your GitHub repository settings.
    • Under the Pages section, select the GitHub Actions branch as the source for build and deployment and save the settings.
  2. Configure production environment variables:

    • Edit the .env.production file with the necessary environment variables for your production setup.
  3. Push to the main branch:

    • The GitHub Actions workflow triggers on every push to main and will deploy the app to GitHub Pages automatically.

πŸ“š Documentation & References

This project leverages several powerful libraries and SDKs:

🀝 Contributing

Contributions are welcome! Feel free to fork the project, submit a pull request, or open an issue for any changes or improvements.

πŸ“„ License

This project is licensed under the MIT License. See the LICENSE file for more information.