노마드코더5 크롬 앱 만들기 [바닐라 JS] Day 6 드디어 실습 로그인 버튼을 구현해 볼꺼다. Summary #7.0 ~ #7.8 #7.0 Set up JS todo.js를 만들어 연결해주었고, 새로운 form을 만들어 id를 todo-form으로 했다. list를 만들기 위해 ul을 하나 만듬. 안에 li 태그가 없는 이유는 JS로 구현할것이기 때문. const toDoForm = document.querySelector("#todo-form"); const toDoInput = document.querySelector("#todo-form input"); const toDoList = document.querySelector("#todo-list"); function handleToDoSubmit(event) { event.preventDefault(.. 2021. 12. 1. 크롬 앱 만들기 [바닐라 JS] Day4 Day 3 이해하기 어려웠다. 이제 함수의 기초를 공부하는 단계인데, 너무 복잡했다.시간날때마다 하나하나 지워가며 구현을 해봐야할듯하다. Summary #5.0 ~ #5.3 #5.0. Clock 모든 js코드를 한 file에 담는것은 혼란스러우니, 기능별로 file을 만드는 것을 추천 받았다. html : css : js --> 1 : 1 : 여러개 00:00 HTML 에 id가 clock인 h2를 추가했다. const clock = document.querySelector("h2#clock"); function sayHello() { console.log("hello"); } setInterval(sayHello, 5000); 이렇게 코드를 작성하면 브라우저 console에서 5초마다 hello가 출력.. 2021. 11. 25. 크롬 앱 만들기 [바닐라 JS] Day3 드디어 실습 로그인 버튼을 구현해 볼꺼다. Summary #4.0 ~ #4.7 #4.0 Input Values what your name?에 입력된 값을 Log In이 눌렸을때 읽고싶다.Log In 버튼은 click event로 처리하자 Log In placeholder : input 박스안에 문자를 입력하기 위해 login-form : input을 구분하기 위해 const loginInput = document.querySelector("#login-form input"); const loginButton = document.querySelector("#login-form button"); function onLoginBtnClick() { console.dir(loginInput); } loginBu.. 2021. 11. 25. 크롬 앱 만들기 [바닐라 JS] Day2 Summary #3.0 ~ #3.8 1. Document 개념 document는 브라우저에 이미 존재하는 object (documnet는 자바스크립트 관점에서의 HTML) 모든 것은 documnet로 부터 시작함(document는 web site를 의미함) 2. HTML in JavaScript Grab me! documet.getElementByID("") : HTML에서 ID를 통해 element를 찾아 줌 --> console창에서 확인 가능 element를 찾고 나면, 해당 HTML에서 변경 가능 자바스크립트는 HTML elemet를 가지고 오는 것 뿐, 자체를 보여주지는 않음 const title = document.getElementById("title"); title.innerText = ".. 2021. 11. 24. 크롬 앱 만들기 [바닐라 JS] Day1 생활코딩 JS를 다 듣고, 클론 코딩을 하러 왔다. 필자는 영어로 코딩을 설명해주는 것이 매력적이라 노마드코더를 선택했다. Summary #1.0 ~ #1.6 1장에서는 기본적인 내용을 배웠다. 1. JS는 만드는데 10일이 걸렸다. 2. JS를 이용해 안드로이드, IOS앱을 만들 수 있다. (React 사용) 3. JS를 이용해 테스크탑 앱을 만들 수 있다. (일렉트론) 4. 가급적 Chrome을 사용해라 Summary #2.0 ~ #2.16 1. 숫자형, 문자형 개념 ( a = 10 정수형, a = "10" 문자형(string)) 2. 출력 --> console로 진행 (console.long(" ");) 3. 선언 --> Const and let - const : 절대적 - let : 업데이트 가능.. 2021. 11. 23. 이전 1 다음
