|
| 1 | +## Flytrap Express Demo |
| 2 | + |
| 3 | +This is a basic Express API app which demonstrates the capture and replay functionality of Flytrap. |
| 4 | + |
| 5 | +To try out the demo, first [create a project](https://useflytrap.com/projects/create), then copy the configuration given by the Flytrap dashboard into the `flytrap.config.ts` file. |
| 6 | + |
| 7 | +Build and run the Express API: |
| 8 | + |
| 9 | +```bash |
| 10 | +pnpm build && node dist/index.cjs |
| 11 | +``` |
| 12 | + |
| 13 | +Then, run the demo bash script. The bash script `curl`:s the API causing an error, which gets sent to the Flytrap API. After that, you can view the captured error in the Flytrap Dashboard. |
| 14 | + |
| 15 | +1. Run the demo |
| 16 | +```bash |
| 17 | +$ bash demo.sh |
| 18 | +``` |
| 19 | + |
| 20 | +## 🐛 Replay the bug |
| 21 | + |
| 22 | +To replay the bug you have just captured, head over to the Flytrap Dashboard, and copy the `captureId` value. Place the `captureId` in your `flytrap.config.ts`, and change the `mode` from `'capture'` to `'replay'`. |
| 23 | + |
| 24 | +```typescript |
| 25 | +export default defineFlytrapConfig({ |
| 26 | + projectId: 'flytrap-nextjs-demo', |
| 27 | + publicApiKey: 'pk_MIIBI...', |
| 28 | + privateKey: 'sk_MIIEv...', |
| 29 | + secretApiKey: 'sk_lLSJJicAKC2gSLAj1BERqNTO3sOWFy3jpeaCCyi1AiTT-Vlr', |
| 30 | + captureId: 'c8a29ce0-c729-4d80-906f-6ab0c4ee0e65', // 👈 enter capture here |
| 31 | + mode: 'replay' // 👈 put mode as 'replay' |
| 32 | +}) |
| 33 | +``` |
| 34 | + |
| 35 | +Due to safeguards in Flytrap preventing you from pushing a configuration that has replaying enabled when `NODE_ENV === production`, we must re-build with `NODE_ENV=development`. |
| 36 | + |
| 37 | +Re-run the build with development environment, and run: |
| 38 | + |
| 39 | +```bash |
| 40 | +$ NODE_ENV=development pnpm build && node dist/index.cjs |
| 41 | +``` |
| 42 | + |
| 43 | +Now, you can try a valid PUT statement like below, and your bug will be reproduced like magic. Now you can easily find the root of the problem! |
| 44 | + |
| 45 | +```bash |
| 46 | +$ curl -X PUT -H "Content-Type: application/json" -d '{"title": "Updated Todo", "completed": true}' http://localhost:3000/todos/1 |
| 47 | +``` |
| 48 | + |
| 49 | +## Learn More |
| 50 | + |
| 51 | +To learn more about Flytrap, take a look at the following resources: |
| 52 | + |
| 53 | +- [Flytrap Documentation](https://docs.useflytrap.com) - learn about Flytrap and its features |
0 commit comments