[JavaScript30] 05 - Flex Panel Gallery
·
스터디/JavaScript30
소스 코드 JavaScript30/05 - Flex Panel Gallery/index-START.html at master · jisunipark/JavaScript3030 Day Vanilla JS Challenge. Contribute to jisunipark/JavaScript30 development by creating an account on GitHub.github.com Today I Learnedtransition 활용패널을 클릭 시 위 아래에서 글자가 나타나게 하는 트랜지션이다. 패널 요소 클릭 시 open-active 클래스가 토글되도록 했고, 디폴트 상태에서는 transform 속성의 값으로 translateY(+/-100%)를 주어 해당하는 요소를 숨겨두었다가 open-activ..
[JavaScript30] 04 - Array Cardio Day 1
·
스터디/JavaScript30
소스 코드 JavaScript30/04 - Array Cardio Day 1/index-START.html at master · jisunipark/JavaScript3030 Day Vanilla JS Challenge. Contribute to jisunipark/JavaScript30 development by creating an account on GitHub.github.com Today I LearnedArray.prototype.reduce()reduce 메서드는 사용할 때마다 사용법이 헷갈리는데 이번 기회에 확실히 알아두게 되었다. reduce 메서드는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환한다. 콜백 함수의 첫 번째 인수로 accumu..
[JavaScript30] 03 - CSS Variables
·
스터디/JavaScript30
소스 코드 JavaScript30/03 - CSS Variables/index-START.html at master · jisunipark/JavaScript3030 Day Vanilla JS Challenge. Contribute to jisunipark/JavaScript30 development by creating an account on GitHub.github.com Today I LearnedDocument.documentElementDocument.documentElement 읽기 전용 속성은 문서의 루트 요소를 나타내는 Element를 반환한다. HTML 문서를 예로 들면  요소를 반환한다.function handleUpdate() { const suffix = this.dataset...
[JavaScript30] 02 - JS and CSS Clock
·
스터디/JavaScript30
소스 코드 JavaScript30/02 - JS and CSS Clock/index-START.html at master · jisunipark/JavaScript3030 Day Vanilla JS Challenge. Contribute to jisunipark/JavaScript30 development by creating an account on GitHub.github.com Today I LearnedDate객체와 setInterval 함께 사용하기Date 객체와 setInterval 메서드 각각에 대해서는 이해하고 있었지만, setInterval의 첫 번째 인수로 전달하는 콜백 함수 내에서 Date객체를 적절히 활용하면 이렇게 시계 인터페이스도 구현해볼 수 있다니 흥미롭다. const seco..
[JavaScript30] 01 - JavaScript Drum Kit
·
스터디/JavaScript30
소스 코드 JavaScript30/01 - JavaScript Drum Kit at master · jisunipark/JavaScript3030 Day Vanilla JS Challenge. Contribute to jisunipark/JavaScript30 development by creating an account on GitHub.github.com Today I Learnedaudio.currentTime = 0function playSound(e) { const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`); const key = document.querySelector(`.key[data-key="${e.keyCode..
함께 자라기: 애자일로 가는 길
·
스터디/독서 스터디
이전 팀 멘토님께서 한번 언급하셨던 책이라 읽어보고 싶었다. 검색해 보니 초록색의 표지가 예뻐서 바로 겟 ㅎㅎ 독서 스터디 때 읽어야겠다 하고 주문했다.읽으면서 개인적으로 정리해둔 노트는 여기에. Quotes and Thoughts1.새로운 정보를 얻었다면 1년 후에 크고 완벽한 실험을 하려고 준비하기보다는 1달, 혹은 1주 후에 작게라도 실험해 보는 것이 좋다. - p. 40나는 게으른 완벽주의자 성향이 좀 있다. 무언가 '해보고 싶다!' 하는 생각이 들어도 기왕 할 거면 준비가 되었을 때, 좀 더 제대로 하고 싶어서 그때를 기다린다. 하지만 '그때'는 잘 오지 않는다. 속으로 정해놓은 '그때'는 절대적인 시점이 아니라 항상 상대적인 시점이라 그렇다. 내가 지금보다 나을 '그때'.사실 때를 기다리려 했..