CS겸 취준까지

스택(Stack) 스택(Stack)은 가장 마지막에 저장된 데이터가 가장 먼저 삭제되는 후입선출(LIFO, Last In Firist Out) 구조이다. 스택은 한쪽 방향에서만 데이터의 삽입과 삭제가 가능하다. 스택 용어 top(peek) : 가장 최근에 저장된 데이터이자 먼저 삭제 될 데이터이다. 그림상 요소4에 해당 push : 데이터를 삽입하는 것을 말하며, 삽입된 데이터는 삭제시 가장 먼저 삭제 될 데이터 pop : 데이터를 삭제 할 때 사용하며, 가장 최근에 저장된 데이터가 삭제된다. 사용되는 예 브라우저의 뒤로가기 실행 취소(Ctrl + z) 재귀 함수 : 자기 자신을 호출하는 함수 함수를 호출할 때마다 해당 함수의 지역변수, 반환주소, 매개변수 등의 정보를 호출 스택이라는 메모리 영역에 저장..

리덕스는 리액트 생태계에서 가장 사용률이 높은 상태관리 라이브러리다. 리덕스를 사용하면 여러분이 만들게 될 컴포넌트들의 상태 관련 로직들을 다른 파일들로 분리시켜서 더욱 효율적으로 관리 할 수 있으며 글로벌 상태 관리도 손쉽게 할 수 있다. Context API 를 사용해도 글로벌 상태 관리를 할 수 있고 상태 관리 로직을 분리 할 수 있다. 특히, Context API 와 useReducer Hook 을 사용해서 개발하는 흐름은 리덕스를 사용하는 것과 매우 개발 방식이 유사하다. 리덕스에서도 리듀서와 액션이라는 개념을 사용한다. Redux는 Context API 가 지금의 형태로 사용방식이 개선되기도 전에, 그리고 useReducer 라는 Hook 이 존재하기도 전 부터 만들어진 라이브러리다. 사실 C..

ESLint란 ESLint는 ‘작성한 JS코드가 EcmaScript재단에서 명시한 Specifiaction에 부합하는지 검사해주는 툴’ 이라고 할 수 있음 ESLint는 문자 그대로 ES와 Lint를 합친 것 ES는 EcmaScript로서 Ecma재단에서 만든 Script Specification이라 할 수 있고 Lint는 에러가 있는 코드에 표시를 달아주는 것을 의미함 ESLint는 코드에 특정 스타일과 규칙을 적용해서 문제를 사전에 찾고 패턴을 적용시킬 수 있는 정적 분석 툴로 분류 함 기본적인 기능은 에러도출이나 전반적인 코딩스타일(tab설정, ; 여부, usingSpaces 등)을 직접 정할 수도 있음 ESLint는 자신의 스타일과 규칙을 정해서 사용할 수도 있고 대기업에서 사용하는 스타일과 규칙..

JavaScript의 런타임 모델 자바스크립트는 싱글 스레드 기반의 언어이다. 하나의 스레드 = 하나의 콜 스택 = 한번에 하나의 작업 입력된 호출을 순차적으로 실행한다. 앞선 코드가 다 실행되기 전까지 다른 코드를 실행시키지 않는다. 자바스크립트는 웹브라우저 상에서 동작한다. 실행하기 까지 오래걸리는 A라는 코드가 존재하면 나머지 화면 렌더링이라던가 다른 동작해야하는 모든 코드가 A코드가 실행을 마칠 때까지 기다려야 한다.(블로킹 현상) 이벤트 루프 이벤트 루프는 코드의 실행, 이벤트의 수집과 처리, 비동기 함수들의 처리를 담당하는 메커니즘이다. 동기 함수는 그대로 실행하게 되고 비동기 함수들은 Web API로 처리하여 일을 분배한다. 자바스크립트의 싱글 쓰레드 특성을 유지하면서 비동기적인 동시성을 제..

각자 취준과 CS지식을 목표로 하는 스터디 격주로 CS공부와 취준 스터디를 한다(2주, 4주) 토요일 오후2시 게더에 모두 모인다 못만날 경우 당사자가 모두에게 말해줄것 취준스터디 후 왕을 정해 CS공부 주제를 정한다 CS발표날에는 1시까지 정리본을 블로그에 올리고 다른사람의 정리게시물을 읽고 발표를 듣는다 CS발표후 질문은 댓글을 적으며 최대 일요일까지 대댓글을 적어 질문을 답변한다 취준스터디 후 피드백은 피드백카테고리에 각 사람에게 적으며 제목은 '[날짜 주제] 이름'으로 한다 이력서를 서로에게 나누고 사전 질문을 미리 공지하지 않은채로 임한다(답변자는 자기 선택) 이력서는 노션첨부 CS는 격주마다 이력서 피드백은 필요할때마다 면접준비는 주에 월수금 9시

아래의 글은 좋은 글들을 발췌해 모아 편집한 내용입니다. 발췌의 출처는 제일 하단에 모아놓았습니다. 브라우저 이벤트 이벤트란 시스템에서 일어나는 액션이다. 브라우저의 모든 DOM 노드는 액션을 만들어 낼 수 있다. 이벤트 흐름의 3단계 캡처링 단계 – 이벤트가 하위 요소로 전파되는 단계 타깃 단계 – 이벤트가 실제 타깃 요소에 전달되는 단계 버블링 단계 – 이벤트가 상위 요소로 전파되는 단계 참고) 자주 사용되는 DOM 이벤트 마우스 이벤트: click : 요소 위에서 마우스 왼쪽 버튼을 눌렀을 때(터치스크린이 있는 장치에선 탭 했을 때) 발생합니다. contextmenu –:요소 위에서 마우스 오른쪽 버튼을 눌렀을 때 발생합니다. mouseover와 mouseout : 마우스 커서를 요소 위로 움직였을..

1. 클로저란? 클로저는 프로그래밍 언의 스코프와 관련된 속성으로, 특히 함수형 프로그래밍에서 중요하다. 여기서 함수형 프로그래밍에서 중요한 이유는 1. 테이터 은닉 : 클로저를 사용하면, 특정 함수에 한정된 변수를 만들 수 있다. 이는 외부에서 해당 변수에 접근하거나 수정하는 것을 막을 수 있다. 이런 특성은 모듈화, 정보 은닉, 캡슐화 등의 개념과 일치하며, 프로그램의 안정성을 높인다. 2. 상태유지 : 클로저는 함수가 종료된 이후에도 특정 데이터를 기억하는데 사용한다. 이는 함수가 일종의 상태 유지하는 것이다. 예를 들어 함수 호출 간에 일종의 메모리를 갖게 해준다. 이러한 특성은 반복자, 비동기 프로그래밍, 함수 메모이제이션 등에 유용하게 사용된다. 3. 고차 함수와의 상호작용 : 클로저는 고차 ..

한국소프트웨어진흥원 공개SW지원센터의 문서에서 발췌했습니다. 크로스 브라우징이란? 크로스 브라우징(상호 호환성)이란 표준 웹기술을 채용하여 1. 다른 기종 혹은 플랫폼에 따라 달리 구현되는 기술을 비슷하게 만듦. 2. 어느 한쪽에 최적화되지 않도록 공통 요소를 사용해 웹페이지를 제작하는 기법 모든 웹브라우저에서 100% 똑같이 보이도록 만드는 것은 오해다. OS가 다르고, 기본 글꼴이 다르며 HTML을 렌더링하는 엔진이 다르기 때문에 모든 웹브라우저에서 100% 똑같이 보이게 하는 것은 가능하지 않다. 웹브라우저간 특이성 브라우저의 특이성은 당연히 존재하는 것, 특징을 알아두고 최대한 표현하고자 하는 컨텐츠 형태로 출력하는 것이 중요하다. 1. 모든 브라우저가 HTML, CSS, 자바스크립트 표준안을 충..

[ CORS(교차 출처 리소스 공유) ] CORS(Cross-Origin Resource Sharing)는 출저가 다른 자원들을 공유한다는 뜻으로 한 출저에 있는 자원에서 다른 출처에 있는 자원에 접근하도록 하는 개념 즉 교차되는 출처 자원들의 공유 다른 출처에 있는 자원을 요청한다고 하면 이를 교차 출저 요청이라고 부름 교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS)는 추가 HTTP 헤더를 사용하여, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제입니다. 웹 애플리케이션은 리소스가 자신의 출처(도메인, 프로토콜, 포트)와 다를 때 교차 출처 HTTP 요청을 실행합니다. - mdn 설명..

CORS란 교차 출처 리소스 공유(Cross-origin Resource Sharing)로, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하기 위한 체제이다. 출처는 프로토콜, 도메인, 포트로 구성되며, 같은 출처는 이 세 가지 요소가 동일한 경우를 말한다. 브라우저는 CORS 정책을 적용하여 요청을 보낼 때 출처를 검사하고, 서버는 응답 헤더를 사용하여 허용된 출처를 명시한다. 만약 CORS 정책을 위반하는 리소스 요청이 발생하면 브라우저는 해당 응답을 무시하고 접근을 차단한다. CORS의 동작 방식은 크게 세 가지가 있다: Preflight Request (프리플라이트 요청): 브라우저는 특정 조건을 충족하는 요청에 대해 사전에 서버에 OPTIONS ..