@powerhousedao/academy 5.1.0-dev.9 → 5.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +43 -1108
- package/blog/BeyondCommunication-ABlueprintForDevelopment.md +1 -2
- package/blog/TheChallengeOfChange.md +0 -1
- package/docs/academy/00-EthereumArgentinaHackathon.md +207 -0
- package/docs/academy/01-GetStarted/00-ExploreDemoPackage.mdx +27 -24
- package/docs/academy/01-GetStarted/01-CreateNewPowerhouseProject.md +9 -118
- package/docs/academy/01-GetStarted/02-DefineToDoListDocumentModel.md +28 -110
- package/docs/academy/01-GetStarted/03-ImplementOperationReducers.md +145 -191
- package/docs/academy/01-GetStarted/04-BuildToDoListEditor.md +218 -0
- package/docs/academy/{02-MasteryTrack/01-BuilderEnvironment → 01-GetStarted}/05-VetraStudio.md +6 -48
- package/docs/academy/01-GetStarted/06-ReactorMCP.md +58 -0
- package/docs/academy/01-GetStarted/_04-BuildToDoListEditor +1 -1
- package/docs/academy/02-MasteryTrack/01-BuilderEnvironment/03-BuilderTools.md +2 -2
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/02-SpecifyTheStateSchema.md +44 -75
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/03-SpecifyDocumentOperations.md +22 -28
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/04-UseTheDocumentModelGenerator.md +31 -28
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/05-ImplementDocumentReducers.md +206 -211
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/06-ImplementDocumentModelTests.md +62 -176
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/07-ExampleToDoListRepository.md +0 -21
- package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/01-BuildingDocumentEditors.md +319 -309
- package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/06-DocumentTools/00-DocumentToolbar.mdx +0 -4
- package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/06-DocumentTools/01-OperationHistory.md +0 -4
- package/docs/academy/02-MasteryTrack/05-Launch/04-ConfigureEnvironment.md +1 -1
- package/docs/academy/03-ExampleUsecases/Chatroom/02-CreateNewPowerhouseProject.md +35 -111
- package/docs/academy/03-ExampleUsecases/Chatroom/03-DefineChatroomDocumentModel.md +76 -255
- package/docs/academy/03-ExampleUsecases/Chatroom/04-ImplementOperationReducers.md +160 -281
- package/docs/academy/03-ExampleUsecases/Chatroom/05-ImplementChatroomEditor.md +35 -188
- package/docs/academy/03-ExampleUsecases/Chatroom/06-LaunchALocalReactor.md +7 -95
- package/docs/academy/03-ExampleUsecases/Chatroom/_category_.json +1 -1
- package/docs/academy/04-APIReferences/00-PowerhouseCLI.md +2 -6
- package/docs/academy/04-APIReferences/01-ReactHooks.md +501 -291
- package/docs/academy/05-Architecture/00-PowerhouseArchitecture.md +39 -7
- package/docs/academy/05-Architecture/02-ReferencingMonorepoPackages +65 -0
- package/docs/academy/05-Architecture/04-MovingBeyondCRUD +61 -0
- package/docs/academy/06-ComponentLibrary/00-DocumentEngineering.md +24 -72
- package/docs/academy/08-Glossary.md +0 -7
- package/docusaurus.config.ts +3 -28
- package/package.json +1 -1
- package/sidebars.ts +12 -49
- package/src/css/custom.css +18 -26
- package/docs/academy/01-GetStarted/04-WriteDocumentModelTests.md +0 -378
- package/docs/academy/01-GetStarted/05-BuildToDoListEditor.md +0 -560
- package/docs/academy/03-ExampleUsecases/TodoList/00-GetTheStarterCode.md +0 -24
- package/docs/academy/03-ExampleUsecases/TodoList/01-GenerateTodoListDocumentModel.md +0 -211
- package/docs/academy/03-ExampleUsecases/TodoList/02-ImplementTodoListDocumentModelReducerOperationHandlers.md +0 -171
- package/docs/academy/03-ExampleUsecases/TodoList/03-AddTestsForTodoListActions.md +0 -462
- package/docs/academy/03-ExampleUsecases/TodoList/04-GenerateTodoListDocumentEditor.md +0 -45
- package/docs/academy/03-ExampleUsecases/TodoList/05-ImplementTodoListDocumentEditorUIComponents.md +0 -422
- package/docs/academy/03-ExampleUsecases/TodoList/06-GenerateTodoDriveExplorer.md +0 -61
- package/docs/academy/03-ExampleUsecases/TodoList/07-AddSharedComponentForShowingTodoListStats.md +0 -384
- package/docs/academy/03-ExampleUsecases/TodoList/_category_.json +0 -8
- package/docs/academy/03-ExampleUsecases/VetraPackageLibrary/VetraPackageLibrary.md +0 -7
- package/docs/academy/03-ExampleUsecases/VetraPackageLibrary/_category_.json +0 -9
- package/docs/academy/04-APIReferences/06-VetraRemoteDrive.md +0 -160
- package/docs/academy/04-APIReferences/renown-sdk/00-Overview.md +0 -316
- package/docs/academy/04-APIReferences/renown-sdk/01-Authentication.md +0 -672
- package/docs/academy/04-APIReferences/renown-sdk/02-APIReference.md +0 -957
- package/docs/academy/04-APIReferences/renown-sdk/_category_.json +0 -8
- package/docs/academy/10-TodoListTutorial/02-ImplementTodoListDocumentModelReducerOperationHandlers.md +0 -171
- package/docs/academy/10-TodoListTutorial/03-AddTestsForTodoListActions.md +0 -462
- package/docs/academy/10-TodoListTutorial/05-ImplementTodoListDocumentEditorUIComponents.md +0 -422
- package/docs/academy/10-TodoListTutorial/07-AddSharedComponentForShowingTodoListStats.md +0 -370
- package/static/img/Vetra-logo-dark.svg +0 -11
- package/static/img/vetra-logo-light.svg +0 -11
- /package/docs/academy/{02-MasteryTrack/01-BuilderEnvironment → 01-GetStarted}/images/Modules.png +0 -0
- /package/docs/academy/{02-MasteryTrack/01-BuilderEnvironment → 01-GetStarted}/images/VetraStudioDrive.png +0 -0
- /package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/06-DocumentTools/{02-RevisionHistoryTimeline/360/237/232/247" → 02-RevisionHistoryTimeline} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /01-WhatIsADocumentModel" → 01-WhatIsADocumentModel} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /02-DAOandDocumentsModelsQ+A" → 02-DAOandDocumentsModelsQ+A} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /02-domain-modeling" → 02-domain-modeling} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /03-BenefitsOfDocumentModels" → 03-BenefitsOfDocumentModels} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /04-UtilitiesAndTips" → 04-UtilitiesAndTips} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /05-best-practices" → 05-best-practices} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /_category_.json" → _category_.json} +0 -0
- /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /three-data-layers.png" → three-data-layers.png} +0 -0
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Beyond Communication - A Blueprint for Development
|
|
3
|
-
description: GraphQL Schema
|
|
3
|
+
description: GraphQL Schema’s as a common language for software design
|
|
4
4
|
slug: Graphql-schema-as-a-common-language
|
|
5
|
-
date: 2024-12-02
|
|
6
5
|
authors:
|
|
7
6
|
- name: Call me T.
|
|
8
7
|
title: Product Manager at Powerhouse
|
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
---
|
|
2
|
+
id: EthereumArgentinaHackathon
|
|
3
|
+
title: Ethereum Argentina Hackathon
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Ethereum Argentina Hackathon
|
|
7
|
+
|
|
8
|
+
**November 19-20, 2024**
|
|
9
|
+
|
|
10
|
+
Welcome to the Vetra hacker page for the Ethereum Argentina Hackathon! We're excited to support developers building with Powerhouse during this event.
|
|
11
|
+
|
|
12
|
+
## Overview
|
|
13
|
+
|
|
14
|
+
Join us for two days of intensive development support as you build decentralized applications using the Vetra framework. Our team will be available online and at the mentor's table to help you navigate the builder platform, answer questions, and guide you through best practices.
|
|
15
|
+
|
|
16
|
+
## 📅 Event Details
|
|
17
|
+
|
|
18
|
+
- **Dates**: November 19-20, 2024
|
|
19
|
+
- **Format**: Online & IRL Developer Support
|
|
20
|
+
- **Time Zone**: Argentina Time (ART)
|
|
21
|
+
- **Support Hours at Mentor Table @ la Rural**: Please get in touch [on Discord to schedule](https://discord.gg/pwQJwgaQKd)
|
|
22
|
+
- **Hackathon informations**: [Taiki Hackathon](https://taikai.network/ethargentina/hackathons/tierra-de-buidlers-2025/overview)
|
|
23
|
+
|
|
24
|
+
## 🚀 Getting Started
|
|
25
|
+
|
|
26
|
+
<details>
|
|
27
|
+
<summary> Vetra Introduction & Follow Along Demo </summary>
|
|
28
|
+
|
|
29
|
+
Please Rewatch our Hackathon introduction & follow along tutorial.
|
|
30
|
+
|
|
31
|
+
<iframe width="560" height="315" src="https://www.youtube.com/embed/R5MAaGaopJg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
|
|
32
|
+
|
|
33
|
+
Find a complete overview of how to use the Vetra Studio for you project [here](./01-GetStarted/05-VetraStudio.md)
|
|
34
|
+
|
|
35
|
+
**Quick Start Summary**
|
|
36
|
+
|
|
37
|
+
- Step 1: Install the powerhouse-CLI: `pnpm install -g ph-cmd`
|
|
38
|
+
- Step 2: Initialize a project & directory `ph init my-project-name`
|
|
39
|
+
- Step 3: CD into you project directory
|
|
40
|
+
- Step 4: Launch Vetra Studio with the `ph vetra`command
|
|
41
|
+
- Step 5: Add the necessary document models & editors for your intended solution in Vetra Studio
|
|
42
|
+
- Step 6: If you're well versed in schema creation or graphql. Just talk with an agent about your imagined solution.
|
|
43
|
+
- Step 7: Start your preferred agent to help you with the initial scaffolding of your schema, operations and reducers.
|
|
44
|
+
- Step 8: Test your implementation in the "Vetra Preview Drive" with the `ph vetra --watch`command.
|
|
45
|
+
- Step 9: Run pnpm build and push your project to a remote repository. Follow the package publishing [Tutorial](./02-MasteryTrack/05-Launch/02-PublishYourProject.md)
|
|
46
|
+
|
|
47
|
+
**Basic tips**
|
|
48
|
+
- 1️⃣ Write a detailed description of your intented functionality inside the document model specification manifest
|
|
49
|
+
- 2️⃣ Ask your agent to ask for clarifying questions before starting any ideation process.
|
|
50
|
+
- 3️⃣ For each document model you'll want to create an accompanying editor in vetra studio.
|
|
51
|
+
- 4️⃣ An 'App' specifcation is an drive that can act as an app because of the specific interface you create for it.
|
|
52
|
+
|
|
53
|
+
### Before the Hackathon
|
|
54
|
+
|
|
55
|
+
1. **Set Up Your Environment**
|
|
56
|
+
- Install the Powerhouse CLI
|
|
57
|
+
- Set up your development environment
|
|
58
|
+
- Review the [Get Started Guide](./01-GetStarted/home.mdx)
|
|
59
|
+
|
|
60
|
+
2. **Explore the Platform**
|
|
61
|
+
- Check out the [Demo Package](./01-GetStarted/00-ExploreDemoPackage.mdx)
|
|
62
|
+
- Familiarize yourself with [Document Models](./02-MasteryTrack/02-DocumentModelCreation/01-WhatIsADocumentModel.md)
|
|
63
|
+
|
|
64
|
+
3. **Join Our Community**
|
|
65
|
+
- Discord: [Join our server](#)
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
</details>
|
|
69
|
+
|
|
70
|
+
:::tip Use your preferred AI agent
|
|
71
|
+
Vetra studio is compatible with Cursor, Claude and Gemini. Find the dedicated markdown files to guide your agent with the correct instruction in your directory. Your agent should also have access to the MCP's available.
|
|
72
|
+
:::
|
|
73
|
+
|
|
74
|
+
|
|
75
|
+
## **Hackathon Project Ideas**
|
|
76
|
+
|
|
77
|
+
Powerhouse is perfect for building:
|
|
78
|
+
|
|
79
|
+
- **Real World Use-cases**: Every document can act as a mini ledger/blockchain.
|
|
80
|
+
- **Decentralized Applications**: Create apps with built-in version control and collaboration.
|
|
81
|
+
- **Document-Based Systems**: Build structured data applications.
|
|
82
|
+
- **Collaborative Tools**: Enable real-time multi-user editing.
|
|
83
|
+
- **Data Management Platforms**: Create systems with queryable, structured data.
|
|
84
|
+
|
|
85
|
+
### Coordination & DAO Design
|
|
86
|
+
|
|
87
|
+
- 🧩 **What if** DAOs weren't chaotic? What documents would you need to make them coordinate like space X and ship like stripe?
|
|
88
|
+
- 🎯 **What if** making decisions as a group felt like playing a co-op strategy game. With a clearly aligned vision, instant dashboards and a way to capture hard won knowledge in expertise into custom software for the Dao?
|
|
89
|
+
|
|
90
|
+
:::tip IDEA
|
|
91
|
+
The ultimate DAO Template toolkit where vision & mission documents influence guidelines & onboarding for contributors.
|
|
92
|
+
:::
|
|
93
|
+
|
|
94
|
+
---
|
|
95
|
+
|
|
96
|
+
### GovTech & Public Infrastructure
|
|
97
|
+
|
|
98
|
+
- 🗳 **What if** local governments had to reach consensus with residents before making a decision? How would that look like?
|
|
99
|
+
- 🚧 **What if** you could submit pothole fixes or transit complaints into a civic DAO, and track the response like GitHub issues?
|
|
100
|
+
- 🧾 **What if** municipal budgets were editable public documents with community feedback loops?
|
|
101
|
+
|
|
102
|
+
:::tip IDEA
|
|
103
|
+
An Open Source Enterprise Resource Planning-suite for municipalities & governments
|
|
104
|
+
:::
|
|
105
|
+
|
|
106
|
+
---
|
|
107
|
+
|
|
108
|
+
### Education & Group Work
|
|
109
|
+
|
|
110
|
+
- 📝 **What if** your group project auto-divided work, tracked contributions, and paid out in real-time?
|
|
111
|
+
- 👾 **What if** "homework" was a multiplayer quest, and grades came from the DAO?
|
|
112
|
+
- 🏫 **What if** we DAO-ified a classroom and let the students vote on rules, roles, and rewards?
|
|
113
|
+
|
|
114
|
+
:::tip IDEA
|
|
115
|
+
The remote classroom SAAS back-end that fosters connection, gives purpose to bullies and empowers younger generation to dream big again.
|
|
116
|
+
:::
|
|
117
|
+
|
|
118
|
+
---
|
|
119
|
+
|
|
120
|
+
### 💸 Grants, Crypto, and Incentive Design
|
|
121
|
+
|
|
122
|
+
- 💰 **What if** grant tooling felt like bounty hunting across a galaxy of projects?
|
|
123
|
+
- 📊 **What if** every grant had a live budget dashboard, contributor feed, and impact score?
|
|
124
|
+
- 🎮 **What if** you could stake on coordination itself, betting that people will work together well?
|
|
125
|
+
|
|
126
|
+
:::tip IDEA
|
|
127
|
+
The future of grant platforms that dares to imagine grants in new ways. With follow up, tracking and impact visualisations of teams, time, risk & resources invested.
|
|
128
|
+
:::
|
|
129
|
+
|
|
130
|
+
---
|
|
131
|
+
|
|
132
|
+
### 💸 Lawmaking, Legislation & Legal
|
|
133
|
+
|
|
134
|
+
- 🧑⚖️ **What if** any government or DAO could fork a legal template, customize it, and track changes in a public, composable way?
|
|
135
|
+
- 🎨 **What if** legislation could be transparently co-created by citizens, NGOs, and governments all with aligned incentives?
|
|
136
|
+
- 💻 **What if** legislation, contracts & templates could exist on an open-source market place like software?
|
|
137
|
+
- 🤖 **What if** a network agent could create a legal vehicle by simply inputing set of requirements and risk preferences (in non legalese)?
|
|
138
|
+
- 🤝 **What if** 2 agents in a network could negotiate terms of an agreement according to predefined functions and risk parameters, without lawyers?
|
|
139
|
+
|
|
140
|
+
:::tip IDEA
|
|
141
|
+
Build a Decentralized Lawmaking Engine using Reactive Document Models
|
|
142
|
+
:::
|
|
143
|
+
|
|
144
|
+
|
|
145
|
+
## 🛠️ Resources
|
|
146
|
+
|
|
147
|
+
### Documentation
|
|
148
|
+
|
|
149
|
+
- [Quick Start Guide](./01-GetStarted/home.mdx)
|
|
150
|
+
- [Create a New Project](./01-GetStarted/01-CreateNewPowerhouseProject.md)
|
|
151
|
+
- [Define Document Models](./01-GetStarted/02-DefineToDoListDocumentModel.md)
|
|
152
|
+
- [Build Editors](./01-GetStarted/04-BuildToDoListEditor.md)
|
|
153
|
+
- [API References](./04-APIReferences/00-PowerhouseCLI.md)
|
|
154
|
+
|
|
155
|
+
### Tutorials
|
|
156
|
+
|
|
157
|
+
- [To-Do List Example](./01-GetStarted/02-DefineToDoListDocumentModel.md)
|
|
158
|
+
- [Chatroom Use Case](./03-ExampleUsecases/Chatroom/02-CreateNewPowerhouseProject.md)
|
|
159
|
+
|
|
160
|
+
## 🏆 Judging Criteria
|
|
161
|
+
|
|
162
|
+
Projects will be evaluated based on:
|
|
163
|
+
|
|
164
|
+
- **Usefulness & Impact**: How well does it solve a certain job or problem?
|
|
165
|
+
- **Composability/Structure**: How are the different document models and / or drive apps collaborating?
|
|
166
|
+
- **Clarity of the developer or user experience**: Did you unlock the secret sauce of UX & reactive documents?
|
|
167
|
+
- **Alignment with Vetra/Powerhouse principles**: Local-first, auditable, usefull for common good.
|
|
168
|
+
|
|
169
|
+
## 📋 Submission Guidelines
|
|
170
|
+
|
|
171
|
+
### What to Submit
|
|
172
|
+
|
|
173
|
+
- GitHub repository with your code
|
|
174
|
+
- (Video) presentation (2-3 minutes)
|
|
175
|
+
- README with:
|
|
176
|
+
- Project description
|
|
177
|
+
- Setup instructions
|
|
178
|
+
- Screenshots/demos
|
|
179
|
+
- Technologies used
|
|
180
|
+
|
|
181
|
+
The Powerhouse team will add you as a builder on the Vetra platform and host your application and drive.
|
|
182
|
+
|
|
183
|
+
|
|
184
|
+
## Tips for Success
|
|
185
|
+
|
|
186
|
+
### Development Tips
|
|
187
|
+
|
|
188
|
+
1. **Start Simple**: Begin with a basic implementation and iterate
|
|
189
|
+
2. **Use Templates**: Leverage existing examples and templates
|
|
190
|
+
3. **Ask Questions**: Don't hesitate to reach out for help
|
|
191
|
+
4. **Test Early**: Test your application frequently during development
|
|
192
|
+
5. **Document**: Keep notes on your decisions and implementations
|
|
193
|
+
|
|
194
|
+
### Presentation Tips
|
|
195
|
+
|
|
196
|
+
1. **Show, Don't Tell**: Live demos are more impactful than slides
|
|
197
|
+
2. **Tell a Story**: Explain the problem you're solving
|
|
198
|
+
3. **Highlight Innovation**: Show what makes your solution unique
|
|
199
|
+
4. **Be Concise**: Respect the time limits for presentations
|
|
200
|
+
5. **Prepare Backup**: Have screenshots/video in case of technical issues
|
|
201
|
+
|
|
202
|
+
---
|
|
203
|
+
|
|
204
|
+
**Good luck, and happy hacking! 🚀**
|
|
205
|
+
|
|
206
|
+
*Last updated: November 17, 2025*
|
|
207
|
+
|
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
## Let's get started
|
|
4
4
|
|
|
5
|
-
To give you a quick idea of how the Powerhouse
|
|
5
|
+
To give you a quick idea of how the Powerhouse ecosystem operates on document models and packages, why don't you try installing a package?
|
|
6
6
|
We will show you how to install the Powerhouse command-line tool `ph-cmd` and then use it to install a pre-built demo package containing a document model, an editor, and a drive app.
|
|
7
7
|
|
|
8
8
|
## Step 1: Install the Powerhouse CLI
|
|
9
9
|
|
|
10
|
-
You will use the Powerhouse CLI to launch a local environment with a "To-do List Demo Package"
|
|
11
|
-
This is also the package that you'll recreate during the tutorials and gets you familiar with Powerhouse
|
|
10
|
+
You will use the Powerhouse CLI to launch a local environment with a "To-do List Demo Package".
|
|
11
|
+
This is also the package that you'll recreate during the tutorials and gets you familiar with Powerhouse.
|
|
12
12
|
|
|
13
13
|
```bash
|
|
14
14
|
pnpm install -g ph-cmd
|
|
@@ -20,21 +20,16 @@ Verify the installation:
|
|
|
20
20
|
ph --version
|
|
21
21
|
```
|
|
22
22
|
|
|
23
|
-
## Step 2:
|
|
23
|
+
## Step 2: Install the to-do list demo package
|
|
24
24
|
|
|
25
|
-
Now use the `ph
|
|
26
|
-
You'll be asked to name your project. Afterwards, move inside your project with `cd project-name`
|
|
27
|
-
|
|
28
|
-
## Step 3: Install the to-do list demo package
|
|
29
|
-
|
|
30
|
-
Now, use the `ph install` command to install the demo package inside the project.
|
|
25
|
+
Now, use the `ph` command to install the demo package into a global project.
|
|
31
26
|
|
|
32
27
|
```bash
|
|
33
28
|
# Install the package
|
|
34
|
-
ph install @powerhousedao/todo-demo
|
|
29
|
+
ph install @powerhousedao/todo-demo-package
|
|
35
30
|
```
|
|
36
31
|
|
|
37
|
-
This command downloads and sets up the `@powerhousedao/todo-demo`, making its features available in your Powerhouse
|
|
32
|
+
This command downloads and sets up the `@powerhousedao/todo-demo-package`, making its features available in your Powerhouse environment.
|
|
38
33
|
|
|
39
34
|
<details>
|
|
40
35
|
<summary>Expected CLI result</summary>
|
|
@@ -78,9 +73,9 @@ This command downloads and sets up the `@powerhousedao/todo-demo`, making its fe
|
|
|
78
73
|
|
|
79
74
|
</details>
|
|
80
75
|
|
|
81
|
-
You have now successfully installed `ph-cmd
|
|
76
|
+
You have now successfully installed `ph-cmd` and added your first package!
|
|
82
77
|
|
|
83
|
-
## Step
|
|
78
|
+
## Step 3: Run the connect app in studio mode
|
|
84
79
|
|
|
85
80
|
To run the package locally in Connect Studio (our collaboration and contributor app), run:
|
|
86
81
|
|
|
@@ -96,7 +91,7 @@ Click the returned localhost URL and you should see Connect Studio appear in you
|
|
|
96
91
|
</figure>
|
|
97
92
|
|
|
98
93
|
When you click the settings wheel in the bottom right corner, you'll get access to the **Package Manager**.
|
|
99
|
-
Here, you'll see that you've installed the `@powerhousedao/todo-demo`, which contains not only a **Document Model** and its accompanying editor but also a **Drive App** specific to the to-do document model.
|
|
94
|
+
Here, you'll see that you've installed the `@powerhousedao/todo-demo-package`, which contains not only a **Document Model** and its accompanying editor but also a **Drive App** specific to the to-do document model.
|
|
100
95
|
|
|
101
96
|
<figure className="image-container">
|
|
102
97
|
<img
|
|
@@ -108,13 +103,13 @@ Here, you'll see that you've installed the `@powerhousedao/todo-demo`, which con
|
|
|
108
103
|
</figcaption>
|
|
109
104
|
</figure>
|
|
110
105
|
|
|
111
|
-
## Step
|
|
106
|
+
## Step 4: Create a todo list document
|
|
112
107
|
|
|
113
108
|
:::tip What is a 'drive' at Powerhouse?
|
|
114
109
|
A **drive** is a folder to store and organize your documents in. Powerhouse offers the ability to build customized 'Drive Apps' for your documents. Think of a Drive App as a specialized lens—it offers **different ways to visualize, organize, and interact with** the data stored within a drive, making it more intuitive and efficient for specific use cases. To learn more, visit [Building A Drive App](/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer)
|
|
115
110
|
:::
|
|
116
111
|
|
|
117
|
-
###
|
|
112
|
+
### 4.1 Create a local todolist app drive
|
|
118
113
|
|
|
119
114
|
First, let's create a dedicated drive for your to-do lists:
|
|
120
115
|
|
|
@@ -122,14 +117,14 @@ First, let's create a dedicated drive for your to-do lists:
|
|
|
122
117
|
- In the **Drive App** field, select 'To-do Drive App'
|
|
123
118
|
- This creates a specialized drive that's optimized for to-do list documents
|
|
124
119
|
|
|
125
|
-
###
|
|
120
|
+
### 4.2 Create a todolist document
|
|
126
121
|
|
|
127
122
|
Now move into the drive you've just created:
|
|
128
123
|
|
|
129
124
|
- Click the button at the bottom of the page to create a new to-do list document
|
|
130
125
|
- This opens the to-do list editor where you can start managing your tasks
|
|
131
126
|
|
|
132
|
-
###
|
|
127
|
+
### 4.3 Add a few todos and inspect the document history
|
|
133
128
|
|
|
134
129
|
- Add a few to-dos that are on your mind
|
|
135
130
|
- You'll see a statistics widget that counts the open to-dos
|
|
@@ -139,6 +134,14 @@ This is an example of the **usefulness and impact of Drive Apps**.
|
|
|
139
134
|
They offer a customized interface that works well with the different documents inside your drive.
|
|
140
135
|
Read more about drive apps in the Mastery Track: [Drive Apps and Drive Explorers](/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer).
|
|
141
136
|
|
|
137
|
+
<figure className="image-container">
|
|
138
|
+
<img
|
|
139
|
+
src={require("./images/TodoDriveApp.png").default}
|
|
140
|
+
alt="Todo Drive App"
|
|
141
|
+
/>
|
|
142
|
+
<figcaption>A list of todos in the custom todo drive app.</figcaption>
|
|
143
|
+
</figure>
|
|
144
|
+
|
|
142
145
|
A key feature of Connect is the **Operations History**. Every change to a document is stored as an individual operation, creating an immutable and replayable history. This provides complete auditability and transparency, as you can inspect each revision, its details, and any associated signatures. For example, you can see a chronological list of all modifications, along with who made them and when.
|
|
143
146
|
|
|
144
147
|
<figure className="image-container">
|
|
@@ -164,7 +167,7 @@ You can find the button to visit the operations history in the document model to
|
|
|
164
167
|
|
|
165
168
|
Learn more about the [Operations History](../MasteryTrack/BuildingUserExperiences/DocumentTools/OperationHistory) and other document tools you get for free.
|
|
166
169
|
|
|
167
|
-
## Step
|
|
170
|
+
## Step 5: Enable operation signing and verification through Renown
|
|
168
171
|
|
|
169
172
|
Renown is Powerhouse's **decentralized identity and reputation system** designed to address the challenge of trust within open organizations, where contributors often operate under pseudonyms. In traditional organizations, personal identity and reputation are key to establishing trust and accountability. Renown replicates this dynamic in the digital space, allowing contributors to earn experience and build reputation without revealing their real-world identities.
|
|
170
173
|
|
|
@@ -172,7 +175,7 @@ Renown is Powerhouse's **decentralized identity and reputation system** designed
|
|
|
172
175
|
When signing in with Renown, use an Ethereum or blockchain address that can function as your 'identity', as this address will accrue more experience and history over time.
|
|
173
176
|
:::
|
|
174
177
|
|
|
175
|
-
###
|
|
178
|
+
### 5.1 Click the renown icon and connect your Ethereum identity
|
|
176
179
|
|
|
177
180
|
"**Log in with Renown**" is a decentralized authentication flow that enables you to log into applications by signing a credential with your Ethereum wallet. Upon signing in, a Decentralized Identifier (DID) is created based on your Ethereum key.
|
|
178
181
|
|
|
@@ -183,7 +186,7 @@ When signing in with Renown, use an Ethereum or blockchain address that can func
|
|
|
183
186
|
</figcaption>
|
|
184
187
|
</figure>
|
|
185
188
|
|
|
186
|
-
###
|
|
189
|
+
### 5.2 Authorize Connect to sign document edits on your behalf
|
|
187
190
|
|
|
188
191
|
This DID is then associated with a credential that authorizes a specific Connect instance to act on your behalf. That credential is stored securely on Ceramic, a decentralized data network. When you perform actions through the Powerhouse Connect interface, those operations are signed with the DID and transmitted to Switchboard, which serves as the verifier.
|
|
189
192
|
|
|
@@ -205,7 +208,7 @@ This DID is then associated with a credential that authorizes a specific Connect
|
|
|
205
208
|
<figcaption>Confirmation of a successful login with Renown.</figcaption>
|
|
206
209
|
</figure>
|
|
207
210
|
|
|
208
|
-
###
|
|
211
|
+
### 5.3 Verify the signatures of new operations in the todo list
|
|
209
212
|
|
|
210
213
|
By leveraging this system, every operation or modification made to a document is cryptographically signed by the contributor's Renown identity. This ensures that each change is verifiable, traceable, and attributable to a specific pseudonymous user, providing a robust audit trail for all document activity.
|
|
211
214
|
|
|
@@ -221,7 +224,7 @@ Now, return to your to-do list and make some additional changes. You'll notice t
|
|
|
221
224
|
</figcaption>
|
|
222
225
|
</figure>
|
|
223
226
|
|
|
224
|
-
## Step
|
|
227
|
+
## Step 6: Export a document
|
|
225
228
|
|
|
226
229
|
Export the document as a `.phd` (Powerhouse Document) file using the export button in the document toolbar at the top. In this toolbar, you will find all available functionality for your documents. The `.phd` file can be sent through any of your preferred channels to other users on your network.
|
|
227
230
|
|
|
@@ -1,100 +1,12 @@
|
|
|
1
1
|
# Create a new to-do list document
|
|
2
2
|
|
|
3
|
-
:::tip Tutorial Repository
|
|
4
|
-
📦 **Reference Code**: [step-1-initialize-with-ph-init](https://github.com/powerhouse-inc/todo-tutorial/tree/step-1-initialize-with-ph-init)
|
|
5
|
-
|
|
6
|
-
This tutorial step has a corresponding branch in the repository. You can:
|
|
7
|
-
- View the complete code for this step
|
|
8
|
-
- Clone and checkout the branch to see the result
|
|
9
|
-
- Compare your implementation using `git diff`
|
|
10
|
-
:::
|
|
11
|
-
|
|
12
|
-
<details>
|
|
13
|
-
<summary>📖 How to use this tutorial</summary>
|
|
14
|
-
|
|
15
|
-
This tutorial is designed for you to **build your own project from scratch** while having access to reference code at each step.
|
|
16
|
-
|
|
17
|
-
### Setup: Create your project and connect to tutorial repo
|
|
18
|
-
|
|
19
|
-
1. **Create your project** following the tutorial:
|
|
20
|
-
```bash
|
|
21
|
-
mkdir ph-projects
|
|
22
|
-
cd ph-projects
|
|
23
|
-
ph init
|
|
24
|
-
# When prompted, enter project name: todo-tutorial
|
|
25
|
-
cd todo-tutorial
|
|
26
|
-
```
|
|
27
|
-
|
|
28
|
-
2. **Add the tutorial repository as a remote** to access reference branches:
|
|
29
|
-
```bash
|
|
30
|
-
git remote add tutorial https://github.com/powerhouse-inc/todo-tutorial.git
|
|
31
|
-
git fetch tutorial --prune
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
3. **Create your own branch** to keep your work organized:
|
|
35
|
-
```bash
|
|
36
|
-
git checkout -b my-todo-project
|
|
37
|
-
```
|
|
38
|
-
|
|
39
|
-
Now you have access to all tutorial step branches while working on your own code!
|
|
40
|
-
|
|
41
|
-
### Compare your work with reference steps
|
|
42
|
-
|
|
43
|
-
At any point, compare what you've built with a tutorial step:
|
|
44
|
-
|
|
45
|
-
```bash
|
|
46
|
-
# Compare your current work with step-1
|
|
47
|
-
git diff tutorial/step-1-initialize-with-ph-init
|
|
48
|
-
|
|
49
|
-
# See what changed between tutorial steps
|
|
50
|
-
git diff tutorial/step-1-initialize-with-ph-init..tutorial/step-2-generate-todo-list-document-model
|
|
51
|
-
|
|
52
|
-
# Compare specific files
|
|
53
|
-
git diff tutorial/step-1-initialize-with-ph-init -- package.json
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
### Visual diff with GitHub Desktop
|
|
57
|
-
|
|
58
|
-
For a more visual comparison, use GitHub Desktop:
|
|
59
|
-
|
|
60
|
-
1. **First, make your initial commit** (GitHub Desktop won't show your branch until you have at least one commit):
|
|
61
|
-
```bash
|
|
62
|
-
git add .
|
|
63
|
-
git commit -m "Initial project setup"
|
|
64
|
-
```
|
|
65
|
-
|
|
66
|
-
2. **Open GitHub Desktop** and open your repository
|
|
67
|
-
|
|
68
|
-
3. **Compare branches visually**:
|
|
69
|
-
- Click on **Branch** menu in the top menu bar
|
|
70
|
-
- Select **"Compare to Branch..."**
|
|
71
|
-
- Choose the tutorial branch you want to compare with (e.g., `tutorial/step-1-initialize-with-ph-init`)
|
|
72
|
-
- GitHub Desktop will show you all file differences in a visual interface
|
|
73
|
-
|
|
74
|
-
4. **Review the differences**:
|
|
75
|
-
- Click on any file to see side-by-side or unified diff view
|
|
76
|
-
- See exactly what's different between your code and the reference
|
|
77
|
-
|
|
78
|
-
**Tip**: You can also use VS Code's Git Graph extension or the command palette → "Git: Compare with Branch"
|
|
79
|
-
|
|
80
|
-
### If you get stuck
|
|
81
|
-
|
|
82
|
-
Reset your code to match a tutorial step:
|
|
83
|
-
|
|
84
|
-
```bash
|
|
85
|
-
# Reset to step-2 (WARNING: loses your changes)
|
|
86
|
-
git reset --hard tutorial/step-2-generate-todo-list-document-model
|
|
87
|
-
```
|
|
88
|
-
|
|
89
|
-
</details>
|
|
90
|
-
|
|
91
3
|
## Overview
|
|
92
4
|
|
|
93
5
|
This tutorial guides you through creating a simplified version of a 'Powerhouse project' for a **To-do List**.
|
|
94
6
|
A Powerhouse project primarily consists of a document model and its editor.
|
|
95
7
|
As your projects use-case expands you can add data-integrations or a specific drive-app as seen in the demo package.
|
|
96
8
|
|
|
97
|
-
For todays purpose, you'll be using Connect, our user-centric collaboration tool and Vetra Studio, the builder tooling through which developers can access and manage specifications of
|
|
9
|
+
For todays purpose, you'll be using Connect, our user-centric collaboration tool and Vetra Studio, the builder tooling through which developers can access and manage specifications of their project.
|
|
98
10
|
|
|
99
11
|
## Prerequisites
|
|
100
12
|
|
|
@@ -129,19 +41,19 @@ ph init
|
|
|
129
41
|
````bash
|
|
130
42
|
you@yourmachine:~/ph-projects % ph init
|
|
131
43
|
|
|
132
|
-
? What is the project name? ‣
|
|
44
|
+
? What is the project name? ‣ getting-started
|
|
133
45
|
```
|
|
134
46
|
|
|
135
47
|
|
|
136
48
|
Once the project is created, you will see the following output:
|
|
137
49
|
```bash
|
|
138
|
-
Initialized empty Git repository in /Users/you/ph-projects/
|
|
50
|
+
Initialized empty Git repository in /Users/you/ph-projects/getting-started/.git/
|
|
139
51
|
The installation is done!
|
|
140
52
|
```
|
|
141
53
|
|
|
142
54
|
Navigate to the newly created project directory:
|
|
143
55
|
```bash
|
|
144
|
-
cd
|
|
56
|
+
cd getting-started
|
|
145
57
|
```
|
|
146
58
|
|
|
147
59
|
## Develop a single document model in Connect
|
|
@@ -161,41 +73,20 @@ The Connect application will start and you will see the following output:
|
|
|
161
73
|
➜ press h + enter to show help
|
|
162
74
|
```
|
|
163
75
|
|
|
164
|
-
A new browser window will open and you will see the Connect application. If it doesn't open automatically, you can open it manually by navigating to `http://localhost:3000/` in your browser.
|
|
76
|
+
A new browser window will open and you will see the Connect application. If it doesn't open automatically, you can open it manually by navigating to `http://localhost:3000/` in your browser.
|
|
165
77
|
|
|
166
|
-
|
|
78
|
+
You will see your local drive and a button to create a new drive.
|
|
167
79
|
If you local drive is not present navigate into Settings in the bottom left corner. Settings > Danger Zone > Clear Storage.
|
|
168
80
|
Clear the storage of your localhost application as it might has an old session cached.
|
|
169
|
-
:::
|
|
170
81
|
|
|
171
82
|
4. Move into your local drive.
|
|
172
|
-
Create a new document model by clicking the `DocumentModel` button, found in the 'New Document' section at the bottom of the page.
|
|
173
|
-
|
|
174
|
-
If you've followed the steps correctly, you'll have an empty `TodoList` document where you can define the **'Document Specifications'**.
|
|
175
|
-
|
|
176
|
-
## Verify your setup
|
|
83
|
+
Create a new document model by clicking the `DocumentModel` button, found in the 'New Document' section at the bottom of the page.
|
|
177
84
|
|
|
178
|
-
|
|
85
|
+
If you've followed the steps correctly, you'll have an empty document where you can define the **'Document Specifications'**.
|
|
179
86
|
|
|
180
|
-
|
|
181
|
-
- Configuration files: `powerhouse.config.json`, `powerhouse.manifest.json`
|
|
182
|
-
- Package management files: `package.json`, `pnpm-lock.yaml`
|
|
183
|
-
- Build configuration: `tsconfig.json`, `vite.config.ts`, `vitest.config.ts`
|
|
87
|
+
## Develop a package in Vetra Studio
|
|
184
88
|
|
|
185
|
-
### Compare with reference implementation
|
|
186
89
|
|
|
187
|
-
Verify your initial setup matches the tutorial:
|
|
188
|
-
|
|
189
|
-
```bash
|
|
190
|
-
# Compare your project structure with step-1
|
|
191
|
-
git diff tutorial/step-1-initialize-with-ph-init
|
|
192
|
-
|
|
193
|
-
# List files in the tutorial's step-1
|
|
194
|
-
git ls-tree -r --name-only tutorial/step-1-initialize-with-ph-init
|
|
195
|
-
|
|
196
|
-
# View a specific config file from step-1
|
|
197
|
-
git show tutorial/step-1-initialize-with-ph-init:package.json
|
|
198
|
-
```
|
|
199
90
|
|
|
200
91
|
## Up next
|
|
201
92
|
|