항해플러스 - 8주차

CH_Hwang·2024년 1월 24일
1

항해플러스

목록 보기
6/8

이번주는 오픈소스 프로젝트의 시작이었다.

여러 아이디어가 나왔지만 결국 vscode extension을 만들기로 했다.
다른 아이디어들은 항해 끝나고 혼자서 해야지 ㅎㅎ

일단 컨셉은 vscode power mode를 쓰는 팀원분이 아이디어를 내주셨다.
vscode power mode는
https://marketplace.visualstudio.com/items?itemName=hoovercj.vscode-power-mode
여기를 보면 되는데 텍스트를 칠때마다 power power한 이펙트와 screen shaker가 동작한다.

우리는 이 익스텐션이 2년전에 유지보수가 끝났고, 이런 컨셉의 다른 vscode extension이 별로 없다는 것을 이용하여 우리가 저 파이를 먹어보자라는 생각으로 시도했다. (처음 시작은 간지였으나... 끝은 성공으로..)

일단 vscode extension은 npm과는 달리 따로 vscode api를 이용해야한다. 그리고 배포도 npm을 이용한 것이 아닌 vsce를 이용하여 배포를 하는 과정이 있다.

그래서 어떻게 하는데?

1. 프로젝트 세팅

린트, 포멧팅

일단 3명에서 프로젝트를 하기때문에 lint, prettier는 필수라고 생각했다. 그리고 vscode setting에서 formatOnSave를 해놓기도 했고, husky, lint-staged를 이용하여 pre-commit, 커밋이 되기 직전에 lint가 돌아가도록 했다.

문서 작업

일단 문서 작업의 경우 기본적으로

  • lincense
  • code of conduct
  • contributing
  • pr template
  • issue template
  • security
  • change log

문서를 만들었다.

하나씩 설명해보자면

License

라이센스의 경우 굉장히 많았다. 다만 우리 오픈소스의 경우 딱히 제한을 두지 않아도 될 것 같아 MIT License를 이용했다.

code of conduct

오픈소스 커뮤니티 행동강령과 같은 느낌이다. 우리의 오픈소스 행동강령은
https://www.contributor-covenant.org/version/2/0/code_of_conduct/
를 따랐다.

contributing

사실 중요하긴 한데 아직 무엇을 정확하게 어떻게 할지 룰이 정해지지 않아 일단 code convention만 적어두었다. 나중에는 실행방법, 테스트 방법 등을 적어두어 우리의 프로젝트에 기여하고 싶을때 어떤방식으로 시작하고 동작시켜야하는지 적어두어야한다.

pr template

pull request 템플릿은 간단하게 두었다. 어떤 변경사항인지, 체크리스트를 따랐는지 정도만 파악하면 될 것이라고 생각했다.

issue template

이슈 템플릿은 2개로 나누었다.

  • bug report
    • 버그가 발생했을 때 어떤 버그가 발생했는지 알 수 있도록 하였다.
  • feture request
    • 기능 제안 이슈 템플릿이다.

security

보안적 이슈가 발생했을 때 일단 뭔가 이슈로 남기거나 한다는건 굉장히 위험할 것 같아 메일로 따로 보내달라고 하였다.

change log

버전이 변경되면서 바뀌는 점을 적어두어야한다. 아직은 처음이라서 뭐가 없다..

extension 세팅

extension 세팅의 경우 기존의 npm에 배포하는 오픈소스와는 사뭇 다르다.
일단 json파일들을 굉장히 굉장히 많이 이용해야한다.
.vscode 폴더 안에 여러 json파일들과 package.json 파일 안에서 engines, main, publisher,activationEvents 같은 것들을 설정해주지 않으면 애초에 실행이 되지 않는다.

  • engines
    • 우리의 package가 실행되는 기반 엔진 (우리의 경우 extension이기 때문에 vscode로 정했고 version은 일단 하위 버전을 테스트해보지않아 최신버전으로 하였다.)
  • main
    • 우리 패키지의 main이 되는 파일. 당연히 extension.js이다 (컴파일 된 후의 파일이기때문에 src/extension.ts가 아닌 dist 폴더안에 있는 extension.js가 main이다.)
  • publisher
    • 이게 없으면 vsce 명령어를 통한 pubslish가 되지 않는다.
  • activationEvents
    • 언제 활성화 되야하는지에 대한 명세이다.
    • 우리의 경우 vscode가 시작된 후의 시점을 activationEvent로 하였다. 처음에는 *로 하여 시작과 동시에 하려고 했는데 그러면 시작할때부터 부하를 주는거라고 생각되어 필요 없다고 생각했다. (시작 후에 몇초안에 실행된다고 해서 뭐 문제될건 없기때문에..)

https://code.visualstudio.com/api/working-with-extensions/publishing-extension
extension을 배포할땐 이 공식문서를 참고하면 참 좋을 것 같다.

Junbae Mode

https://github.com/JunbaeJs/junbae-mode

작업중이니 참고할만한 코드가 있으면 참고하면 좋을 것 같다.

0개의 댓글