JiSoo's Devlog

[타입스크립트로 블록체인 만들기] Typescript Blockchain 본문

Frontend/Typescript

[타입스크립트로 블록체인 만들기] Typescript Blockchain

지숭숭숭 2024. 4. 20. 16:54

package.json 초기화

npm init -y

 

typescript 설치

npm i -D typescript

 

tsconfig.json 파일 만들기

code tsconfig.json

tsconfig.json 파일이 있으면 vs code는 우리가 타입스크립트로 작업한다는 것을 즉시 알게 된다

{
  "include":[
    "src"
  ]
}

include 배열에는 자바스크립트로 컴파일하고 싶은 모든 디렉터리 넣기

-> 타입스크립트가 src의 모든 파일을 확인한다는 것을 의미

 

compilerOptions에서 outDir라는 키를 만들어주는데 이 키는 자바스크립트 파일이 생성될 디렉터리를 저장한다

타입스크립트는 컴파일러니까 index.ts 같은 파일들을 일반적인 자바스크립트로 컴파일시켜준다

{
  "include": ["src"],
  "compilerOptions": { "outDir": "build" }
}
"scripts": {
    "build": "tsc"
  },

타입스크립트가 코드를 컴파일해서 낮은 버전의 자바스크립트 코드로 바꿔준 것

 

{
  "include": ["src"],
  "compilerOptions": { "outDir": "build", "target": "ES5" }
}

target은 어떤 버전의 자바스크립트로 내가 타입스크립트를 컴파일하고 싶은지를 나타낸다

 

lib은 타입스크립트에게 어떤 API를 사용하고 어떤 환경에서 코드를 실행하는 지를 지정할 수 있다

target 런타임 환경이 무엇인지 지정

프로그램이 브라우저에서 실행되면 lib에 'DOM' 유형 정의 가능

DOM: window, document 등

 

타입스크립트는 내장된 자바스크립트 API를 위한 기본적인 타입 정의는 가지고 있다

타입 정의는 타입스크립트에게 몇몇 자바스크립트 코드의 타입을 설명해 주기 위해 사용하는 것

타입스크립트에게 우리가 불러올 자바스크립트 함수의 모양을 설명하려면 타입 정의가 필요

 

정의 파일은 자바스크립트 코드의 모양을 타입스크립트에 설명해 주는 파일

 

strict는 모든 엄격한 타입 검사 옵션 활성화

 

d.ts의 정의 파일에서 호출 시그니처, 즉 타입만 써주면 된다

 

allowJs를 true로 해주면 타입스크립트 안에 자바스크립트를 허용한다는 의미

코드가 엄청 많을 때는 파일을 그냥 자바스크립트 파일인 채로 두는 게 좋다

 

자바스크립트에 보호장치를 더하는 방법은 코멘트 더하는 것

// @ts-check

↑ 타입스크립트 파일한테 자바스크립트 파일을 확인하라고 알리는 것

 

JSDoc은 코멘트로 이루어진 문법

@ts-check

자바스크립트 코드에 JSDoc 코멘트만 더하면 타입스크립트가 도와준다

// @ts-check
/**
 * Initializes the project
 * @param {object} config
 * @param {boolean} config.debug
 * @param {string} config.url
 * @returns boolean
 */
export function init(config) {
  return true;
}
/**
 * Exits the program
 * @param {number} code
 * @returns number
 */
export function exit(code) {
  return code + 1;
}

 

워크 플로우는 'npm run build && npn run start' 이런 식으로 실행해야 한다

"scripts": {
    "build": "tsc",
    "start": "node build/index.js"
  },

 

ts-node 설치

npm i -D ts-node

빌드 없이 타입스크립트 실행 가능

 

nodemon 설치

npm i nodemon

자동으로 커맨드를 재실행시켜 일일이 커맨드를 다시 실행할 필요 X

 

esModuleInterop는 CommonJS 모듈을 ES6 모듈 코드베이스로 가져오려고 할 때 발생하는 문제 해결

 

DefinitelyTyped - 타입 정의를 위한 레포지토리

https://github.com/DefinitelyTyped/DefinitelyTyped

 

GitHub - DefinitelyTyped/DefinitelyTyped: The repository for high quality TypeScript type definitions.

The repository for high quality TypeScript type definitions. - DefinitelyTyped/DefinitelyTyped

github.com

 

nodejs를 위한 타입 전부 설치

npm i -D @types/node

 

axon에 대한 타입 정의 설치

npm i -D @types/axon

 

import crypto from "crypto";

interface BlockShape {
  hash: string;
  prevHash: string;
  height: number;
  data: string;
}
class Block implements BlockShape {
  public hash: string;
  constructor(
    public prevHash: string,
    public height: number,
    public data: string
  ) {
    this.hash = Block.calculateHash(prevHash, height, data);
  }
  static calculateHash(prevHash: string, height: number, data: string) {
    const toHash = `${prevHash}${height}${data}`;
    return crypto.createHash("sha256").update(toHash).digest("hex");
  }
}

class Blockchain {
  private blocks: Block[];
  constructor() {
    this.blocks = [];
  }
  private getPrevHash() {
    if (this.blocks.length === 0) return "";
    return this.blocks[this.blocks.length - 1].hash;
  }
  public addBlock(data: string) {
    const newBlock = new Block(
      this.getPrevHash(),
      this.blocks.length + 1,
      data
    );
    this.blocks.push(newBlock);
  }
  public getBlocks() {
    return [...this.blocks];
  }
}
const blockchain = new Blockchain();
blockchain.addBlock("First one");
blockchain.addBlock("Second one");
blockchain.addBlock("Third one");
blockchain.addBlock("Fourth one");

console.log(blockchain.getBlocks());

 

728x90