This article mainly introduces how to build a static HTML project into a blocklet and package it for release in the store. Before reading this article, please install the Blocklet CLI environment. You can refer to the official documentation for installing the Blocklet CLI.
YouTube video has been uploaded: https://www.youtube.com/watch?v=0gLtAos1WS0
-
Find a static HTML project
It can be your own HTML project, or you can find interesting open source HTML projects on GitHub. In this article, we will use [example] as an example, but other HTML games like Snake and Minesweeper can also be used.
Download the project zip file and unzip it. -
Initialize the blocklet
From step one, you will get a project folder (assuming the folder name is jump).
Go to the folder directory, modify according to the actual situation#
cd jump
Initialize the blocklet#
blocklet init
During this process, you need to fill in some basic information, as shown in the figure below. After filling in, a browser window will pop up, and you need to connect your wallet to the official store to generate the application DID.
- Verification and packaging
- Run verification
Run to verify if the HTML project is working properly#
blocklet dev
After successful execution, you will get the application link as shown in the figure below. Copy the URL to the browser to verify if it is working properly.
- Packaging
After successful verification, you can configure some project information before packaging to make the entire project look more formal.
Pay attention to blocklet.yml and blocklet.md, the fields correspond to the store application information, as shown in the screenshot.
If the project is built from an open source repo mentioned by @shijun:
Please indicate the source in blocklet.yml.
Please ensure that the project's license is not a problem to avoid infringement.
In addition, future static HTML projects need to configure a dependency in blocklet.yml.
engine:
interpreter: blocklet
source:
store: https://store.blocklet.dev
name: z2qa2dGC9EmsjB2WJtUcmuRWx43zTwPUZQF7g
version: latest
For open source projects, please indicate the source in blocklet.yml.
repository:
type: git
url: git+https://github.com/blocklet/html-2048-sample.git
After configuring the project's basic information, start packaging.
blocklet bundle --zip --create-release
- Release
Before releasing, you need to have a dev pass for the blocklet store. You can start the blocklet store yourself or apply for a dev pass from the official store (you can private message the project party).
After obtaining the dev pass, you can apply for a key on the page and execute the command line in the screenshot.
Configure store information (the following information is an example, please copy the actual content)#
blocklet config set accessToken z2K8qz2DdixZUoTuYLUf5wBDWy**************snhaJHpC5YwGjii8SvunJrDGxk9n
blocklet config set store https://test.store.blocklet.dev
blocklet config set developerDid z1XwQif7VXcM****SksVC3sgqKtfR8
Upload to the store#
blocklet upload
After successful upload, you also need to publish it in the backend of the blocklet store. The first release requires a pledge. The store used in the example is the official test store, which requires 5 TBA. You can get it for free from the faucet.
After successful publication, you can see it on the homepage of the store.