Back Ground

주관적인 생각 솔직히 요즘 시대에 쓰는게 맞는가 싶을 정도로 왜 사용하는지 잘 모르겠다.전자정부프레임워크 사용시 사용 된다고 하는데 STS나 Eclipse에도 eGov 설정을 쉽게 할 수 있는데Kawa를 사용한다는 이야기를 들어서 알아 봤지만특별히 사용 목적을 잘 이해가지 않는데 혹시 Kawa로 사용해서의 장점같은 것들이 있다면댓글로 적어주셨으면 감사하겠습니다. Kawa 는 자바 언어이 특성을 그대로 보여줄 수 있는 쉐어웨어(Shareware) 통합개발환경으로 Tek-Tools사 제품자바 전용 툴이기는 하지만 JDK 는 따로 설치를 해야 한다.통합 환경 : 전문적인 자바 프로그램을 개발하기 위한 환경 2.1 자바 개발 환경 Kawa는 Java 플랫폼에서 다른 프로그래밍 언어를 구현 하는 데 유용한 프레임..

콜백 지옥(Callback hell) 콜백 지옥은 비동기 처리 로직을 위해 콜백 함수를 연속해서 사용할 때 발생하는 문제이다. 123456789$.get('url', function (response) { parseValue(response, function (id) { auth(id, function (result) { display(result, function (text) { console.log(text); }); }); });});Colored by Color Scriptercs 웹 서비스를 개발하다 보면 서버에서 데이터를 받아와 화면에 표시하기까지 인코딩, 사용자 인증 등을 처리해야 하는 경우가 있다.만약 이 모든 과정을 비동기로 처리해야 한다고 하면 위와 같이 콜백 안에 콜백을 계속 무는 형..

객체 리터럴 객체 리터럴에는 편리한 기능들이 추가되었다.- ES51234567891011121314var sayNode = function(){ console.log('Node');}var es = 'ES';var oldObject = { sayJS : function(){ console.log('JS'); }, sayNode : sayNode,};oldObject[es + 6] = 'Fantastic';oldObject.sayNode(); // NodeoldObject.sayJS(); //JSconsole.log(oldObject.ES6); //FantasticcsoldObject 객체에 동적으로 속성을 추가하고 있다. 앞의 코드를 다음과 같이 다시 쓸 수 있다. - ES61234567891011121..

VSCODE - Debugger for chrome VSCODE에서 확장 프로그램중 Debugger for chrome 를 설치 해준다.크롬에서 JS 코드를 Debugger할 수 있게 할 수 있다. 그 후 디버깅 탭으로 들어간 후 설정을 누른다, 그런 후 이렇게 바꿔주면 되는데 { // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "..

redux-actions를 이용한 더 쉬운 액션 관리 redux-actions 패키지에는 리덕스 액션들을 관리할 때 유용한 createAction과 handleActions 함수가 있다. 이 함수들은 다음과 같이 yarn으로 설치한다. yarn add redux-acitons이렇게 불러와 사용 할 수 있다. 1import {createAction, handleActions } from 'redux-actions';cs 각 함수의 용도와 사용법createAction을 이용한 액션 생성 자동화 리덕스에서 액션을 만들다 보면 모든 액션에게 일일이 액션 생성자를 만드는 것이 번거로울 수 있다. 123456789export const increment = (index) => ({ type: types.INCREM..

리덕스에서 사용하는 파일들은 일반적으로 액션 타입, 액션 생성 함수, 리듀서 이렇게 세 종류로 분류하여 관리한다. 리덕스 공식 문서에서도 기초를 다룰 때는 이 방식으로 설명한다. 하지만 파일들을 어떻게 구조화할지 정해진 방식은 없다. 이렇게 파을을 세 종류 나누어 리덕스 관련 코드를 작성하다 보면 액션을 하나 만들때마다 파일 세개를 수정해야 한다.그렇게까지 번거로운 작업은 아니지만, 몇몇 개발자는 귀찮았던 모양이다.이 처럼 '액션 타입, 액션 생성 함수, 리듀서를 모두 한 파일에서 모듈화하여 관리하면 어떨까?' 라는 아이디어로 만든 파일 구조가 바로 Ducks파일 구조이다. 이 파일 구조는 개발자인 erikras(Erik Rasmussen)가 처음으로 제시했는데(https://gtihub.com/erik..

Immutable.js 익히기 Immutable.js는 자바스크립트에서 불변성 데이터를 다룰 수 있도록 도와준다. Immutable.js를 알기전에 객체 불변성을 알아야 한다. 객체 불변성Immutable.js 객체 불변성을 이해하려면 간단한 자바스크립트 코드를 실행해 보아야 한다. 크롬 웹 브라우저에서 개발자 도구를 열고 다음 코드를 입력해보자 1234let a = 7;let b = 7;let object1 = {a: 1, b:2 };let object2 = {a: 1, b:2 };cs 보다시피 a 값과 b값은 같다.둘은 === 연산자로 비교해 보면 당연히 true를 반환할 것이다.하지만 object1과 object2가 가진 값이 같더라도 서로 다른 객체이기 때문에 둘을 비교하면 false를 반환한다 ..

React.PureComponent는 React.Component와 매우 유사하다. 하지만 한 가지 다른 점이 있다면, React의 생명주기 메소드 중 하나인 shouldComponentUpdate를 다루는 방식이 다르다는 것이다. React.PureComponent는 shouldComponentUpdate가 이미 구현되어 있는데, props와 state를 얕은 비교를 통해 비교한 뒤 변경된 것이 있을 때만 리렌더링한다. 즉, React.PureComponent를 사용하면 React애플리케이션 성능을 향상시키는 데 가장 중요한 것 중 하나인 shouldComponentUpdate를 신경쓰지 않아도 된다. 하지만 props나 state가 복잡한 데이터 구조를 포함하고 있다면, props와 state를 비교..