JC story

이번에는 'Dev Ed' 유튜브에 있는 내용 중 Javascirpt Tutorial 중 하나인 Build A Mysic App With Javascript 를 진행하였습니다. 각 버튼을 누르면 사전에 저장해 놓은 소리가 나면서 간단한 jump animation 이 실행되는 예제입니다. 음이 들어간 예제를 해보니 더 재미있고 어떤 방향의 애플리케이션을 만들어 봐야겠다는 생각까지 들게 되네요! HTML HTML 구성은 매우 간단합니다. header에 h1 tag와 p tag 만 사용하여 간단하게 구성하였습니다. 그리고 각 버튼은 div를 이용하여 구성하고 div 안에 재생할 음악을 audio에 담습니다. CSS 공이 튀어 오르는 animation CSS는 @keyframes jump {}를 이용합니다. an..

독학에 재미를 느끼면서 프로그래밍 독학을 시작했습니다. 예전부터 프로그래밍 공부는 조금씩 했지만 항상 문법만 익히고 끝내고 익히고 끝내고를 반복하여 실제로 사용해보지는 못했습니다. 마치 영어 단어만 외우고 실생활에 사용하지 못하는 것과 마찬가지 었죠.. 이번에는 문법을 익힌 후 유튜브 영상들을 참고하면서 실습을 진행했습니다. 반복해서 여러 유형 실습해보면 제 것이 될 것이라는 믿음은 학창 시절 공부하면서 확인을 했고 이번에도 똑같이 적용해보고 있습니다. 실습 유튜브 영상은 'Dev Ed'라는 유투버의 재생목록에 있는 Javascript Animation Tutorials입니다. 사이트에 들어갔을 때 특정 버튼을 누르면 버튼이 변하면서 무언가 동작하거나 창이 나오거나 이러한 애니메이션을 제작하는 과정을 모..