# CreateElement

18개의 포스트

React.createElement 와 ReactDOM.render

예시 코드를 보며 React.createElement 와 ReactDOM.render 에 대해 알아보려 한다.Javascriptdocument.createElement(tagName, options)=> 지정한 tagName의 HTML 요소를 만들어서 반환ReactRe

2022년 6월 14일
·
0개의 댓글

자바스크립트로 html생성하기

.creadteElement()<div>안에 <p>태그를 생성해보았습니다. document.createElement()를 쓰면 html자료를 하나 생성해줍니다. 그걸 맘대로 조작한 다음 appendChild()를 써서 원하는 곳에 넣으면 html이 생성됩니다

2022년 6월 6일
·
0개의 댓글

[React] JSX 2

이 전 글과 똑같이 위의 코드를 아래처럼 바꿔줄 수 있다.(대소문자 잘 지켜주자) 이렇게 코드를 작성하면 이 버튼이 아니라 텍스트로 나오는데 요소들을 하나도 포함시키고 있지 않아서이다. 이 전 글에서 작성한 title과 button의 코드를 가져와보자.

2022년 5월 24일
·
0개의 댓글

[React] JSX 1

굳이 createElement를 대체하는 이유는 개발자들에게 좀 더 편리한 도구를 사용하기 위해서이다.그게 바로 JSXJSX는 JavaScript를 확장한 문법이다.생긴건 HTML이랑 비슷해서 JSX로 React 요소를 만드는게 개발자들 입장에서는 매우 편하다.위의 코

2022년 5월 24일
·
0개의 댓글
post-thumbnail

02.14 복습

현재 시간을 불러온다둘 다 비슷한 함수이나, setInterval은 지속적으로 반복, setTimeout은 한 번만 실행된다.둘이 쓰는 법은 똑같으나, 앞에 붙느냐 뒤에 붙느냐 차이다.앞에 String type을 받는다.string.padStart(앞에 string의

2022년 2월 14일
·
0개의 댓글
post-thumbnail

[KDT]FCFE - 7주4일 React ( Hooks )

React Hooks hooks 이전 컴포넌트 내부에 상태가 있다면? class 컴포넌트 내부에 상태가 없다면? 라이프사이클을 사용해야 한다면? class 라이프사이클에 관계 없다면? function class component function comp

2022년 1월 6일
·
0개의 댓글

[React] React 컴포넌트 생성방식 #TIL

React.Component를 상속하여 정의합니다.function과 arrow function을 이용한 두가지 방식이 존재합니다.function 방식arrow function 방식위의 방식으로 element를 생성합니다.하지만 복잡한 컴포넌트는 생성하는데 어려움이 큽니

2021년 12월 26일
·
0개의 댓글
post-thumbnail

[JS] 바닐라 자바스크립트 - random

이 부분 중요! 앞쪽에 quotes배열을 넣어주고 그 길이 만큼 곱해서 랜덤 수를 지정해주었다. 그리고 Math.floor함수를 넣어서 소숫점 자리를 내려 주었다. 그러면 quotes배열의 해당값이 변수 todaysQuote에 나오고 innerText로 화면에 보여지게

2021년 12월 21일
·
0개의 댓글

자바스크립트로 요소 추가하기 : createElement(), appendChild()

여때까지는 JS를 이용해 HTML에서 뭔가를 가져왔음 document.querySelector(어쩌구) 하지만 먼저 JS에서 무언가를 만들어서 그걸 HTML에 넣어볼 수도 있음. createElement(), createTextnode(), appendChild()

2021년 12월 9일
·
0개의 댓글

Javascript - append vs appendchild

둘 다 js 상에서 부모와 자식 관계를 만들어주는 요소이다.요소(tag)를 생성해줄 때 사용한다.여러개의 자식 형성이 가능하다.string도 자식으로 만들어줄 수 있다.

2021년 11월 20일
·
0개의 댓글
post-thumbnail

[CS] DOM Day-17

DOM이란? Document Object Model의 약자입니다. 프로그래머 입장에서 바라 본 HTML입니다. DOM을 이해하고 조작할 수 있다면 HTML을 단순화 해 웹앱으로 업그레이드 할 수 있습니다. HTML에 JavaScript 적용하기 HTML에 JavaSc

2021년 10월 26일
·
0개의 댓글
post-thumbnail

React 원리

2021년 10월 23일
·
0개의 댓글
post-thumbnail

Quotes & Background -바닐라JS 크롬 앱 만들기 nomad coder

명언들 랜덤으로 화면에 띄워주기quotes.js 내에 object가 모인 array를 만들어준다.ex)html 내에 인용문 넣을 자리를 만들어준다.랜덤으로 명언들을 화면에 띄우기 위해서는 먼저 랜덤으로 명언들을 호출할 수 있어야 한다.10개의 명언이 있다면, quote

2021년 10월 1일
·
0개의 댓글
post-thumbnail

DOM 기초

DOM 이란? / createElement / append(),appendChild() / getElementByTagName

2021년 3월 25일
·
0개의 댓글