post-thumbnail

디바운스

사용자 ID의 검증을 입력할때마다 결과를 실시간 텍스트로 알려달라는 요청이 있었다. 그냥 스크립트 상에서 검증을 하면 문제가 없었지만, 외부 API를 통해 검증을 해야되서 입력되는 순간마다 API를 호출하면 불필요하게 호출되겠다는 생각이 들어 구현하면서 정리한 내용을

3일 전
·
0개의 댓글
·
post-thumbnail

프론트앤드 면접 질문 정리(작성중)

✔ Promise와 Callback의 차이점 공통점: 비동기를 처리하기 위한 방법 Callback은 어떤 코드에 인자로 넘겨주는 함수를 말하며, 인자를 받은 함수가 어느 시점에 부를것인가에 대한 제어권을 가지는것이 특징 Promise는 비동기 작업을 할수 있는 객체를

5일 전
·
0개의 댓글
·

브라우저에서 주소를 입력했을때

해당 내용은 면접에서 많이 나오는 질문인지라, 면접때 조금이라도 덜 당황하고 대답하고 싶다는 생각으로 정리해보았다.😂 🛻1.서버로부터 리소스(데이터)를 받는 과정.(=웹 동작 방식) > MDN에서는 이 과정을 상점으로 이동하여 주문한 상품을 받는 과정과 유사하다고

2023년 1월 19일
·
0개의 댓글
·
post-thumbnail

코어 자바스크립트(프로토타입)

프로토타입의 개념 이해 > 자바스크립트는 프로토 타입의 언어. 객체지향 언어에서는 상속을 사용하지만, JS에서는 prototype 을 기반으로, 이를 복제(참조)하여 상속과 비슷하게 흉내 낼수 있음. 1. constructor,prototype,instance 선

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

코어 자바스크립트(클로저)

1. 클로저의 의미 및 원리 이해 사전적 의미는 폐쇄,닫힘,완결성. 함수형 프로그래밍 언어에서 나타나는 보편적인 현상. MDN에서 정의하는 클로저 > A closure is the combination of a function bundled together (enclo

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

코어자바스크립트(콜백)

1.콜백 함수란? > 다른 코드의 인자로 넘겨주는 함수. 콜백함수를 넘겨받은 코드는 적절한 시점에 실행. > 콜백(callback)의 뜻은 '되돌아 호출해달라'는 뜻. 함수를 호출시 매개변수를 함수로 받고 특정조건 떄 인자로받은 함수를 실행해서 알려달라고 요청을

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

코어자바스크립트(this)

1.상황에 따라 달라지는 this > 자바스크립트에서 this는 실행 컨텍스트가 생성될 때 함께 결정. 함수를 호출할 때 결정됨. 1-1.전역 공간에서의 this 전역 공간에서 this는 런타임 환경에 따라 다른데, 브라우져에서는 window는 nodeJS에서는

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

코어 자바스크립트(실행 컨텍스트)

실행 컨텍스트 실행할 코드에 제공할 조건과 환경 정보들(현재 환경과 관련된 식별자 정보)을 모아놓은 객체. 실행컨텍스트가 활성화될 시점에 선언된 변수를 끌어올리고(호이스팅), 환경정보 설정과 this가 설정되는 등의 동작이 일어남. 동일한 환경에 있는 코드들

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

코어 자바스크립트 (데이터 타입)

데이터 타입 1.데이터 타입 종류 기본형 숫자(Number), 문자열(String), Boolean, null, undefined, Symbol(ES6 추가) 참조형(객체) 객체(Object), 배열(Array), 함수(Function), 날짜(Date), 정규

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

메소드 Chaining

오늘 면접에서 promise에 대한 설명에 이어서 메소드 체이닝에 대한 질문을 했었다. 질문을 받았을떄는 뭔지 몰라서 대답을 하지 못했다. 면접끝나고 나서 해당 내용을 검색해보았을때 평소 현업에서도 잘 쓰고 있었던 패턴이었다. 사슬에 이어진 고리처럼 함수를 호출할때

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

LocalStorage & SessionStorage & Cookie

local 브라우져에서 데이터를 저장할수 있는 저장소로 HTML5표준부터 새롭게 추가된 저장소.key:value 조합 형태로 저장되며, 이때 value는 무조건String형태로 들어간다.(숫자나 boolean형태의 값도 String으로 들어가며, value에 objec

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

[Javascript] 비트 연산자

이번에 코딩테스트 문제를 풀어보면서 비트 연산을 이용한 문제가 있었다. 옛날에 정보처리기사에서도 자주 언급되었던 개념이었던걸로 기억하는데, 코딩테스트에서도 나올 여지가 있어서 간단하게 정리해본다.&는 비트의 자리마다 대응하는 비트의 숫자가 둘다 1인 경우에 1을 반환한

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

HTML5 폼검증 API

저번주에 있었던 코딩 테스트에 구현사항 중 폼검증을 이용하여 Class 추가와 커스텀 메시지 구현 요구 사항이 있었다. required,maxlength,minlength,min,max등의 속성은 알고는 있었지만, 내가 일했던 현업에서는 잘 쓰지 않는 속성일뿐더러 검증

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

NodeJS 환경변수 설정

1. 환경변수란?📦 개인개발 PC, 개발 서버와 운영 서버에서의 개발 설정값이 다르기 때문에 소스코드를 제외한 DB관련 설정과 API키값등은 환경변수를 통해 관리. 외부인들에게 노출이 되면 안되는 내용(DB정보, 토큰, API키 값)나 운영체제별로 특정 파일의 경로처

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

ESLINT설치

기본적으로 cli를 통한 vue를 설치하면 eslint의 기본적인 설치까지 해준다. 하지만, 이전에 vuejs cli없이 설치했기에, eslint까지 직접 설치해야한다.

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

HTTPMethod PUT,DELETE보안 위험성?

작년에 들어갔던 프로젝트 요구사항중의 하나가 솔루션의 기초 데이터를 제공하는 공통API개발 있어 2주정도 개발했었다. 당연히 REST 규칙에 맞게 HTTP METHOD를 맞춰서 개발을 하였으나, PUT,DELETE METHOD는 보안에 취약하다는 지적이 있었다. 처음

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

VueJS vue-cli 없이 설치하기

1.📦 기본 패키지 구성 npm init -y 을 통해 기본 npm 개발 환경 생성. 아래 명령어를 통해 vue 관련 패키지 설치 그외 웹팩, 바벨과 vue파일을 컴파일링하고 번들링하는 패키지는 개발의존성에만 포함을 시켜서 설치 >npm i vue npm i -

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

웹페이지에서 이미지를 불러오는방법

면접에서 웹페이지에서 이미지를 불러오는 방법을 말해보라는 질문이 있었다. 뭔가 되게 쉬우면서도 뭔가 중요한게 있을꺼 같다는 생각이 들어서 말해놓고도 찜찜했다.(떨어진것은 함정😭) 1. `` 태그 기본적으로 많이 사용되는 방식 src경로에 이미지가 없거나 피치못

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

TIL(0419)

1.특정 컴포넌트 클릭시 무한루프 현상 이번에 스타트업에서 서류전형에 합격되어 1주동안 과제를

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

프로그래머스 프론트앤드 코드리뷰 스터디 3주차 후기

3주차 미션은 비동기방식의 API호출이 메인인 미션이었습니다. 저번 미션2에서 이어지지는 않지만 이전에 했던 개념들도 필수로 알아야 하는 미션이었습니다. 코드리뷰 이슈 사항 1.디바운싱(debounce) 😎디바운싱의 간단한 정리 > "이벤트가 여러번 발생하면 가

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