본문 바로가기

VanillaJS2

(포트폴리오)CaptureMark 제작기 -2편 (vanillaJS 컴포넌트 구현) 지난 1편에서 기획, 설계, 디자인을 빠르게 진행했고, 본격적으로 vanillaJS로 개발을 시작하였다. - 프로젝트 구성 크롬 익스텐션 개발은 chrome://extensions/ 에 들어가서 구성된 파일을 로드해주면 된다. (https://support.google.com/chrome/a/answer/2714278?hl=ko 자세한 설명은 여길 참고하면 된다.) 파일엔 전체 manifest파일, 앱 클릭시 띄워줄 popup html, background.js, 다른 진입점 파일, 아이콘 과 같은 리소스 파일을 포함해야 한다. 나의 경우엔 각 진입점 기준으로 js를 번들링 해주고 빌드파일만 업로드할 수 있게 간단히 webpack으로 빌드 폴더를 세팅했다. const path = require('path.. 2024. 2. 6.
(포트폴리오)CaptureMark 제작기 -1편 (아이디어, 기획, 설계, 디자인) 혼자서 새로운 사이드 플젝을 시작하기로 마음 먹었다. 첫번째는 아이디어 선정이 었는데, 몇가지 기준을 정했다. 1. 2주안에 혼자서 구현 가능할 것 - 평소 회사 업무도 있고, 이 이상 넘어가면 계속 집중력을 발휘하기 어려웠다. 2. vanilla js로 만들 수 있을 것 - 기본적인 js실력을 늘려야 했고, 가장 좋은게 실제로 만들어 보는거라고 생각 했다. 3. 실제 수요가 있고 사용가능한 것을 만들 것 - 실제 사용자가 쓸 수 있는 의미 있는 것을 만들고 싶었다. 여러 아이디어를 생각하다가 일단 크롬 익스텐션이 눈에 들어왔다. 크롬 브라우저 사용률이 높은 만큼 접근성도 좋고 생각보다 러닝커브가 높지 않았다. 그리고 무엇보다 브라우저의 여러 기능을 활용할 수 있기 때문에 다양한 아이디어가 나올 수 있었.. 2024. 2. 3.