본문 바로가기

분류 전체보기

(129)
will-change / transformation 애니메이션 흔들림 방지 CSS Keyframe animation 으로 두근두근 하트를 만들려고 하는데 하트아이콘이 매우 부들부들 떨린다. 이때 will-change 명령어를 사용함으로써 브라우저에 어떤 항목이 애니메이션 적용이 되어 변할지 알려주게 된다. will-change 명령어를 아래 예시와 같이 적용하면 다음과 같이 하트 애니메이션이 매끈하게 변하게 된다. 모든 애니메이션 적용이 이런것은 아니지만 종종 부자연스러운 움직임이 나타날때 will-change 를 사용하여 우리 브라우저가 매끈하게 작동하도록 도와줄 수 있다. @keyframes heartBeat { 0% { color: white; transform: none; } 50% { color: tomato; transform: scale(1.5); } 100% { ..
반도체란? 트랜지스터의 발명 및 역사 도체(Conductors): 전류가 아주 쉽게 통과할 수 있도록 도움을 주는 속성으로 구리, 은 , 금과 같은 물질 절연체(insulators): 전류가 흐르지 않는 도체로 고무, 플라스틱 같은 물질 저마늄(germanium)과 실리콘(silicon) 같은 원소는 반도체라 불리는데 전도체에 비해서 절반 정도 전류가 흐르기 때문이 아니라, 다양한 방법으로 전도성(conductance)이 조절될 수 있기 때문이다. 순수한 반도체의 경우 매우 안정된 원자의 형태를 가지고 있으며, 각각이 다이아몬드 형태의 결정 구조를 가지고 있고 반도체가 결정 구조를 형성하고 있을 때는 전도성이 거의 없게된다. 하지만 반도체에 특정한 불순물을 첨가하여 화합물을 만들 수 있다. 첫 번째 종류의 불순물은 원자들 간의 결합에 요구되..
07 클래스 by 코어 자바스크립트 아래 내용은 '코어 자바스크립트' 정재남 저 | 위키북스의 내용을 발췌한 것으로 자세한 내용은 해당 서적을 확인 바랍니다. 자바 스크립트 내의 클래스(CLASS)는 사용자의 니즈에 따라 ES6에서 문법에 추가되었으며 다만 ES6의 클래스에서도 일정 부분은 프로토타입을 활용하고 있기 때문에, ES5 체제 하에서 클래스를 흉내내기 위한 구현방식을 학습하는 것은 여전히 큰 의미를 지닌다. 클래스와 인스턴스의 개념 이해 클래스는 하위로 갈수록 상위 클래스의 속성을 상속하면서 더 구체적인 요건이 후가 또는 변경된다. 물론 하위 클래스가 아무리 구체화되더라도 이들은 결국 추상적인 개념일 뿐이다. 클래스의 속성을 지니는 실존하는 개체를 일컬어 인스턴스라고 한다. :어떤 조건에 부합하는 구체적인 예시 -> 조건은 클래..
CSS / box-sizing: border-box 사용, 뜻 여기 width 100px 짜리 박스가 하나 있습니다. 왼쪽에 padding 10px 만큼 공간을 주고 싶은데, width 100px는 바뀌지 않았으면 합니다. padding-left: 10px; 를 추가하여 왼쪽에 10px 공간을 줍니다. 다음과 같은 결과물을 얻게됩니다. 총 width 110px 짜리 박스가 생겨버렸네요 ? 화면 설정은 100px로 고정할 생각이었는데 이거 뭔가 잘못돌아갑니다. width 100px 박스에 padding-left: 10px; 적용시 CSS default 는 다음과 같은 작업을 수행합니다. 기존 100px 박스 사이즈를 유지 + padding 10px 추가의 명령을 수행하기 위해 총 width를 110px으로 설정하게 됩니다. 아래와 같이 box-sizing: borde..
가설 없는 탐구 / 고객은 생각보다 더 비합리적이다 기존에 발견하지 못했던 새로운 통찰을 찾아내기 위해서는 최대한 편견을 배제하려고 노력하는 것이 좋다. 어쭙잖게 알고 있는 것보다는 차라리 지식을 비워 내고 무지에서 시작하는 게 더 유용하다는 관점이다. 편견 없이 현상을 연구하는 방법이 곧 철학이다. 철학은 인간이라면 누구나 갖고 있는 호기심에서 시작되며 원점에서 재시작이 필요할 때, 철학적 질문을 던져 볼 필요가 있다. 경제학·경영학적 접근은 일견 합리적인 듯 보이지만, 고객의 행동 양식과 심리를 이해하는 도구로서는 완벽하지 않다. 전통 경제학은 '인간은 가장 경제적이고 합리적으로 결정한다'는 전제를 바탕으로 한다. 모든 인간은 최소한의 비용으로 최대의 효용을 보기 위해 꼼꼼히 계산하고 움직인다는 것이다. '어떤 사람이 신발을 사러 간다고 치자, 하나의..
06 프로토타입 by 코어 자바스크립트 아래 내용은 '코어 자바스크립트' 정재남 저 | 위키북스의 내용을 발췌한 것으로 자세한 내용은 해당 서적을 확인 바랍니다. 자바스크립트는 프로토타입 (prototype)기반 언어로 클래스 기반 언어에서는 '상속'을 사용하지만 프로토타입 기반 언어에서는 어떤 객체를 원형으로 삼고 이를 복제(참조)함으로써 상속과 비슷한 효과를 얻는다. 프로그래밍 언어의 상당수가 클래스 기반인 것에 비교하면 프로토타입은 꽤나 독특한 개념이라 할 수 있다. var instance = new Constructor(); instance 는 Constructor 앞에 new를 붙여서 새로운 객체를 만들어 낸것으로, Constructor가 해당 instance의 프로토타입이 되는 개념이다. 보통 Object.getPrototypeOf..
등차수열의 합 공식 등차 수열은 예를들어 1~100까지의 연속된 숫자를 말하며, 등차수열의 합 공식은 아래와 같다. 프로그래밍 코드에 적용시 단순하게 참조하기 위해 아래와 같이 정리해본다. Sn= 등차수열의 합 n = 수열의 개수 a = 수열 첫 항 l = 수열 마지막 항 예를 들어 1~100 합을 구하고자 한다면 다음과 같다. Sn = 100 x (1+100) / 2 = 5050 5~100까지의 합은 어떻게 구할수 있을까 ? 1부터 시작하는 숫자가 아니면, 수열의 개수를 구하는 방법은 (l - a)+1 로 구할 수 있다. n = 수열의 개수 = ( l - a ) + 1 ex) (100 - 5) + 1 = 96 Sn = 96 x (5+100) / 2 = 5040
성과급, 인센티브를 주면 열심히 일 할까 ? 기본급 80% +성과급20% 자신이 받는 월급이 이와 같다면 어떤 기분이 들까 ? 기본급 + 성과급은 노동자에게 "너는 일을 열심히 하지 않으니, 더 분발해서 일해라" 라는 무언의 압박을 주게 된다. 성과급 20% 라는 개념은 고용주와 피고용주 간의 신뢰를 해치게 되는 요인으로 작용하게 된다. 기본급 100% + 성과급 @% 는 어떤가 ? 기본급에 "일을 더 잘하면 ?" 성과급을 주겠다는 말은 얼핏 뉘앙스가 다른것 같아도 사실 그 본질은 같다. "너가 일을 더 열심히 하지 않으니 열심히 하면 월급 외에 더 돈을 주겠다" 라는 말과 같으므로 그 느낌은 동일하다. 이와 같은 방식으로 급여체계를 유지하다보면 생산성이 높아질것 같지만 그 효과는 사실 미미하다 못해 장기적으로는 오히려 생산성이 떨어지는 악영향을 ..

반응형