개요 x-mouse 의 기능을 활용하여 가상 데스크탑을 좀더 편리하게 활용해보자. - x-mouse 다운로드: https://www.highrez.co.uk/downloads/xmousebuttoncontrol.htm windows 10 가상 데스크탑 가상 데스크탑이란, 마치 여러대의 컴퓨터 화면을 오가듯 할 수 있는 것을 말한다. prefix key 는 CTRL +WIN 이라고 보면 될 듯 하다. 대부분의 경우 CTRL +WIN 키를 먼저 누르고 특정 키를 눌러 가상 데스크탑 명령을 실행한다. 대표적인 단축키는 다음과 같다. CTRL + WIN + D 새로운 가상 데스크탑 생성 CTRL + WIN + LEFT / RIGHT 가상 데스크탑 사이를 이동하기 CTRL + WIN + F4 가상 데스크답 닫기 ..
개요 체크박스들이 있는데, 하나를 클릭하고, 쉬프트를 누른 채 나머지 하나를 클릭하면, 마지막으로 클릭했던 체크박스와 지금 쉬프트를 누른채 클릭한 체크박스 사이의 모든 체크박스가 체크 되도록 한다. index-START.html 오랜만에 .css 와 div 레이아웃을 둘러보자. 1) 전체 div 는 inbox class 이다. - max-width: 전체 폭이 450 px - margin: 상하좌우중에서 위쪽만 50px, 나머지는 자동설정 - box-shadow: 그림자의 x, y offset 과 blur (클 수록 블러커짐), 그리고 rgba 값 2) 각각의 체크박스 리스트는 .item 이다. 3) input:checked+p - input:checked 바로 뒤에 오는 p 이다. - 완료되었다는 느낌..
개요 console 의 다양한 함수를 써보자. 해보니깐 신기하고 재미나다. Breakpoint 사용해보자 1) 만약 버튼을 만들어 두었다면, Element 탭에서 해당 코드를 우클릭하여 2) Break on >> attribute modification 을 설정해두면 3) 실제로 해당 를 클릭하였더니 breakpoint 가 먹힌다. console.log 사용법 1) console.clear() 를 사용하면 그 이전의 출력이 다 지워진다. 2) console.log() 는 일반적 출력 3) formatting 을 하는 두 방법, `` 와 ${} 를 사용하는 방법 추천 4) %c 를 이용해 style 을 넣어줄 수 있다. 5) warning, error, info 등을 먹일 수 있다. - 나중에 이걸로 필터..
개요 HTML5 Canvas 기능 맛보기 내용 #draw 의 # 은 뭘까 - id 일때에는 # 을 쓰자. 1) hsl 알아보기 - Hue, Saturation, Lightness 이다. - Hue 는 0 to 360 까지의 색깔이다. 빨간색 0, 초록색 120, 파란색 240 이다. - Saturation 은 0%는 그레이, 100% 는 Full color 이다. - Lightness 는 0%는 검정, 100%는 흰색이다. 2) beginPath() 함수 - 새로운 경로를 만든다. - 이후로 이렇게 새로 생성된 경로에 다양한 명령으로 구성하고 만들게 된다. EventListener() 4개 - 마우스가 눌려진 경우에만 그려질 수 있도록 해준다. - 처음 시작할때의 좌표를 눌려진 순간의 좌표로 해준다. -..
개요 Array 관련해서 몇몇 함수들을 더 들여다 보자 이번 편은 매우 짧다. 내용 첫 번째로 가지고 놀 배열 배열의 some() 함수에 파라미터로 함수를 넣어주는데 - 배열 원소를 파라미터로 받아서, 참 / 거짓을 리턴하는 함수이다. - some() 함수는 파라미터로 들어온 함수가 하나라도 true 를 리턴하면 true 를 리턴 배열의 every() 함수에 파라미터로 함수를 넣어주는데 - 배열 원소를 파라미터로 받아서, 참 / 거짓을 리턴하는 함수이다. - every() 함수는 파라미터로 들어온 함수가 하나라도 false 를 리턴하면 false 를 리턴 두 번째로 가지고 놀 배열 배열의 find() 함수에 파라미터로 함수를 넣어주는데 - 배열 원소를 파라미터로 받아서, 참 / 거짓을 리턴하는 함수이다...
개요 특정 단어를 포함하는 도시명, 주명을 아래에 리스트로 보여준다. style.css z-index - 정수값이며 (= 음수, 0, 양수) - 여럿을 겹치게 놓을 수 있으며 - 클 수록 앞에 놓이게 된다. → 소스에서는 여기에만 쓰이며, 다른 녀석들보다는 항상 위에 두겠다는 것이다. 검색된 값이 아코디언처럼 보이게 해주는 부분이다. 1) even, odd 로 표현할 수 있는 것이 재미있다. - 자연어에 점점 가까워지는 프로그래밍 언어이다. 2) 각도를 각각 3, -3씩 돌리고, 그에 따라 비어지는 공백을 y 좌표를 조금 내리면서 해결한게 아닐까 싶다. scale 역시 좀더 자연스럽게 보이게 값을 넣어가면서 조절한 것일듯 → 실제 값을 변화시켜가며 확인해보면 될듯 하다. 1) 아무것도 안먹였을때 2) r..
개요 2주차 정리를 바탕으로, 4주차 즈음의 정리를 해봄. 결혼 이후엔 나 자신에게 투자할 시간이 부족해지고, 일상의 스트레스는 먹는 것에 대한 심리적 제한을 풀어버려서 해결한지 오래되었다. - 과식, 과음은 아니지만, 입이 궁금하면 다양한 간식을 챙겨먹고, 면식, 탄산, 야식, 음주를 절제하지 않았다. 몸무게는 최고점을 찍었고, 현 상황에서의 해법을 고민해왔다. - 운동은 몇 달 전부터 하루 만 보 걷기와, 직장 계단 2번 오르기 (= 총 40 층) 를 해왔고, - 식이요법으로 반식 다이어트, 그리고 간헐적 단식을 시도해보게 되었다. - 계기가 된 후기 링크: https://www.clien.net/service/board/use/12944105 - 책 링크: http://aladin.kr/p/hhaG..
개요 flex 를 활용하여 panel 들이 click 에 멋지게 반응하게 해보자. - flex 에 대하여 참고 링크: https://css-tricks.com/snippets/css/a-guide-to-flexbox/ index-START.html 참고 링크: https://goo.gl/QcRIEX 1) :before, :after - 특정한 것의 앞과 뒤에 이것을 적용한다는 것. - 그런데 * 모든 것이라니 무슨 의미인지 헷갈린다. 2) inherit: 부모의 값을 상속받는다. Selector 참고링크: https://goo.gl/aYHKVb .panel > * .panel 의 직계 자식인 "모든" element 를 선택 .panel p .panel 의 자식인 p element 를 선택 nth-chil..
Array 가지고 이런저런 장난을 쳐보자 inventors 오브젝트 배열을 가지고 놀아보자 1) first, last, year, passed 값을 가지고 있는 구조체가 있고, 2) 그 구조체들로 이루어진 배열이 있다. 이걸로 장난을 쳐보자 Array.prototype.filter() Filter the list of inventors for those who were born in the 1500's → 1500 년대에 태어난 inventor 를 추려내보자 filter() 는 먹여주는 함수가 true 를 return 하는 경우만 추가해서 회신한다. 1) 익명함수로 리턴값이 true 인 경우만 filtering 해서 회신해준다. 2) 화살표 함수로 좀더 간결하게 표현 가능. 하지만 아직은 좀 낯선 방식이..
- Total
- Today
- Yesterday
- Bug
- golang
- Shortcut
- 영화
- go
- 명상
- OpenAI
- Gin
- solid
- 클린 애자일
- pool
- 2023
- API
- postgres
- folklore
- notion
- websocket
- 체호프
- 노션
- agile
- ChatGPT
- strange
- 중용
- intellij
- 인텔리제이
- 독서후기
- ORM
- bun
- github
- 잡학툰
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |