잼굴 코딩공장

HTML Todo List Add Clear All CSS * { box-sizing: border-box; } body { font-family: Arial, sans-serif; margin: 0; padding: 0; } h1 { text-align: center; } form { display: flex; justify-content: center; margin-top: 20px; } input[type="text"] { padding: 10px; border-radius: 5px; border: 1px solid #ccc; margin-right: 10px; width: 70%; } button[type="submit"] { padding: 10px; border-radius: 5px; bord..

1. HTML 변경, 조작하기 기본 틀 안녕하쇼 링크 버른 1) 제목을 변경해보자. 기존 자바스크립트에서는 let 제목 = document.querySelector('#title'); 제목.innerHTML = '반갑소' 이렇게하면 변경 됐지만, 타입스크립트는 에러가 난다. "제목"이라는 변수가 null일수 있다 --> 셀렉터로 html을 찾으면 타입이 Element | null 이라서 그럼 // html 못찾으면 null처리 됨 타입스크립트로 하는방법 총 5개 있다. ① narrowing let 제목 = document.querySelector('#title'); if (제목 != null) { 제목.innerHTML = '반갑소' } ② instanceof (★) let 제목 = document.qu..

1. 타입스크립트를 쓰는이유 기존 자바스크립트는 타입에 관대하다. 10-"3"을 해도, parseInt([1,2,3]) 이런 이상한걸 넣어도 아무런 제지가 없다. => 타입스크립트는 이런걸 모두 잡아낸다. 근데 굳이? 작은 프로젝트들은 코드량이 그렇게 많지 않다보니 상관없지만, 협업프로젝트에서 코드량이 천줄, 만줄단위의 큰 프로젝트에서는 타입에러가 문제되는 경우가 있다. 남이 쓴 코드에서 에러가 발생했는데 알수없는 타입에러가 뜬다면 골치아프기 때문이다.. 그리고 에러가 나도 자바스크립트보다 더 구체적으로 에러원인을 알려준다. 2. 타입스크립트 기본 룰 1. 변수 옆에 :를 붙이고 타입을 지정해준다. let 타입1 :string = "문자" let 타입2 :number = "3" 타입으로 쓸수있는 것은 s..