@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.
Files changed (75) hide show
  1. package/CHANGELOG.md +43 -1108
  2. package/blog/BeyondCommunication-ABlueprintForDevelopment.md +1 -2
  3. package/blog/TheChallengeOfChange.md +0 -1
  4. package/docs/academy/00-EthereumArgentinaHackathon.md +207 -0
  5. package/docs/academy/01-GetStarted/00-ExploreDemoPackage.mdx +27 -24
  6. package/docs/academy/01-GetStarted/01-CreateNewPowerhouseProject.md +9 -118
  7. package/docs/academy/01-GetStarted/02-DefineToDoListDocumentModel.md +28 -110
  8. package/docs/academy/01-GetStarted/03-ImplementOperationReducers.md +145 -191
  9. package/docs/academy/01-GetStarted/04-BuildToDoListEditor.md +218 -0
  10. package/docs/academy/{02-MasteryTrack/01-BuilderEnvironment → 01-GetStarted}/05-VetraStudio.md +6 -48
  11. package/docs/academy/01-GetStarted/06-ReactorMCP.md +58 -0
  12. package/docs/academy/01-GetStarted/_04-BuildToDoListEditor +1 -1
  13. package/docs/academy/02-MasteryTrack/01-BuilderEnvironment/03-BuilderTools.md +2 -2
  14. package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/02-SpecifyTheStateSchema.md +44 -75
  15. package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/03-SpecifyDocumentOperations.md +22 -28
  16. package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/04-UseTheDocumentModelGenerator.md +31 -28
  17. package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/05-ImplementDocumentReducers.md +206 -211
  18. package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/06-ImplementDocumentModelTests.md +62 -176
  19. package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/07-ExampleToDoListRepository.md +0 -21
  20. package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/01-BuildingDocumentEditors.md +319 -309
  21. package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/06-DocumentTools/00-DocumentToolbar.mdx +0 -4
  22. package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/06-DocumentTools/01-OperationHistory.md +0 -4
  23. package/docs/academy/02-MasteryTrack/05-Launch/04-ConfigureEnvironment.md +1 -1
  24. package/docs/academy/03-ExampleUsecases/Chatroom/02-CreateNewPowerhouseProject.md +35 -111
  25. package/docs/academy/03-ExampleUsecases/Chatroom/03-DefineChatroomDocumentModel.md +76 -255
  26. package/docs/academy/03-ExampleUsecases/Chatroom/04-ImplementOperationReducers.md +160 -281
  27. package/docs/academy/03-ExampleUsecases/Chatroom/05-ImplementChatroomEditor.md +35 -188
  28. package/docs/academy/03-ExampleUsecases/Chatroom/06-LaunchALocalReactor.md +7 -95
  29. package/docs/academy/03-ExampleUsecases/Chatroom/_category_.json +1 -1
  30. package/docs/academy/04-APIReferences/00-PowerhouseCLI.md +2 -6
  31. package/docs/academy/04-APIReferences/01-ReactHooks.md +501 -291
  32. package/docs/academy/05-Architecture/00-PowerhouseArchitecture.md +39 -7
  33. package/docs/academy/05-Architecture/02-ReferencingMonorepoPackages +65 -0
  34. package/docs/academy/05-Architecture/04-MovingBeyondCRUD +61 -0
  35. package/docs/academy/06-ComponentLibrary/00-DocumentEngineering.md +24 -72
  36. package/docs/academy/08-Glossary.md +0 -7
  37. package/docusaurus.config.ts +3 -28
  38. package/package.json +1 -1
  39. package/sidebars.ts +12 -49
  40. package/src/css/custom.css +18 -26
  41. package/docs/academy/01-GetStarted/04-WriteDocumentModelTests.md +0 -378
  42. package/docs/academy/01-GetStarted/05-BuildToDoListEditor.md +0 -560
  43. package/docs/academy/03-ExampleUsecases/TodoList/00-GetTheStarterCode.md +0 -24
  44. package/docs/academy/03-ExampleUsecases/TodoList/01-GenerateTodoListDocumentModel.md +0 -211
  45. package/docs/academy/03-ExampleUsecases/TodoList/02-ImplementTodoListDocumentModelReducerOperationHandlers.md +0 -171
  46. package/docs/academy/03-ExampleUsecases/TodoList/03-AddTestsForTodoListActions.md +0 -462
  47. package/docs/academy/03-ExampleUsecases/TodoList/04-GenerateTodoListDocumentEditor.md +0 -45
  48. package/docs/academy/03-ExampleUsecases/TodoList/05-ImplementTodoListDocumentEditorUIComponents.md +0 -422
  49. package/docs/academy/03-ExampleUsecases/TodoList/06-GenerateTodoDriveExplorer.md +0 -61
  50. package/docs/academy/03-ExampleUsecases/TodoList/07-AddSharedComponentForShowingTodoListStats.md +0 -384
  51. package/docs/academy/03-ExampleUsecases/TodoList/_category_.json +0 -8
  52. package/docs/academy/03-ExampleUsecases/VetraPackageLibrary/VetraPackageLibrary.md +0 -7
  53. package/docs/academy/03-ExampleUsecases/VetraPackageLibrary/_category_.json +0 -9
  54. package/docs/academy/04-APIReferences/06-VetraRemoteDrive.md +0 -160
  55. package/docs/academy/04-APIReferences/renown-sdk/00-Overview.md +0 -316
  56. package/docs/academy/04-APIReferences/renown-sdk/01-Authentication.md +0 -672
  57. package/docs/academy/04-APIReferences/renown-sdk/02-APIReference.md +0 -957
  58. package/docs/academy/04-APIReferences/renown-sdk/_category_.json +0 -8
  59. package/docs/academy/10-TodoListTutorial/02-ImplementTodoListDocumentModelReducerOperationHandlers.md +0 -171
  60. package/docs/academy/10-TodoListTutorial/03-AddTestsForTodoListActions.md +0 -462
  61. package/docs/academy/10-TodoListTutorial/05-ImplementTodoListDocumentEditorUIComponents.md +0 -422
  62. package/docs/academy/10-TodoListTutorial/07-AddSharedComponentForShowingTodoListStats.md +0 -370
  63. package/static/img/Vetra-logo-dark.svg +0 -11
  64. package/static/img/vetra-logo-light.svg +0 -11
  65. /package/docs/academy/{02-MasteryTrack/01-BuilderEnvironment → 01-GetStarted}/images/Modules.png +0 -0
  66. /package/docs/academy/{02-MasteryTrack/01-BuilderEnvironment → 01-GetStarted}/images/VetraStudioDrive.png +0 -0
  67. /package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/06-DocumentTools/{02-RevisionHistoryTimeline/360/237/232/247" → 02-RevisionHistoryTimeline} +0 -0
  68. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /01-WhatIsADocumentModel" → 01-WhatIsADocumentModel} +0 -0
  69. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /02-DAOandDocumentsModelsQ+A" → 02-DAOandDocumentsModelsQ+A} +0 -0
  70. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /02-domain-modeling" → 02-domain-modeling} +0 -0
  71. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /03-BenefitsOfDocumentModels" → 03-BenefitsOfDocumentModels} +0 -0
  72. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /04-UtilitiesAndTips" → 04-UtilitiesAndTips} +0 -0
  73. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /05-best-practices" → 05-best-practices} +0 -0
  74. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /_category_.json" → _category_.json} +0 -0
  75. /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's as a common language for software design
3
+ description: GraphQL Schemas 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
@@ -2,7 +2,6 @@
2
2
  title: The Challenge of Change
3
3
  description: Rapid Application Development with document models.
4
4
  slug: Rapid-Application-Development-with-document-models.
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 Vetra builder platform operates on document models and packages, why don't you try installing a package?
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" installed.
11
- This is also the package that you'll recreate during the tutorials and gets you familiar with Powerhouse Vetra.
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: Initialize a new project
23
+ ## Step 2: Install the to-do list demo package
24
24
 
25
- Now use the `ph init` command to initialize a new project and install a Powerhouse package inside the project.
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 project.
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`, initalized a product project and added your first package!
76
+ You have now successfully installed `ph-cmd` and added your first package!
82
77
 
83
- ## Step 4: Run the connect app in studio mode
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 5: Create a todo list document
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
- ### 5.1 Create a local todolist app drive
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
- ### 5.2 Create a todolist document
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
- ### 5.3 Add a few todos and inspect the document history
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 6: Enable operation signing and verification through Renown
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
- ### 6.1 Click the renown icon and connect your Ethereum identity
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
- ### 6.2 Authorize Connect to sign document edits on your behalf
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
- ### 6.3 Verify the signatures of new operations in the todo list
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 7: Export a document
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 your project.
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? ‣ todo-tutorial
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/todo-tutorial/.git/
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 todo-tutorial
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. You will see your local drive and a button to create a new drive.
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
- :::tip
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. Name your document `TodoList` (PascalCase, no spaces or hyphens).
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
- At this point, your project structure should match the `step-1-initialize-with-ph-init` branch. You should have:
85
+ If you've followed the steps correctly, you'll have an empty document where you can define the **'Document Specifications'**.
179
86
 
180
- - Empty `document-models/`, `editors/`, `processors/`, and `subgraphs/` directories
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