Ink: React for CLIs

This one is short and sweet.

Are you familiar with React? Then you know Ink. I haven't tried this out yet, but basically it's a custom React renderer that allows you to build beautiful CLIs.

GitHub link: https://github.com/vadimdemedes/ink

Flexbox in a CLI? 🤯 React hooks in a CLI? YOLO my friend, YOLO.

<center>

</center>

Here's a little example straight from the repository's ReadME:

        
          
class Counter extends Component {
	constructor() {
		super();

		this.state = {
			i: 0
		};
	}

	render() {
		return (
			<Color green>
				{this.state.i} tests passed
			</Color>
		);
	}

	componentDidMount() {
		this.timer = setInterval(() => {
			this.setState({
				i: this.state.i + 1
			});
		}, 100);
	}

	componentWillUnmount() {
		clearInterval(this.timer);
	}
}

render(<Counter/>);
        
      

Even the folks at npm think it's kinda cool.

Vadim, the author of Ink has a great intro post to it, Building rich command-line interfaces with Ink and React.

So what are you going to build with Ink? 😉

Happy coding!

Photo by Pierre Bamin on Unsplash