diff --git a/basics/calculator.json b/basics/calculator.json
new file mode 100644
index 0000000..1841c0d
--- /dev/null
+++ b/basics/calculator.json
@@ -0,0 +1,34 @@
+{
+  "code": "basics.calculator",
+  "name": "Simple calculator",
+  "description": "Do simple operations for numbers in `args` input.",
+  "icon": "mdi-calculator",
+  "inputs": [
+    {
+      "name": "operator",
+      "type": "string",
+      "description": "Operation to perform",
+      "enum": ["add", "subtract", "multiply", "divide"],
+      "required": true
+    },
+    {
+      "name": "args",
+      "type": "object[]",
+      "description": "Array of numbers to operate on",
+      "required": true
+    }
+  ],
+  "outputs": [
+    {
+      "name": "result",
+      "type": "object",
+      "description": "Result of the calculation"
+    }
+  ],
+  "source": "S8n.Components.Packages (project)",
+  "class": "S8n.Components.Basics.Calculator",
+  "methods": ["Execute"],
+  "gui": "ComponentCalculator.vue",
+  "category": "basics",
+  "tags": ["arithmetic", "math", "basics"]
+}
\ No newline at end of file
diff --git a/basics/calculator.md b/basics/calculator.md
deleted file mode 100644
index b30011f..0000000
--- a/basics/calculator.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Component definitions
-
-## Simple calculator
-
-```yaml
-code: basics.calculator
-description: Do simple operations for numbers in `args` input.
-inputs:
-  - operator: string enum { add, subtract, multiply, divide }
-  - args: object[]
-outputs:
-  - result: object
-source: S8n.Components.Packages (project)
-class: S8n.Components.Basics.Calculator
-methods: Calc()
-gui: ComponentCalculator.vue
-```
diff --git a/basics/calculator.yaml b/basics/calculator.yaml
new file mode 100644
index 0000000..0481da3
--- /dev/null
+++ b/basics/calculator.yaml
@@ -0,0 +1,31 @@
+code: basics.calculator
+name: Simple calculator
+description: Do simple operations for numbers in `args` input.
+class: S8n.Components.Basics.Calculator
+methods:
+  - Execute
+gui: ComponentCalculator.vue
+inputs:
+  - name: operator
+    type: string
+    description: Operation to perform
+    enum:
+      - add
+      - subtract
+      - multiply
+      - divide
+    required: true
+  - name: args
+    type: object[]
+    description: Array of numbers to operate on
+    required: true
+outputs:
+  - name: result
+    type: object
+    description: Result of the calculation
+tags:
+  - arithmetic
+  - math
+  - basics
+source: S8n.Components.Packages (project)
+category: basics
\ No newline at end of file
diff --git a/basics/httprequest.json b/basics/httprequest.json
new file mode 100644
index 0000000..f5fbab4
--- /dev/null
+++ b/basics/httprequest.json
@@ -0,0 +1,66 @@
+{
+  "code": "basics.httprequest",
+  "name": "HTTP Request",
+  "description": "Make HTTP requests to any URL with custom headers and body.",
+  "icon": "mdi-web",
+  "inputs": [
+    {
+      "name": "method",
+      "type": "string",
+      "description": "HTTP method",
+      "enum": ["GET", "POST", "PUT", "DELETE", "PATCH", "HEAD", "OPTIONS"],
+      "required": true
+    },
+    {
+      "name": "url",
+      "type": "string",
+      "description": "Target URL",
+      "required": true
+    },
+    {
+      "name": "headers",
+      "type": "object",
+      "description": "Optional HTTP headers",
+      "required": false
+    },
+    {
+      "name": "body",
+      "type": "object",
+      "description": "Optional request body",
+      "required": false
+    }
+  ],
+  "outputs": [
+    {
+      "name": "statusCode",
+      "type": "int",
+      "description": "HTTP status code"
+    },
+    {
+      "name": "statusText",
+      "type": "string",
+      "description": "HTTP status text"
+    },
+    {
+      "name": "response",
+      "type": "string",
+      "description": "Response body as string"
+    },
+    {
+      "name": "headers",
+      "type": "object",
+      "description": "Response headers"
+    },
+    {
+      "name": "duration",
+      "type": "long",
+      "description": "Request duration in milliseconds"
+    }
+  ],
+  "source": "S8n.Components.Packages (project)",
+  "class": "S8n.Components.Basics.HttpRequest",
+  "methods": ["Execute"],
+  "gui": "ComponentHttpRequest.vue",
+  "category": "basics",
+  "tags": ["http", "network", "web", "basics"]
+}
\ No newline at end of file
diff --git a/basics/httprequest.md b/basics/httprequest.md
deleted file mode 100644
index 936dd1c..0000000
--- a/basics/httprequest.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# Component definitions
-
-## HTTP Request
-
-```yaml
-code: basics.httprequest
-description: Make HTTP requests to any URL with custom headers and body.
-inputs:
-  - method: string enum { GET, POST, PUT, DELETE, PATCH, HEAD, OPTIONS }
-  - url: string
-  - headers: object (optional)
-  - body: object (optional)
-outputs:
-  - statusCode: int
-  - statusText: string
-  - response: string
-  - headers: object
-  - duration: long
-source: S8n.Components.Packages (project)
-class: S8n.Components.Basics.HttpRequest
-methods: Execute()
-gui: ComponentHttpRequest.vue
-```
diff --git a/basics/httprequest.yaml b/basics/httprequest.yaml
new file mode 100644
index 0000000..ca39536
--- /dev/null
+++ b/basics/httprequest.yaml
@@ -0,0 +1,55 @@
+code: basics.httprequest
+name: HTTP Request
+description: Make HTTP requests to any URL with custom headers and body.
+class: S8n.Components.Basics.HttpRequest
+methods:
+  - Execute
+gui: ComponentHttpRequest.vue
+inputs:
+  - name: method
+    type: string
+    description: HTTP method
+    enum:
+      - GET
+      - POST
+      - PUT
+      - DELETE
+      - PATCH
+      - HEAD
+      - OPTIONS
+    required: true
+  - name: url
+    type: string
+    description: Target URL
+    required: true
+  - name: headers
+    type: object
+    description: Optional HTTP headers
+    required: false
+  - name: body
+    type: object
+    description: Optional request body
+    required: false
+outputs:
+  - name: statusCode
+    type: int
+    description: HTTP status code
+  - name: statusText
+    type: string
+    description: HTTP status text
+  - name: response
+    type: string
+    description: Response body as string
+  - name: headers
+    type: object
+    description: Response headers
+  - name: duration
+    type: long
+    description: Request duration in milliseconds
+tags:
+  - http
+  - network
+  - web
+  - basics
+source: S8n.Components.Packages (project)
+category: basics
\ No newline at end of file