This app is published at https://pipedream.com/connect/demo. Read below to run it locally.
git clone https://github.com/PipedreamHQ/pipedream-connect-examples.git
cd connect-react-demopnpm install- A Pipedream account and workspace
- A Pipedream API OAuth client
- Your project's ID
Copy the .env.example file to .env.local and fill in the values.
cp .env.example .env.local
pnpm devclone this repo as well as the the repo that contains connect-react (pipedream). Make sure the two repos are cloned in the same parent directory
git clone https://github.com/PipedreamHQ/pipedream-connect-examples.git
git clone https://github.com/PipedreamHQ/pipedream.gitInstall dependencies and build connect-react. Using watch will rebuild the package when changes are detected.
cd pipedream/packages/connect-react
pnpm install
pnpm watchIn a separate tab install dependencies and run the demo app. Be sure to set the correct values in .env.local
cd pipedream-connect-examples/connect-react-demo
cp .env.example .env.local
make connect-react-devChanges made in connect-react will not be automatically loaded by the app. To pick them up you'll need to restart make connect-react-dev
A change like the following is an easy way to check that your connect-react changes have been picked up (all app names will be prefixed with 'hello world!'
diff --git a/packages/connect-react/src/components/SelectApp.tsx b/packages/connect-react/src/components/SelectApp.tsx
index 61fe7bd27..a9378297d 100644
--- a/packages/connect-react/src/components/SelectApp.tsx
+++ b/packages/connect-react/src/components/SelectApp.tsx
@@ -48,7 +48,7 @@ export function SelectApp({
/>
<span style={{
whiteSpace: "nowrap",
- }}>{optionProps.data.name}</span>
+ }}>hello world!{optionProps.data.name}</span>
</div>
</Option>
),