Developing with Tesseract on Gravity OS
Gravity OS provides a unique platform for developing decentralized applications (dApps) directly on the blockchain. Using Tesseract within Gravity OS, you can create, manage, and deploy projects with ease. This guide will walk you through the basic steps of developing with Tesseract on Gravity.
Accessing Tesseract on Gravity
To start using Tesseract on Gravity OS, navigate to the application menu (top left of the interface, Utopixia logo) and click on the Tesseract icon. This will open the Tesseract application. If no projects have been created yet, the Tesseract window will be empty.
Creating a New Project
To create a new project in Tesseract, click the three dots in the top left corner of the Tesseract window. This will open a modal with a + button. Clicking on the + button opens a window where you can enter a project name. After confirming, a transaction is issued to save this project on-chain. If the auto-signature option is not enabled, you will be prompted to sign the transaction for it to be recorded.
Once the transaction is signed and mined, the project name appears in the top left corner. Clicking on the project name opens the project creation modal again, where you can see the projects you've created or add a new one.
Managing Files and Graphs
The interface provides several buttons for managing your project:
- Create a File: This option allows you to create a new file. You will be asked to enter a file name. The file extension is important; you can create .js, .html, .css files. For testing, create a file named index.html. When adding the file, you will be asked to validate two transactions: one for creating a graph to store your code, and another for updating your on-chain project to include the newly created file. After these transactions are signed and mined, the file becomes accessible in the left panel that lists your project files.
- Link to Existing Graph: This option lets you create a file linked to an existing graph. For example, click on it and enter the file name core/event_manager.js and in the graph ID field, enter 0b6a9301-cb03-4887-bdca-1170d13f21e5. Click Next, and as before, validate two transactions if the auto-signature option is not enabled.
- Edit Files: Allows you to edit the files in your project by changing the file name, type, or graph ID. You can also delete files from your project, but the associated graph is never deleted.
- Save Files: Save your modified files. You can also use Ctrl+S to save your files.
Tip: You can prefix your filenames with directories, e.g., js/main.js will create a main.js file inside a js directory.
Integrating the JavaScript Library
The previously imported file (core/event_manager.js) is a JS library that allows your application to communicate with Gravity OS.
To test, enter the following code into your index.html file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My DApp</title>
</head>
<body>
<!-- gravity/event_manager -->
<script src="/parser/graph/javascript/0b6a9301-cb03-4887-bdca-1170d13f21e5"></script>
</body>
</html>
This script loads the request manager, enabling your dApp to communicate with the OS. It allows you to request transaction signatures, encrypt/decrypt user data, and perform basic operations on your window, like changing its title or opening another window.
Next Step: Enrich your DApp and connect with the user
Now that you have integrated the basic functionalities, it's time to enhance your decentralized application. Build rich features, handle user interactions, and leverage the full potential of Gravity OS. Connect your DApp to user data, provide secure transaction handling, and make your application user-friendly.
Learn more on how to enrich your DApp