728x90 반응형 javascript8 screen.height로 모바일 웹뷰 단말 창크기 구하기 #2159 요구사항은 다음과 같았다. 화면이 작은 단말에서 메뉴를 하나라도 더 보여주기 위해 스크롤 시 상단 일정 영역을 올렸다 내렸다 하는 UI였다. 해당 요구에 대한 구현은 다음과 같은 코드로 해결을 했었다. 이걸 해결한 것 까지는 좋았는데 실제로 개발에 적용하면서부터 문제가 생기기 시작했다. 모바일 대응에 Portrait만 신경쓰면 되었기에 혹시 모를 스크롤 영역에 대한 대비책으로 단말 크기를 체크해서 고정시켜두려고 했었다. 스크롤 영역이 단말기 크기마다 상이한 관계로 가변인 만큼 영향도가 없는 상단 고정 영역에 대한 높이 값을 가지고 있어야 조절이 가능해서 스크립트는 필수적으로 적용시켜야 했다. 윈도 창 높이 값을 가장 쉽게 구하는 방법은 jQuery를 사용하여 height를 구하는 방법이겠지만 .. 2021. 10. 31. Object.assign(), Spread Operator #2114 자바스크립트를 공부 중이다. 그동안 눈에 잘 들어오지도 머리에 남지도 않았었는데 어떤 형태로든 아웃풋을 남기는 것이 기억에도 남고 좋을 것 같아 공부의 흔적을 남기려는 것이 목적이다. Object 이번에 공부한 내용은 객체에 대한 내용이었다. 어디에 사용하는 게 좋을지는 현시점에선 잘 모르겠고 착각일 수도 있지만 방법은 약간 이해가 된 것 같다. See the Pen 20210130_01 by minamiland (@minamiland) on CodePen. 기본적으로 객체는 복사하면 똑같다 [1] obj1에서 사용되는 객체가 있고, [2] obj2에 obj1을 대입하면 둘 다 동일한 값을 가지게 된다 [3]. 이때 [4] obj2에 다른 속성을 부여하면 간단히 생각하면 obj2 만 바뀔 것 .. 2021. 2. 1. 혼자 공부하는 자바스크립트 #2102 혼공(혼자 공부하는) 시리즈 우선 혼공 시리즈는 책의 판형이 큰 것을 알 수 있다. 혼자 공부하기 좋은 책이라는 콘셉트로 되어 있고 가지고 다니면서 보는 크기는 아닌 것 같다. 판형이 큰 만큼 자간과 행간 등에 여유가 있어서 페이지를 보는 동안 지루함이 적은 것을 느낄 수 있었다. 혼자 공부하는 자바스크립트는 초보나 입문자용 근래의 자바스크립트(ES)가 5에서 6으로 올라가면서 var 사용을 가능한 자제하고 조금 더 논리적인 개발이 가능하도록 상황에 따라 const나let을 사용하도록 권유하고 있는데 혼자 공부하는 자바스크립트에서는 ES6를 기준으로 입문자에게 교육을 시켜준다. 앞서 말했듯이 전체적으로 큰 판형을 활용하여 한 페이지에서 다루는 정보의 양을 조절하고 있기 때문에 페이지 수도 그만.. 2021. 1. 6. 자바스크립트 코딩의 기술: 똑똑하게 코딩하는 법 감상 소감 #2031 코딩의 기술 몇 권의 자바스크립트 책을 읽었지만 개념적인 부분이 항상 모자라고 예제를 따라 해도 그때뿐인 경우가 많습니다. 실제 자바스크립트 코딩을 하는 데 있어 ES6를 똑똑하게 코딩할 수 있다고 합니다. 열심히 읽어 봐야겠죠? 저에겐 똑똑하게 코딩하는 방법이 필요합니다. 좋은 방법을 접할 수 있기를 기대합니다. 책의 구성 변수 할당으로 의도를 표현하라 배열로 데이터 컬렉션을 관리하라 특수한 컬렉션을 이용해 코드 명료성을 극대화하라 조건문을 깔끔하게 작성하라 반복문을 단순하게 만들어라 매개변수와 return 문을 정리하라 유연한 함수를 만들어라 클래스로 인터페이스를 간결하게 유지하라 외부 데이터에 접근하라 컴포넌트 아키텍처를 이용해 관련 파일을 모아라 책은 이상의 10가지 주제로 나누어져 있.. 2020. 4. 2. 초보자를 위한 JavaScript 200제 감상후기 #1923B15 초보자를 위한 JavaScript 200제는 네이티브 자바스크립트라고도 불리는 ES6(ecmascript 6)에 대해 200개의 항목을 입문, 초급, 중급, 활용으로 분류하여 설명해 주는 초보자를 대상으로 하는 책입니다. 경험상 지금까지 사들였던 다른 자바스크립트 서적들이 모두 앞단만 읽힌 채 책꽂이에 있는 상황에서 새로운 마음가짐으로 임할 수 있는 한권을 추가시킬 기회가 생겼습니다. 몇 년간 퍼블리셔로 일을 해오다 보니 자연스럽게 스크립트 언어를 접하는 기회가 많고 조금씩이지만 간단한 팝업이나 UI 요소들은 jQuery를 사용해서 코딩하고 있습니다. 스크립트 쪽 언어는 처음부터 jQuery에 익숙해져 있었기에 몇 가지 단순한 작업 이외에는 ES6로 작성하는 건 힘든 실정입니다. 시장이 .. 2019. 4. 27. Vue를 익히고 싶은 입문자라면, Vue.js 이정도는 알아야지 B18.017Vue.js는 특히 View 부분, 즉 화면용 작업에 특화된 프레임워크로 React와 Angular의 경우는 뭔가 접근하기에 너무 덩치가 큰 느낌이라 엄두가 나지 않았다. 후발 주자이지만 최근 트랜드를 봤을 때 확실히 꽤 많은 관심을 받고 있는 것 같다.Vue.js의 경우는 프론트엔드 프레임워크중에서 학습비용이 적게 들고 한글 가이드가 충실하게 잘 이루어져 있다고 해서 내심 기대를 하며 접근하기 시작했지만, 온라인의 공식 문서를 읽어 보고 따라 하기엔 약간 난해한 부분이 있었는데 책을 읽으면서 정리가 되는 부분이 꽤 있었다.개인적인 감각으로 보면 공식 문서가 어느 정도 스크립트 등에 대한 이해도가 있는 사람들을 대상으로 하고 있다면, 책은 어떤 식으로 동작하며 어떤 것들이 가능한지 공식 문서.. 2018. 4. 28. RWD의 메뉴를 지원하는 스크립트 - menu-breaker.js RWD의 대응이 가능하며 트리메뉴 구조도 지원하는 menu-breaker.js RWD를 지원하는 만큼, 당연히 데스크탑이나 모바일을 지원합니다.Github페이지는 이쪽 > https://github.com/JB1905/menu-breaker.js샘플 페이지는 이쪽 > https://jb1905.github.io/menu-breaker.js 2018. 4. 24. 초보자의 눈위치를 고려한 착한 입문서. 처음 만나는 자바스크립트를 읽었다 #18.009초보자를 위한 JavaScript 서적.초보자, 입문자에게 개인적으로 추천할만한 책이라는 느낌이 들었다. 용어가 생소해서 잘 잡히지 않던 개념을 이해하는데 많은 도움을 받을 수 있었다. 분명히 어디선가 보고 많이 들었고 내손으로 타이핑을 해보면서 접했던 부분인데도 잘 기억에 남지 않는 명칭이 이 책을 보면서 쉽게 다가왔다. 아직도 이해를 다 하려면 멀었지만..console은 'test'를 log해라. 어째서 지금까지 이 간단하다고 느껴지는 것들인데 머릿속에 들어오질 않고 있었을까..지금 돌이켜 보면 메서드, 매개변수, 프로퍼티 같은 단어가 단순한 것을 어렵게 만드는 주요 원인은 아니었을까 추측해 볼 뿐이다. 아직도 100% 정확하게 이해를 한것은 아니지만 뭔가 끈의 끄트머리를 잡은 느낌이다... 2018. 2. 19. 이전 1 다음 728x90 반응형
