HiÐΞClassic

Getting Started with HiÐΞ Offline Mode

Tomoya Nagasawa | HiÐΞ
3 years ago
Why Offline-First?How to Get StartedEnter offline modeInstall The App (optional)Get Remote TopicsCreate User(s)Write ArticlesBack up data on IPFSSign up for Texile Hub and get API key/secretSave Textile key/secret locally with crypto wallet signatureBack up / Fetch / Import / Download dataExport the Current Data onto Local DeviceImport data via JSON filePublish to Decentralized Data WebLog in with DIDSign up for web3.storage and save API key locallyUpdate User ProfileSave Article Images on IPFSPublish Article to CeramicGet Offline Articles Listed on hide.acTokenize Article as NFTDirectly Upload to hide.ac OnlineExport and Import Individual ArticlesA CaveatFrontend Decentralization

As we previously introduced you to HiÐΞ, we are building an offline-first decentralized CMS.

I will explain the offline-first part and how you can get started with it in this article.

Why Offline-First?

So why do we think the offline-first approach prevails over the cloud-based online counterpart?

  • Saving / Managing data in-memory or in local storage is extremely fast
  • No need for internet connections (you can work on a plane or even off the grid)
  • You have the freedom to choose your preferred storage (platformers often lock in your content)

The whole architecture is explained in the introduction, but I will guide you through how to actually use HiÐΞ Offline CMS today. The whole system is already in production and functioning, but please note that we are still in alpha mode and expecting bugs and changes in the coming weeks.

How to Get Started

Enter offline mode

There are two ways to use HiÐΞ at the moment: online mode and offline mode.

The online mode works as a social media platform that is managed by us (the team behind HiÐΞ) or any third party who runs an OSS fork of HiÐΞ. Yes, we are determined to decentralize the frontend dapps as well as everything else. This will be explained in the next article, but let's try the offline mode this time around.

The offline mode is not connected to any remote database or server, and everything you create will only be saved on your local device. Later on, you can choose to back up your data on IPFS or publish your article to Ceramic decentralized data web.

Choose one out of the two options below:

  • switch to offline mode in the online app (hide.ac)

The former would be more convenient at times since you can switch back and forth between online and offline, but the latter achieves a self-contained environment that never connects with remote servers of any kind.

Install The App (optional)

HiÐΞ is a PWA (progressive web app), which means once you access either of the sites above, you can install the app to your mobile home screen and use it as a mobile app. PWA is perfect since it works both as a web app and a mobile app, but there's no need for app store listings where everything is subject to Google and Apple.

Get Remote Topics

Topics can be assigned to articles and get rewards from HiÐΞ Protocol. Simply opening Topics page will start reading remote topics and filling the offline mode.

At the moment, you can only create topics in the online mode, but offline topic creation will be enabled in the future.

Create User(s)

Unlike the online mode, the offline mode is your local environment. You can create any number of arbitrary users and freely switch between them without restrictions. Open Offline Users tab on Settings page to do so.

Write Articles

From the bottom menu or the side menu, click on New Article to open the editor.

You can write articles using the markdown editor or the rich text editor. In the markdown editor, code blocks are editable in the preview pane with the ACE coding editor.

Images can be uploaded and reused from the Gallery tab. HiÐΞ efficiently converts your images between base64 and a unique short format that is suitable to place in markdown documents while editing.

Your edit history will be saved every 30 seconds by only the text diff of two consecutive versions.

To edit a published article, click on Edit from the circle menu in the lower right corner on your article page.

Back up data on IPFS

In the offline mode, all your data is saved in the local storage of your browser, so if you clear the browser cache, your data will be gone. You can back up your data on IPFS and recover it on another device by connecting to Textile buckets.

To do the following, you need to be connected to the internet and have Metamask (or another Ethereum wallet) installed.

Sign up for Texile Hub and get API key/secret

You can sign up for Textile Hub through their cloud UI.

Once you are signed in, create a pair of secure user group public key and secret.

Save Textile key/secret locally with crypto wallet signature

Go to Settings page and open IPFS tab, then you can save your Textile key/secret using Metamask. Your key/secret will be encrypted with a crypto signature and only saved locally, which means no one can access or decrypt your credentials unless he/she has access to your private key (Metamask never discloses private keys unless you instruct it to do so with your password).

Back up / Fetch / Import / Download data

Open Backup tab on Settings page, and first decrypt the Textile key/secret you have encrypted in the previous step,

then connect with Textile with yet another signature.

You can use different addresses when decrypting and connecting with Textile. But the decryption must be done with the same address used for the encryption.

When connecting with Textile, you can choose your arbitrary app name (default to HiÐΞ), which will be a part of your signed message. This can also be a password instead of an app name to further secure your data. The only person who has the private key and this arbitrary app name can decrypt and access your Textile bucket. So don't forget your app name (or password).

Once connected, you can

  • back up your entire data on IPFS
  • fetch the saved data from IPFS
  • import the fetched data to overwrite the entire current offline mode data
  • or download the fetched data to your local device (so you can import it to another device)

Export the Current Data onto Local Device

You can also export the entire current data in Export tab on Settings page.

Import data via JSON file

The backup data is a JSON file, and if you download and save it on your local device, you can import the file without IPFS. Open Import tab on Settings page, then choose the file to import and click Import Data

Publish to Decentralized Data Web

Log in with DID

To publish your articles to the open data web, you first need to log in with a DID (or link a DID if already logged in). Go to Login or Manage Accounts page and click on the DID login/link button. You will be prompted to connect with Ceramic and create/link an existing DID if your wallet address already has a DID issued by Ceramic (3ID DID).

Sign up for web3.storage and save API key locally

To save images for your profile and articles on IPFS, sign up for web3.storage and get an API key, then save it encrypted locally in the same way you did previously with Textile key/secret. Go to Settings page and open IPFS tab, then refer to the instructions for Textile above.

Update User Profile

Go to Your Page and click Profile to update your profile data.

You can update your user profile and save it locally or to IDX. IDX is an open identity protocol on top of Ceramic. The profiles saved on IDX will be accessible to anyone, which makes it possible to openly get your persistent profile from anywhere. Go to Your Page and click Setting button to change your profile. Choose IPFS from Where to selector. Only the images saved on IPFS will be reflected to IDX profile.

If you already have a profile on IDX, you can fetch that by clicking get IDX button while editing.

Once you saved your profile data, click save IDX button, and your profile will be published to IDX.

When DID is linked to your account, you will have Ceramic icon next to your profile image. Clicking on it will lead you to your decentralized page where your profile and articles are fetched directly from IDX/Ceramic.

Save Article Images on IPFS

While editing your article, you can upload images onto IPFS in Gallery tab and insert them in the article. Simply choose an image file and select IPFS, then click the upload button. The uploaded images will be listed below, and clicking on one will copy the URL in case of the markdown editor or insert it in the article when using the rich text editor.

Publish Article to Ceramic

Once you locally saved/published your article, you can publish it to Ceramic decentralized data web. In Post screen, choose Ceramic from Where to Post, then hit publish. You will see a link to your Ceramic article page, which is directly fetched from Ceramic in contrast to the local/cloud database.

Get Offline Articles Listed on hide.ac

Tokenize Article as NFT

You can also tokenize your articles as NFTs to get rewards from HiÐΞ Protocol which is a sustainable reward distribution protocol powering HiÐΞ CMS.

Tokenized articles will also be indexed by subgraphs and appear on online social media platforms such as hide.ac. For your articles to be automatically indexed and appear on hide.ac, you will need to sign in and link the same DID in the online mode before tokenizing your articles.

Directly Upload to hide.ac Online

If you are using the offline mode by

  • switching to offline mode in the online app (hide.ac)

you can directly upload your articles to HiÐΞ Online. Choose Online from Where to post, and Save Draft or Publish. To make this work, you need to be logged in in the online mode before switching to the offline mode.

You can also download online articles to offline mode in the same way if you are logged in in the offline mode while editing in the online mode. You can choose an offline user account to download the article to on Settings page even when in the online mode.

Export and Import Individual Articles

Another way to move articles between online and offline is to export/import individual articles as markdown (.md) files. You can export your article as a markdown file from Preview screen

or your published article page.

You can also let others download this markdown file by setting Enable Markdown Download by Your Readers to allow.

You can import this markdown file from Advanced tab.

A Caveat

One caveat for the offline mode is it shouldn't run in multiple tabs at the same time. The local database for the offline mode runs in-memory, which means if you open two tabs at the same time, the state of one tab overwrites the state of the other tab, which ends up erasing some data back and forth. This limitation is to be solved in the future.

Frontend Decentralization

So what's next? Our main development objective right now is frontend decentralization; that is, anyone can deploy a fork of hide.ac anywhere they want with customized topics and articles. This means hide.ac will be one of many decentralized social media platforms on top of HiÐΞ Protocol and a myriad of offline nodes.

Our entire project will be soon open-sourced, and you can have your own node for your offline personal use or online social media just like hide.ac but with your own customization.

We are also aiming to deploy an IPFS version of the offline node and a DFINITY version with additional node configurations, so it runs in a 100% decentralized manner.


コメント
いいね
投げ銭
最新順
人気順
コメント
いいね
投げ銭
最新順
人気順
トピック
アプリ

Astar Network

DFINITY / ICP

NFT

DAO

DeFi

L2

メタバース

BCG

仮想通貨 / クリプト

ブロックチェーン別

プロジェクト

目次
Tweet
ログイン