From 10661515761daa9bd43e43192a5434fc390f36b4 Mon Sep 17 00:00:00 2001 From: Moxiegirl Date: Sat, 22 Dec 2018 16:31:02 -0800 Subject: [PATCH] Zero to dapp update (#83) * Closes #40 more detail and library clarification Signed-off-by: Mary Anthony * #45 Signed-off-by: Mary Anthony * Adding in blurb about the browser limitations Signed-off-by: Mary Anthony * Close #71 Signed-off-by: Mary Anthony --- _develop/zero_to_dapp_1.md | 2 ++ _develop/zero_to_dapp_3.md | 27 +++++++++++++++++++-------- _develop/zero_to_dapp_4.md | 7 +++---- 3 files changed, 24 insertions(+), 12 deletions(-) diff --git a/_develop/zero_to_dapp_1.md b/_develop/zero_to_dapp_1.md index bd04c8e9..20d9a440 100644 --- a/_develop/zero_to_dapp_1.md +++ b/_develop/zero_to_dapp_1.md @@ -38,6 +38,8 @@ along. If you are a developer superhero, you may want to skim or move quickly through the pages and that's fine too. +{% include note.html content="For best results, please use the Chrome browser for this tutorial. Currently, the Blockstack Browser works best in Chrome and you can encounter problems using browsers such as Safari or Firefox. We are working on a fix for these issues." %} + ## How traditional and decentralized applications differ diff --git a/_develop/zero_to_dapp_3.md b/_develop/zero_to_dapp_3.md index b1f371e1..90b6672f 100644 --- a/_develop/zero_to_dapp_3.md +++ b/_develop/zero_to_dapp_3.md @@ -34,11 +34,11 @@ you'll need the command line to run your project. ## Understand the Animal Kingdom application code -The Animal Kingdom application has two major components, React and Blockstack. React is used to -build all the web components and interactions. You could replace React with any -framework that you like; Blockstack is web framework agnostic. This section does -not explain the React in any detail; The discussion focuses on the Blockstack -Javascript library the DApp instead. +The Animal Kingdom application has two major components, React and Blockstack. +React is used to build all the web components and interactions. You could +replace React with any framework that you like; Blockstack is web framework +agnostic. This section does not explain the React in any detail; The discussion +focuses on the Blockstack Javascript library the DApp instead. The Blockstack Javascript library is all a developer needs to @@ -46,6 +46,8 @@ create a DApp. It grants the application the ability to authenticate a Blockstack identity and to read and write to the user's data stored in a Gaia hub. +{% include note.html content="Animal Kingdom uses a pre-relese version 19.0.0-alpha.2 of the Blockstack javascript library. Feel free to follow the pull request for this version to track the version's progress." %} + ### Authenticating user identity The `src/App.js` file creates a Blockstack `UserSession` and uses that session's @@ -112,6 +114,13 @@ Signing in with an identity is the means by which the user grants the DApp access. Access means the DApp can read the user profile and read/write user data for the DApp. Data is encrypted at a unique URL on a Gaia storage hub. +The source code imports `UserSession` from the Blockstack library. Data related to a given user-session is encapsulated in the session. In a web +browser, `UserSession` default behavior is to store session data in the +browser's local storage. This means that app developers can leave management of +session state to users. In a non-web browser environment, it is necessary to +pass in an instance of `AppConfig` which defines the parameters of the current +app. +
App Mining Requirement: Blockstack Authentication

To participate in application mining your application must integrate Blockstack authentication. @@ -142,8 +151,10 @@ loadMe() { } ``` -The `loadMe()` code uses the Blockstack's `getFile()` method to get the -specified file from the applications data store. If the users' data store on +Most of the imports in this file are locally coded React components. For example, `Kingdom.js`, `EditMe.js`, and `Card.js`. The key Blockstack imports is the `UserSession` and an `appConfig` which is defined in the `constants.js` file. + +The `loadMe()` code uses the Blockstack's `UserSession.getFile()` method to get +the specified file from the applications data store. If the users' data store on Gaia does not have the data, which is the case for new users, the Gaia hub responds with HTTP `404` code and the `getFile` promise resolves to null. If you are using a Chrome Developer Tools with the DApp, you'll see these errors in a @@ -187,7 +198,7 @@ explorer and search for your ID: Your DApp contains three pages **Animals**, **Territories**, and **Other Kingdoms** that are derived from three code elements: - * The `src/constants.js` file defines the application's data profile. + * The `src/constants.js` file defines the application's data profile (`AppConfig`). * The `public/animals` directory which contains images. * The `public/territories` directory which contains images. diff --git a/_develop/zero_to_dapp_4.md b/_develop/zero_to_dapp_4.md index 4e87a4ec..4fbdd780 100644 --- a/_develop/zero_to_dapp_4.md +++ b/_develop/zero_to_dapp_4.md @@ -59,7 +59,7 @@ To add an app, do the following: DApp Name - Name of your sample. Animal Kingdom or, if you renamed it, the name you gave your application. + Name of your sample. USERNAME: Animal Kingdom or, if you renamed it, the name you gave your application. Short description @@ -117,10 +117,9 @@ To add an app, do the following: Only applications that integrate Blockstack authentication, use GAI storage, and which are accessible to review can participate in application mining. -To submit an application for App Mining, do the follwoing: +To submit an application for App Mining, you select App Mining from the App.co menu and then select the **Submit your app for qualification** button. -1. Go to select App Mining from the App.co menu. -2. Select the **Submit your app for qualification** button. +Blockstack sample applications that you create from our tutorials such as this one don't qualify for application mining. ## How Blockstack helps App Miners market