Skip to content

Commit 69ce45e

Browse files
committed
add ts custom code page
1 parent d1ca46f commit 69ce45e

File tree

1 file changed

+132
-2
lines changed

1 file changed

+132
-2
lines changed

fern/products/sdks/overview/typescript/custom-code.mdx

Lines changed: 132 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,136 @@ title: Adding custom code
33
description: Augment your TypeScript SDK with custom utilities
44
---
55

6-
Learn how to extend your Fern TypeScript SDK with custom code and utilities.
6+
Fern-generated SDKs are designed to be extended with custom code. Your custom
7+
code can add additional functionality to the SDK and live in harmony with the
8+
generated code. This page explains how to configure custom logic using a
9+
`.fernignore` file, create custom SDK methods, and add additional dependencies to your SDK.
710

8-
<Warning>This page is a WIP, please refer to our previous [documentation](https://buildwithfern.com/learn/sdks/capabilities/custom-code).</Warning>
11+
## Adding custom logic
12+
13+
If you want your SDK to do more than just make basic API calls (like combining
14+
multiple calls, processing data, adding utilities), you can use `.fernignore` to
15+
protect your custom code from being overwritten during regeneration.
16+
17+
Simply add your custom files to the SDK repository and list them out in `.fernignore`. Fern
18+
won't override any files that you add in `.fernignore`.
19+
20+
To get started adding custom code:
21+
22+
<Steps>
23+
24+
### Create a new file and add your custom logic
25+
26+
<CodeBlock title="src/helper.ts">
27+
```typescript
28+
export function myHelper(): void {
29+
return console.log("Hello world!");
30+
}
31+
```
32+
</CodeBlock>
33+
34+
### Add your file to `.fernignore`
35+
36+
<Tip>A `.fernignore` file is automatically created in your SDK repository when you use GitHub publishing.</Tip>
37+
38+
<CodeBlock title=".fernignore">
39+
```yaml {3}
40+
# Specify files that shouldn't be modified by Fern
41+
42+
src/helper.ts
43+
```
44+
45+
</CodeBlock>
46+
47+
### Consume the helper
48+
49+
Now your users can consume the helper function by importing it from the SDK:
50+
51+
```typescript
52+
import { myHelper } from "sdk/helper";
53+
54+
myHelper();
55+
```
56+
</Steps>
57+
58+
## Custom SDK methods
59+
60+
Fern also allows you to add custom methods to the SDK itself (e.g.
61+
`client.my_method()` ). by inheriting the Fern generated client and then
62+
extending it.
63+
64+
<Note>
65+
See an example from Flatfile using this process in their [TypeScript SDK](https://github.com/FlatFilers/flatfile-node)
66+
</Note>
67+
68+
<Steps>
69+
### Import and extend the generated client
70+
71+
First, import the Fern generated client from `../client` and alias it to `FernClient`.
72+
Next, extend `FernClient` and add whatever methods you want.
73+
74+
```typescript title="src/wrapper/MyClient.ts"
75+
import { MyClient as FernClient } from "../client"; // alias the Fern generated client
76+
77+
export class MyClient extends FernClient { // extend the Fern generated client
78+
79+
public myHelper(): void {
80+
console.log("Hello world!");
81+
}
82+
83+
}
84+
```
85+
86+
<Note>
87+
See an example from Flatfile doing this in their [FlatfileClient](https://github.com/FlatFilers/flatfile-node/blob/main/src/wrapper/FlatfileClient.ts)
88+
</Note>
89+
90+
### Export the extended client
91+
92+
Update your `index.ts` file to export the **extended client** instead of the generated client.
93+
94+
```typescript title="src/index.ts"
95+
export { MyClient } from src/wrapper/MyClient; // instead of `src/Client`
96+
```
97+
98+
<Note>
99+
See an example [index.ts](https://github.com/FlatFilers/flatfile-node/blob/main/src/index.ts) from Flatline
100+
</Note>
101+
102+
### Update `.fernignore`
103+
104+
Add both the `wrapper` directory and `index.ts` to `.fernignore`.
105+
106+
```diff title=".fernignore"
107+
+ src/wrapper
108+
+ src/index.ts
109+
```
110+
111+
<Note>
112+
See an example [.fernignore](https://github.com/FlatFilers/flatfile-node/blob/main/.fernignore) from Flatline
113+
</Note>
114+
115+
116+
### Consume the method
117+
118+
Now your users can consume the helper function by importing it from the SDK:
119+
120+
```typescript
121+
client.myHelper()
122+
```
123+
</Steps>
124+
125+
126+
## Custom dependencies
127+
128+
To add packages that your custom code requires, update your `generators.yml`.
129+
130+
```yaml {4-7} title="generators.yml"
131+
- name: fernapi/fern-typescript-sdk
132+
version: "..."
133+
config:
134+
extraDependencies:
135+
lodash-es: '1.0.0'
136+
extraDevDependencies:
137+
"@types/lodash-es": '1.0.0'
138+
```

0 commit comments

Comments
 (0)