본문 바로가기

전체 글123

22.01.26 코드스테이츠 4주차 Final Project 회고록 👀 4주차 Final Project 회고록 📌 4주차 두 번째 프로젝트의 시작 2주 프로젝트가 끝나고 쉼없이 4주 프로젝트가 시작되었다. 대화를 많이 하고 기획을 꼼꼼히 하기로 다짐했던 만큼 5일의 시간을 들여 계획했다. 운 좋게도, 내가 하고싶었던 아이디어로 웹을 만들게 되었다. 아이디어를 간단히 소개하자면 : -> 기획 의도 사진은 생각보다 많은 정보를 담고 있습니다. "사진을 저장하다 = 추억을 기억한다" 는 의미가 통하는 시대입니다. 갤러리의 수많은 사진들 사이에서 내가 원하는 사진 한장을 찾아 헤매본 적이 있으신가요 ? 정보의 저장은 쉬워졌지만 해당 정보를 제대로 관리할 수 있는 도구는 많지 않습니다. 블로그와 SNS에서 본 사진을 보고 반해 찾아간 장소의 주변에서 놀거리를 찾지 못해 당황한 적.. 2022. 1. 28.
21.12.26 코드스테이츠 2주차 First Project 회고록 👀 2주차 First Project 회고록 📌 2주차 첫 번째 프로젝트의 시작 팀원 모두 "첫" 프로젝트 경험이다 보니 배운 걸 복습하면 된다는 가벼운 생각으로 임했다. 그런데 아이디어 이야기를 하면할수록 큰 가닥이 잡히고, 해낼 수 있겠는데 ..? 라는 용기가 생겼다. 스토리 라인을 탄탄히 짰고 업무 분배도 기간에 맞춰 계획했다. 모두들 할 수 있다는 자신감에 부푼 채 프로젝트를 시작했다. 📌 우리팀이 잘한 점 📎 팀프로젝트와 직접적으로 관계없는 내용의 질문이더라도 팀원 모두가 함께 고민했다. 프로젝트를 하면서 대화의 생산성과 상관없이, 대화 자체를 많이 해야한다는 것을 느꼈다. 팀 프로젝트에서 빠질 수 없는 "GitHub 관리" 를 예로 들어보겠다. 우리 팀은 깃허브를 대화 주제로 삼았을 때, ✔ G.. 2022. 1. 27.
Token & Token-based Authentication 의 동작 과정 (feat. JWT) 📌 Token ? 프로그래밍 언어에서의 token 문법적으로 더 이상 나눌 수 없는 기본적인 언어 요소를 말한다. 키워드나 연산자, 구두점 등이 token 이 될 수 있다. 네트워크에서의 token 네트워크를 따라 돌아다니는 암호화된 비트열이다. 각 네트워크에는 오직 하나의 token 만 존재하므로 2개 이상의 컴퓨터가 동시에 메세지를 전송할 가능성을 사전에 차단한다. 보안시스템에서의 token 크레딧 카드 크기의 작은 장치를 말한다. 사용자가 처음에 암호를 입력하면, 카드는 네트워크에 접속할 수 있는 ID를 수시로 변경해가며 표시해준다. --> 공유 자원 접근에 대한 동기화를 보장하기 위해 사용되는 추상적인 개념이다. --> token 을 가진 사람이라면 누구나 특정 자원에 배타적 접근이 허용되고 (선.. 2021. 11. 26.
Session & Session-based Authentication 의 동작 과정 📌 Session ? 클라이언트가 서버에 data 를 저장할 수 있는 방법 중 하나로, 특정 저장 공간을 의미한다. session 은 특별한 경우가 아니라면 사용자가 웹 브라우저를 접속한 시점부터 종료하는 시점까지 유지된다. 📌 Session-based Authentication 동작 과정 ? 📎 express-session 모듈 // express-session 모듈 const express = require('express'); const session = require('express-session'); const app = express(); app.use( session({ secret: , resave: , saveUninitialized: , . . . cookie: { domain: , p.. 2021. 11. 25.
Cross-Site Scripting ( XSS ) 공격 📌 XSS ? Cross-site Scripting 의 약자이며, 웹 상에서 일어나는 기초적인 공격 방법의 일종. 악의적인 사용자가 공격하려는 사이트에 script 를 넣는 기법을 말한다. ( script의 형태는 다양하다 ) 보통 사이트에 접속한 사용자의 쿠키나 세션, 토큰 등 민감한 정보를 탈취하는 데 사용된다. ◾ Stored XSS ( Persistent XSS ) 저장형 XSS 공격 ( 지속형 XSS 공격 ) 일시적으로 공격하는 것이 아니라 지속적으로 피해를 입히는 XSS 공격을 말한다. 해커가 삽입한 script 가 DB에 저장되어, 악성 코드가 삽입된 웹 페이지를 본 사용자들에게 지속적으로 공격이 가해진다. 사용자가 입력한 값이 DB에 저장되고, 저장된 그대로 클라이언트 단에 보여질 때 이 .. 2021. 11. 24.
Cookie 와 Cookie options (Set-Cookie) 📌 Cookie ? 서버에서 클라이언트에 data 를 저장할 수 있는 방법 중 하나로, 작은 크기의 문자열을 말한다. 서버에서 클라이언트에 cookie 를 전송할 수도 있고, 클라이언트에서 서버로 cookie 를 전송할 수도 있다. -> cookie 를 이용해 데이터를 저장하고, 원할 때 불러와 다시 사용할 수 있다. ◾ Cookie 형식 = 쿠키는 name=value 쌍으로 정보를 저장한다. 📌 Cookie Options ? 서버가 클라이언트에 cookie 로 데이터를 저장하는 건 맘대로 할 수 있지만 역으로 클라이언트에서 서버로 다시 불러오는 건, 지정된 조건을 만족할 때만 가능하다. cookie에 데이터를 저장하면서 원하는 조건을 지정해줄 수 있다 ( 조건 설정은 option임 ). ✔ Expire.. 2021. 11. 23.
__filename , __dirname 📍 __filename 현재 실행 중인 파일 경로 📍 __dirname 현재 실행 중인 폴더 경로 2021. 11. 20.
CommonJS 와 ES(6) 모듈 키워드 ( require vs import ) 차이 📍 공부하게 된 계기 require 와 import 의 차이가 궁금해서 파보다가 ... CommonJS 와 ECMAScript 까지 살펴보게 되었다. 하면서 느낀거지만, 자바스크립트를 사랑하는 개발자가 많은 것 같다. 자바스크립트의 무한한 잠재력에 놀라면서도, 그걸 확장시키는 개발자들이 있기에 내가 이렇게 편하게 코딩을 할 수 있는 게 아닌가 싶다 ㅎ 📌 CommonJS 자바스크립트 언어의 활동 영역을 더 넓히기 위해 조직된 그룹이다. 브라우저 이외에도 ✔ Server-side JS applications ✔ CLI tools ✔ Desktop GUI-based applications ✔ Hybrid applications 등 다양한 어플리케이션에 자바스크립트 언어가 쓰일 수 있도록 표준화된 라이브러리를.. 2021. 11. 14.
.env 파일 관리부터 dotenv & DB랑 NodeJS 연결하기 📌 .env 파일 ?-? " 환경 변수 파일 " 을 의미한다. 이 파일은, 애플리케이션이 실행될 때 넘기고 싶은 특정 값을 담고 있는 변수가 기록되어 있다. 미리 정의된 값을 애플리케이션에서 활용하고 싶을 때 이 .env 파일을 활용한다. 📂 .env // .env 파일 // DB에 접속하기 위해 필요한 username과 password와 dbname을 변수에 차례차례 담아줬다. DATABASE_USERNAME='lee' DATABASE_PASSWORD=1234 DATABASE_NAME='learnsql' // .env 파일 // local URI 와 test server를 위한 URI, id와 비밀번호 등등 다양한 방식으로 담아둘 수 있다. REACT_APP_LOCAL_URI=http://localho.. 2021. 11. 13.
GCD (최대 공약수) & LCM (최소 공배수) & 유클리드 호제법 📍 GCD : Greatest Common Divisor : 최대 공약수 📍 LCM : Least Common Multiple : 최대 공배수 📌 유클리드 호제법 ? 유클리드 호제법은 두 양의 정수 간의 최대 공약수를 구할 수 있는 방법이다. 단, a 가 b 보다 항상 크다는 전제가 있어야 성립한다. -> 당연한 이야기인게, a = bq + r 공식에서 이미 b는 a의 약수로 속해 있다. a = bq + r 식은 a와 b 간의 관계를 정의한 식이다. -> a가 b 보다 크다면, b*q 값과 어떤 나머지 정수가 더해져 a를 완성할 것이다. 여기서 나머지 값(r) 이 0이게 되면 a와 b 사이에서는 b가 가장 큰 최대 공약수가 되는 것이다 ! 만약 r이 0이 아니라면 ? r은 b와 어떤 정수 q의 곱으로 a.. 2021. 11. 10.
Redux 3가지 원칙 정리 📍 The truth comes from one source App의 모든 상태는 하나의 저장소에 객체 트리 구조로 저장된다. console.log(store.getState()); /* * { * visibilityFilter: 'SHOW_ALL', * todos: [{ * text: 'Consider using Redux', * completed: true, * }, { *text: 'Keep all state in a single tree', * completed: false * }] * } */ 📍 State is read-only 상태 변경은, 액션 객체(어떤 상태 변화가 일어나야하는 지 기술된 객체)를 통해서만 일어난다. store.dispatch(action: Object) store.dis.. 2021. 11. 4.
Preflight Request : HTTP Message 를 통한 header 공부 📍 HTTP message 를 살펴보기 전, Method 와 Header 그리고 CORS 정책을 짚고 넘어가면 좋다. 2021.09.10 - [개발 공부/Browser] - Client - Server : SOP와 CORS Client - Server : SOP와 CORS 📌 SOP? (Same Origin Policy) 동일 출처 정책으로, 하나의 Origin에서 로드된 문서나 스크립트가 다른 Origin의 자원과 상호작용하지 못하도록 제한하는 것. 여기서 말하는 Origin은 아래 3가지 요소를 조합 code-designer.tistory.com 📌 Preflight Request ◾ HTTP Request : Preflight ✔ Access-Control-Request-Method : Access.. 2021. 10. 27.
직접 서버를 만들면서 배운 Location Header ✔ Location : Location Response header는 "re-direct" 할 url을 명시한다. 3XX(redirection) 이나 201(created) 상태 코드가 응답되었을 때만 적용할 수 있다. 3XX 상태코드가 반환되었을 때, 기존 url에 Location에 명시된 url을 붙여 완성된 새로운 URL에 request를 보낸다 ! (fetch 요청) 📎 303 See Other 상태 코드 언제나 GET 메서드를 사용해 re-direct fetch 요청을 보낸다. (기존의 original 메서드 무시) PUT 이나 POST 메서드가 요청된 이후에 변경된 상황을 "읽고싶을 때" 주로 사용한다. 📎 307 Temporary Redirect 상태 코드 기존의 original 메서드를 변.. 2021. 10. 26.
Node JS address already in use 문제 해결 📍 내가 오늘 만났던 오류 Error: listen EADDRINUSE: address already in use :::5000 📎오류가 발생하는 이유 2 가지 ✔ 다른 프로세스가 명시된 포트를 사용중일 때 ✔ Node JS 프로세스가 비정상적으로 종료됐을 때 난 서버를 잘 껐고 ... 현재 쓰고 있는 port도 없는데 왜 자꾸 이 오류가 뜨는거야 ;;; 📍 해결 방안 난 Ubuntu를 사용하기 때문에 Linux 중심의 해결 방법을 찾았다. lsof : 활성화된 프로세스 리스트를 출력해주는 명령어이다. i : [option] 특정 port를 사용중인 프로세스만 골라주는 옵션이다. lsof -i 명령어를 활용해 내가 찾고 싶은 프로세스를 찾는다. 이제 이 프로세스를 kill 명령어를 활용해 종료한다. ki.. 2021. 10. 25.
Simple Request : HTTP Message 를 통한 header 공부 📍 HTTP message 를 살펴보기 전, Method와 Header 그리고 CORS 정책을 짚고 넘어가면 좋다. 2021.09.10 - [개발 공부/Browser] - Client - Server : SOP와 CORS Client - Server : SOP와 CORS 📌 SOP? (Same Origin Policy) 동일 출처 정책으로, 하나의 Origin에서 로드된 문서나 스크립트가 다른 Origin의 자원과 상호작용하지 못하도록 제한하는 것. 여기서 말하는 Origin은 아래 3가지 요소를 조합 code-designer.tistory.com 📌 Simple Request ◾ HTTP Request ✔ Host : : (optional) Host Request header 는 서버의 도메인명과 서버.. 2021. 10. 22.
브라우저와 Node JS : 데이터를 가져올 수 있는 다양한 방법들 (추가중) 📍 클라이언트 단의 API 호출을 도와주는 Node.js 라이브러리 ✔ request ✔ axios ✔ jQuery 📍 클라이언트 단의 API 호출을 도와주는 브라우저 내장 객체 or 함수 ✔ XMLHttpRequest - 객체 ✔ fetch( ) - 함수 📌 XMLHttpRequest 특징 ◾ XML뿐만 아니라 모든 종류의 데이터를 받아올 수 있다. ◾ 오래된 브라우저를 지원하기 위해 아직까지도 쓴다. ◾ fetch가 아직 처리하지 못하는 일들을 위해 쓰인다. ( ex. 업로드 진행 상황 추적하기 ) ◾ 데이터를 동기적으로 불러올 수도 있고, 비동기적으로 불러올 수도 있다. 📌 XMLHttpRequest 사용법 📎 문법 // request를 요청하기 위해서는 3가지 단계가 필요하다. // 01 XMLH.. 2021. 10. 20.
[ Graph - BFS ] 인접 행렬 길 찾기 ✅ BFS 기초 개념 잡기 https://blog.naver.com/wpghks7/221598474816 BFS의 기초 개념을 잘 설명해놓은 블로그가 있어 첨부한다. 📍 제한 사항 주어진 인접행렬에서 한 정점으로부터 다른 정점으로 이어지는 길이 존재하는지 반환해야 합니다. 📍 예시 const result = getDirections( [ [0, 1, 0, 0], [0, 0, 1, 0], [0, 0, 0, 1], [0, 1, 0, 0] ], 0, 2 ); console.log(result) // true 📍 코드 공부 0과 2는 직접적으로 연결되어있지는 않다. 그러나 둘은 간선으로 연결되어있으므로 true 를 반환하도록 식을 짜야한다. 어떻게 해야할까 ?? 그리고 만약 첫번째 간선에서 원하는 결과가 탐색되.. 2021. 10. 13.
자바스크립트 프로그래머스 거스름돈 문제 풀이 📌 문제 ◾ 해설 Finn은 편의점에서 야간 아르바이트를 하고 있습니다. 야간에 손님이 너무 없어 심심한 Finn은 손님들께 거스름돈을 n 원을 줄 때 방법의 경우의 수를 구하기로 하였습니다. 예를 들어서 손님께 5원을 거슬러 줘야 하고 1원, 2원, 5원이 있다면 다음과 같이 4가지 방법으로 5원을 거슬러 줄 수 있습니다. 1원을 5개 사용해서 거슬러 준다. 1원을 3개 사용하고, 2원을 1개 사용해서 거슬러 준다. 1원을 1개 사용하고, 2원을 2개 사용해서 거슬러 준다. 5원을 1개 사용해서 거슬러 준다. 거슬러 줘야 하는 금액 n과 Finn이 현재 보유하고 있는 돈의 종류 money가 매개변수로 주어질 때, Finn이 n 원을 거슬러 줄 방법의 수를 return 하도록 solution 함수를 완성.. 2021. 10. 12.
Dynamic Programming 동적 프로그래밍 📌 동적 프로그래밍이란 ? 동적 프로그래밍이라고 해서 동적으로 ?!? 프로그래밍이 이루어지는 건 아니다 ㅋㅋㅋ 큰 문제를 작은 문제로 나누어 푸는 법을 말한다. -> 그럼 분할 정복 아닌가 ? 📍 Divide and Conquer 분할 정복이란 ? 분할 정복도 큰 문제를 작은 문제로 나누어 푸는 법이다. 그러나 동적 프로그래밍과는 큰 차이점이 있다. 분할 정복은, " 작은 문제 " 에서 반복이 일어나지 않는다. 동적 프로그래밍은, " 작은 문제 " 에서 반복이 일어난다. -> 불필요한 일들이 반복적으로 일어난다. 즉, 분할 정복은 진짜 큰 문제를 여러 개로 작게 작게 나눠서 푸는 방식이라면, 동적 프로그래밍은 어짜피 반복되는 작은 문제들을 한 곳에 묶어 놓거나(?) 기록(?) 하는 식으로 불필요한 반복들.. 2021. 10. 11.
[ Queue ] 프린터 📍 제한 사항 ✔ 인쇄 작업 목록은 칸으로 이루어져 있습니다. ✔ 각 칸에는 한 개의 문서만 위치할 수 있습니다. ✔ 문서는 1초에 한 칸만 이동할 수 있습니다. ✔ 인쇄 작업 목록의 크기는 bufferSize이고 최대 용량 capacities 만큼 문서를 담을 수 있습니다. 📍 예시 만약, 인쇄 작업 목록의 크기가 2이고 최대 용량이 10Kib라면 크기가 [7, 4, 5, 6] Kib인 문서들이 최단 시간 안에 순서대로 모두 인쇄되는 과정은 다음과 같습니다. 1초가 지나면 인쇄 작업 목록에는 7Kib 크기의 문서가 추가됩니다. 2초일 때 인쇄 작업 목록의 최대 용량이 10Kib이기 때문에 4Kib 문서는 작업 목록에 들어갈 수 없습니다. 동시에 7Kib 문서는 작업 목록에서 1칸 앞으로 이동합니다. 3.. 2021. 10. 9.
변수, 함수, 클래스 호이스팅 정리 📌 선언하는 모든 식별자는 호이스팅 된다 변수 선언문 (var, let, const), 함수 선언문 (function, function*), 클래스 선언문 (class) 은 모두 호이스팅이 일어난다. 📍 변수 ✔ var // var 키워드로 선언한 변수는 [1.선언 단계] & [2.초기화 단계]가 동시에 실행된다. // 따라서 변수 선언문 이전에 변수를 참조할 수 있다. console.log(VAR); // undefined var VAR; console.log(VAR); // undefined // 할당문에서 [3.할당 단계]가 실행된다. VAR = "var"; console.log(VAR); // "var" ✔ const ❗ const 키워드로 선언한 상수는 반드시 선언과 동시에 초기화 해야한다.❗ .. 2021. 10. 5.
REACT 컴포넌트 생명 주기 Component Life Cycle ❗ Component Life Cycle을 공부하게 된 계기 리액트를 파다보니 마운트, 언마운트, 업데이트 등 한번에 와닿지 않는 개념들이 많더라. 그래서 정리하기로 결심했다 ! 📌 리액트의 Component Life Cycle 리액트는 UI 중심의 컴포넌트 기반 개발 언어이다. 컴포넌트로 시작해 컴포넌트로 끝낸다고 해도 과언이 아니다. 때문에 리액트에는 컴포넌트 관리 방법과 과정을 명시한 "Component Life Cycle"이 존재한다. 컴포넌트 렌더링 직전 or 직후 또는 컴포넌트 업데이트 전 or 후에 처리해야하는 작업들을 순서에 맞춰 실행시킬 수 있다. 📍 Rendering // HTML // // React DOM은 이 안에 들어가는 모든 엘리먼트들을 "관리"한다. // 는 root DOM .. 2021. 10. 1.
CSS 반응형 브라우저의 텍스트 크기 조절 (-webkit-)text-size-adjust 📌 text-size-adjust 아이폰의 경우 viewport가 변경되면 자동으로 텍스트 크기를 자동으로 조정한다. 이처럼 디바이스의 상태가 변경되었을 때 원치 않는 결과가 렌더링될 수 있기 때문에 이를 방지할 수 있는 장치가 필요하다. 그 장치 중 하나가 바로 text-size-adjust 이다. text-size-adjust: none; 기본값. 텍스트의 크기를 자동으로 조절하지 못하게 한다. text-size-adjust: auto; 화면의 폭에 맞게 텍스트의 크기를 자동으로 조절한다. text-size-adjust: 100%; 폰트 크기를 명시적으로 지정해준다. 모든 디바이스에서 동일한 output을 낼 수 있다. text-size-adjust: inherit; 부모 요소의 속성값을 상속받아 적.. 2021. 9. 30.
Redux Action과 Reducer와 Store의 관계성 📌 파일 구조 📌 actions/index.js // action types export const ADD_TO_CART = "ADD_TO_CART"; export const REMOVE_FROM_CART = "REMOVE_FROM_CART"; // actions creator functions export const addToCart = (itemId) => { return { type: ADD_TO_CART, payload: { quantity: 1, itemId } } } export const removeFromCart = (itemId) => { return { type: REMOVE_FROM_CART, payload: { itemId } } } reducer 함수에 인자로 전해주고싶은 acti.. 2021. 9. 28.
자바스크립트 정규표현식 RegExp 📌 정규 표현식 ? 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어formal language이다. 자바스크립트의 고유 문법은 아니다. 대부분의 프로그래밍 언어와 코드 에디터에 내장되어 있다. 정규표현식은 문자열을 대상으로 패턴 매칭 기능을 제공하기 때문에 반복문이나 조건문을 사용하지 않고도 간단히 체크할 수 있다. 다만, 여러가지 기호를 혼합하여 사용하기 때문에 가독성이 좋지 않다. ^!^ 📌 정규 표현식 생성 ◾ 정규 표현식 리터럴 const target = 'Is this all there is?'; // 패턴: is // 플래그: i => 대소문자를 구분하지 않고 검색한다. const regexp = /is/i; // test 메서드 // target 문자열에 대해 정규 표현.. 2021. 9. 27.
CSS overflow 속성 📌 overflow 콘텐츠가 너무 커서 element의 Block Format Context를 맞출 수 없을 때의 처리법을 지정한다. 필요한 속성 (택 1) 📍 블록 레벨 컨테이너의 높이 (height / max-height) 📍 white-space: nowrap (※ white-space 속성은 element가 공백 문자를 처리하는 방식을 나타낸다.) ◾ overflow : visible; See the Pen by ciocio97 (@ciocio97) on CodePen. 기본값 / 콘텐츠를 자르지 않는다. ◾ overflow : hidden; See the Pen by ciocio97 (@ciocio97) on CodePen. 해당 element의 크기(정해진 크기)에 맞춰 컨텐츠를 과감히 잘라버.. 2021. 9. 26.
Binary Search Tree 구현 : pre-order / in-order / post-order 📌 Binary Search Tree class BinarySearchTree { constructor(value){ this.value = value; this.left = null; this.right = null; } insert(value) { if(value this.value){ if(this.right === null){ this.right = new BinarySearchTree(value); } else{ this.right.insert(value); }.. 2021. 9. 23.
자바스크립트 네이티브 객체와 호스트 객체 Native Object & Host Object 📌 자바스크립트 객체의 분류 (3) 자바스크립트 객체는 크게 네이티브 객체, 호스트 객체, 사용자 정의 객체 이렇게 3가지로 분류할 수 있다. 📌 네이티브 객체 Native Objects / Built-in Objects / Global Objects 란 ? ECMAScript(자바스크립트 언어 규약) 명세에 정의된 객체를 말한다. 애플리케이션의 환경과 관계 없이 언제나 사용할 수 있다. 애플리케이션 전역의 공통의 기능을 제공한다. ex. Object, String, Number, Function, Array, RegExp, Date, Math 📍 네이티브 객체(Global Objects)와 전역 객체(Global Object)는 다르다. 전역 객체는 모든 객체의 최상위 객체를 의미한다. ex. 브라우저.. 2021. 9. 22.
자바스크립트 프로미스와 비동기 처리 Promise & Asynchronous 프로미스를 이해하기 위해서는 자바스크립트가 자료를 어떻게 비동기적으로 받아오는 지, 해당 원리를 이해할 필요가 있다. 2021.09.18 - [개발 공부/Browser] - Event Loop & Task queue 이벤트 루프와 태스크 큐 Event Loop & Task queue 이벤트 루프와 태스크 큐 📌 브라우저 환경 📍 자바스크립트 엔진 (싱글 스레드) 대부분의 자바스크립트 엔진은 크게 2가지 영역으로 구분할 수 있다. ✔ 콜 스택 call stack (실행 컨텍스트 스택) 소스코드 평가 과정에서 code-designer.tistory.com 📌 프로미스 등장 배경 2021.09.20 - [개발 공부/JS] - 자바스크립트 콜백 함수와 비동기 처리 Call back func & Asynchron.. 2021. 9. 21.
자바스크립트 콜백 함수와 비동기 처리 Call back func & Asynchronous 콜백 함수를 이해하기 위해서는 자바스크립트가 자료를 어떻게 비동기적으로 받아오는 지, 해당 원리를 이해할 필요가 있다. 2021.09.18 - [개발 공부/Browser] - Event Loop & Task queue 이벤트 루프와 태스크 큐 Event Loop & Task queue 이벤트 루프와 태스크 큐 📌 브라우저 환경 📍 자바스크립트 엔진 (싱글 스레드) 대부분의 자바스크립트 엔진은 크게 2가지 영역으로 구분할 수 있다. ✔ 콜 스택 call stack (실행 컨텍스트 스택) 소스코드 평가 과정에서 code-designer.tistory.com 📌 비동기 함수에 콜백 함수가 필요했던 이유 // 여기서 흔히 말하는 callback 함수는 successCallback & failureCallback.. 2021. 9. 20.

티스토리툴바