@powerhousedao/academy 2.5.0-dev.4 → 2.5.0-dev.40
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 +237 -0
- package/docs/academy/01-GetStarted/00-ExploreDemoPackage.md +19 -15
- package/docs/academy/01-GetStarted/01-CreateNewPowerhouseProject.md +39 -40
- package/docs/academy/01-GetStarted/02-DefineToDoListDocumentModel.md +22 -7
- package/docs/academy/01-GetStarted/03-ImplementOperationReducers.md +9 -4
- package/docs/academy/01-GetStarted/04-BuildToDoListEditor.md +146 -422
- package/docs/academy/01-GetStarted/_04-BuildToDoListEditor +360 -0
- package/docs/academy/01-GetStarted/home.mdx +16 -24
- package/docs/academy/01-GetStarted/styles.module.css +31 -0
- package/docs/academy/02-MasteryTrack/01-BuilderEnvironment/01-Prerequisites.md +0 -18
- package/docs/academy/02-MasteryTrack/01-BuilderEnvironment/02-StandardDocumentModelWorkflow.md +10 -6
- package/docs/academy/02-MasteryTrack/01-BuilderEnvironment/03-BuilderTools.md +1 -1
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/01-WhatIsADocumentModel.md +33 -16
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/02-SpecifyTheStateSchema.md +73 -0
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/03-SpecifyDocumentOperations.md +59 -4
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/04-UseTheDocumentModelGenerator.md +32 -12
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/05-ImplementDocumentReducers.md +103 -38
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/06-ImplementDocumentModelTests.md +90 -228
- package/docs/academy/02-MasteryTrack/02-DocumentModelCreation/07-ExampleToDoListRepository.md +41 -1
- package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/01-BuildingDocumentEditors.md +342 -67
- package/docs/academy/02-MasteryTrack/03-BuildingUserExperiences/02-ConfiguringDrives.md +5 -3
- package/docs/academy/02-MasteryTrack/05-Launch/02-PublishYourProject.md +70 -5
- package/docs/academy/02-MasteryTrack/05-Launch/03-SetupEnvironment.md +162 -73
- package/docs/academy/02-MasteryTrack/05-Launch/{03-RunOnACloudServer.md → _03-RunOnACloudServer} +8 -5
- package/docs/academy/03-ExampleUsecases/Chatroom/02-CreateNewPowerhouseProject.md +10 -9
- package/docs/academy/03-ExampleUsecases/Chatroom/03-DefineChatroomDocumentModel.md +3 -4
- package/docs/academy/03-ExampleUsecases/Chatroom/05-ImplementChatroomEditor.md +1 -1
- package/docs/academy/03-ExampleUsecases/Chatroom/_category_.json +1 -1
- package/docs/academy/04-APIReferences/00-PowerhouseCLI.md +13 -49
- package/docs/academy/05-Architecture/00-PowerhouseArchitecture.md +3 -0
- package/docs/academy/05-Architecture/images/PowerhouseArchitecture.png +0 -0
- package/docs/academy/06-ComponentLibrary/00-DocumentEngineering.md +85 -30
- package/docs/academy/06-ComponentLibrary/02-CreateCustomScalars.md +382 -0
- package/docs/academy/06-ComponentLibrary/03-IntegrateIntoAReactComponent.md +124 -0
- package/docs/academy/07-Cookbook.md +252 -4
- package/docs/academy/08-Glossary.md +20 -18
- package/docs/academy/09-AIResources +131 -0
- package/docusaurus.config.ts +4 -0
- package/package.json +1 -1
- package/sidebars.ts +3 -45
- package/src/css/custom.css +23 -1
- package/docs/academy/03-ExampleUsecases/Chatroom/01-SetupBuilderEnvironment.md +0 -216
- package/docs/academy/06-ComponentLibrary/02-BuildingWithScalars.md +0 -54
- package/docs/academy/06-ComponentLibrary/03-Scalar-Components/01-phid-field.mdx +0 -72
- package/docs/academy/06-ComponentLibrary/03-Scalar-Components/02-input-field.mdx +0 -0
- package/docs/academy/06-ComponentLibrary/04-Complex-Components/01-sidebar.mdx +0 -36
- package/docs/academy/06-ComponentLibrary/05-Layout-Components/01-test-toupdate.mdx +0 -61
- package/docs/academy/06-ComponentLibrary/06-Fragments/01-test-toupdate.mdx +0 -61
- /package/docs/academy/02-MasteryTrack/05-Launch/{02-IntroductionToPackages.md → 01-IntroductionToPackages.md} +0 -0
- /package/docs/academy/02-MasteryTrack/05-Launch/{00-IntegrateInAFront-End → _00-IntegrateInAFront-End} +0 -0
- /package/docs/academy/02-MasteryTrack/05-Launch/{01-IntroducingFusion → _01-IntroducingFusion} +0 -0
- /package/docs/academy/02-MasteryTrack/05-Launch/{04-GraphQLNamespacing → _04-GraphQLNamespacing} +0 -0
- /package/docs/academy/02-MasteryTrack/05-Launch/{05-LaunchYourBackend.md → _05-LaunchYourBackend} +0 -0
- /package/docs/academy/02-MasteryTrack/05-Launch/{06-LaunchYourFrontend.md → _06-LaunchYourFrontend} +0 -0
- /package/docs/academy/04-APIReferences/{01-ReactHooks.md → 01-ReactHooks} +0 -0
- /package/docs/academy/04-APIReferences/{02-ReactorAPI.md → 02-ReactorAPI} +0 -0
- /package/docs/academy/04-APIReferences/{03-Configuration.md → 03-Configuration} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,240 @@
|
|
|
1
|
+
## 2.5.0-dev.40 (2025-06-18)
|
|
2
|
+
|
|
3
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
4
|
+
|
|
5
|
+
## 2.5.0-dev.39 (2025-06-18)
|
|
6
|
+
|
|
7
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
8
|
+
|
|
9
|
+
## 2.5.0-dev.38 (2025-06-18)
|
|
10
|
+
|
|
11
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
12
|
+
|
|
13
|
+
## 2.5.0-dev.37 (2025-06-18)
|
|
14
|
+
|
|
15
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
16
|
+
|
|
17
|
+
## 2.5.0-dev.36 (2025-06-18)
|
|
18
|
+
|
|
19
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
20
|
+
|
|
21
|
+
## 2.5.0-dev.35 (2025-06-18)
|
|
22
|
+
|
|
23
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
24
|
+
|
|
25
|
+
## 2.5.0-dev.34 (2025-06-18)
|
|
26
|
+
|
|
27
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
28
|
+
|
|
29
|
+
## 2.5.0-dev.33 (2025-06-18)
|
|
30
|
+
|
|
31
|
+
### 🩹 Fixes
|
|
32
|
+
|
|
33
|
+
- deploy not on push to main ([63eef7020](https://github.com/powerhouse-inc/powerhouse/commit/63eef7020))
|
|
34
|
+
- deploy powerhouse to available environments ([a45859a22](https://github.com/powerhouse-inc/powerhouse/commit/a45859a22))
|
|
35
|
+
|
|
36
|
+
### ❤️ Thank You
|
|
37
|
+
|
|
38
|
+
- Frank
|
|
39
|
+
|
|
40
|
+
## 2.5.0-dev.32 (2025-06-18)
|
|
41
|
+
|
|
42
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
43
|
+
|
|
44
|
+
## 2.5.0-dev.31 (2025-06-18)
|
|
45
|
+
|
|
46
|
+
### 🚀 Features
|
|
47
|
+
|
|
48
|
+
- **connect,builder-tools,ph-cli:** added support for path argument on ph connect build and preview ([fe049aae8](https://github.com/powerhouse-inc/powerhouse/commit/fe049aae8))
|
|
49
|
+
- **reactor:** initial event-bus implementation with tests and benchmarks ([ef5b3c42e](https://github.com/powerhouse-inc/powerhouse/commit/ef5b3c42e))
|
|
50
|
+
|
|
51
|
+
### 🩹 Fixes
|
|
52
|
+
|
|
53
|
+
- **ph-cli:** install and uninstall packages with and without version tag ([c2a4ad13f](https://github.com/powerhouse-inc/powerhouse/commit/c2a4ad13f))
|
|
54
|
+
|
|
55
|
+
### ❤️ Thank You
|
|
56
|
+
|
|
57
|
+
- acaldas
|
|
58
|
+
- Benjamin Jordan (@thegoldenmule)
|
|
59
|
+
- Frank
|
|
60
|
+
|
|
61
|
+
## 2.5.0-dev.30 (2025-06-17)
|
|
62
|
+
|
|
63
|
+
### 🩹 Fixes
|
|
64
|
+
|
|
65
|
+
- **connect:** set proper tag on docker build ([598c1b3fb](https://github.com/powerhouse-inc/powerhouse/commit/598c1b3fb))
|
|
66
|
+
|
|
67
|
+
### ❤️ Thank You
|
|
68
|
+
|
|
69
|
+
- Frank
|
|
70
|
+
|
|
71
|
+
## 2.5.0-dev.29 (2025-06-17)
|
|
72
|
+
|
|
73
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
74
|
+
|
|
75
|
+
## 2.5.0-dev.28 (2025-06-16)
|
|
76
|
+
|
|
77
|
+
### 🚀 Features
|
|
78
|
+
|
|
79
|
+
- add app skeleton to html at build time ([1882bb820](https://github.com/powerhouse-inc/powerhouse/commit/1882bb820))
|
|
80
|
+
|
|
81
|
+
### ❤️ Thank You
|
|
82
|
+
|
|
83
|
+
- acaldas
|
|
84
|
+
|
|
85
|
+
## 2.5.0-dev.27 (2025-06-16)
|
|
86
|
+
|
|
87
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
88
|
+
|
|
89
|
+
## 2.5.0-dev.26 (2025-06-16)
|
|
90
|
+
|
|
91
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
92
|
+
|
|
93
|
+
## 2.5.0-dev.25 (2025-06-13)
|
|
94
|
+
|
|
95
|
+
### 🚀 Features
|
|
96
|
+
|
|
97
|
+
- start dependent services with switchboard ([188c82c6a](https://github.com/powerhouse-inc/powerhouse/commit/188c82c6a))
|
|
98
|
+
|
|
99
|
+
### 🩹 Fixes
|
|
100
|
+
|
|
101
|
+
- **docker:** request write permissions ([29d4d3fd7](https://github.com/powerhouse-inc/powerhouse/commit/29d4d3fd7))
|
|
102
|
+
|
|
103
|
+
### ❤️ Thank You
|
|
104
|
+
|
|
105
|
+
- Frank
|
|
106
|
+
|
|
107
|
+
## 2.5.0-dev.24 (2025-06-13)
|
|
108
|
+
|
|
109
|
+
### 🚀 Features
|
|
110
|
+
|
|
111
|
+
- added hostnames in docker compose ([a590eea17](https://github.com/powerhouse-inc/powerhouse/commit/a590eea17))
|
|
112
|
+
- **docker-compose:** work with published images ([9f31b70fb](https://github.com/powerhouse-inc/powerhouse/commit/9f31b70fb))
|
|
113
|
+
- **ci:** build and publish docker images on newly created tags ([ee930c4a4](https://github.com/powerhouse-inc/powerhouse/commit/ee930c4a4))
|
|
114
|
+
|
|
115
|
+
### ❤️ Thank You
|
|
116
|
+
|
|
117
|
+
- Frank
|
|
118
|
+
|
|
119
|
+
## 2.5.0-dev.23 (2025-06-13)
|
|
120
|
+
|
|
121
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
122
|
+
|
|
123
|
+
## 2.5.0-dev.22 (2025-06-13)
|
|
124
|
+
|
|
125
|
+
### 🩹 Fixes
|
|
126
|
+
|
|
127
|
+
- **ci:** set proper tags for docker images ([3cab91969](https://github.com/powerhouse-inc/powerhouse/commit/3cab91969))
|
|
128
|
+
- **ci:** connect deployment ([8ac8e423b](https://github.com/powerhouse-inc/powerhouse/commit/8ac8e423b))
|
|
129
|
+
|
|
130
|
+
### ❤️ Thank You
|
|
131
|
+
|
|
132
|
+
- Frank
|
|
133
|
+
|
|
134
|
+
## 2.5.0-dev.21 (2025-06-12)
|
|
135
|
+
|
|
136
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
137
|
+
|
|
138
|
+
## 2.5.0-dev.20 (2025-06-12)
|
|
139
|
+
|
|
140
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
141
|
+
|
|
142
|
+
## 2.5.0-dev.19 (2025-06-12)
|
|
143
|
+
|
|
144
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
145
|
+
|
|
146
|
+
## 2.5.0-dev.18 (2025-06-12)
|
|
147
|
+
|
|
148
|
+
### 🚀 Features
|
|
149
|
+
|
|
150
|
+
- added docker publish workflow ([adf65ef8a](https://github.com/powerhouse-inc/powerhouse/commit/adf65ef8a))
|
|
151
|
+
|
|
152
|
+
### ❤️ Thank You
|
|
153
|
+
|
|
154
|
+
- Frank
|
|
155
|
+
|
|
156
|
+
## 2.5.0-dev.17 (2025-06-12)
|
|
157
|
+
|
|
158
|
+
### 🚀 Features
|
|
159
|
+
|
|
160
|
+
- show app skeleton while loading and accessibility fixes ([4f96e2472](https://github.com/powerhouse-inc/powerhouse/commit/4f96e2472))
|
|
161
|
+
|
|
162
|
+
### ❤️ Thank You
|
|
163
|
+
|
|
164
|
+
- acaldas
|
|
165
|
+
|
|
166
|
+
## 2.5.0-dev.16 (2025-06-11)
|
|
167
|
+
|
|
168
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
169
|
+
|
|
170
|
+
## 2.5.0-dev.15 (2025-06-11)
|
|
171
|
+
|
|
172
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
173
|
+
|
|
174
|
+
## 2.5.0-dev.14 (2025-06-10)
|
|
175
|
+
|
|
176
|
+
### 🚀 Features
|
|
177
|
+
|
|
178
|
+
- improved analytics frontend integration ([269aed50c](https://github.com/powerhouse-inc/powerhouse/commit/269aed50c))
|
|
179
|
+
|
|
180
|
+
### ❤️ Thank You
|
|
181
|
+
|
|
182
|
+
- acaldas @acaldas
|
|
183
|
+
|
|
184
|
+
## 2.5.0-dev.13 (2025-06-10)
|
|
185
|
+
|
|
186
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
187
|
+
|
|
188
|
+
## 2.5.0-dev.12 (2025-06-10)
|
|
189
|
+
|
|
190
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
191
|
+
|
|
192
|
+
## 2.5.0-dev.11 (2025-06-07)
|
|
193
|
+
|
|
194
|
+
### 🚀 Features
|
|
195
|
+
|
|
196
|
+
- **connect:** updated diff-analyzer processor ([ce5d1219f](https://github.com/powerhouse-inc/powerhouse/commit/ce5d1219f))
|
|
197
|
+
|
|
198
|
+
### ❤️ Thank You
|
|
199
|
+
|
|
200
|
+
- acaldas
|
|
201
|
+
|
|
202
|
+
## 2.5.0-dev.10 (2025-06-06)
|
|
203
|
+
|
|
204
|
+
### 🚀 Features
|
|
205
|
+
|
|
206
|
+
- run analytics db on web worker ([ecf79575f](https://github.com/powerhouse-inc/powerhouse/commit/ecf79575f))
|
|
207
|
+
|
|
208
|
+
### ❤️ Thank You
|
|
209
|
+
|
|
210
|
+
- acaldas
|
|
211
|
+
|
|
212
|
+
## 2.5.0-dev.9 (2025-06-05)
|
|
213
|
+
|
|
214
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
215
|
+
|
|
216
|
+
## 2.5.0-dev.8 (2025-06-05)
|
|
217
|
+
|
|
218
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
219
|
+
|
|
220
|
+
## 2.5.0-dev.7 (2025-06-05)
|
|
221
|
+
|
|
222
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
223
|
+
|
|
224
|
+
## 2.5.0-dev.6 (2025-06-05)
|
|
225
|
+
|
|
226
|
+
### 🩹 Fixes
|
|
227
|
+
|
|
228
|
+
- set node 22 in release branch workflow ([b33681938](https://github.com/powerhouse-inc/powerhouse/commit/b33681938))
|
|
229
|
+
|
|
230
|
+
### ❤️ Thank You
|
|
231
|
+
|
|
232
|
+
- Frank
|
|
233
|
+
|
|
234
|
+
## 2.5.0-dev.5 (2025-06-05)
|
|
235
|
+
|
|
236
|
+
This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.
|
|
237
|
+
|
|
1
238
|
## 2.5.0-dev.4 (2025-06-05)
|
|
2
239
|
|
|
3
240
|
### 🩹 Fixes
|
|
@@ -1,14 +1,25 @@
|
|
|
1
1
|
# Explore the Demo Package
|
|
2
2
|
|
|
3
|
-
:::
|
|
3
|
+
:::info How Long Will This Tutorial Take?
|
|
4
|
+
We've designed this "Get Started" track to be as smooth as possible. The time it takes will vary based on your familiarity with modern web development tools.
|
|
5
|
+
|
|
6
|
+
- **For Experienced Developers** (familiar with TypeScript, React, and CLIs), you can expect to complete the entire four-part tutorial in approximately **1 to 1.5 hours**.
|
|
7
|
+
- **For Developers New to This Stack**, we recommend setting aside **3.5 to 4.5 hours**. This allows for time to understand not just the steps, but the core concepts behind them.
|
|
8
|
+
|
|
9
|
+
This is just a guideline. The goal is to learn comfortably and build a solid foundation with Powerhouse!
|
|
10
|
+
|
|
11
|
+
A more in theoretic and advanced version of this tutorial can also be found in [Mastery Track - Document Model Creation](../MasteryTrack/DocumentModelCreation/WhatIsADocumentModel).
|
|
12
|
+
:::
|
|
13
|
+
|
|
14
|
+
|
|
4
15
|
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?
|
|
5
16
|
|
|
6
17
|
Install the Powerhouse command-line tool `ph-cmd` and then use it to install a pre-built demo package with document models & editors.
|
|
7
|
-
:::
|
|
8
18
|
|
|
9
19
|
## Step 1: Install the Powerhouse CLI
|
|
10
20
|
|
|
11
|
-
You will use the Powerhouse CLI to launch a local environment with a "**
|
|
21
|
+
You will use the Powerhouse CLI to launch a local environment with a "**ToDoList Demo Package**".
|
|
22
|
+
This is also the package that you'll recreate during the tutorials and get's you familiar with Powerhouse.
|
|
12
23
|
|
|
13
24
|
```bash
|
|
14
25
|
pnpm install -g ph-cmd
|
|
@@ -26,26 +37,19 @@ Now, use the `ph` command to install the demo package into a global project.
|
|
|
26
37
|
|
|
27
38
|
```bash
|
|
28
39
|
# Install the package
|
|
29
|
-
ph install
|
|
40
|
+
ph install @powerhousedao/todo-demo-package.
|
|
30
41
|
```
|
|
31
42
|
|
|
32
|
-
This command downloads and sets up the
|
|
43
|
+
This command downloads and sets up the todo-demo-package, making its features available in your Powerhouse environment.
|
|
33
44
|
|
|
34
45
|
You have now successfully installed `ph-cmd` and added your first package!
|
|
35
46
|
|
|
36
|
-
:::info
|
|
37
|
-
WORK IN PROGRESS @callmet
|
|
38
|
-
Let's explore what exactly you can do with this package
|
|
39
|
-
- Document model
|
|
40
|
-
- Drive App
|
|
41
|
-
:::
|
|
42
|
-
|
|
43
47
|
## Step 3: Run the Connect App in Studio mode
|
|
44
48
|
To run the package locally in Connect Studio (our collaboration and contributor app), run the `ph connect` command.
|
|
45
49
|
|
|
46
50
|
## Step 4: Log in with Renown
|
|
47
51
|
|
|
48
|
-
Renown is Powerhouse's decentralized identity and reputation system designed to address the challenge of trust within
|
|
52
|
+
Renown is Powerhouse's decentralized identity and reputation system designed to address the challenge of trust within open organization's, 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.
|
|
49
53
|
|
|
50
54
|
:::tip
|
|
51
55
|
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.
|
|
@@ -66,7 +70,7 @@ This DID is then associated with a credential that authorizes a specific Connect
|
|
|
66
70
|
### Modify a document
|
|
67
71
|
Switchboard checks the validity of the DID and credential, ensuring the operation request is legitimate. This flow is designed to offer a verifiable, cryptographically secure login system that replaces traditional password-based authentication with decentralized identity and signature-based trust.
|
|
68
72
|
|
|
69
|
-
## Step 5: Explore the Document Operations History
|
|
73
|
+
## Step 5: Create an invoice & Explore the Document Operations History
|
|
70
74
|
|
|
71
75
|

|
|
72
76
|
|
|
@@ -77,7 +81,7 @@ Learn more about the [Operations History and other document tools you get for fr
|
|
|
77
81
|
|
|
78
82
|
## Step 6: Export a Document
|
|
79
83
|
|
|
80
|
-
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 Powergrid network.
|
|
84
|
+
Export the invoice 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 Powergrid network.
|
|
81
85
|
|
|
82
86
|
Now that you have explored a Powerhouse package and discovered its basic functionalities, it is time to start building your own.
|
|
83
87
|
Our next tutorial focuses on creating a simple To-Do list document and will introduce you to the world of Document Models.
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
# Create a ToDoList Document
|
|
2
2
|
|
|
3
3
|
## Overview
|
|
4
|
-
This tutorial guides you through creating a 'Powerhouse project' for a **ToDoList**.
|
|
4
|
+
This tutorial guides you through creating a simplified version of a 'Powerhouse project' for a **ToDoList**.
|
|
5
|
+
A Powerhouse project primarily consists of a document model and its editor.
|
|
6
|
+
For this purpose, you'll be using Connect, our use-centric collaboration tool, locally, known as Connect in 'Studio mode'.
|
|
5
7
|
|
|
6
8
|
## Prerequisites
|
|
7
9
|
- Powerhouse CLI installed: `pnpm install -g ph-cmd`
|
|
@@ -9,7 +11,7 @@ This tutorial guides you through creating a 'Powerhouse project' for a **ToDoLis
|
|
|
9
11
|
- Visual Studio Code (or your preferred IDE)
|
|
10
12
|
- Terminal/Command Prompt access
|
|
11
13
|
|
|
12
|
-
If you need help with installing the prerequisites you can visit our page prerequisites
|
|
14
|
+
If you need help with installing the prerequisites you can visit our page [prerequisites](/academy/MasteryTrack/BuilderEnvironment/Prerequisites)
|
|
13
15
|
|
|
14
16
|
## Quick Start
|
|
15
17
|
Create a new Powerhouse project with a single command:
|
|
@@ -19,7 +21,9 @@ ph init
|
|
|
19
21
|
<details>
|
|
20
22
|
<summary> How to make use of different branches? </summary>
|
|
21
23
|
|
|
22
|
-
When installing or using the Powerhouse CLI commands you are able to make use of the dev & staging branches.
|
|
24
|
+
When installing or using the Powerhouse CLI commands you are able to make use of the dev & staging branches.
|
|
25
|
+
These branches contain more experimental features then the latest stable release the PH CLI uses by default.
|
|
26
|
+
They can be used to get access to a bugfix or features under development.
|
|
23
27
|
|
|
24
28
|
| Command | Description |
|
|
25
29
|
|---------|-------------|
|
|
@@ -43,57 +47,52 @@ Please be aware that these versions can contain bugs and experimental features t
|
|
|
43
47
|
```bash
|
|
44
48
|
cd your-directory
|
|
45
49
|
```
|
|
46
|
-
3. Ensure you're in the correct directory before running the `ph init` command
|
|
47
|
-
|
|
48
|
-
|
|
50
|
+
3. Ensure you're in the correct directory before running the `ph init` command.
|
|
49
51
|
In the terminal, you will be asked to enter the project name. Fill in the project name and press Enter.
|
|
52
|
+
```bash
|
|
53
|
+
you@yourmachine:~/Powerhouse$ ph init
|
|
50
54
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
? What is the project name? ‣ <yourprojectname>
|
|
55
|
-
```
|
|
56
|
-
|
|
57
|
-
Once the project is created, you will see the following output:
|
|
58
|
-
|
|
59
|
-
```bash
|
|
60
|
-
Initialized empty Git repository in /Users/yourmachine/<yourprojectname>/.git/
|
|
61
|
-
The installation is done!
|
|
62
|
-
```
|
|
63
|
-
|
|
64
|
-
Navigate to the newly created project directory:
|
|
65
|
-
|
|
66
|
-
```bash
|
|
67
|
-
cd <yourprojectname>
|
|
68
|
-
```
|
|
55
|
+
? What is the project name? ‣ <yourprojectname>
|
|
56
|
+
```
|
|
69
57
|
|
|
70
|
-
Once
|
|
58
|
+
Once the project is created, you will see the following output:
|
|
59
|
+
```bash
|
|
60
|
+
Initialized empty Git repository in /Users/yourmachine/<yourprojectname>/.git/
|
|
61
|
+
The installation is done!
|
|
62
|
+
```
|
|
71
63
|
|
|
72
|
-
|
|
64
|
+
Navigate to the newly created project directory:
|
|
65
|
+
```bash
|
|
66
|
+
cd <yourprojectname>
|
|
67
|
+
```
|
|
68
|
+
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.
|
|
69
|
+
Run the following command to start the Connect application:
|
|
73
70
|
|
|
74
|
-
```bash
|
|
75
|
-
ph connect
|
|
76
|
-
```
|
|
71
|
+
```bash
|
|
72
|
+
ph connect
|
|
73
|
+
```
|
|
77
74
|
|
|
78
|
-
The Connect application will start and you will see the following output:
|
|
75
|
+
The Connect application will start and you will see the following output:
|
|
79
76
|
|
|
80
|
-
```bash
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
```
|
|
77
|
+
```bash
|
|
78
|
+
➜ Local: http://localhost:3000/
|
|
79
|
+
➜ Network: http://192.168.5.110:3000/
|
|
80
|
+
➜ press h + enter to show help
|
|
81
|
+
```
|
|
85
82
|
|
|
86
|
-
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.
|
|
83
|
+
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.
|
|
87
84
|
|
|
88
|
-
You will see your local drive and a button to create a new drive.
|
|
85
|
+
You will see your local drive and a button to create a new drive.
|
|
86
|
+
If you local drive is not present navigate into Settings in the bottom left corner. Settings > Danger Zone > Clear Storage.
|
|
87
|
+
Clear the storage of your localhost application as it might has an old session cached.
|
|
89
88
|
|
|
90
89
|
:::tip
|
|
91
|
-
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)
|
|
90
|
+
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)
|
|
92
91
|
:::
|
|
93
92
|
|
|
94
|
-
Move into your local drive.
|
|
93
|
+
Move into your local drive.
|
|
95
94
|
Create a new document model by clicking the `DocumentModel` button, found in the 'New Document' section at the bottom of the page.
|
|
96
95
|
|
|
97
|
-
If you've followed the steps correctly, you'll have an empty document where you can define the 'Document Specifications'
|
|
96
|
+
If you've followed the steps correctly, you'll have an empty document where you can define the **'Document Specifications'**.
|
|
98
97
|
|
|
99
98
|
In the next tutorials, you will learn how to specify, add code and build an editor for your document model and export it to be used in your Powerhouse package.
|
|
@@ -3,13 +3,26 @@
|
|
|
3
3
|
In this tutorial, you will learn how to define the specifications for a **ToDoList** document model within the Connect application using its GraphQL schema, and then export the resulting document model specification document for your Powerhouse project.
|
|
4
4
|
If you don't have a document specification file created yet, have a look at the previous step of this tutorial to create a new document specification.
|
|
5
5
|
|
|
6
|
-
Before you start, make sure you have the Connect application running locally with the command
|
|
6
|
+
Before you start, make sure you have the Connect application running locally with the command:
|
|
7
|
+
```bash
|
|
8
|
+
ph connect
|
|
9
|
+
```
|
|
10
|
+
The Connect application will start and you will see the following output:
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
➜ Local: http://localhost:3000/
|
|
14
|
+
➜ Network: http://192.168.5.110:3000/
|
|
15
|
+
➜ press h + enter to show help
|
|
16
|
+
```
|
|
7
17
|
|
|
8
18
|
## ToDoList Document Specification
|
|
9
19
|
|
|
10
|
-
Likely you have called your project 'ToDoList'.
|
|
20
|
+
Likely you have called your project 'ToDoList'.
|
|
21
|
+
If you've used a different name, please create a new document specification named 'ToDoList'.
|
|
22
|
+
**Pay close attention to capitalization, as it influences our code.**
|
|
11
23
|
|
|
12
|
-
We'll continue with this project to teach you how to create a document model specification and later an editor for your document model. We use the **GraphQL Schema Definition Language** (SDL) to define the schema for the document model.
|
|
24
|
+
We'll continue with this project to teach you how to create a document model specification and later an editor for your document model. We use the **GraphQL Schema Definition Language** (SDL) to define the schema for the document model.
|
|
25
|
+
Below, you can see the SDL for the `ToDoList` document model.
|
|
13
26
|
|
|
14
27
|
:::info
|
|
15
28
|
This schema defines the **data structure** of the document model and the types involved in its operations, which are detailed further as input types.
|
|
@@ -17,7 +30,7 @@ Documents in Powerhouse leverage **event sourcing principles**, where every stat
|
|
|
17
30
|
:::
|
|
18
31
|
|
|
19
32
|
<details>
|
|
20
|
-
<summary>State Schema of our ToDoList</summary>
|
|
33
|
+
<summary>State Schema of our Simplified ToDoList</summary>
|
|
21
34
|
|
|
22
35
|
```graphql
|
|
23
36
|
# The state of our ToDoList
|
|
@@ -37,7 +50,7 @@ type ToDoItem {
|
|
|
37
50
|
|
|
38
51
|
|
|
39
52
|
<details>
|
|
40
|
-
<summary>Operations Schema of our ToDoList</summary>
|
|
53
|
+
<summary>Operations Schema of our Simplified ToDoList</summary>
|
|
41
54
|
```graphql
|
|
42
55
|
# Defines a GraphQL input type for adding a new to-do item
|
|
43
56
|
input AddTodoItemInput {
|
|
@@ -63,10 +76,10 @@ input DeleteTodoItemInput {
|
|
|
63
76
|
|
|
64
77
|
To be able to define the document model, you need to open the document model editor in Connect.
|
|
65
78
|
|
|
66
|
-
|
|
79
|
+
### The steps below show you how to do this:
|
|
67
80
|
|
|
68
81
|
1. In the Connect application, click on **'document model'** to open the document model specification editor.
|
|
69
|
-
2. Name your document model 'ToDoList' in the Connect application, paying close attention to capitalization.
|
|
82
|
+
2. Name your document model '**ToDoList**' in the Connect application, paying close attention to capitalization.
|
|
70
83
|
3. You'll be presented with a form to fill in metadata about the document model. Fill in the details in the respective fields.
|
|
71
84
|
|
|
72
85
|
In the **Document Type** field, type `powerhouse/todolist`. This defines the new type of document that will be created with this document model specification.
|
|
@@ -93,4 +106,6 @@ Check below screenshot for the complete implementation:
|
|
|
93
106
|
|
|
94
107
|

|
|
95
108
|
|
|
109
|
+
### Up next: Reducers
|
|
110
|
+
|
|
96
111
|
Up next, you'll learn how to implement the runtime logic and components that will use the `ToDoList` document model specification you've just created and exported.
|
|
@@ -8,8 +8,10 @@ To export the document model specification, follow the steps in the [Define ToDo
|
|
|
8
8
|
|
|
9
9
|
Reducers are a core concept in Powerhouse document models. They implement the state transition logic for each operation defined in your schema.
|
|
10
10
|
|
|
11
|
+
:::info
|
|
11
12
|
**Connection to Schema Definition Language (SDL)**: The reducers directly implement the operations you defined in your SDL. Remember how we defined `AddTodoItemInput`, `UpdateTodoItemInput`, and `DeleteTodoItemInput` in our schema?
|
|
12
13
|
The reducers provide the actual implementation of what happens when those operations are performed.
|
|
14
|
+
:::
|
|
13
15
|
|
|
14
16
|
To import the document model specification into your Powerhouse project, you can either:
|
|
15
17
|
- Copy and paste the file directly into the root of your Powerhouse project.
|
|
@@ -19,6 +21,8 @@ Either step will import the document model specification into your Powerhouse pr
|
|
|
19
21
|
|
|
20
22
|

|
|
21
23
|
|
|
24
|
+
## In your Project Directory
|
|
25
|
+
|
|
22
26
|
The next steps will take place in the VSCode editor. Make sure to have it open and the terminal window inside VSCode open as well.
|
|
23
27
|
|
|
24
28
|
|
|
@@ -107,10 +111,10 @@ Here are the tests for the three operations implemented in the reducers file. Th
|
|
|
107
111
|
<details>
|
|
108
112
|
<summary>Operation Reducers Tests</summary>
|
|
109
113
|
```typescript
|
|
110
|
-
import utils from '../../gen/utils';
|
|
111
|
-
import { reducer } from '../../gen/reducer';
|
|
112
|
-
import * as creators from '../../gen/creators';
|
|
113
|
-
import { ToDoListDocument } from '../../gen/types';
|
|
114
|
+
import utils from '../../gen/utils.js';
|
|
115
|
+
import { reducer } from '../../gen/reducer.js';
|
|
116
|
+
import * as creators from '../../gen/creators.js';
|
|
117
|
+
import { ToDoListDocument } from '../../gen/types.js';
|
|
114
118
|
|
|
115
119
|
// REMARKS:
|
|
116
120
|
// These tests demonstrate the event sourcing principles of our document model.
|
|
@@ -190,4 +194,5 @@ Output should be as follows:
|
|
|
190
194
|
|
|
191
195
|
If you got the same output, you have successfully implemented the operation reducers and tests for the **ToDoList** document model. Congratulations, you've successfully set up the backbone for a simple **ToDoList** document.
|
|
192
196
|
|
|
197
|
+
## Up Next: ToDoListEditor
|
|
193
198
|
In the next chapter of this introduction track you will learn how to implement an editor for your document model so you can see a simple user interface for the **ToDoList** document model in action.
|