조금씩 천천히

주제:자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.10.31 강의자: 김민태님 ## 실행과 실행 흐름의 개념이해 문 - 값이 아닌것, 분기점을 만드는 것. 값은 바꿀수 없다. 10은 10일뿐 11이 아니다. A도 A일뿐 B가 아니다. 값자체는 바꿀수 없지만 값을 담은 상자(변수)에는 값을 넣었다 뺐다 하면서 비교한다. 마치 값이 바뀐것'처럼', 값은 상태라고 할 수 없다. 상태는 변할 수 있지만 값은 변할 수 없는 것이기 때문에. 상자(변수)가 생기면서 상태라는 것이 생김. age = age + 1; // 대입문, 값 =(문) 값(식) 제어문 / if문 - 참과 거짓이 나옴 ## 반복과 반복문 반복문 while - 원하는 상태동안. 참,거짓이 필요하다. 조건에 따라 한번도 실행 안할수도 있다..

주제: 자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.10.29 강의자: 김민태님 ## 코드의 구성요소 예약어 - 자바스크립트가 자바스크립트로서 사용되기 위해 만들어진 단어. 이미 용도가 정해져 있는 단어. 예) do, if in for, let, new, try, case, else, null, this. true, break, catch, const, false 등... 기호 - /+-*()!{}=> 등... 식별자 - 예약어가 아닌 간단한 규칙에 준수하여 개발자가 필요해서 이름을 지어 사용하는 단어 -> 식별자 작성 규칙을 잘 알아두자 ## 자바스크립트 데이터와 상태 undefined - 정의되지 않은/ 자바스크립트에만 있다 number - 숫자, Infinity라는 예약어는 무한수를 의..

인프런을 열심히 듣다가 벨로퍼트님의 리액트 초급 강의를 끝으로 잠깐 쉬었다.바쁨에 극심한 더위로 인해 퇴근하고 집에 오면 아무것도 할 수 없었다(에어컨만 있고 설치를 안해서 올 여름을 선풍기로 버텼다ㅠㅠ) 극심한 무더위에 무기력증까지 더해져 인강을 한동안 듣지 않다가 날씨가 선선해지면서 다시 인강을 듣기 시작했다 현재 듣고 있는 강의는 두개!내가 듣고싶은 코드스쿼드의 강의가 있길래 냉큼 듣고 있다 #### 정호영님의 깃과 깃헙강의 회사에서 소스트리를 사용하고 있는데 정말 커밋, 풀, 푸시, 머지, 브랜치 생성 다 할 수 있지만정확히 모른 상태에서 '일을 위해' 배운 거라 정확한 깃 사용법을 익히기 위해 듣고 있다소스트리같은 gui툴이 아닌 cli 방식으로도 사용해 보고싶지만 우선 소스트리로 익숙해 진다음..

좌우로 움직이는 뱃지 애니메이션(?)딱히 뭐라고 불러야 할지 모르겠어서 이렇게 제목을 적었다 회사에서 두가지 타입의 컨텐츠를 번갈아 가면서 보여줘야하는 페이지에 사용했던 애니메이션처음에 기획을 보고 좌절했지만 기획자님이 원하는 동작을 애프터이펙트로 만들어 보여주셔서 그나마 기획에 맞게 만들 수 있었다 css를 이용해서 만들었고 active클래스를 토글하는 방식으로 애니메이션을 줬다단점은, 두가지 타입만 보여줄 수 있다는....확장이 안되는 너무 큰 단점이 ㅠㅠ 실제 사이트에선 좌우로 한번씩 이동할 때마다 예제의 텍스트 영역에 odometer.js를 사용해서 숫자를 돌리는 애니메이션이 있고, 하단에 글이 써질 때마다 알림텍스트가 아래에서 위로 flip되는 애니메이션까지 들어있다 하지만 odometer.js..

한달전쯤 설문조사 페이지 퍼블리싱을 진행했는데,기획에선 모바일 세로모드만 적용해도 좋다고 해서 가로모드는 전혀 고려하지 않고 만들었다하지만 팀장님이 가로모드에서 화면이 깨지지 않느냐 말씀하셔서 부랴부랴 가로모드 처리 방법을 찾았다 모바일 가로 화면 css를 억지로 맞추기보다 모바일 화면을 세로로 고정시키는 방법으로 하려고 했지만 스크립트를 찾아봤지만 찾지 못했다그래서 차선으로 화면을 가로로 돌렸을 땐 다른 화면을 보여주는 방법으로 수정하기로 결정. 구글링에서 찾은 코드는 함수형태가 아닌 제이쿼리 ready 안에 들어있는 스크립트였는데, 화면 방향을 전환할 땐 적용이 되었지만 가로모드에서 새로고침을 했을 땐 스크립트 적용이 안되어 함수로 만들고 ready 함수 안에도 넣어주었다 또 모바일에서만 사용해야하니..

일하다보면 종종 사용하는 스크롤고정!! 매번 사용하지만 할 때마다 까먹는 것 같아서 정리한다 처음엔 스크롤 안에 함수가 아닌 if문을 직접 넣어서 사용했는데 새로고침을 할 경우 적용되지 않아서 함수로 만들어 스크롤상황과 최초접속(새로고침) 두가지 모두 적용되도록 만들었다 그리고 앵커태크 클릭 시 부드럽게 해당 영역으로 애니메이션 되는 것까지 함께 정리!.hash가 아니라 클릭한 a태그의 href값을 읽어서 하는 방법도 있다 12345678 $(document).on('click','#gnb a',function(event){ var targetHash = $(this).attr('href'); var headerHeight = $('header').outerHeight(); event.preventDef..