Introduction

Text.js est un framework React pour les applications qui s’affichent dans la console DevTools avec console.log.

import { useState } from "react";import { Box, Text, useInput } from "@textjs/app";export default function Page() {  const [count, setCount] = useState(0);  useInput((e) => {    if (e.key === "up") setCount((c) => c + 1);    if (e.key === "down") setCount((c) => c - 1);  });  return (    <Box className="flex-col p-1 border rounded">      <Text bold>count = {count}</Text>    </Box>  );}

L’aperçu est interactif. Cliquez dessus et appuyez sur ↑.

#Fonctionnalités incluses

• React 19 : rendu concurrent, Suspense et périmètres d’erreurs.
• App Router : layouts, pages, segments dynamiques et gestionnaires de route.
• Layout Yoga : flexbox en WebAssembly, aligné sur des cellules entières.
• Turbolog : un appel à console.log par frame modifiée.
• Interface de la console : la page héberge uniquement une zone de focus et un champ de saisie masqué.

#Fonctionnement

L’état se propage vers le bas : React, puis le layout, puis un tampon de cellules, puis la console.

React 19 ▼ Yoga ▼ CellBuffer ▼ console.log(format, ...css)

Les frames inchangées sont ignorées, donc les applications inactives n’écrivent rien dans la console.

#Étapes suivantes

• Installation : créez votre première application.
• Routage : pages, layouts et navigation.
• Turbolog : encodage des frames.
• OpenCode : une interface textuelle d’agent conçue avec Text.js.