전체보기 (32) 썸네일형 리스트형 Node.js 서버사이드 자바스크립트를 사용하는 프론트엔드 개발자들도 이 자바스크립트를 사용하여 백엔드 서비스 개발을 할 수 있도록 만들어준게 바로 이 Node.js이다. 여기서 말하는 백엔드 서비스란, API(Application Programming Interface) 라고도 불린다. 유저들과 직접적으로 액션이 일어나는 Web App 이나 Mobile App 도 이 백엔드 서비스를 통해서 데이터를 주고 받아 보여지게 된다. 왜 Node.js 인가? 1. 프로토타입핑과 애자일 개발에 효과적이다. 애자일 소프트웨어 개발이란 : 완전한 무계획이나 너무 완벽한 계획에서 벗어나 일정한 주기로 프로토타입을 만들어 이를 발전시켜가는 방법론이다. (출처: 위키피디아) 2. 시스템적으로 빠르고 예상한 결과를 쉽게 측정하고 얻어낼 수 있다. .. React.js_리액트 React.js 란? " 사용자 인터베이스를 만들기 위한 JavaScript 라이브러리 " 현재와 같이 유저들과 수많은 인터액션이 일어나는 인터넷 페이지에서 불편한 부분을 줄이고 훨씬 더 효율적으로 운영하고 관리하기 위해서 만들어진 프론트엔드 라이브러리다. 웹상에서 돔의 상태변화가 주기적으로 또는 셀 수 있을 만큼 일어난다면 리액트를 쓰지 않고도 자바스크립트만을 이용해 인터페이스를 만들어 줄 수있다. 하지만 무수히 많은 클릭과 동적인 상태변화를 요구하는 지금은 그 많은 상태들을 관리하기 쉬운 상태로 쪼개놓고 필요한 부분만을 쉽고 편하게 관리하게 만들어 주는게 바로 리액트다. 우리가 많이 사용하는 페이스북의 개발자들이 만든 라이브러리이고 굵직굵직한 기업에서도 많이 사용하고 있어 넓은 생태계속에서 빠르게 성.. setTimeout() && setInterval() 자바스크립트 setTimeout(func, millisec) setTimeout()은 어디선가 그리고 아무래도 익숙한 느낌이다. 뭔가 시간과 관련된 함수일 것 같은 그런 느낌. 그리고 그 느낌이 맞다. 원하는 시간을 설정하면 그 시간이 지난 후 함수를 실행하게 된다. 포인트 setTimeout() 과 setInterval() 은 비동기적으로 작동하는 함수이다. 자바스크립트는 동기적으로, 즉, 스크립트를 순차적으로 읽으며 실행된다. 이 말은 윗라인의 실행이 끝나기 전까지는 아래라인은 실행할 엄두도 내지 못한다는 것이다. 예를 들어보자. 1 2 3 4 5 6 7 console.log('start working'); console.log('still working'); console.log('end working'); /.. Web Architecture Web Architecture 란? 이제는 삶에서 없으면 안될만큼 아주 중요한 부분을 차지하고 있는 것이 바로 인터넷이다. 처음에는 인터넷에 연결이 되기만 하면 둥둥 떠있는 것처럼 원하는 곳으로 헤엄치며 다니면서 원하는 정보를 보고 듣고 가져올 수 있을 거라고 생각했다. 아주 추상적인 생각이다. 이번 블로그에서는 이러한 일을 가능하게 만들어 주는 구성요소에 대해 간략히 알아보자. Application Programming Interface(API) 어떤 프로그램에서 사용할 수 있도록 운영체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스 *인터페이스: 서로 다른 두개의 시스템, 장치 사이에서 정보나 신호를 주고받는 경우의 접점이나 경계면 Client (=== Browser) 사용자가.. [Algorithms]N-queens (Chess Puzzle) 알고리즘, 연습 또 연습 알고리즘적 사고를 한다는건 정말 어려운 일이다. 인간은 컴퓨터와는 다르게 생각하기 때문이다. 일련의 모든 과정들을 일일이 명령하고 알려줘야만 컴퓨터는 사고할 수 있다. 이번에 다룰 알고리즘 또한 만만치 않은 퍼즐이다. 지난 세기의 대결, 이세돌과 알파고와의 대결은 엄청났다. 알파고는 어떻게 바둑을 뒀을까? 물론 딥러닝과 같은 컴퓨터 기술을 구현하는건 아니지만 체스보드를 활용해서 꽤 유명한 알고리즘 퍼즐을 풀어봤다. 우리는 체스의 규칙을 알지만 컴퓨터는 모른다. 그렇기 때문에 각각의 경우마다 어떻게 체스를 둬야할 지 하나하나 길을 알려주어야 하는 것이다. 그 중, 체스의 가장 강력한 말인 퀸을 구현해본다. 여기서 말하는 N은 체스보드의 크기이며, 어떠한 보드의 사이즈(NxN)가 오.. Prototype? __proto__? constructor? 1. Prototype(프로토타입)과 __proto__(언더바언더바 프로토 언더바언더바) 여러 다른 언어들과 비슷하게 자바스크립트도 객체지향 프로그램 언어 중 하나이다. 사실 이해하는데 있어서 쉽지 않은 부분이기 때문에 콘솔창을 열고 직접 객체를 만들어가면서 공부하면 조금 더 쉽게(?) 이해할 수 있다. 자바스크립트에서 생성되는 모든 객체는 부모의 형태를 본따서 생성되게 된다. 자바스크립트를 객체지향 언어라고 하는 이유는 어떤 객체든 Object.prototype을 최초의 조상으로 이어져 생성되기 때문이다. 그 말은, 즉, 부모 객체의 부모 객체의 부모 객체로부터 프로퍼티나 메소드를 상속받게 된다는 것이다. 이것을 자바스크립트의 Inheritance(상속) 라고 한다. 먼저 생성자 함수를 사용하지 않고,.. if(object[key] !== undefined) VS for(let key in object) VS Object.hasOwnProperty(key) : 누가 더 빠를까? 1. Time Complexity (시간 복잡도) 2. 누가 더 빠를까? 시간 복잡도를 검색하는데 흥미로운 질문을 발견했다. " if(object[key] !== undefined) VS for(let key in object) VS Object.hasOwnProperty(key) " 쉽게 말해 O(1)과 O(n)과의 대결이다. 한번 보는게 낫기 때문에 테스트 사이트를 이용해 확인 할 수 있다. 아래 사이트는 몇년전에 만들어졌기 때문에 최신 브라우저의 성능을 기준으로 결과를 주진 않지만 어떤 방법이 더 빠르게 작동하는지 알 수 있다. https://jsperf.com/double-lookup/4 Double Lookup · jsPerf Test runner Warning! For accurate resu.. Hash Table Data Structure(해시 테이블 자료구조) 1. 해시 테이블(Hash Table) 이란? 데이터의 관리 및 유지하는데 있어서 최대한 빠르게 원하는 데이터에 접근하기 위한 자료구조이다. 검색하고자 하는 Key값을 입력받아 해쉬함수를 통해 HashCode를 생성하고, 그 HashCode를 배열의 index로 환산하여 해당 index에 값(value)을 저장한다. 즉, 인덱스와 값은 언제나 연관성을 가지고 있다. 장점: 빠른 서치 유연한 키값 단점: 비정렬된 구조 한방향 서칭 메모리 비효율적 구조 만약 colision 발생시 대처방법 1) Linear Probing(선형탐사) 해시 함수로부터 얻어낸 주소에 이미 다른 데이터가 입력되어 있으면 현재 주소를 기준으로 고정 폭으로 다음 주소로 이동해 비어있는 주소에 입력한다. 서치방법 : 원하는 데이터를 서.. 이전 1 2 3 4 다음
