전체 글 (78) 썸네일형 리스트형 VSCode 확장 프로그램 만들기 (3) - VSCode 코드 품질 측정 확장 프로그램(VSCode 익스텐션) Style Rank 프로젝트 소개코드를 작성하다 보면 "이 코드가 잘 작성된 건가?" 하는 의문이 들 때가 있다. 주로 ESlint와 같은 도구를 활용하여 코드 컨벤션에 대한 검사를 하곤 하지만, 해당 코드가 얼마나 복잡하게 짜여있는지, 구조적으로 문제가 없어도 클린 코드로써 좋은 코드인지에 대한 검사에는 어려움이 있다. 리뷰를 해주는 입장에서 읽기에 가독성 등의 측면에서 문제가 없는지에 대한 의문이 든 경우가 많을 것이다. Style Rank는 이러한 의문에 답하기 위해 만든 VSCode 익스텐션이다. 파일을 저장하는 순간 코드 품질을 자동으로 분석하고, S/A/B/C/D/F 등급을 실시간으로 보여준다. 아래는 관련 깃허브 url과 vscode 익스텐션 마켓의 url이다. Github: https://.. VSCode 확장 프로그램 만들기 (2) - AST와 코드 복잡도 측정 코드 품질을 객관적으로 측정하려면 어떻게 해야 할까?이번 글에서는 AST(Abstract Syntax Tree)와 순환 복잡도, 인지 복잡도 등 이번 프로젝트에서 주요하게 다른 코드 분석 내용을 다룰 것이다. AST(Abstract Syntax Tree)란?AST는 소스 코드의 구조를 트리 형태로 표현한 자료구조다. 코드의 문법적 구조를 추상화하여 컴파일러나 분석 도구가 이해할 수 있는 형태로 변환한다. 예를 들어,const add = (a, b) => a + b; 이 코드는 AST로 다음과 같이 표현된다. { "type": "VariableDeclaration", "declarations": [ { "type": "VariableDeclarator", "id": { "type.. VSCode 확장 프로그램 만들기 (1) - 확장 프로그램 시작하기 VSCode 확장 프로그램 개발 시작하기VSCode는 개발자들에게 가장 사랑받는 에디터 중 하나다. 그 이유 중 하나는 바로 확장 프로그램(Extension) 생태계 덕분이다. 이번 글에서는 VSCode 확장 프로그램을 만드는 방법과 개발 과정에서 겪은 경험을 공유한다. 개발 환경 구축VSCode 확장 프로그램을 만들기 위해서는 먼저 개발 환경을 구축해야 한다. Yeoman과 generator-code를 사용하면 확장 프로그램의 기본 템플릿을 쉽게 생성할 수 있다.npm install -g yo generator-codeyo code 템플릿 생성 시 여러 옵션을 선택할 수 있는데, 나는 TypeScript와 esbuild를 선택했다. Webpack 대신 esbuild를 선택한 이유는 빌드 속도가 월등히 .. 이전 1 2 3 4 ··· 26 다음