@powerhousedao/academy 5.1.0-staging.0 → 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 (76) hide show
  1. package/CHANGELOG.md +46 -1148
  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 +10 -155
  7. package/docs/academy/01-GetStarted/02-DefineToDoListDocumentModel.md +35 -122
  8. package/docs/academy/01-GetStarted/03-ImplementOperationReducers.md +155 -178
  9. package/docs/academy/01-GetStarted/04-BuildToDoListEditor.md +218 -0
  10. package/docs/academy/{02-MasteryTrack/01-BuilderEnvironment → 01-GetStarted}/05-VetraStudio.md +22 -62
  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 +79 -195
  26. package/docs/academy/03-ExampleUsecases/Chatroom/04-ImplementOperationReducers.md +241 -435
  27. package/docs/academy/03-ExampleUsecases/Chatroom/05-ImplementChatroomEditor.md +27 -388
  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 +13 -49
  40. package/src/css/custom.css +18 -26
  41. package/docs/academy/01-GetStarted/04-WriteDocumentModelTests.md +0 -425
  42. package/docs/academy/01-GetStarted/05-BuildToDoListEditor.md +0 -557
  43. package/docs/academy/02-MasteryTrack/01-BuilderEnvironment/images/Modules.png +0 -0
  44. package/docs/academy/02-MasteryTrack/01-BuilderEnvironment/images/VetraStudioDrive.png +0 -0
  45. package/docs/academy/02-MasteryTrack/05-Launch/05-DockerDeployment.md +0 -384
  46. package/docs/academy/03-ExampleUsecases/TodoList/00-GetTheStarterCode.md +0 -24
  47. package/docs/academy/03-ExampleUsecases/TodoList/01-GenerateTodoListDocumentModel.md +0 -211
  48. package/docs/academy/03-ExampleUsecases/TodoList/02-ImplementTodoListDocumentModelReducerOperationHandlers.md +0 -171
  49. package/docs/academy/03-ExampleUsecases/TodoList/03-AddTestsForTodoListActions.md +0 -462
  50. package/docs/academy/03-ExampleUsecases/TodoList/04-GenerateTodoListDocumentEditor.md +0 -45
  51. package/docs/academy/03-ExampleUsecases/TodoList/05-ImplementTodoListDocumentEditorUIComponents.md +0 -422
  52. package/docs/academy/03-ExampleUsecases/TodoList/06-GenerateTodoDriveExplorer.md +0 -61
  53. package/docs/academy/03-ExampleUsecases/TodoList/07-AddSharedComponentForShowingTodoListStats.md +0 -384
  54. package/docs/academy/03-ExampleUsecases/TodoList/_category_.json +0 -8
  55. package/docs/academy/03-ExampleUsecases/VetraPackageLibrary/VetraPackageLibrary.md +0 -7
  56. package/docs/academy/03-ExampleUsecases/VetraPackageLibrary/_category_.json +0 -9
  57. package/docs/academy/04-APIReferences/06-VetraRemoteDrive.md +0 -160
  58. package/docs/academy/04-APIReferences/renown-sdk/00-Overview.md +0 -316
  59. package/docs/academy/04-APIReferences/renown-sdk/01-Authentication.md +0 -672
  60. package/docs/academy/04-APIReferences/renown-sdk/02-APIReference.md +0 -957
  61. package/docs/academy/04-APIReferences/renown-sdk/_category_.json +0 -8
  62. package/docs/academy/10-TodoListTutorial/02-ImplementTodoListDocumentModelReducerOperationHandlers.md +0 -171
  63. package/docs/academy/10-TodoListTutorial/03-AddTestsForTodoListActions.md +0 -462
  64. package/docs/academy/10-TodoListTutorial/05-ImplementTodoListDocumentEditorUIComponents.md +0 -422
  65. package/docs/academy/10-TodoListTutorial/07-AddSharedComponentForShowingTodoListStats.md +0 -370
  66. package/static/img/Vetra-logo-dark.svg +0 -11
  67. package/static/img/vetra-logo-light.svg +0 -11
  68. /package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/06-DocumentTools/{02-RevisionHistoryTimeline/360/237/232/247" → 02-RevisionHistoryTimeline} +0 -0
  69. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /01-WhatIsADocumentModel" → 01-WhatIsADocumentModel} +0 -0
  70. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /02-DAOandDocumentsModelsQ+A" → 02-DAOandDocumentsModelsQ+A} +0 -0
  71. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /02-domain-modeling" → 02-domain-modeling} +0 -0
  72. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /03-BenefitsOfDocumentModels" → 03-BenefitsOfDocumentModels} +0 -0
  73. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /04-UtilitiesAndTips" → 04-UtilitiesAndTips} +0 -0
  74. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /05-best-practices" → 05-best-practices} +0 -0
  75. /package/docs/academy/05-Architecture/05-DocumentModelTheory/{360/237/232/247 /_category_.json" → _category_.json} +0 -0
  76. /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,21 +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
3
  ## Overview
13
4
 
14
5
  This tutorial guides you through creating a simplified version of a 'Powerhouse project' for a **To-do List**.
15
6
  A Powerhouse project primarily consists of a document model and its editor.
16
7
  As your projects use-case expands you can add data-integrations or a specific drive-app as seen in the demo package.
17
8
 
18
- 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.
19
10
 
20
11
  ## Prerequisites
21
12
 
@@ -26,85 +17,6 @@ For todays purpose, you'll be using Connect, our user-centric collaboration tool
26
17
 
27
18
  If you need help with installing the prerequisites you can visit our page [prerequisites](/academy/MasteryTrack/BuilderEnvironment/Prerequisites)
28
19
 
29
- <details>
30
- <summary>📖 How to use this tutorial</summary>
31
-
32
- This tutorial is designed for you to **build your own project from scratch** while having access to reference code at each step.
33
-
34
- ### Setup: Create your project and connect to tutorial repo
35
-
36
- 1. **Create your project** following the tutorial:
37
- ```bash
38
- mkdir ph-projects
39
- cd ph-projects
40
- ph init
41
- # When prompted, enter project name: todo-tutorial
42
- cd todo-tutorial
43
- ```
44
-
45
- 2. **Add the tutorial repository as a remote** to access reference branches:
46
- ```bash
47
- git remote add tutorial https://github.com/powerhouse-inc/todo-tutorial.git
48
- git fetch tutorial --prune
49
- ```
50
-
51
- 3. **Create your own branch** to keep your work organized:
52
- ```bash
53
- git checkout -b my-todo-project
54
- ```
55
-
56
- Now you have access to all tutorial step branches while working on your own code!
57
-
58
- ### Compare your work with reference steps
59
-
60
- At any point, compare what you've built with a tutorial step:
61
-
62
- ```bash
63
- # Compare your current work with step-1
64
- git diff tutorial/step-1-initialize-with-ph-init
65
-
66
- # See what changed between tutorial steps
67
- git diff tutorial/step-1-initialize-with-ph-init..tutorial/step-2-generate-todo-list-document-model
68
-
69
- # Compare specific files
70
- git diff tutorial/step-1-initialize-with-ph-init -- package.json
71
- ```
72
-
73
- ### Visual diff with GitHub Desktop
74
-
75
- For a more visual comparison, use GitHub Desktop:
76
-
77
- 1. **First, make your initial commit** (GitHub Desktop won't show your branch until you have at least one commit):
78
- ```bash
79
- git add .
80
- git commit -m "Initial project setup"
81
- ```
82
-
83
- 2. **Open GitHub Desktop** and open your repository
84
-
85
- 3. **Compare branches visually**:
86
- - Click on **Branch** menu in the top menu bar
87
- - Select **"Compare to Branch..."**
88
- - Choose the tutorial branch you want to compare with (e.g., `tutorial/step-1-initialize-with-ph-init`)
89
- - GitHub Desktop will show you all file differences in a visual interface
90
-
91
- 4. **Review the differences**:
92
- - Click on any file to see side-by-side or unified diff view
93
- - See exactly what's different between your code and the reference
94
-
95
- **Tip**: You can also use VS Code's Git Graph extension or the command palette → "Git: Compare with Branch"
96
-
97
- ### If you get stuck
98
-
99
- Reset your code to match a tutorial step:
100
-
101
- ```bash
102
- # Reset to step-2 (WARNING: loses your changes)
103
- git reset --hard tutorial/step-2-generate-todo-list-document-model
104
- ```
105
-
106
- </details>
107
-
108
20
  ## Quick start
109
21
 
110
22
  Create a new Powerhouse project with a single command:
@@ -129,56 +41,22 @@ 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
- ## Develop a single document model in Vetra Studio
148
-
149
- **Vetra Studio** is the builder's orchestration hub for assembling all specifications needed for your package. It provides a **Vetra Studio Drive** to access, manage, and share document model specifications, editors, and data integrations—all through a visual interface. For deeper coverage, see the [Vetra Studio documentation](/academy/MasteryTrack/BuilderEnvironment/VetraStudio).
150
-
151
- Once in the project directory, run the `ph vetra` command to start a Vetra Studio Drive where you'll be defining your specifications.
152
-
153
-
154
- ```bash
155
- ph vetra
156
- ```
157
-
158
- The host application for Vetra Studio will start and you will see the following output:
159
-
160
- ```bash
161
- ➜ Local: http://localhost:3000/
162
- ➜ Network: http://192.168.5.110:3000/
163
- ➜ press h + enter to show help
164
- ```
165
-
166
- A new browser window will open and you will see the Vetra Studio. If it doesn't open automatically, you can open it manually by navigating to `http://localhost:3000/` in your browser.
167
-
168
-
169
- <figure className="image-container">
170
- <img
171
- src={require("./images/VetraStudioDrive.png").default}
172
- alt="Vetra Studio Drive"
173
- />
174
- <figcaption>The Vetra Studio Drive, a builder app that collects all of the specification of a package.</figcaption>
175
- </figure>
176
-
177
-
178
- Create a new document model by clicking the Document Modesl 'Add new specification' button. Name your document TodoList (PascalCase, no spaces or hyphens). If you've followed the steps correctly, you'll have an empty TodoList document where you can define the 'Document Specifications' in the next step.
179
-
180
- <details>
181
- <summary>Alternatively: Develop a single document model in Connect</summary>
59
+ ## Develop a single document model in Connect
182
60
 
183
61
  Once in the project directory, run the `ph connect` command to start a local instance of the Connect application. This allows you to start your document model specification document.
184
62
  Run the following command to start the Connect application:
@@ -195,43 +73,20 @@ The Connect application will start and you will see the following output:
195
73
  ➜ press h + enter to show help
196
74
  ```
197
75
 
198
- 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.
199
77
 
200
- :::tip
78
+ You will see your local drive and a button to create a new drive.
201
79
  If you local drive is not present navigate into Settings in the bottom left corner. Settings > Danger Zone > Clear Storage.
202
80
  Clear the storage of your localhost application as it might has an old session cached.
203
- :::
204
81
 
205
82
  4. Move into your local drive.
206
- 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).
83
+ Create a new document model by clicking the `DocumentModel` button, found in the 'New Document' section at the bottom of the page.
207
84
 
208
- If you've followed the steps correctly, you'll have an empty `TodoList` document where you can define the **'Document Specifications'**.
85
+ If you've followed the steps correctly, you'll have an empty document where you can define the **'Document Specifications'**.
209
86
 
210
- </details>
87
+ ## Develop a package in Vetra Studio
211
88
 
212
- ## Verify your setup
213
89
 
214
- At this point, your project structure should match the `step-1-initialize-with-ph-init` branch. You should have:
215
-
216
- - Empty `document-models/`, `editors/`, `processors/`, and `subgraphs/` directories
217
- - Configuration files: `powerhouse.config.json`, `powerhouse.manifest.json`
218
- - Package management files: `package.json`, `pnpm-lock.yaml`
219
- - Build configuration: `tsconfig.json`, `vite.config.ts`, `vitest.config.ts`
220
-
221
- ### Compare with reference implementation
222
-
223
- Verify your initial setup matches the tutorial:
224
-
225
- ```bash
226
- # Compare your project structure with step-1
227
- git diff tutorial/step-1-initialize-with-ph-init
228
-
229
- # List files in the tutorial's step-1
230
- git ls-tree -r --name-only tutorial/step-1-initialize-with-ph-init
231
-
232
- # View a specific config file from step-1
233
- git show tutorial/step-1-initialize-with-ph-init:package.json
234
- ```
235
90
 
236
91
  ## Up next
237
92