잉크: CLI용 반응

사진 제공: Pierre Bamin on Unsplash

이것은 짧고 달콤합니다.

당신은 반응에 익숙합니까? 그럼 당신은 잉크를 알고 있습니다. 아직 시도하지는 않았지만 기본적으로 아름다운 CLI를 구축할 수 있는 custom React renderer입니다.

바딤데메데스 / 잉크

🌈 대화형 명령줄 앱에 대한 반응

React for CLIs. Build and test your CLI output using components.

Ink는 React가 브라우저에서 제공하는 것과 동일한 구성 요소 기반 UI 구축 환경을 제공하지만 명령줄 앱용입니다.
Yoga을 사용하여 터미널에서 Flexbox 레이아웃을 빌드하므로 대부분의 CSS와 유사한 소품을 Ink에서도 사용할 수 있습니다.
이미 React에 익숙하다면 Ink도 이미 알고 있을 것입니다.
Ink는 React 렌더러이므로 React의 모든 기능이 지원된다는 의미입니다.
사용 방법에 대한 설명서는 React 웹 사이트로 이동하십시오.
이 추가 정보에는 Ink의 방법만 설명되어 있습니다.
참고: 이것은 Ink 3에 대한 문서입니다. Ink 2에 대한 문서를 찾고 있다면 this release을 확인하십시오. Ink 2의 migration guide도 있습니다.




My open source work is supported by the community ❤️


특별히 감사함:

Your app, enterprise-ready.

_{Start selling to enterprise customers with just a few}…

View on GitHub

CLI의 Flexbox? 🤯 CLI에서 반응 후크? 욜로 내 친구 욜로.




다음은 리포지토리의 ReadME에서 바로 가져온 작은 예입니다.

import React, {Component} from 'react';
import {render, Color} from 'ink';

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/>);

여기 Gatsby의 저자가 Ink를 사용하여 빌드 흐름을 작업하고 있습니다.

















카일 매튜스









이 잉크는 꽤 멋집니다(터미널에서 반응)1시간 이내에 Gatsby 빌드 흐름을 프로토타입화했습니다. github.com/vadimdemedes/i… 내 코드 — gist.github.com/KyleAMathews/0…/cc


오후 23:34 - 2019년 3월 8일









jest 예제도 매우 멋집니다.

npm의 사람들조차 이것이 멋지다고 생각합니다.

캣 마찬

@maybekatz

잉크는 매우 흥미롭고 모두 확인해야 합니다. CLI 팀은 우리 UI의 많은 부분을 여기로 옮길 계획이며 저는 이것으로 대화형 설치 프로그램 및 업데이트 프로그램의 초기 프로토타입을 개발하는 것이 너무 즐거웠습니다! 멋진 작업을 해주신 Vadim에게 찬사를 보냅니다! twitter.com/vadimdemedes/s…

오후 17:32 - 2019년 3월 6일

바딤 데메데스

🍭 마침내 Ink 2의 출시를 발표하게 되어 매우 기쁩니다. React 구성 요소로 그 어느 때보다 빠르게 아름답고 대화형 명령줄 인터페이스를 구축할 수 있는 라이브러리입니다! 아 그리고 Flexbox로 구성 요소를 레이아웃할 수도 있습니다 🙂 https://t.co/U6Z0kv2EUG. https://t.co/CZIAaBEcBq

Ink의 저자인 Vadim은 훌륭한 소개 게시물을 가지고 있습니다Building rich command-line interfaces with Ink and React.

Ink로 무엇을 만드시겠습니까? 😉

즐거운 코딩하세요!