التثبيت

#المتطلبات

• ⁦Bun⁩ ⁦1.2+⁩ أو ⁦Node.js 22+⁩
• Chrome أو Edge أو Firefox أو Safari على جهاز سطح مكتب

#إنشاء تطبيق

bunx create-text-app@latest

اختر قالبًا (starter أو dashboard أو opencode)، ثم شغّل خادم التطوير:

cd my-appbun installbun dev

#فتح وحدة التحكم

انتقل إلى http://localhost:3000 وافتح وحدة التحكم.

في Safari، فعّل أولًا «إظهار الميزات لمطوري الويب» في «الإعدادات» → «متقدم».

انقر على الصفحة لتركيزها، ثم اكتب. يتيح إرساء DevTools في الأسفل أعرض شبكة.

#إعدادات وحدة التحكم

عطّل «الاحتفاظ بالسجلّ» في إعدادات وحدة التحكم. يلحق Text.js رسالة واحدة لكل إطار ويمسح وحدة التحكم لتحرير الإطارات القديمة. عند تفعيل «الاحتفاظ بالسجلّ»، يتجاهل DevTools المسح وتتراكم الإطارات القديمة.

#الإعداد اليدوي

bun add @textjs/app react react-dom

{  "scripts": { "dev": "text dev", "build": "text build", "start": "text start" }}

import { Text } from "@textjs/app";export default function Page() {  return <Text className="p-1">Hello from console.log</Text>;}

#بدون إطار العمل

اعرض أي شجرة React في وحدة التحكم من موقع موجود:

import { renderToConsole, Box, Text } from "@textjs/react";await renderToConsole(  <Box className="border rounded p-1">    <Text bold>Hello, DevTools</Text>  </Box>,  { width: 100, height: 32 },);