Skip to content

Commit 28724cd

Browse files
thuongtruong109thuongtruong109
committed
build: init api module
1 parent 33c8e77 commit 28724cd

14 files changed

Lines changed: 2178 additions & 4 deletions

‎.config/eslint.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,5 +18,5 @@ export default tseslint.config([
1818
"sonarjs/no-nested-conditional": "off",
1919
},
2020
},
21-
globalIgnores(["package/dist/**/*", "cli/dist/*", "api/**/*", "web/**/*"]),
21+
globalIgnores(["*/dist/**/*", "*/dist/*", "*/dist/*", "web/**/*"]),
2222
]);

‎.gitignore‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
node_modules
2+
dist
23
.idea
34
*.log
4-
.DS_Store
5-
api
5+
.DS_Store

‎CHANGELOG.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@
22

33
### 🚀 Features
44

5-
- **web**: Add sample deployment webpage - by @thuongtruong109 [<samp>(46c26)</samp>](https://github.com/thuongtruong109/flashot/commit/46c26cdf4127e5b2a01e5bc48945975e9c3aff18)
5+
- **docs**: add landing page - by @thuongtruong109 [<samp>(33c8e)</samp>](https://github.com/thuongtruong109/flashot/commit/33c8e77580cbff104125642ebe7fc55be2253963)
6+
- **web**: Add sample playground - by @thuongtruong109 [<samp>(46c26)</samp>](https://github.com/thuongtruong109/flashot/commit/46c26cdf4127e5b2a01e5bc48945975e9c3aff18)
67
- **refactor**: Refactor codebase to workspace monorepo - by @thuongtruong109 [<samp>(c019d)</samp>](https://github.com/thuongtruong109/flashot/commit/c019d61bfd82c01293563139ba13d5e59a2f443f)
78

89
### 🐞 Bug Fixes

‎api/.dockerignore‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
# Node modules (will be installed in container)
2+
node_modules
3+
npm-debug.log*
4+
yarn-debug.log*
5+
yarn-error.log*
6+
7+
# Build outputs
8+
dist
9+
build
10+
*.tsbuildinfo
11+
12+
# Development files
13+
.env
14+
.env.local
15+
.env.development.local
16+
.env.test.local
17+
.env.production.local
18+
19+
# IDE files
20+
.vscode
21+
.idea
22+
*.swp
23+
*.swo
24+
*~
25+
26+
# OS generated files
27+
.DS_Store
28+
.DS_Store?
29+
._*
30+
.Spotlight-V100
31+
.Trashes
32+
ehthumbs.db
33+
Thumbs.db
34+
35+
# Git
36+
.git
37+
.gitignore
38+
39+
# Documentation
40+
README.md
41+
API_DOCS.md
42+
43+
# Test files
44+
test
45+
tests
46+
*.test.ts
47+
*.test.js
48+
coverage
49+
50+
# Temporary files
51+
tmp
52+
temp

‎api/API_DOCS.md‎

Lines changed: 288 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,288 @@
1+
# Flashot API Documentation
2+
3+
A REST API for converting code to beautiful images with syntax highlighting.
4+
5+
## Base URL
6+
7+
```
8+
http://localhost:8080
9+
```
10+
11+
## Endpoints
12+
13+
### 1. Convert Code String to Image
14+
15+
**POST** `/`
16+
17+
Convert a code string directly to an image.
18+
19+
#### Request Body
20+
21+
```json
22+
{
23+
"code": "console.log('Hello, World!');",
24+
"options": {
25+
"lang": "javascript",
26+
"theme": "github-dark",
27+
"format": "png",
28+
"quality": 100,
29+
"style": {
30+
"padding": 25,
31+
"borderRadius": 8
32+
},
33+
"lineNumbers": {
34+
"enabled": true,
35+
"startFrom": 1,
36+
"color": "#7b7f8b"
37+
}
38+
}
39+
}
40+
```
41+
42+
#### Response
43+
44+
Returns the generated image as binary data with appropriate headers.
45+
46+
---
47+
48+
### 2. Convert Code from URL to Image
49+
50+
**POST** `/url`
51+
52+
Fetch code from a URL and convert it to an image.
53+
54+
#### Request Body
55+
56+
```json
57+
{
58+
"url": "https://raw.githubusercontent.com/user/repo/main/file.js",
59+
"options": {
60+
"lang": "javascript",
61+
"theme": "dracula",
62+
"format": "webp"
63+
}
64+
}
65+
```
66+
67+
#### Response
68+
69+
Returns the generated image as binary data.
70+
71+
---
72+
73+
### 3. Convert Code from File Path to Image
74+
75+
**POST** `/file`
76+
77+
Read code from a local file path and convert it to an image.
78+
79+
#### Request Body
80+
81+
```json
82+
{
83+
"path": "../package.json",
84+
"options": {
85+
"lang": "json",
86+
"theme": "monokai",
87+
"format": "png"
88+
}
89+
}
90+
```
91+
92+
#### Response
93+
94+
Returns the generated image as binary data.
95+
96+
---
97+
98+
### 4. Convert Code from Hex Buffer to Image
99+
100+
**POST** `/buffer`
101+
102+
Convert a hex-encoded buffer containing code to an image.
103+
104+
#### Request Body
105+
106+
```json
107+
{
108+
"buffer": "636f6e736f6c652e6c6f672827486565c6c6f27293b",
109+
"options": {
110+
"lang": "javascript",
111+
"theme": "nord"
112+
}
113+
}
114+
```
115+
116+
#### Response
117+
118+
Returns the generated image as binary data.
119+
120+
---
121+
122+
### 5. Get Available Options
123+
124+
**GET** `/options`
125+
126+
Get all available configuration options, themes, languages, and default values.
127+
128+
#### Response
129+
130+
```json
131+
{
132+
"languages": ["javascript", "typescript", "python", "java", "..."],
133+
"themes": ["github-dark", "github-light", "dracula", "monokai", "..."],
134+
"formats": ["png", "jpeg", "webp", "avif"],
135+
"fonts": {
136+
"JetBrainsMono": "https://fonts.bunny.net/jetbrains-mono/...",
137+
"UbuntuSansMono": "https://fonts.bunny.net/ubuntu-sans-mono/...",
138+
"Abeezee": "https://fonts.bunny.net/abeezee/..."
139+
},
140+
"defaultOptions": {
141+
"lang": "js",
142+
"theme": "dracula",
143+
"format": "webp",
144+
"quality": 100,
145+
"...": "..."
146+
}
147+
}
148+
```
149+
150+
---
151+
152+
### 6. Health Check
153+
154+
**GET** `/health`
155+
156+
Check if the API is running properly.
157+
158+
#### Response
159+
160+
```json
161+
{
162+
"status": "healthy",
163+
"service": "flashot-api",
164+
"timestamp": "2024-01-01T00:00:00.000Z"
165+
}
166+
```
167+
168+
## Options Reference
169+
170+
### ThemeOptions
171+
172+
| Option | Type | Default | Description |
173+
| --------- | ------------------ | ------------- | -------------------------------------------- |
174+
| `lang` | string | `"js"` | Programming language for syntax highlighting |
175+
| `theme` | string | `"dracula"` | Color theme for syntax highlighting |
176+
| `font` | string/ArrayBuffer | JetBrainsMono | Font URL or buffer |
177+
| `format` | string | `"webp"` | Output format: png, jpeg, webp, avif |
178+
| `quality` | number | `100` | Image quality (1-100) |
179+
| `width` | number | `0` | Fixed width (0 = auto) |
180+
| `height` | number | `0` | Fixed height (0 = auto) |
181+
| `bg` | string | `"null"` | Background color |
182+
| `gap` | number | `1` | Gap between elements |
183+
184+
### Style Options
185+
186+
| Option | Type | Default | Description |
187+
| -------------- | ------ | ------- | --------------------------------- |
188+
| `padding` | number | `25` | Padding around the code |
189+
| `borderRadius` | number | `8` | Border radius for rounded corners |
190+
191+
### Line Numbers Options
192+
193+
| Option | Type | Default | Description |
194+
| ------------- | ------- | ----------- | ----------------------------- |
195+
| `enabled` | boolean | `false` | Show line numbers |
196+
| `startFrom` | number | `1` | Starting line number |
197+
| `color` | string | `"#7b7f8b"` | Line number color |
198+
| `marginRight` | number | `0` | Right margin for line numbers |
199+
200+
### Highlight Options
201+
202+
| Option | Type | Default | Description |
203+
| ----------------- | ------- | ------------- | ---------------------------- |
204+
| `enabled` | boolean | `false` | Enable line highlighting |
205+
| `backgroundColor` | string | `"#347faa23"` | Highlight background color |
206+
| `borderRadius` | number | `0` | Highlight border radius |
207+
| `at` | number | `1` | Line number to highlight |
208+
| `depth` | number | `1` | Number of lines to highlight |
209+
210+
## Example Usage
211+
212+
### JavaScript/Node.js
213+
214+
```javascript
215+
const response = await fetch("http://localhost:8080/", {
216+
method: "POST",
217+
headers: {
218+
"Content-Type": "application/json",
219+
},
220+
body: JSON.stringify({
221+
code: 'const hello = "Hello, World!";',
222+
options: {
223+
lang: "javascript",
224+
theme: "github-dark",
225+
format: "png",
226+
},
227+
}),
228+
});
229+
230+
const imageBuffer = await response.arrayBuffer();
231+
// Save or use the image buffer
232+
```
233+
234+
### Python
235+
236+
```python
237+
import requests
238+
239+
response = requests.post('http://localhost:8080/', json={
240+
'code': 'print("Hello, World!")',
241+
'options': {
242+
'lang': 'python',
243+
'theme': 'monokai',
244+
'format': 'png'
245+
}
246+
})
247+
248+
with open('output.png', 'wb') as f:
249+
f.write(response.content)
250+
```
251+
252+
### cURL
253+
254+
```bash
255+
curl -X POST http://localhost:8080/ \
256+
-H "Content-Type: application/json" \
257+
-d '{
258+
"code": "console.log(\"Hello, World!\");",
259+
"options": {
260+
"lang": "javascript",
261+
"theme": "github-dark",
262+
"format": "png"
263+
}
264+
}' \
265+
--output code-image.png
266+
```
267+
268+
## Error Responses
269+
270+
All endpoints return error responses in JSON format:
271+
272+
```json
273+
{
274+
"error": "Error message description"
275+
}
276+
```
277+
278+
Common HTTP status codes:
279+
280+
- `400` - Bad Request (missing required parameters)
281+
- `500` - Internal Server Error (processing failed)
282+
283+
## Performance Notes
284+
285+
- Images are generated in ~135ms on average
286+
- Supports caching for better performance
287+
- Multiple output formats with quality control
288+
- Optimized for high throughput

0 commit comments

Comments
 (0)