놀러와요 버그의 숲

// 10강 타입스크립트로 HTML 변경과 조작할때 주의점 // 잘 찾으면 html object 자료가 남고 // 요소를 예를들어 못찾으면 null이 남기 때문에 // union type으로 설정해주어야 함 let title = document.querySelector("#title"); if (title != null) { title.innerHTML = " 반가워요"; } // HTML 조작시 narrowing 방법 5가지 // 1. instanceof연산자 => 가장 많이 쓰게 될 확률 높음 if (title instanceof Element) { title.innerHTML = "반가워요"; } // 2. as로 사기치기 // as는 타입 assertion으로 , Element 타입으로 사기쳐주세..

자바스크립트의 가장 중요한 역할 중 하나는 HTML 문서를 조작하는 것이다. 그래 그건 알겠어. 그런데 정확히 어떻게 조작해? 이것에 대해서 의문점을 가져본적이 없다. 그냥 태그 써서 요소를 불러왔지. (이 글은 계속 업데이트 될 예정이니 내용이 빈약하더라도..걱정 말아라) MDN 문서를 살펴보니, 어떻게 조작하는지를 알려면 DOM의 개념을 이해해야 한다고 한다. 한번 살펴보자. Introduction to the DOM The Document Object Model (DOM) is the data representation of the objects that comprise the structure and content of a document on the web. -> DOM 일단 그자체에서 유추해보..

뭐가 이리 많을까? 아 그리고 너무 이론만 배우는 느낌이라 빨리 클론을 해보고 싶다. 약간 실전에서 적용하구 싶은데 이것저것 다양한 키워드만 배우는 느낌이라 솔직히 학습하기 조금 부담스럽다. 재미도 좀 떨어지고. 그래도 잘 견뎌보자. 지금 팥빙수 먹으면서 개발일지 쓰고있다. 이 슈퍼에서 파는 팥빙수 아는가? 나 훈련소있을때 먹고 처음이다. 훈련소에서 진짜 맛잇게 먹었는뎈ㅋㅋㅋ 설빙 저리가라였다. 오늘 배운 내용 1. position -> 위치를 움직일때나 고정시킬 때 사용 ex) div {position fixed;} -> 이거하면 스크롤 내려도 계속 상자가 보인다. 굉장히 유용하다고 생각한다. 왜냐하면 스크롤 내려도 계속 유지하게끔 하고 싶을 때가 있으니까 움직이게 만들 수도 있다. ex) {posit..

지금까지 배운것을 바탕으로 사이트를 만들어보려고 한다. 왜냐하면 계속 강의만 듣고 진도만 나가는건 의미가 없다고 느꼈기 때문이다. 일단 연습겸 에 타이틀이랑 파비콘을 넣었다 그리고 구글,네이버에 검색할 수 있는 간단한 meta 정보도 넣었다. 또한 브라우저로 하여금 이 사이트의 언어가 한국어라고 알려주었고, 특수문자나 한글이 깨지지 않도록 charset도 설정했다. 에는 이미지를 클릭하였을 때, 나의 티스토리 블로그로 넘어가게끔 설정을 해두었다. 그리고 간단한 회원가입 느낌을 만들었는데, 아이디는 최소8자, 비밀번호, 생년월일, 파일첨부, 범위 설정 등 다양한 attribute를 사용해보았다. (만약 이 항목 중 어떤것도 설정을 안했을 시에 넘어가지 않도록 설정해놓았다.) 보잘것 없지만,, 귀엽게 봐줬으..

너무 배운게 많은데, 다 기억이 안나서 계속 써먹어 봐야겠다는 생각이 들었다. 어제는 약간 컨디션이 안좋아서 아무것도 생각하기 싫었다. (그래서 개발일지도 스킵해버렸다능,,,,) 오늘 배운 내용 오늘 배운 내용은 모두 안에 들어갈 내용들이다. 1. -> 정보를 제출하기 위한 대화형 코드이다. 특징: 그냥 만 있어서는 아무 작동이 되지 않는다. 과 함께 해야한다. (input은 유저로부터 데이터를 받기 위한것이다.) 또한 은 self closing tag이다. ex) -> 색을 선택할수있게 만들어준다 -> 비밀번호를 설정할 수 있게 만들어준다. 2. 속성 placeholder ->유저에게 무엇을 입력해야하는지 알려주는 용도 ex) 3. 속성 value ->입력값을 임의로 바꾸게 해준달까? ex) 4. 속성..

우선 나의 감정을 말해본다면 코딩의 짜릿함을 느꼈다. 나 혼자 그냥 이렇게 해보면 어떨까 싶었는데 구현이 되어서 놀랐다. 약간 이런 짜릿함에 코딩을 하는 것이 아닐까 싶다. 내가 원하는 것이 구현 될때 너무 보람차다 약간 이게 되네??! 이런느낌쓰!! 오늘 배운 내용 1. 내용 -> 링크를 만들어준다 여기서 a는 anchor를 뜻하며, 그냥 링크를 하는 태그라고 생각하면 편하다 근데 그냥 만 태그하면 아무것도 이루어지지 않는다. 왜냐하면 링크인건 알지만 어디로 가야하는지에 대한 정보를 브라우저가 모르기 때문이다. 그래서 tag에 부가적인 정보를 주어야 하는데 그것을 attribute (속성)이라고 한다. 여기서 우리는 href 라는 속성을 사용해줄 것이다. 문득 궁금해진점은 이런 문법은 마치 정해져잇는것..