Skip to content

Commit 7fef0fa

Browse files
committed
chore(README.md): update README based on feedback and retrying running playground application from a fresh pull of the repository
1 parent 07ed52e commit 7fef0fa

File tree

1 file changed

+43
-58
lines changed

1 file changed

+43
-58
lines changed

README.md

Lines changed: 43 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -25,84 +25,69 @@ $ npx @commercetools-frontend/create-mc-app my-new-custom-application-project --
2525

2626
### Initial Installation
2727

28-
1. Clone this repo
28+
1. Add necessary environment variables
2929

30-
```bash
31-
$ git clone https://github.com/commercetools/merchant-center-application-kit.git
32-
```
33-
34-
2. Add necessary environment variables
35-
36-
> Navigate to `merchant_center_application_kit/playground`, duplicate `.env.local.template`, name the duplicate `.env.local` and add these values:
37-
38-
```bash
39-
MC_API_URL="https://mc-api.europe-west1.gcp.commercetools.com" # for prod
40-
APP_ID="" # can be an empty string for dev
41-
CTP_INITIAL_PROJECT_KEY=<your-project-name> # the name of any project you have access to on prod/stage
42-
```
30+
Navigate to `merchant_center_application_kit/playground`, duplicate `.env.local.template`, name the duplicate `.env.local` and add the necessary values.
4331

44-
3. Build and run the application kit
32+
2. Build and run the application kit
4533

46-
> In a new terminal window, navigate to the project root directory - `/merchant_center_application_kit` - and run:
34+
First build the application. In a new terminal window, navigate to the project root directory and run:
4735

4836
```bash
49-
$ yarn && yarn prebuild && yarn build && yarn build:watch
37+
$ yarn build
5038
```
5139

52-
> Confirm that the watch is running successfully, you should see:
40+
Once the build is complete, you can run the application in watch mode by running:
5341

5442
```bash
55-
> "info @commercetools-frontend/application-shell waiting for changes..."
56-
>...
43+
$ yarn build:watch
5744
```
5845

59-
4. Remove fake permission:
60-
> `PERMISSIONS.ViewPlaygroundStateMachines` which is required by playground is a fake permission and you might need to remove it
61-
> in order to be able to run and view the application. You'll need to remove it twice in `custom-application-config.mjs` and once in
62-
> `routes.js` so that `permissions`/`demandedPermissions` are just empty objects:
46+
3. Update Playground Permissions:
6347

64-
`custom-application-config.mjs`
48+
`PERMISSIONS.ViewPlaygroundStateMachines` is not necessary and you might need to remove it in order to be able to view the application.
49+
You'll need to remove it twice in `custom-application-config.mjs` and once in `routes.js` so that `permissions`/`demandedPermissions` are empty arrays:
6550

66-
```bash
67-
permissions: [PERMISSIONS.ViewPlaygroundStateMachines],
68-
submenuLinks: [
69-
{
70-
uriPath: 'echo-server',
71-
permissions: [PERMISSIONS.ViewPlaygroundStateMachines],
72-
defaultLabel: '${intl:en:Menu.EchoServer}',
73-
labelAllLocales: [
74-
{
75-
locale: 'en',
76-
value: '${intl:en:Menu.EchoServer}',
77-
},
78-
{
79-
locale: 'de',
80-
value: '${intl:de:Menu.EchoServer}',
81-
},
82-
],
83-
},
84-
],
85-
```
51+
`custom-application-config.mjs`
8652

87-
`routes.js`
53+
```bash
54+
permissions: [],
55+
submenuLinks: [
56+
{
57+
uriPath: 'echo-server',
58+
permissions: [],
59+
defaultLabel: '${intl:en:Menu.EchoServer}',
60+
labelAllLocales: [
61+
{
62+
locale: 'en',
63+
value: '${intl:en:Menu.EchoServer}',
64+
},
65+
{
66+
locale: 'de',
67+
value: '${intl:de:Menu.EchoServer}',
68+
},
69+
],
70+
},
71+
],
72+
```
8873

89-
```bash
90-
const canViewStateMachines = useIsAuthorized({
91-
demandedPermissions: [PERMISSIONS.ViewPlaygroundStateMachines],
92-
});
93-
```
74+
`routes.js`
9475

95-
5. Build and run the [playground application](./playground):
76+
```bash
77+
const canViewStateMachines = useIsAuthorized({
78+
demandedPermissions: [],
79+
});
80+
```
9681

97-
> In a new terminal window, navigate to the project root directory - `/merchant_center_application_kit`, and run:
82+
4. Build and run the [playground application](./playground):
9883

99-
```bash
100-
$ yarn playground:build && yarn playground:start
101-
```
84+
In a new terminal window, navigate to the project root directory and run:
10285

103-
> This should open a browser window and the standard merchant cernter login prompt, login using your account, and then the playground should load in the browser if permissions are set correctly (I am unclear on what those perms are or how to set them, so this is completely theoretical on my part at this point)
86+
```bash
87+
$ yarn playground:start
88+
```
10489

105-
### RUNNING THE APP KIT AND PLAYGROUND AFTER INITIAL INSTALLATION
90+
### Running the App Kit and Playground After Initial Installation
10691

10792
> The playground application consumes the app-kit dependencies as es modules, which means you need to bundle the packages first. We recommend to bundle the packages in watch mode in one terminal process and start the playground app in another terminal process.
10893

0 commit comments

Comments
 (0)