본문 바로가기

분류 전체보기

[DesignPattern] 추상팩토리 (Abstract Factory) README 추상 팩토리 (Abstract Factory) - 객체 생성 의도 상세화된 서브클래스를 정의하지 않고도 서로 관련성이 있거나 독립적인 여러 객체의 군을 생성하기 위한 인터페이스를 제공 합니다. 다른이름 키트(Kit) 동기 포르쉐 자동차 공장에서 자동차를 모델별로 찍어내고있을 때, 모델별로 찍어내는 부품(문, 후드 등)들이 다를 것이다. 이렇게 다르게 되니, 제품군을 생성하기 위한 공통적인 인터페이스 를 생성한 후 해당 인터페이스를 별도로 작성해 사용할 수 있게끔 해주는것이 좋을것 같다. 활용 객체가 생성되거나 구성, 표현되는 방식과 무관하게 시스템을 독립적으로 만들고자 할 때 여러 제품군 중 하나를 선택해서 시스템을 설정해야 하고 한번 구성한 제품을 다른 것으로 대체할 수 있을 때 관련된 제..
[Javascript] 자바스크립트와 이벤트루프 JS_EventLoop 자바스크립트와 이벤트 루프 자바스크립트는 단일쓰레드 기반 언어이다. 이 뜻은, 동시에 하나만 처리할 수 있다는 말이다.하지만 웹 브라우저는 애니메이션기능이 실행되면서 이벤트 효과도 받고, Node.js 기반의 웹서버는 동시에 여러개의 HTTP 요청을 처리하기도하는데 이것을 가능하게 해주는것이 이벤트 루프 이다. ECMAscript 에는 이벤트 루프가 없다 ECMAscript 의 스펙을 자세히 보면 이벤트 루프에 관한 내용이 없다. 사실 이벤트루프를 지원해주는 것은 브라우저나, Node.js 와 같은 자바스크립트 엔진을 구동하는 환경이다. 출처 : 자바스크립트와 이벤트 루프 - 김동우 단일 호출 스택과 Run-to-Completion function A() { console.log(..
[vuejs] 기초연습을 위한 계산기 실습 README vuejs 기초연습을 위한 계산기 왜 만들었나? 기존에 계산기를 만든적이 있는데 소스코드가 너무 지저분했던것도 있고, vuejs 를 공부하는 김에 다시 다듬어볼까 하고 만들어봤습니다. 구성이 어떻게 되어있나? Vue instance 에 필요한 데이터들을 전부 집어넣었습니다. 크게 view-content 와 button-content 로 나누었습니다 button 을 렌더링할 때 조건을 걸어주어서 각 버튼에 맞는 css 를 적용 시켰습니다. 계산방식 숫자를 담는 numStack, 연산자를 담는 oprStack 을 나누어서 연산자 우선순위에 따라 실시간으로 계산이 되는 방식입니다. git clone https://github.com/heecheolman/vue-calc.git 공부하면 좋을 참고자..
[etc] 프로세스와 쓰레드의 차이 process_thread Process 와 Thread 의 차이 Process 와 Thread 의 차이를 설명해주세요 신입이나 인턴의 기술면접 단골질문 중 하나인데 제대로 개념이 잡혀있지않다면 당황할 수 밖에 없다. 당황하기 싫어서 해당 글에서 정리를 해보려고한다.먼저 개념부터 정리해보면 프로세스(Process) 란? 프로세스란 운영체제로부터 자원을 할당받는 작업 의 단위 쓰레드(Thread) 란? 프로세스가 할당받은 자원을 이용하는 실행 의 단위 하나의 프로세스가 실행되면 기본적으로 하나의 스레드가 생성이되는데 이를 메인스레드 라고 한다 그래서요? 정리하면, 어떤 프로그램을 실행을 하면 프로세스는 운영체제로부터 자원을 할당받는다. 해당 프로세스는 메인 스레드를 통해 코드를 실행하게된다.여기까지 살펴본..
[etc] 동기와 비동기, 블로킹과 논블로킹 정리 sync_async Blocking I/O 와 NonBlocking I/O, Synchronous 와 Asynchronous 동기(Synchronous)와 비동기(Asynchronous) 그리고 블로킹과 논블로킹의 차이를 알아본다. 많이 보게되는 단어들인데 이 용어들에 대해 정리해서 말을 할 수 없었기에 공부를 하기로 했다. 아래의 참고문서를 보며 정리를 했다. Blocking I/O / NonBlocking I/O Blocking I/O 호출된 함수가 자신의 작업을 모두 끝낼때까지 제어권을 가지고 있어 호출한 함수가 대기하도록 만듦 NonBlocking I/O 호출된 함수가 바로 return 해서 호출한 함수에게 제어권을 주어 다른 일을 할 수 있게 함호출되는 함수가 바로 리턴하느냐 마느냐가 중점 Sy..
[vuejs] 뷰 템플릿 (vue templates) vuejs-templates vuejs-templates Boilerplate 란? boilerplate 는 반복되며 자주 쓰이는 것들에 대해 미리 개발환경설정을 구성해놓은 일종의 템플릿 개념이다.front-end 개발을 하다보면 babel, webpack 등 많이 쓰이는 모듈들 또는 빌드 설정들, 폴더구조들을 반복적으로 설정하게되는데 이를 미리 만들어 놓는것이다.이렇게 자동화를 해놓으면 갖다 쓰기만 하면돼서 개발환경구축에 시간과 비용을 단축시킬 수 있다. $vue list해당 명령어를 통해 공식적인 뷰 템플릿의 리스트들을 확인할 수 있다. vuejs-templates 종류 vue-webpack-boilerplate webpack + vue-loader 조합으로 hot-reload, lint-on-sav..
[vuejs] 뷰 라이프사이클 (Vue life-cycle) vue-lifecycle Vue.js 라이프사이클 이해하기 Vue.js 의 라이프사이클은 크게 4가지로 나뉜다. Creation Mounting Updating Destruction 위의 그림은 Vue.js 의 라이프사이클 다이어그램이다. 빨간색폰트가 컴포넌트에서 사용할 수 있는 함수들이다. Creation : 컴포넌트 초기화 컴포넌트들을 초기화하는 단계이며 서버렌더링에서 지원되는 단계이다. 클라이언트나 서버 렌더 단에서 처리해야 일이 있으면 이 단계에서 진행한다.아직 Component가 DOM 에 추가되기 전이므로 DOM에 접근할 수 없다. new Vue() Vue Instance 생성 Init(Events & Lifecycle) Event 와 Lifecycle 초기화 beforeCreate 가장 처음..
[blah blah] 2018 SW개발 하계인턴(정규직 채용 연계형) 코딩테스트 후기 2018 SW개발 하계인턴(정규직 채용 연계형) 코딩테스트 후기 ㅋㅋㅋㅋㅋㅋ 망했다.서류전형은 합격했지만 코딩테스트 필기테스트에서 엄청 갈릴것같다. 문제는 저작권상 알려줄 수 없다 [느낀점] * 필기도 생각보다 많이 어려웠다ㄴ 여러가지 유형의 필기문제들이 많았다. 좀 더 기본적인 것들을 배워야겠다. ㄴ 생각하는 힘이 부족한것같다 * 일단 백준 알고리즘을 많이 풀어봐야할것같고 문법에도 익숙해져야겠다ㄴ 알고리즘에도 많은 종류가 있는데 종류별로 매일매일 풀어보는게 좋을것같다ㄴ 기본적인 문자열 다루기에 힘좀 써야겠다.ㄴ 생각하는것을 코드로 옮기는것이 아직 미숙한듯 하다, 특히 문자열 * 원래부터 목표는 서류전형 1차였으니 다시 심기일전해서 가야겠다.ㄴ 아직 공부한지 반년밖에안됐으니 천천히 다시 생각해봐야겠다.ㄴ..

티스토리툴바