DoM 3

객체 지향 프로그래밍 - Drag & Drop 프로젝트 01.

Typescript: 기초부터 실전형 프로젝트까지 with React + NodeJS 정확하게 뭘 하는지 설명도 안 해주고 다짜고짜 클래스 만들면서 출발해가지고 너무나도 어려웠다,,, 오버뷰라도 살짝 한 다음에 코드 작성으로 들어갔으면 이해하기가 훨씬 쉽지 않았을까 싶다. 솔직히 강의의 절반도 이해 못한 것 같다. 모르는 건 다 제쳐두고 이해한 것 위주로 작성할 예정이다. Title Description People ADD PROJECT 번호 제목 내용 let temp = document.querySelector('template'); let tbody = document.querySelector('tbody'); //데이터 SET let db = [ {'id':'1','title':'title1','c..

코드스테이츠 프론트엔드 부트캠프 Day 18 - Coz' Mini Hackathon (1) 기본 구조

첫 솔로 프로젝트다. 손 끝을 자극하는 키보드의 감각 하나까지 다 남겨보고 싶다. 처음부터 쓰지 않으면 진행에 몰입하다가 완전 잊을까봐 처음부터 기록한다. 일단 막막하다. 어떻게 시작해야 할까.. 한 번 의식의 흐름대로 적어보겠다. Coz' Mini Hackathon 의 목표는 '나만의 아고라 스테이츠 만들기'. 주어진 최소한의 양식을 가지고 자유롭게 단일 페이지를 구성하는 것이다. Bare Minimum Requirement 디스커션 나열 기능 script.js를 수정하여 agoraStatesDiscussions 배열의 데이터를 나열할 수 있게 구현합니다. CSS 아고라 스테이츠 질문 리스트가 중앙으로 와야 합니다. style.css를 수정하여 멋지고 아름답게 나만의 아고라 스테이츠를 꾸밉니다. col..

부트캠프/TIL 2023.01.09

코드스테이츠 프론트엔드 부트캠프 Day 16 - DOM

DOM: Doucument Object Model HTML 요소를 JavaScript Object처럼 조작할 수 있는 Model. 아주 간단한 CRUD 설명 C: Create R: Read U: Update D: Delete C document.createElement('div') 새로운 요소를 만든다. const newDiv = document.createElement('div') document.body.append(newDiv) 새로 만든 요소를 변수에 할당해 그 변수를 body의 자식으로 집어 넣는다. R DOM으로 HTML 엘리먼트의 정보를 조회하기 위해서는, querySelector의 첫 번째 인자로 셀렉터를 전달하여 확인해야 한다. 셀렉터에는 HTML 요소("div"), id("#myID")..

부트캠프/TIL 2023.01.05