Build Terminal UIs with Vue.js

Quick Example ​

Build reactive terminal interfaces with familiar Vue syntax:

<template>
  <Col>
    <Box color="cyan">
      Counter Example
    </Box>
    <Row>
      <TextBox color="green">Count: {{ counter }}</TextBox>
    </Row>
  </Col>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { Box, TextBox, Row, Col } from 'vuetty';

const counter = ref(0);

onMounted(() => {
  setInterval(() => counter.value++, 1000);
});
</script>

import { vuetty } from 'vuetty';
import Counter from './Counter.vue';

// Create and mount the SFC component
const app = vuetty(Counter);

// Cleanup on exit
process.on('SIGINT', () => {
  app.unmount();
  process.exit(0);
});

Use Cases ​

Vuetty enables development of:

• CLI Tools: Build interactive command-line applications with rich user interfaces
• Dashboard Applications: Create real-time monitoring dashboards for servers and services
• Development Tools: Develop debugging interfaces, log viewers, and system administration utilities
• Data Visualization: Display charts, graphs, and tabular data directly in the terminal
• Form-Based Applications: Build complex forms with validation and interactive input handling

Get Started ​

Start building terminal UIs with Vuetty: