profile
냠소현 개발일지
태그 목록
전체보기 (67)배열(4)객체(4)submit(4)input(4)얕은복사(3)반복문(3)push(3)전역객체(3)단항연산자(3)변수(3)addEventListener(3)shift(2)@property(2)form(2)전개구문(2)unshift(2)백틱(2)extends(2)논리연산자(2)생성자함수(2)React(2)JavaScript(2)className(2)메서드체인(2)조건문(2)radio(2)Pop(2)parseInt(2)classList(2)부정연산자(2)DOM(2)Spread(2)Event(2)getElementById(2)checkbox(2)비교연산자(2)Map(2)catch(2)이터러블(2)delete(2)reset(2)이터레이터(2)querySelectorAll()(2)콜백함수(2)undefined(2)카멜표기법(2)return(2)parentElement(1)재할당(1)resolve(1)동적생성(1)decodeURIComponent(1)초기식(1)promise(1)import(1)우선 연산(1)초기셋팅(1)conditional(1)else if(1)html문서(1)기명함수(1)nextElementSibling(1)스네이크표기법(1)단일데이터(1)레퍼객체(1)indexOf(1)인자(1)GET(1)POST(1)문자열연결연산자(1)querySelector(1)배열메서드(1)checked(1)dropdown(1)런타임(1)HTTP Message Payload(1)JSON.stringify(1)스코프(1)Symbol(1)getElementsClassName(1)encodeURIComponent(1)알규먼트(1)옵셔널체이닝(1)프로퍼티(1)keyup이벤트(1)반환값(1)stack(1)queue(1)감소연산자(1)dataset(1)배열리터럴(1)대소관계비교연산자(1)조건식(1)REST(1)classList.remove(1)removeAttribute(1)for문(1)image(1)내부함수(1)JSON.parse(1)병합연산자(1)프로미스(1)단축평가(1)BOM(1)모듈(1)finally(1)generator(1)제너레이터(1)length(1)유사배열(1)배열 리터럴(1)익스텐션(1)try(1)전역 프로퍼티(1)variables(1)MBTI(1)연산자(1)표현식(1)isFinite(1)blur(1)글로벌객체(1)Module(1)일치연산자(1)웹페이지 시작하기(1)create react app(1)요소찾기(1)정적메소드(1)text(1)ScrollHeight(1)판다코딩(1)호스트객체(1)프로퍼티 키(1)매개변수(1)피연산자(1)데이터 공급자(1)동적언어(1)null(1)실행환경(1)선언과 할당(1)await(1)preview(1)ajax(1)Infinity(1)NaN(1)함수선언문(1)kakaoAPI(1)함수표현식(1)메모리셀(1)campen(1)for ~ in(1)insertBefore(1)parseFloat(1)reject(1)원시데이터(1)async(1)ecmascript(1)node.js(1)위치찾기(1)복합데이터(1)event.curruntTarget(1)classList.add(1)while(1)for(1)전역 메서드(1)hasAttribute(1)export(1)&&(1)이벤트리스너(1)고차함수(1)키 동적 생성(1)notation(1)입력값(1)인수(1)<script></script>(1)이항산술연산자(1)nodeList(1)프로퍼티 삭제(1)attribute(1)e.preventDefault()(1)할당연산자(1)웹브라우저(1)eval(1)typeof(1)AND조건(1)keyframes(1)클래스필드(1)OR조건(1)object생성자함수(1)break(1)자바스크립트(1)테스트(1)error(1)파라미터(1)인스턴스(1)switch(1)동등연산자(1)배열생성자함수(1)key in obj(1)REST API(1)json(1)클래스레벨(1)비동기처리(1)concat(1)const(1)let(1)var(1)변수캡슐화(1)식별자(1)HTTP URI(1)Primitive Data Type(1)class제어(1)localStorage.setItem(1)회원가입(1)동등비교연산자(1)동적속성(1)객체 리터럴(1)default(1)재선언(1)CSS in JS(1)htmlDOM(1)vanilla js(1)인스턴스레벨(1)quiz(1)빌트인 이터러블(1)Ajax response(1)as(1)put(1)mouseover(1)event.target(1)select(1)option(1)즉시실행함수(1)Array.isArray(1)console.dir(1)증감식(1)and(1)or(1)삼항연산자(1)재귀함수(1)배열프로퍼티(1)ThemeProvider(1)템플릿리터럴(1)후입선출(1)value(1)encodeURI(1)전역함수(1)멤버변수(1)함수(1)this(1)입력커서(1)개발환경(1)data속성제어(1)단어찾기(1)axios(1)if문(1)컴파일러(1)if else(1)funtion(1)CSS(1)styled components(1)html(1)CSS제어(1)closest(1)네이티브객체(1)이벤트핸들러(1)원본배열(1)checkbox[i](1)FIFO(1)focus(1)localStorage.getItem(1)객체생성(1)innerText(1)증가연산자(1)preventDefault(1)계산된 프로퍼티 이름(1)Ajax requset(1)전역변수(1)데이터 소비자(1)type(1)localstorage(1)localStorage.removeItem(1)Multiple(1)전역설정(1)InnerHTML(1)name(1)클래스(1)Overriding(1)선언과정의(1)HTML속성제어(1)정적속성(1)산술연산자(1)요소생성(1)최대값(1)대괄호(1)단축키(1)appendChild(1)HTML요소제어(1)데이터멤버(1)for...of(1)스택(1)http method(1)dataset프로퍼티(1)required(1)shallow copy(1)array(1)전개연산자(1)label(1)스타일컴포넌트(1)getter(1)setter(1)super(1)Then(1)max_length(1)이터레이션 프로토콜(1)type="text/css"(1)xhr.open(1)LIFO(1)style(1)익명함수(1)isNaN(1)toggle(1)slice(1)e.currentTarget.dataset(1)setAttribute(1)vanillajs(1)프로퍼티 값(1)Array.from(1)change이벤트(1)일급객체(1)decodeURI(1)selectedIndex(1)yield(1)Math.max()(1)객체리터럴(1)메소드(1)file(1)mouseout(1)이벤트종류(1)중첩(1)Props(1)(1)if(1)객체타입(1)xhr.send(1)getElementsTagname(1)삼항조건연산자(1)attrs(1)값접근(1)redux(1)challenges(1)document object(1)for ~ of(1)set(1)빌트인 객체(1)이벤트(1)생성자(1)children(1)xhr.setRequestHeader(1)인터프리터(1)XMLHttpRequst(1)vscode(1)childNodes(1)static(1)test(1)netify(1)노마드코더(1)getAttribute(1)<script type="text/javascript"></script>(1)클래스상속(1)메모리(1)기본자료형(1)자바스크립트 엔진(1)데이터 소스(1)form객체(1)선입선출(1)previousElementSibling(1)엠비티아이(1)object(1)object/reference type(1)파스칼케이스(1)
post-thumbnail

바닐라 JS 챌린지 day7 Login

4.Login 4.0 Input Values 모든 것은 HTML에서 시작되어야함 HTML에서 작성 후 JS에서 기능 구현 1) HTML form 마크업 사용자가 이름을 작성할 수 있도록 ``태그 작성 안에 텍스트를 넣기위해 type="text" 미리 작성할 말은

2022년 11월 30일
·
0개의 댓글
·
post-thumbnail

바닐라JS 챌린지 day 5

1) click event 발생 및 함수 실행 2) currentColor 변수 선언 후 h1.style.color 값 복사 (getter) 3) newColor 변수 선언 4) currentColor 현재 값 확인 5) 조건에 따라 newColor에 "tomato

2022년 11월 29일
·
0개의 댓글
·
post-thumbnail

바닐라JS 챌린지 day4

3.0 Document Object 자바스크립트를 이용해 브라우저를 인터랙티브하게 만들기 브라우저 핵심 object : document : html을 가르키는 객체 document.title 이라고하면 html의 title을 읽어옴 document.body 라고하

2022년 11월 29일
·
0개의 댓글
·
post-thumbnail

바닐라JS 챌린지 day2, day3

함수 반복해서 사용할수있는 조각코드 코드를 캡슐화해서 재사용 가능하게 해줌 함수에게 고정된 코드를 지정하고 함수 밖에서 데이터를 받아 함수에게 전달해줘야함 함수는 결과를 받아 줘야함 => return return 후에 쓴 코드는 작동안함 return 하자마자 함수는

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

바닐라JS 챌린지 day1 퀴즈

✅ only JS✅ Yes✅ Yes✅ To add interactivity to Websites✅ No‼️ No자바스크립트 실행환경모든 브라우저, Node.js 둘 다 자바스크립트 엔진을 갖고있으므로 실행 가능하다.🚨단 차이점은 브라우저는 HTML,CSS,JS를 실행

2022년 11월 21일
·
0개의 댓글
·

노마드 코더/ TypeScript

타입스크립트는 자바스크립트를 기반으로 한 언어 strongly-typed(엄겨한 자료형): 데이터의 type을 확인함 프로그램이 작동하기 전에yarn add typescript @types/node @types/react @types/react-dom @types/je

2022년 11월 21일
·
0개의 댓글
·

리액트 초기 셋팅 / 설치 후 프로젝트 폴더 생성부터 패키지 설치 및 초기화까지

01. 프로젝트 생성 >yarn create react-app 프로젝트명 🚨주의 : 리액트 프로젝트명은 대문자 금지 에러 뜸 01-1 패키지 설치 프로젝트를 VSCode로 열고, Ctrl + ~ 눌러 터미널 실행 후 설치 필요한 패키지 찾아 띄어쓰기로 여러개 한번

2022년 11월 17일
·
0개의 댓글
·

노마드코더 / 리액트 REACT JS #2 styled-components

기존 DOM을 만드는 방식인 css,scss 파일을 밖에 두고 쓰지 않음 => CSS in JS 방식임css가 전역으로 중첩되지 않으며 class명 중복을 줄일 수 있음패키지 설치yarn add styled-components적용하고자 하는 컴포넌트 상단에 import

2022년 11월 16일
·
0개의 댓글
·

리액트 TIL

리액트 css-reset 하기 styled-components 설치하기 styled-reset 패키지 설치하기 기본적인 컴포넌트 생성하기 GlobalStyles.js 생성하기 App.js에 GlobalStyles import 리액트 중첩 라우팅 기존 부모 라우터의

2022년 10월 11일
·
0개의 댓글
·

리액트 에러 Manifest: Line: 1, column: 1, Syntax error

"Manifest: Line: 1, column: 1, Syntax error"index.html 파일 열기manifest 코드 수정 ('/' 추가)

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

리액트 에러 expected a string or class/function

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely

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

TIL / MBTI 테스트 답변 점수 계산하기

01. 최대값 구하는 함수 Math.max( ) 파라미터로 입력받은 숫자들 중 최대값 리턴 02. ' ... ' 전개 연산자로서 인수로 넘기는 경우 Max.max(...(배열이름)) 배열 안에 있는 값들을 넘겨줌 즉, 인수들 목록으로 리턴 전개 연산자는 배열이나 객

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

vscode 멀티커서 [mac] option + 클릭

window 는 alt + 클릭 ~

2022년 10월 4일
·
0개의 댓글
·

vscode 전체 프로젝트 안에서 단어찾기 ctrl + shift + f

현재 파일 내에서 찾기는 ctrl + f ~

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

react proxy 에러

https&#x3A;//nodejs.org/api/errors.htmlpakage.json에서 proxy localhost 30001에서 3000으로 바꾸니 해결

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

myMBTI 테스트 만들어보기

구름에듀 사이트의 판다코딩의 HTML/JS/CSS로 나만의 MBTI 사이트 만들기 강의를 보고 만들었습니다. 01. HTML 각 3개의 섹션 레이아웃하기 총 3개의 섹션으로 나누어 한 페이지로 레이아웃하여 1️⃣ 이 보일 때 display:block 나머지 2️⃣,3

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

async await

함수 앞에 async 예약어 붙이기함수의 내부 로직 중 HTTP 통신을 하는 비동기 처리 코드 앞에 await 붙이기주의‼️ 비동기 처리 메서드가 꼭 프로미스 객체를 반환해야 await가 의도한대로 동작함일반적으로 await 의 대상이 되는 비동기 처리 코드는 Axio

2022년 7월 25일
·
0개의 댓글
·

프로미스 Promise

프로미스란? ES6에서 비동기 처리르 위한 또 다른 패턴으로 전통적인 콜백패턴이 가진 담점을 보완하며 비동기 처리 시점을 명확하게 표현할 수 있는 장점을 가지고 있다. 콜백 패턴의 단점 - 콜백 헬 동기식 처리 모델 Synchronous processing model

2022년 7월 25일
·
0개의 댓글
·

REST API

URI는 정보의 자원을 표현해야 한다.: 리소스명은 동사보다 명사 사용자원에 대한 행위는 HTTP Method (GET,POST,PUT,DELETE)등으로 표현GET : index,retrieve / payload X / 모든, 특정 리소스 조회POST : create

2022년 7월 25일
·
0개의 댓글
·

Ajax

Ajax (Asynchronous Javascript and XML) 브라우저에서 웹페이지를 요청하거나 링크를 클릭하면 브라우저와 서버와의 통신에 의해 화면 갱신이 발생한다. * 전통적인 방식 * 서버는 요청 받은 페이지를 반환하는데 이 때 CSS,JS 파일들도 같

2022년 7월 25일
·
0개의 댓글
·