diff --git a/.editorconfig b/.editorconfig
index 3e10c03..a09b1ee 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -3,7 +3,8 @@ root = true
 [*]
 charset = utf-8
 indent_style = space
+tab_size = 4
 indent_size = 4
 end_of_line = lf
 insert_final_newline = true
-trim_trailing_whitespace = true
\ No newline at end of file
+trim_trailing_whitespace = true
diff --git a/electron.vite.config.ts b/electron.vite.config.ts
index b377457..65d4397 100644
--- a/electron.vite.config.ts
+++ b/electron.vite.config.ts
@@ -11,6 +11,12 @@ export default defineConfig({
                 "@renderer": resolve("src/renderer/src"),
             },
         },
-        plugins: [vue()],
+        plugins: [vue({
+            template: {
+                compilerOptions: {
+                    isCustomElement: tag => tag === "nfc-reader",
+                },
+            },
+        })],
     },
 });
diff --git a/eslint.config.mjs b/eslint.config.mjs
index b2a33ec..bdc5db5 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -26,6 +26,7 @@ export default defineConfig(
         rules: {
             "vue/require-default-prop": "off",
             "vue/multi-word-component-names": "off",
+            "@typescript-eslint/no-unused-vars": "warn",
             "vue/block-lang": [
                 "error",
                 {
diff --git a/package-lock.json b/package-lock.json
index c5add93..070fab6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
                 "@electron-toolkit/preload": "^3.0.2",
                 "@electron-toolkit/utils": "^4.0.0",
                 "@tockawa/nfc-pcsc": "latest",
+                "axios": "^1.13.6",
                 "electron-updater": "^6.3.9",
                 "nfc-pcsc": "latest"
             },
@@ -3150,7 +3151,6 @@
             "version": "0.4.0",
             "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
             "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
-            "dev": true,
             "license": "MIT"
         },
         "node_modules/at-least-node": {
@@ -3163,6 +3163,17 @@
                 "node": ">= 4.0.0"
             }
         },
+        "node_modules/axios": {
+            "version": "1.13.6",
+            "resolved": "https://registry.npmjs.org/axios/-/axios-1.13.6.tgz",
+            "integrity": "sha512-ChTCHMouEe2kn713WHbQGcuYrr6fXTBiu460OTwWrWob16g1bXn4vtz07Ope7ewMozJAnEquLk5lWQWtBig9DQ==",
+            "license": "MIT",
+            "dependencies": {
+                "follow-redirects": "^1.15.11",
+                "form-data": "^4.0.5",
+                "proxy-from-env": "^1.1.0"
+            }
+        },
         "node_modules/balanced-match": {
             "version": "4.0.4",
             "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
@@ -3534,7 +3545,6 @@
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
             "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "es-errors": "^1.3.0",
@@ -3730,7 +3740,6 @@
             "version": "1.0.8",
             "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
             "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "delayed-stream": "~1.0.0"
@@ -3972,7 +3981,6 @@
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
             "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=0.4.0"
@@ -4152,7 +4160,6 @@
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
             "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "call-bind-apply-helpers": "^1.0.1",
@@ -4534,7 +4541,6 @@
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
             "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
-            "devOptional": true,
             "license": "MIT",
             "engines": {
                 "node": ">= 0.4"
@@ -4544,7 +4550,6 @@
             "version": "1.3.0",
             "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
             "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
-            "devOptional": true,
             "license": "MIT",
             "engines": {
                 "node": ">= 0.4"
@@ -4554,7 +4559,6 @@
             "version": "1.1.1",
             "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
             "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "es-errors": "^1.3.0"
@@ -4567,7 +4571,6 @@
             "version": "2.1.0",
             "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
             "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "es-errors": "^1.3.0",
@@ -5125,6 +5128,26 @@
             "dev": true,
             "license": "ISC"
         },
+        "node_modules/follow-redirects": {
+            "version": "1.15.11",
+            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.11.tgz",
+            "integrity": "sha512-deG2P0JfjrTxl50XGCDyfI97ZGVCxIpfKYmfyrQ54n5FO/0gfIES8C/Psl6kWVDolizcaaxZJnTS0QSMxvnsBQ==",
+            "funding": [
+                {
+                    "type": "individual",
+                    "url": "https://github.com/sponsors/RubenVerborgh"
+                }
+            ],
+            "license": "MIT",
+            "engines": {
+                "node": ">=4.0"
+            },
+            "peerDependenciesMeta": {
+                "debug": {
+                    "optional": true
+                }
+            }
+        },
         "node_modules/foreground-child": {
             "version": "3.3.1",
             "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
@@ -5159,7 +5182,6 @@
             "version": "4.0.5",
             "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.5.tgz",
             "integrity": "sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "asynckit": "^0.4.0",
@@ -5225,7 +5247,6 @@
             "version": "1.1.2",
             "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
             "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
-            "dev": true,
             "license": "MIT",
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
@@ -5255,7 +5276,6 @@
             "version": "1.3.0",
             "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
             "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "call-bind-apply-helpers": "^1.0.2",
@@ -5280,7 +5300,6 @@
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
             "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "dunder-proto": "^1.0.1",
@@ -5436,7 +5455,6 @@
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
             "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
-            "devOptional": true,
             "license": "MIT",
             "engines": {
                 "node": ">= 0.4"
@@ -5503,7 +5521,6 @@
             "version": "1.1.0",
             "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
             "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">= 0.4"
@@ -5516,7 +5533,6 @@
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
             "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "has-symbols": "^1.0.3"
@@ -5532,7 +5548,6 @@
             "version": "2.0.2",
             "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
             "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "function-bind": "^1.1.2"
@@ -6101,7 +6116,6 @@
             "version": "1.1.0",
             "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
             "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">= 0.4"
@@ -6124,7 +6138,6 @@
             "version": "1.52.0",
             "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
             "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">= 0.6"
@@ -6134,7 +6147,6 @@
             "version": "2.1.35",
             "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
             "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "mime-db": "1.52.0"
@@ -6987,6 +6999,12 @@
                 "signal-exit": "^3.0.2"
             }
         },
+        "node_modules/proxy-from-env": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+            "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
+            "license": "MIT"
+        },
         "node_modules/pump": {
             "version": "3.0.4",
             "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.4.tgz",
diff --git a/package.json b/package.json
index 0dd7bef..963070b 100644
--- a/package.json
+++ b/package.json
@@ -25,9 +25,10 @@
     "dependencies": {
         "@electron-toolkit/preload": "^3.0.2",
         "@electron-toolkit/utils": "^4.0.0",
+        "@tockawa/nfc-pcsc": "latest",
+        "axios": "^1.13.6",
         "electron-updater": "^6.3.9",
-        "nfc-pcsc": "latest",
-        "@tockawa/nfc-pcsc": "latest"
+        "nfc-pcsc": "latest"
     },
     "devDependencies": {
         "@electron-toolkit/eslint-config-prettier": "3.0.0",
diff --git a/src/main/index.ts b/src/main/index.ts
index 99b7997..9eb75f0 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -4,7 +4,6 @@ import { electronApp, optimizer, is } from "@electron-toolkit/utils";
 import icon from "../../resources/icon.png?asset";
 import { NfcService } from "../services/NfcService";
 
-
 function createWindow(): void {
     // Create the browser window.
     const mainWindow = new BrowserWindow({
@@ -60,6 +59,12 @@ app.whenReady().then(() => {
     // IPC test
     ipcMain.on("ping", () => console.log("pong"));
 
+    // HANDLE es bidireccionar ON es unidireccional
+    ipcMain.handle("nfc:labelReq", async (_event, data: unknown) => {
+        console.log("nfc:labelReq", data);
+        return data;
+    });
+
     ipcMain.handle("ping:url", async (_event, url: string) => {
         try {
             const response = await fetch(url, {
diff --git a/src/preload/index.ts b/src/preload/index.ts
index a7409cb..35a0fb9 100644
--- a/src/preload/index.ts
+++ b/src/preload/index.ts
@@ -13,6 +13,9 @@ const api = {
         onError: (callback: (event: { message: string }) => void): void => {
             ipcRenderer.on("nfc:error", (_event, value) => callback(value));
         },
+        labelReq: (data: unknown): Promise<void> => {
+            return ipcRenderer.invoke("nfc:labelReq", data);
+        },
         ping: (url: string): Promise<boolean> => {
             return ipcRenderer.invoke("ping:url", url);
         },
diff --git a/src/renderer/index.html b/src/renderer/index.html
index 9777bba..e333747 100644
--- a/src/renderer/index.html
+++ b/src/renderer/index.html
@@ -6,7 +6,7 @@
         <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
         <meta
             http-equiv="Content-Security-Policy"
-            content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:"
+            content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data: ; connect-src http://localhost:* ws://localhost:* "
         />
     </head>
 
diff --git a/src/renderer/src/components/Configuration.vue b/src/renderer/src/components/Configuration.vue
index bd7aa5f..9d91392 100644
--- a/src/renderer/src/components/Configuration.vue
+++ b/src/renderer/src/components/Configuration.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { reactive } from "vue";
 </script>
 
 <template>
diff --git a/src/renderer/src/components/MainView.vue b/src/renderer/src/components/MainView.vue
index 4f6906b..3041a62 100644
--- a/src/renderer/src/components/MainView.vue
+++ b/src/renderer/src/components/MainView.vue
@@ -1,6 +1,12 @@
 <script setup lang="ts">
 import { ref, onMounted, onUnmounted } from "vue";
-
+import axios from "axios";
+/**
+ * waiting = esperando a leer una tarjeta (igual es mejor ready)
+ * reading = proceso de lectura
+ * sucess  = se ha leido la tarjeta y sigue en el lector
+ * error
+ */
 const readerState = ref<"waiting" | "reading" | "success" | "error">("waiting");
 const uid = ref<string | null>(null);
 const errorMsg = ref<string | null>(null);
@@ -19,7 +25,10 @@ onMounted(() => {
 
     window.api.nfc.onRemoved(() => {
         console.log("Card removed");
-        // Optional: you could reset state here if you wanted immediate reset on removal
+        // Reset state after 3 seconds
+        setTimeout(() => {
+            readerState.value = "waiting";
+        }, 3000);
     });
 
     window.api.nfc.onError((event) => {
@@ -29,7 +38,6 @@ onMounted(() => {
             readerState.value = "waiting";
         }, 3000);
     });
-
 });
 
 onUnmounted(() => {
@@ -52,15 +60,61 @@ const mockReadCard = (): void => {
     }, 1000);
 };
 
-const triggerError = (): void => {
+type CodeResponse = {
+    error?: string,
+    data: {
+        label: string;
+        code: string;
+        overriden: boolean;
+        reused: boolean;
+    }
+}
+
+type CodeRequest = {
+    card_id: string; // UUIDv7
+    override?: boolean;
+}
+
+const readCard = async (): void => {
+    console.log("test readcard")
     if (readerState.value !== "waiting") return;
+    readerState.value = "reading";
 
-    readerState.value = "error";
+    const serverURL =
+        localStorage.getItem("serverUrl") || "http://localhost:3000";
+    const endpoint = "/nfc/generate";
 
+    // TODO: De momento está hardcodeado porque no se puede leer la tarjeta
+    const card_id = "019cdd39-fc08-7417-b16d-a78794a24c01";
+    const override = false;
+
+    try {
+        window.api.nfc.labelReq({card_id,override});
+        const response = await axios.post<CodeResponse>(serverURL + endpoint, {
+            card_id,
+            override,
+        });
+        console.log("Resp", response);
+        readerState.value = "waiting";
+    } catch (e) {
+        console.error(e);
+        readerState.value = "error";
+        delayWaiting();
+    }
+};
+
+const delayWaiting = (): void => {
     setTimeout((): void => {
         readerState.value = "waiting";
         errorMsg.value = null;
     }, 3000);
+}
+
+const triggerError = (): void => {
+    if (readerState.value !== "waiting") return;
+
+    readerState.value = "error";
+    delayWaiting();
 };
 </script>
 
@@ -68,7 +122,6 @@ const triggerError = (): void => {
     <div class="main-display">
         <div class="display-container">
             <div class="display-grid"></div>
-            
             <div class="top-meta">
                 <div class="meta-item">
                     <span class="label">MODULE</span>
@@ -111,7 +164,6 @@ const triggerError = (): void => {
                     </p>
                 </div>
             </div>
-
         </div>
 
         <!-- Discrete mock controls for dev testing -->
@@ -123,6 +175,13 @@ const triggerError = (): void => {
             >
                 FORCE_TAP
             </button>
+            <button
+                class="dev-btn"
+                :disabled="readerState !== 'waiting'"
+                @click="readCard"
+            >
+                TEST_CODE
+            </button>
             <button
                 class="dev-btn danger"
                 :disabled="readerState !== 'waiting'"
diff --git a/tsconfig.node.json b/tsconfig.node.json
index 500335a..4deb49e 100644
--- a/tsconfig.node.json
+++ b/tsconfig.node.json
@@ -4,13 +4,14 @@
         "electron.vite.config.*",
         "src/main/**/*",
         "src/preload/**/*",
-        "src/services/**/*"
+        "src/services/**/*",
+        "src/renderer/src/services/NfcService.ts",
     ],
     "compilerOptions": {
         "composite": true,
         "types": ["electron-vite/node"],
         "module": "nodenext",
         "moduleResolution": "nodenext",
-        "target": "es6"
-    }
+        "target": "es6",
+    },
 }
diff --git a/tsconfig.web.json b/tsconfig.web.json
index 11063b0..80ff289 100644
--- a/tsconfig.web.json
+++ b/tsconfig.web.json
@@ -4,13 +4,14 @@
         "src/renderer/src/env.d.ts",
         "src/renderer/src/**/*",
         "src/renderer/src/**/*.vue",
-        "src/preload/*.d.ts"
+        "src/preload/*.d.ts",
+        "src/services/NfcService.ts",
     ],
     "compilerOptions": {
         "composite": true,
         "baseUrl": ".",
         "paths": {
-            "@renderer/*": ["src/renderer/src/*"]
-        }
-    }
+            "@renderer/*": ["src/renderer/src/*"],
+        },
+    },
 }