NPM에서 이력서를 구축하는 방법

어제 Ali Churcher는 CSS 그리드 레이아웃을 사용하여 이력서를 만들 수있는 깔끔한 방법을 공유했습니다. 명령 줄을 사용하고 싶을 때마다 회전 할 수있는 템플릿을 만들어 조금 구축합시다. 그에 대한 멋진 점은 하나의 명령으로 만 실행할 수 있다는 것입니다.

명령 줄이 위협적 일 수 있다는 것을 알고 있습니다. 그렇습니다. 우리는 Node.js에서 약간 작동합니다. 우리는 일을 더 쉽게 따라갈 수 있도록 작은 단계로 나누어 줄 것입니다.

많은 프로젝트와 마찬가지로 약간의 설정이 관련되어 있습니다. 작업 디렉토리에서 빈 폴더를 만들고 NPM 또는 원사를 사용하여 프로젝트를 초기화하여 시작하십시오.

 mkdir your-project && cd "$ _"

## npm
npm init

## 원사
원사 초기

"귀하의 프로젝트"에 사용하는 이름은 NPM 레지스트리의 패키지 이름입니다.

다음 단계는 응용 프로그램의 항목 파일을 작성하는 것입니다.이 경우 index.js입니다. 또한 데이터를 저장할 장소가 필요하므로 Data.json이라는 다른 파일을 만듭니다. 당신이 그들을 생성하면 명령 줄에서 그것을 열 수 있습니다.

 touch index.js && touch data.json

명령 줄 인터페이스 생성

이 앱을 만드는 데있어 가장 큰 이점은 명령 줄에서 직접 이력서를 만들 수있는 반 시각적 방법을 제공한다는 것입니다. 우리는 그 일을하려면 몇 가지가 필요합니다.

• 데이터를 저장하는 개체
• 대화식 명령 줄 인터페이스 (Inquirer.js를 사용하여 빌드)

첫 번째부터 시작하겠습니다. 열린 data.json을 깨고 다음을 추가하십시오.

 {
  "교육": [
    "일부 정보",
    "덜 중요한 정보",
    "등 등"
  ],,
  "경험": [
    "일부 정보",
    "덜 중요한 정보",
    "등 등"
  ],,
  "연락하다": [
    "연락하는 방법"
  ]]
}

이것은 인터페이스의 각 단계에 사용될 객체와 키를 정의하는 예일뿐입니다. 자신의 요구에 맞게 완전히 수정할 수 있습니다.

그것이 우리가 필요한 첫 번째 것입니다. 두 번째는 대화식 인터페이스입니다. Inquirer.js는 90%를 처리합니다.

 원사 add atederer chalk

그 분필이 뭐야? 더 나은 경험을 위해 색상과 스타일을 추가하여 터미널 출력을 사용자 정의하는 데 도움이되는 라이브러리입니다.

이제 index.js를 열고 다음 코드를 붙여 넣으십시오.

 #!/usr/bin/env 노드

"엄격한 사용";

const atibirer = require ( "Inquirer");
const chalk = 요구 사항 ( "Chalk");
const data = require ( "./ data.json");

// 응답 색상을 추가합니다
const response = chalk.bold.blue;

const recumeoptions = {
  유형 : "목록",
  이름 : "이력서",
  메시지 : "무엇을 알고 싶습니까?",
  선택 : [... Object.keys (데이터), "종료"]
};

함수 showResume () {
  Console.log ( "안녕하세요, 이력서입니다");
  handleresume ();
}

함수 handleresume () {
  Inquirer.prompt (이력서).
    if (답변. resumeoptions == "exit") 반환;

    const 옵션 = data [`$ {answer.resumeoptions}`]
    if (옵션) {
      console.log (응답 (new Inquirer.separator ());
      옵션 .foreach (info => {
        console.log (응답 ( "| =>"info));
      });
      console.log (응답 (new Inquirer.separator ());
    }

    지망생
      .즉각적인({
        유형 : "목록",
        이름 : "Exitback",
        메시지 : "돌아가거나 나가십니까?",
        선택 : [ "백", "종료"]]
      }). 그런 다음 (선택 => {
        if (choice.exitback == "back") {
          handleresume ();
        } 또 다른 {
          반품;
        }
      });
  }). catch (err => console.log ( 'oops,', err)))
}

showresume ();

조이 크! 그것은 큰 코드 덩어리입니다. 무슨 일이 일어나고 있는지 설명하기 위해 조금 찢어 봅시다.

파일 상단에서는 앱을 실행하는 데 필요한 모든 것을 가져오고 Chalk 라이브러리를 사용하여 색상 스타일을 설정합니다. 색상과 사용자 정의에 더 관심이 있다면 Chalk 문서를 확인하십시오.

 const atibirer = require ( "Inquirer");
const chalk = 요구 사항 ( "Chalk");
const data = require ( "./ data.json");

// 응답 색상을 추가합니다
const response = chalk.bold.blue;

다음 코드가 수행하는 일은 이력서 옵션 목록을 만드는 것입니다. 이것들은 터미널에 명령을 입력 한 후에 표시 될 것입니다. 우리는 그것을 이력서라고 부르기 때문에 그것이 무엇을하는지 정확히 알 수 있습니다.

 const recumeoptions = {
  유형 : "목록",
  이름 : "이력서",
  메시지 : "무엇을 알고 싶습니까?",
  선택 : [... Object.keys (데이터), "종료"]
};

우리는 선택 필드에 주로 관심이 있습니다. 왜냐하면 그것이 데이터 객체에서 키를 구성하는 동시에 필요한 경우 앱을 "종료"하는 방법을 제공하기 때문입니다.

그 후, 우리는 함수 showresume ()을 만듭니다. 이는 출시 직후에 실행되는 주요 함수가 될 것입니다. SONTA Welcome 메시지를 표시하고 handleresume () 함수를 실행합니다.

 함수 showResume () {
  Console.log ( "안녕하세요, 이력서입니다");
  handleresume ();
}

좋아, 이제 큰 것 : handleresume () 함수. 첫 번째 부분은 우리가 앱을 종료하지 않았는지 확인하고 모든 것이 양호한 경우 데이터 객체에서 등록 된 옵션을 표시하는 조건부 점검입니다. 다시 말해, 선택한 옵션이 종료되면 프로그램을 종료합니다. 그렇지 않으면 선택한 키 아래에서 사용할 수있는 옵션 목록을 가져옵니다.

따라서 앱이 종료되지 않음을 확인한 후에는 답변을 얻습니다. resumeoptions 당신이 추측했을 수도있는 것처럼 우리가 data.json 파일에 정의한 섹션 목록을 뱉어냅니다. 우리가 정의한 것은 교육, 경험 및 연락처였습니다.

그것은 우리를 Inquirer.js 물건으로 데려옵니다. 우리가 그 조각들을 나열하면 가장 쉬울 수 있습니다.

옵션 출력에서 ​​새로운 Inquirer.separator () 기능이 있음을 알았습니까? 이는 컨텐츠 간의 시각적 분리기를 제공하여 문제를 조금 분해하고 인터페이스를 읽기 쉽게 만드는 Inquirer.js의 기능입니다.

좋아, 우리는 옵션 목록을 보여주고 있습니다! 이제 AA가 이전 화면으로 돌아 가도록해야합니다. 그렇게하기 위해, 우리는 새로운 객체를 전달할 다른 Inquirer.prompt를 만듭니다. 그러나 이번에는 두 가지 옵션 만 출구와 뒤로. 그것은 우리가 처리해야 할 답변으로 약속을 돌려 줄 것입니다. 선택한 옵션이 다시 돌아 오면 핸들러 ()를 실행합니다. 즉, 옵션으로 메인 화면을 다시 열 수 있습니다. 출구를 선택하면 기능을 종료합니다.

마지막으로, 가능한 오류를 잡기 위해 Catch 문을 추가 할 것입니다. 모범 사례. :)

NPM에 출판

축하해요! Node Index.js를 실행해 보면 앱을 테스트 할 수 있어야합니다.

그것은 훌륭하고 모두이지만, 매번 직접 일할 필요없이 실행하는 것이 더 좋을 것입니다. 이것은 우리가 방금 본 기능보다 훨씬 간단합니다.

1. NPMJS.com에 계정이없는 경우 계정을 등록하십시오.
2. NPM AddUser를 실행하여 CLI에 사용자를 추가하십시오.
3. NPM 계정을 등록하는 데 사용한 사용자 이름과 비밀번호를 제공하십시오.
4. package.json으로 이동하여 다음 줄을 추가하십시오.

    "빈": {
     "당신의 package-name": "./index.js"
   }

5. 앱의 NPM 페이지에 표시 될 readme.md 파일을 추가하십시오.
6. 패키지를 게시하십시오.

 NPM 게시 -Access = public

패키지를 업데이트 할 때마다 패키지를 NPM으로 푸시 할 수 있습니다. NPM 버전 작성에 대한 자세한 내용은 여기를 참조하십시오.

 NPM 버전 패치 // 1.0.1
NPM 버전 마이너 // 1.1.0
NPM 버전 전공 // 2.0.0

업데이트를 NPM으로 푸시하려면 :

 NPM 게시

마법을 재개하십시오!

그게 다야! 이제 당신은 당신의 package-name을 명령 줄에 입력하고 이력서를 바로 만들 수있는 마법을 경험할 수 있습니다. 그건 그렇고, NPX는 컴퓨터에 로컬로 설치하지 않고 명령을 실행하는 방법입니다. NPM이 설치된 경우 자동으로 사용할 수 있습니다.

이것은 단순한 터미널 앱이지만, 무대 뒤에서 논리를 이해하면 놀라운 것들을 만들 수 있으며 이것이 첫 번째 단계입니다.

소스 코드

행복한 코딩!

위 내용은 NPM에서 이력서를 구축하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!