슬기로운 개발자

오늘 드디어 정상등록으로 RedTimer가 게시됐다. 개발과정의 설명을 적기에는 내용이 부족해서 CSS 카테고리에 타이머 생성과 관련된 부분만 게시할 예정이다. 초기 스토리보드 작성부분과 차이가 있지만 결과적으로 깔끔하고 간단한 디자인에 초점을 둬서 만들었다. 타이머에만 눈이 갈 수 있도록 했다. 색상 부분은 빨간색을 유지하면서 눈에 띄기는 하면서 눈이 아프지 않은 색을 고르느라 고민을 했던 것 같다. 약간의 꼼수로 Youtube가 선택한 색상을 나도 사용했는데, 괜히 유투브가 그 색을 고르지 않았을 것 같아서이다. 확실히 눈도 안아프고 눈에 들어오는 RedTimer가 완성될 수 있었다.

확장 프로그램을 만들어보고 싶다고 생각해서 단순하게 html 파일로 만들어서 크롬에서 확인하고 고쳤는데 이게 잘못된 방식이라는 것을 뒤늦게 알았다. 정확하게는 잘못됐다기보다 조금 느린 방식의 접근이었다. 1. 개발자 모드에서 개발 시작하자! 확장프로그램 개발을 위해서는 각각 웹사이트에서 ://extension으로 개발자모드로 들어가서 현재 상황을 확인하면서 할 수 있다. manifest.json 프로그램으로 사이드바앱인지 등 종류만 확정지어도 브라우저 너비 등등에 대해서 불필요하게 고민할 시간을 줄일 수 있다. 2. 확장프로그램에서 필요한 API를 확인하자. 웹에서 제공하고 있는 API가 다양한 것들이 있기 때문에 미리 확인하면서 개발단에 사용하면 개발시간을 줄일 수 있고 그냥 살펴보는 재미가 있다. 3..

01. 프로젝트의 주요기능(version 0.0.1) 사용자가 원하는 1~60분 내의 타이머 기능으로 설정한대로 시간을 측정, 기록할 수 있도록 했다. 02. 상세 기능 기본 세팅 타이머 부분의 모양을 화면시작시 보이게 하고, 초기 타이머 값은 15분으로 설정한다. 타이머 세팅 1) 0~60분에 원하는 시간을 입력 또는 input 숫자타입으로 up/down이 가능하게 한다. 2) 시간 변동에 따른 타이머 동작부분 반경의 변화 (실제 줄어들 빨간색 모양) 타이머 구동 1) 시작버튼 누르면, 타이머 동작부분과 input 숫자가 감소한다. 2) 멈춤버튼 누르면, 시작버튼으로 바뀌면서 interval을 clear처리한다. 3) 재시작버튼 누르면, 시작시 저장해두었던 세팅을 기억하고 그 시간만큼 타이머가 구동된다..

0. 왜 확장프로그램인가? 이전부터 만들어보고 싶기도 했고 이상하게도 내가 원하는 타이머가 확장프로그램으로 개발이 되지 않아서 만들어보고 싶었다. 돈주고 타이머를 구매할까 하다가 괜히 비주얼적인 요소가 부가된 타이머를 산다는 것이 돈이 아깝기도 했다. 어플은 있는데 왜 확장프로그램은 없는지 모르겠다. 아마 돈이 되지 않아서 그런 것 같다. 프로젝트 개발 의도는 어차피 돈이 아니므로! 타이머 체커가 필요한 나에게 필요한 기능을 만드는 것이 목표이다. 1. 개발환경 프론트 언어나 프로그램을 전문으로 배우지 않아서 백엔드까지 연결하는 프로젝트로 만드는 것이 목표이다. 그래서 일단 Intellij에서 Springboot gradle, Java 기반으로 JS, CSS, HTML을 사용했다. 욕심같아서 다른 언어나..