Practice) Tic, Tac, Toe

 

- 학습 내용

• modal 창 구현
• backdrop
• defer
• data-col/row
• article
• DOM
• eventListener

 

 

- 회 고

 

: 'Tic, Tac, Toe'를 만드는 과정은 내게 개안이 되는 순간이었다. 생각해보면 현재 수강하는 강의를 듣기 전, html, js, css를 각각 배웠기 때문에, eventListener도 DOM도 쉽게 와닿지가 않았다. 뭔가 장벽이 있는 느낌이랄까. 하지만 이번에 Tic, Tac, Toe를 만들면서 (이런 게임이 있다는 것도 처음 알았지만) 말 그대로 개안이 된 것 같다. '이렇게 쓰는구나', '이렇게 개발하는구나'를 체감하는 순간이었다. 

게임을 만들면서 여러가지를 많이 배웠다. 생소한 것도 있었고 익숙하지 않은 것도 있었다.  첫 난관은 modal창을 통해 각 선수의 정보를 입력받고 이때 back-drop을 사용해 modal창 이외의 부분이 어두워지는 것을 구현하는 것이었다. 내가 아는, 창을 띄우는 것은 alert 밖에 모르는데... 한참 고민하다가 결국 강의를 수강하며 해결할 수 있었다😥

두번째 난관은 승자를 가려내는 것이었다. 나름 하드코딩 하지 않으려고 어떻게 하면 쉽게 승자를 가려낼 수 있을까 고민했는데, 방법이 떠오르지 않아 결국 하드코딩 했다. 강의 내용 역시, 가로/세로/대각선/무승부의 경우로 나눠 승패를 나누었다. 

내겐 다소 생소한 부분이 많았기에 이번 페이지는 사진을 보고 강사가 주는 미션을 혼자 수행하기에 다소 어려웠다.  강의를 수강하며 하나씩 만들 때 마다 느끼지만, 이론강의에는 정말 한계가 있음을 체감한다. 이론에서 놓치는 부분을 연습을 통해 하나 씩 채울 수 있어 즐겁다. 앞으로도 화이팅😁