Bleeding edge

프로젝트를 시작하게 된 계기 처음 이 프로젝트를 시작하게 된 계기는 “윈도우에 있는 스티커 메모에 투명한 기능이 있었으면 좋겠다. “라고 생각하고 short-cut-marker 라는 이름으로 프로젝트를 시작하였다. 만들고 사용해 보니, 메모장 자체는 글자 크기가 고정되어 있어서 강조된 부분이 없어서 보기 불편했다. 또 메모장에 저장된 것은 핸드폰으로 확인할 수 없어서 아쉬웠다. 개선책 augmentedDevice 상단에 고정되고 투명도를 조절할 수 있는 브라우저를 만들고, 그 브라우저에서 노션이나 블로그를 이용하면 내가 원하는 메모에 하이라이트를 적용할 수 있고, 영상을 보면서 코딩할 일이 있을 때, 유튜브를 켜두고 작업하면 편할 것 같다는 생각이 들었다. electron을 선택한 이유 프론트엔드 개발자..

프로젝트를 시작하게 된 계기 처음 이 프로젝트를 시작하게 된 계기는 백준 온라인 저지 사이트에서 오답이 나왔을 때, 문제를 다시 읽으려면 다시 문제 페이지로 이동하는 것이 불편하다는 점에서 시작됐다. 페이지 이동을 줄여주기 위해서 문제 제출 페이지에서 문제도 볼 수 있게 만들기로 했다. 크롬 익스텐션을 선택한 이유 내가 직접 사이트를 수정할 권한이 없기에 이 문제를 해결하기 위해서는 브라우저의 익스텐션을 개발하기로 했다. 브라우저의 익스텐션은 사람들이 가장 많이 이용하는 크롬을 기준으로 만들기로 했다. 다행히도 크롬 익스텐션은 js를 이용하여 구현할 수 있었다. 처음에 만들기로 한 문제 제출 페이지에서 문제를 볼 수 있게 만드는 것은 local-storage를 이용하여 만들었기에 빠르게 만들었다. 새로운..

아마 요번주 중으로 조사를 할거 같은데, webAr이 1. 특정한 객체가 특정한 위치에 설치된다 2. 다른 사람 카메라에도 동일한 각도(예를들면 내가 좌측에서보면 다른사람이 그 객체 건너편에 있다고 하면 그 반대의 각도로) 보인다. 이 두가지가 성립이 된다고 하면, web Ar을 통한 간단한 사이드 프로젝트를 진행할 꺼 같다. 만들고 싶다고 생각한건 아마 20대 중반쯤이었던거 같은데, 소스를 구한거같으니 이제 요리를 한번해봐야겠다! 아마 필요한 3d 같은경우 굳이 내가 블렌더나 이런걸 사용해서 만들지말고 시간은 돈이라고, 3d 스킨을 파는 곳에서 사는 방향으로 진행할 것 같다. 일단은 샘플을 무료로 구해서 진행하는 것도 괜찮아보인다.

흐 지금까지 구현한 것은 1. 맨 앞에 Float 시키기 2. 저장된 txt파일 읽기 3. txt 자동 저장하기 4. input type range 를 이용하여 화면의 밝기 조절하기 이렇게 4가지 기능을 구현했다. 지금부터 구현하고 싶은 기능은... 1. 프로그램을 켰을 때, 임시 저장소에 저장된 파일을 자동으로 켜지게하기 2. 새창 띄우기 (새로운 메모장) 3. (할지안할지 안정함) 색 바꾸기 4. 파일이 아닌 링크 켜기. 4 번같은경우 다른 곳에서 만든게 있기 때문에 굳이 안만들 수도 있다. 우선 1,2를 storage를 이용하여 구현할 계획이다!

쨔잔! electron으로 shortcut key marker을 만들기 프로젝트를 오늘부터 시작하였다! 우선 electron의 기본 앱설치를 하기 위해서 git clone https://github.com/electron/electron-quick-start 를 설치하였다! SKM의 목표 이자 계획 1. 배경을 투명색으로 2. 화면을 맨위로 fixed 3. TODO list 처럼 단축키 입력하기 4. 그 키를 누르면 단축키부분이 focus처럼 반짝이기 + 고민 5. background에 유튜브재생(?)

내가 종종 쓸때마다 json을 업데이트를 하면 자주 쓰는 웹폰트나, 그림자와 깃 컨벤션 기능을 넣은 FFF를 만들었다. 처음에는 그냥 단순히 HTML을 만들다가 너무 HTML파일이 길어져서 컴포넌트화 시키기도 했고, 잘안쓰는 컬러를 날리기도 하였다. 아마 추가적으로 더 넣고 싶은 것이 있다면 종종 업데이트를 할꺼같다. 다음 프로젝트로 보고있는것은 electron으로 만드는 shortcut key viewer? 일꺼같다. 프로그램이나 맥북같은걸 최근에 이용하면서 느낀건, background fixed된 프로그램으로 내가 보고 싶은 단축키를 계속 볼 수 있게 하면 편할꺼 같다는 생각이 들어서이다. 내일 또 일렉트론으로 셋을 하다보면 시간이 후딱갈꺼같은 느낌이든다

1. Shadow 파레트를 넣었다. 이제 json파일에 그림자만 넣으면 원하는 값을 넣을 수 있다. 이제 새로운 그림자를 찾을 때마다 하나씩 넣어야겠다 2. 오픈 소스 폰트를 써볼 수 있는 페이지와 링크를 넣을까라는 생각이 들었다.

깃헙컨벤션을 만들어서 사용하다보니.. 내가 쓸꺼같은 기능을 넣다보니 좀 더 개편해야겠다 라는 생각이 들었다. 1. index.html에만 계속 편집을 하다보니, 페이지가 너무 복잡해졌다. 왜 CBD(component based dev)인 프레임워크들이 사용되는지 느낄 수 있었다. 2. 어차피 자주 쓸꺼면, 내가 좋아하는 디자인을 살짝 넣는게 좋을꺼같아서 기본배경을 흰색에 검정 글씨만 넣을게 아니라, 아주 옅은 grey배경에 흰색 content를 넣었다 3. javascript에 한 continer에 여러번을 render하면 지속적으로 초기화가 되기때문에 div를 분리하고 그 안에서 따로 render을 진행했다. 4. index.html에 모든 페이지를 넣다보니 페이지를 분류하는게 낫다는 판단이 들었다 -..

https://codevilot.github.io/FFF/ For Frontend Favorites codevilot.github.io 만들어둔 깃컨벤션 때문에 너무 편하다.. 후.. 깃 컨벤션을 FFF에 만들어두고 사용하고 있는데 깃 컨벤션을 사용하니 확실히, 장점이 몇개 있었다 1. 푸시 네임을 고민할 필요가 없다 2. 일관성 있게 되기때문에 어떤걸 수정했는지 한눈에 보기 좋다. 그리고 이제는, 공식 docs에 올라온 내용을 보고 만들다보니, 검색 결과가 나오지 않더라도 잘 만들 수 있는 것 같다. 요즘 모던 자바스크립트책과, 면접을 위한 cs 노트를 보고 있는데, 확실히 이 책에서 나오는 개념이 바로는 이해가 안되지만 반복적으로 읽다보니, 다른 기능을 사용할 때 이해도가 늘고 있다는 것이 느껴진다...