우리는 우리가 사용하는 개발 도구를 더욱 깊이 파헤쳐야 합니까?

만약 내가 간단명료하게 대답하고 싶다면, 나는 이렇게 쓸 수밖에 없다. 그래, 우리는 반드시 이렇게 해야 한다.
그러나 물론 이 주제는 훨씬 복잡하다. 왜냐하면 우리는 보통 바빠서 개발 도구의 원본 코드를 볼 수 없기 때문이다.그 밖에 개발자들은 모두 사람이기 때문에 우리는 게으르거나 큰 코드 라이브러리에서 발굴하는 것이 쓸모없고 피곤하다고 생각할 수도 있다.
나는 7~8년 전에 일어난 이야기를 나눴는데, 그것은 아마도 나의 정확한 뜻을 설명할 수 있을 것이다.
나는 보통 일찍(새벽 2시에서 5시 사이) 일을 시작하기 때문에 코로나 시대 이전에는 항상 사무실의 책임자였다.
한 번은 사무실에 앉아서 리눅스 핵의 원본 코드를 보면서 프로세스 스케줄러가 어떻게 작동하는지 알아보려고 했다.나는 아무것도 하고 싶지 않다.나는 방금 이 일이 생각났는데, 나는 본래 좀 더 깊이 이해하고 싶었다.그리고 이 코드가 수억 가지의 다른 장치에서 실행되는 것을 보니 흥미롭기도 하고 신기하기도 하다.나는 그것의 코드에서 약간의 것을 배우고 싶다.그래서 우선, 나는 그것이 내부 코드에 있는 위치를 조사했다.커다란 코드 라이브러리에서 뭔가를 찾으려고 시도할 때, 이 조사는 매우 유용하다. 왜냐하면 이 과정에서 코드 라이브러리 구조에 대한 새로운 정보를 얻을 수 있기 때문이다.
스케줄러 코드로 보이는 파일을 찾았을 때, 나는 그것을 자세히 살펴보고, 그 기능을 이해하려고 했다.물론 그것에 대한 이해는 깊지 않지만, 이것은 좋은 모험이다.나에게 있어서 가장 중요한 것은 공부다.이 똑똑한 코드에 대한 지식도 배우고 이 파일의 역사도 배웁니다.누가 그것의 첫 번째 판본을 창조했습니까?언제 만들었어요?어떻게 바뀌었나요?왜 바꿔야 합니까?그것은 여전히 내부 핵에 있습니까 아니면 이미 폐기되었습니까?아직 많은 문제가 있다.
한 번은 그 후에 내 동료가 사무실에 왔을 때 우리는 완전히 다른 일을 이야기하기 시작했다. 갑자기 나는 그에게 리눅스 소스 코드가 매우 아름답다고 말했다. 나는 이것과 저것을 연구했다.그는 웃었지만, 나는 그의 얼굴에서 내가 왜 이 이상한 일에 시간을 쓰는지 알 수 없었다.나는 그가 이것이 시간을 낭비하는 것이라고 생각한다.내가 미친 줄 알았나봐.이 가능하다, ~할 수 있다,...
어쨌든, 나는 매우 좋아하고, 게다가 나는 통상적으로 여전히 이렇게 한다.그래, 나는 우리가 다르다는 것을 안다. 그래서 내 전 동료의 세계에서 그가 옳다.이 세계에서 개발자들은 그들의 도구를 사용하고, 그들의 도구, 프로그래밍 언어, 프레임워크가 어떻게 작동하는지에 대해 그리 관심이 없다.우리는 그것들을 사용한다.하지만 나는 또 다른 성계에 있다. 여기서 나의 도구를 이해하는 것이 나에게 매우 중요하다.공부 때문만은 아니야.나는 또 나의 도구를 창조한 우수한 개발자들에게 경의를 표하고 싶다.그들이 만든 원본 코드는 보통 매우 훌륭해서, 이 코드 라이브러리를 깊이 파헤치면 나의 지식을 높일 수 있다.그러나 우리도 그들의 소스 코드에서 재미있고 놀라운 것을 찾을 수 있다.어쨌든, 나는 도구의 원본 코드를 끌어내려 그것들을 이해해 보는 것을 좋아한다.
좋아, 우리 재미있는 예를 찾아보자.
나는 언어가 알 수 없는 개발 모델을 좋아하기 때문에 항상 특정 임무에 적합한 프로그래밍 언어를 사용하려고 시도한다.내가 가장 좋아하는 언어 중 하나는 자바스크립트와 TypeScript이다.나는 타자 스크립트를 정말 좋아하기 때문에, 만약 내가 새로운 항목이 있다면, 나는 보통 그것을 사용해 보려고 한다.TypeScript가 인기가 많은 것 같아서 많은 개발자들도 이렇게 하는 것을 알고 있습니다.문제는 타자 스크립트를 우리가 알고 있느냐는 것이다.물론 우리는 그것의 문법을 안다.우리는 TypeScript에서 인터페이스를 사용할 수 있다. 그러면 우리의 핵심이 더욱 통용되고 신뢰할 수 있으며, 클래스와 더 많은 것을 적절하게 봉인할 수 있다.그런데 저희가 타자 스크립트가 어떻게 작동하는지 아세요?그것의 코드 라이브러리는 어떤 모양입니까?예를 들어, 컨트롤러에 tsc --help 를 입력했을 때, 그것은 어떻게 시작되었습니까?아니면 그것은 어떤 프로그래밍 언어로 작성되었습니까?그 코드 라이브러리는 전면적인 테스트를 거쳤습니까?그것의 개발자는 견고한 원칙을 따르는가?나는 이상할 수도 있지만, 나는 이 문제들의 답을 알고 싶다. 그래서 이것이 바로 내가 GitHub에서 그 코드를 복제하고, 내가 필요로 하는 모든 답을 컴파일하고 연구한 이유이다.이것은 결코 항상 쉬운 것은 아니지만, 거의 항상 재미있다.우리 어떻게 해요?솔직히 말하면, 모든 코드 라이브러리가 다르기 때문에 정확한 방법은 없다.이것은 학습 메커니즘과 모험의 일종이다.그래서 TypeScript를 예로 들겠습니다.
나는 너의 기계에 노드와 NPM이 설치되어 있다고 추측한다.있는 경우 콘솔을 열고 TypeScript의 저장소를 복제합니다.

git clone https://github.com/microsoft/TypeScript.git

만약 Gulp이 없다면, 그들은 건설 과정에서 Gulp를 사용하기 때문에 그것을 설치해야 한다.따라서 먼저 디렉토리를 변경합니다.

cd TypeScript

그리고 Gulp을 설치합니다. (전역적으로 설치할 수 있도록 - g 인자로 설치했습니다.)

npm install -g gulp

그 다음에 너는 달리기를 할 수 있다.

npm install

알겠습니다. 코드에서 처리되는 help 파라미터의 부분을 찾아보겠습니다.이것은 매우 자질구레하게 들리지만, 그것은 코드에 더욱 익숙해지는 좋은 출발점이 될 수 있다.
좋아하는 편집기에서 원본 코드를 열고 찾아보겠습니다.우리는 많은 방법으로 이 점을 해낼 수 있다.우리는 문자열 '-help' 를 검색할 수 있다. (우리는 그것이 작동하지 않을 것이라고 내기할 수 있다.) 대시가 없는 'help' 단어를 검색할 수 있다. (검색 결과를 너무 많이 제공하기 때문에 작동하지 않을 것이다.)우리 어떻게 해요?나는 다른 방식을 추천할 것이다.우선, 나는 프로그램을 구축하고 그것을 실행해 보려고 한다. 그리고, 우리는 디버깅을 할 수 있어야 한다.TypeScript는 TypeScript로 작성되므로 한 번에 만들 수 있습니다.따라서 다음 명령을 실행할 수 있습니다.

gulp local

이것은 응용 프로그램을 내장/로컬 디렉터리로 구축할 것입니다.따라서 를 실행하고 빌드 프로세스가 완료되면 다음 명령을 실행할 수 있어야 합니다.

node ./built/local/tsc.js --help

네, 이제 콘솔을 추가할 수 있습니다.src/tsc/tsc에 로그인합니다.우리는 무슨 일이 발생했는지 보게 될 것이다.물론 이것은 통하지 않는다.우리는 구축 과정에서 오류 메시지를 받을 것이다.

error TS2584: Cannot find name 'console'. Do you need to change your target library? Try changing the lib compiler option to include 'dom'.

@types/node (npm install @types/node 를 설치하지 않았기 때문에 컨트롤러 정의를 찾을 수 없습니다.또한 콘솔 로그를 사용하는 것은 TypeScript 코드를 디버깅하는 가장 복잡한 방법이 아닙니다.우리는 컨트롤러 로그를 사용하지 않고 원본 코드 편집기에서 디버거를 사용해야 한다.
이제 이 디버깅 과정을 봅시다.그렇다면 TypeScript 소스 코드는 어떻게 디버깅합니까?
나는 VS 코드를 사용하여 TypeScript 코드를 편집하는데, 그것은 자신의 실행과 디버깅 기능을 가지고 있다.편집기를 열고 TypeScript 디렉토리를 엽니다.
그래서 tsc 명령의 help 파라미터를 디버깅하고 싶습니다.먼저 만들거나 편집해야 합니다.vscode\launch.json file.나는 이 예제를 위해 만든 파일을 공유한다.

{
    "version": "0.1.0",
    "configurations": [
      {
        "type": "node",
        "protocol": "inspector",
        "request": "launch",
        "name": "Testing of debugging",
        "program": "${workspaceFolder}/built/local/tsc.js",
        "args": [
          "--help"
        ],
        "env": {
          "NODE_ENV": "develop"
        },
        "sourceMaps": true,
        "smartStep": true
      }
    ]
  }

src\tsc\tsc를 열어야 합니다.ts 파일에서 다음 행으로 이동합니다.ts.executeCommandLine(ts.sys, ts.noop, ts.sys.args);자, 이제 이 줄에 단점을 추가한 다음 디버깅 도구 모음의 '단일 실행' 단추로 다음 작업에 들어갈 수 있습니다.너는 다음 두 개의 캡처에서 이 점을 볼 수 있다.


마우스 포인터를 변수 위에 놓으면 해당 변수의 현재 값이 표시됩니다.

tsc 명령을 실행할 때, help 파라미터나 다른 파라미터의 상황을 쉽게 조사할 수 있습니다.나는 이것이 매우 간단하고 매우 유용하다고 생각한다.
한 마디로 하면, 이 문장에서 우리는 약간의 새로운 것을 배웠다고 말할 수 있다.나는 이것이 재미있는 학습 과정이라고 생각한다.우리는 방금 TypeScript 소스 코드를 열었는데 심지어 어떤 진정한 코드도 보지 못했다.그럼에도 불구하고 TypeScript 코드를 디버깅하는 방법을 배웠습니다.이것이 바로 내가 같은 일을 하는 이유다.나는 새로운 것을 배울 수 있을 뿐만 아니라, 나도 내가 매일 사용하는 개발 도구에 점점 익숙해진다.
물론 이것은 하나의 예일 뿐입니다. TypeScript 디버깅을 어떻게 하는지 이미 알고 있을 수도 있지만, 이것은 중요하지 않습니다. 왜냐하면 TypeScript 소스 코드에서 다른 것을 찾을 수 있다고 믿기 때문입니다. 이 물건들은 당신에게 새로운 정보일 수도 있습니다.이것이 바로 내가 나의 도구 소스 코드를 훑어보는 것을 좋아하는 이유이다.이것은 거대한 학습 여행이다.
다른 조사를 진행합시다.Tsc에서 HelloWorld를 실행하면 TypeScript에서 어떤 일이 발생합니다.ts?
나는 지옥의 세계를 창조했다.TypeScript 디렉토리에서 제거하려면 다음과 같이 하십시오.

cd ..
touch HelloWorld.ts

편집기에서 해당 컨텐트를 다음과 같이 엽니다.

let message: string = 'Hello world!';
console.log(message);

방을 바꿨습니다.vscode/launch.json

{
    "version": "0.1.0",
    "configurations": [
      {
        "type": "node",
        "protocol": "inspector",
        "request": "launch",
        "name": "Testing of debugging",
        "program": "${workspaceFolder}/built/local/tsc.js",
        "args": [
          "../HelloWorld.ts"
        ],
        "env": {
          "NODE_ENV": "develop"
        },
        "sourceMaps": true,
        "smartStep": true
      }
    ]
  }

따라서 디버깅을 시작하고 코드에 들어가면 TypeScript 소스 코드에서 무슨 일이 일어났는지 볼 수 있습니다.
VS 코드에서 Run And Debug 아이콘을 클릭하면 전체 호출 스택, 사용된 모든 변수, 로드된 스크립트가 표시됩니다.

만약 우리가 어떤 코드 라이브러리에 더 익숙해지고 싶다면 디버깅의 설정은 항상 시작점이다.가능하다면, 우리는 구조, 인코딩 스타일, 명칭 약속, 모든 것을 검사할 수 있다.또 다른 의미 있는 것은 프로젝트의 단원 테스트를 보고 실행하는 것이다. 왜냐하면 그들은 우리에게 많은 새로운 정보를 알려줄 수 있기 때문이다.
나는 우리의 도구/프로그래밍 언어/프레임워크 소스 코드를 훑어보는 것이 매우 유용하다고 생각한다.이런 예들은 모두 작은 일이지만, 어쨌든 이것은 단지 공부를 위한 것이다.
이 글을 읽어 주셔서 감사합니다.오늘 하루 즐겁게 보내세요.