شروعات

دس ابواب میں آپ ⁦Acme Deploys⁩ بنائیں گے، جو ایک ڈیپلائے ڈیش بورڈ ہے اور DevTools کونسول میں رینڈر ہوتا ہے۔ ہر باب کے آخر میں ایپ بالکل اسی حالت میں ہوتی ہے جس میں آپ کا کوڈ اسے چھوڑتا ہے، اور اسی صفحے کے کونسول میں لائیو چل رہی ہوتی ہے۔

#ایپ بنانا

create-text-app، ⁦App Router⁩، TypeScript اور text CLI کے ساتھ پروجیکٹ کا ابتدائی ڈھانچا بناتا ہے۔

bunx create-text-app@latest acme-deploys --template startercd acme-deploysbun installbun dev

http://localhost:3000 کھولیں، پھر براؤزر کا کونسول کھولیں۔ صفحے پر ایک فوکس پیڈ نظر آتا ہے۔ آپ کی ایپ کونسول میں رینڈر ہوتی ہے۔

#آپ کا پہلا صفحہ

ہر روٹ app/ ڈائریکٹری میں ایک page.tsx فائل ہے۔ ابتدائی صفحے کو ڈیش بورڈ کے ٹائٹل کارڈ سے بدلیں:

import { Box, Text } from "@textjs/app";export default function Page() {  return (    <Box className="flex-col border rounded px-2 py-1">      <Text bold>▼ Acme Deploys</Text>      <Text color="muted">Hello, console.</Text>    </Box>  );}

فائل محفوظ کریں۔ ⁦Fast Refresh⁩ فریم کو دوبارہ رینڈر کرتا ہے اور آپ کے کمپوننٹ کی اسٹیٹ برقرار رکھتا ہے۔

#کلید کا جواب دینا

جب صفحے پر فوکس ہو تو useInput کو ہر کی اسٹروک ملتا ہے۔ ہیلو کی تعداد گنیں:

یہ ایک مکمل Text.js ایپ ہے۔ اس میں React اسٹیٹ، ایک لے آؤٹ باکس اور ہر تبدیل شدہ فریم کے لیے ایک console.log ہے، اور غیر فعال ہونے پر یہ کچھ لاگ نہیں کرتی۔