ASH_Blog 전체보기
-
Test카테고리 없음 2024. 10. 29. 15:49
안드로이드폰에서 안전 영역(노치 영역)을 구하는 방법을 정리해볼게. 1.안드로이드 기기 확인 먼저, JavaScript로 사용자가 안드로이드 기기를 사용하는지 확인할 수 있어. const isAndroid = /Android/i.test(navigator.userAgent); 2.안전 영역 계산 안드로이드 기기라면 window.visualViewport API를 사용해 뷰포트의 위치를 감지하여 노치나 안전 영역을 계산할 수 있어. 아래 코드는 visualViewport API를 사용하여 각 방향(top, right, bottom, left)의 안전 영역을 계산해. function getSafeAreaInsets() { const insets = { top: 0, right: 0, bottom: 0, le..
-
책 - "빅데이터 부동산 투자 2022-2023 대전망" 읽고Book/빅데이터 부동산 투자 2022-2023 대전망 2022. 5. 14. 15:41
내 나이 39에 처음으로 부동산 책을 구입 했다. 이 책을 구입하게 된 계기는 아래와 같다.(구입 동기가 궁금 하지 않으면 넘어 가셔도 됩니다.) 구입 동기 여태 까지 부동산에 관심이 없다가 2020년부터 부동산 열풍이 불었을 때 난 준비가 되어 있지 않았다. 그래서 부동산 열풍에 동참 하지 못하였는대, 부동산 구입을 하지 못한 지금 다행힌지 불행힌지는 모르겠지만, 아무튼 작년 부터 내 유트브 메인에 리치고 김기원 대표님의 빅데이터 부동산 영상이 올라 왔다. 그래서 한번 보게 되었고 데이터에 근거하여 현재 부동산의 고평가를 주장 하셨고, 작년에 빅데이터를 근거로 주장 하셧던 내용들이 해가 바뀐 지금 돌이켜 보면 거의 다 일치 했다. 모두가 " Yes"라고 말 할때 "No" 라고 말 할 수 있는 소신~!!..
-
맥북 에어 (MacBook Air) 골드 언박싱 및 사용 후기Vlog 2022. 5. 9. 21:27
장비를 지참 하고 프로젝트를 투입을 하게 되어서 주말에 사용 할 노트북이 필요했다. 주로 카페에서 노트북을 사용하기 때문에 가벼운거를 원해서 MS 서피스 랩탑 하고 맥북air 중에 고민하다가 맥북 air는 생각 해보니간 학생 할인을 받을 수 있어서 맥북air 로 선택 했다. 코딩 용도로만 사용 할거면 램 8g 도 무난 하다고 해서 아래의 사양으로 대학생 할인 받아서 116만원에 구입함. Apple M1 칩(8코어 CPU, 7코어 GPU, 16코어 Neural Engine), 8GB 통합 메모리, 256GB SSD 저장 장치https://www.apple.com/kr/shop/buy-mac/macbook-air 13형 MacBook Air 구입하기 새 MacBook Air를 무료로 배송받으세요. 기본 모델..
-
책 - css 시크릿Book 2020. 11. 13. 15:16
리아 베루 지음 / 이시내 올김/ 프리렉 올해 여름에 이 책을 사서 이제서야 보고 있는데, 챕터 2까지 보다가 모르고 있던것들이 너무 많아서, 많은 팁들을 알게되어서 책을 산 보람을 느낌. 다른 사람들도 혹시나 이 책에 내용들을 모르고 있었다면 알면 좋을 것 같다. 이 책을 보면 잘 사용하지 않았던, 모르고 있었던 css3 속성과 이 속성에 대한 사용법 및 팁을 얻을 수 있고, 이 책에 머리 말에 "DRY 하고 유지보수 가능하고 유동적이고 가볍게 표준을 준수하는 생산적인 팁을 얻을 수 있다." 라고 나오는데, 정말 이다, 잠깐 읽었는데, 새로운 팁들을 너무 많이 알았다. 이 책을 보면서 알게된 것들은 조금씩 블로그에 포스팅을 하면서 정리를 할가.... 생각중이다.
-
[css] display: grid - 05. track-list 에 대해서html, css/css-display속성들 정리 2020. 8. 2. 16:09
[css] grid 로 리스트 배열하기. 1. 리스트들의 부모 Element 를 Grid Container로 만든다. 2. 몇 행 몇 열을 만들건지 정의 합니다. 가. grid-template-columns /rows 를 사용한다. 가-1. grid-template-columns 속성 값은 Track-list 인데 Track-list에 대해서 알아야 사용 할 수 있습니다. (이게 맞는 표현인지는 모르겠습니다. 혹시 표현이 잘 못 되었다면 정정 코멘트 부탁 드립니다.) 지난 포스팅에 이어서 Track-list에 대해서 마무리를 하겠습니다. w3g.org 사이트의 설명을 이해하기에는 어려운것 같아서 css-tricks.com 여기 사이트의 내용을 정리를 해보려고 합니다. css-tricks.com 에서 아래..
-
display: grid - 04. Grid Tracks / Cells /track-list 용어 정리, grid-template-columns /rows 사용법에 대해서html, css/css-display속성들 정리 2020. 7. 18. 11:12
지난 포스팅에 이어서 css display:Grid로 리스트 배열 하는 법에 대해서 포스팅을 하겠습니다. 1. 리스트들의 부모 Element 를 Grid Container로 만든다. 2. 몇 행 몇 열을 만들건지 정의 합니다. 몇 행 몇 열을 만들려면 grid-template-columns 와 grid-template-rows 속성을 사용 해야 됩니다. grid-template-columns 와 grid-template-rows 를 사용 해보겠습니다. https://www.w3.org/TR/css-grid-1/#grid-track-concept 에서 사용법을 확인 하면 아래의 이미지처럼 나오는데 빨간 박스 영역들의 용어들이 생소해서 이 부분들 부터 포스팅을 하려고 합니다. 먼저 trak-list 가 나오..
-
[css] display: grid - 03. grid로 리스트 배열 하기( Grid Container)html, css/css-display속성들 정리 2020. 7. 4. 10:12
이제 Grid 속성에 대해서 어느정도 알았으니 Grid드를 사용하여 리스트 들을 배열을 해보는 포스팅을 해 보겠습니다. 먼저 MDN 과 w3schools 에서 설명하는 내용을 종합하여 정리를 하였습니다. 리스트를 Grid를 사용하여 배열 하기 위해서는 다음의 순서로 진행 합니다. 1. 리스트들의 부모 Element 를 Grid Container로 만든다. 먼저 리스트를 배열 하려면 리스트를 감싸고 있는 부모 Element에 display: gird를 적용하여 부모 요소를 Grid Container로 만듭니다. Grid Container는 grid 레이아웃을 사용 할때 display:grid를 적용하는 대상을 부르는 명칭으로 이해 하면 될 것 같은데요, 왜 이름이 Grid Container라고 물어보면 저..