Note

1. 개요 React는 두 가지의 컴퍼넌트 선언방식이 있습니다. 하나는 함수형 컴퍼넌트고, 다른 하나는 클래스형 컴퍼넌트입니다. 2. 컴퍼넌트 2.1. 함수형 컴퍼넌트 함수형 컴퍼넌트는 아래와 같은 형태를 합니다. import React from "react"; const FunctionalComponent = (props) => { const {description} = props; return Functional Component: {description} }; export default FunctionalComponent; 간단한 형태를 하고, 라이프사이클 기능을 사용하지 않아도 될 때 사용하기 좋습니다. Hooks이 생기면서 함수형 컴퍼넌트에서도 state를 사용할 수 있도록 되었습니다. 2.2...

1. 설치하기 설치하는 것은 간단한 편입니다. 우선 노드와 npm을 설치합니다. 여러 버전을 사용해야 한다면 NVM(NVM Install)을 통해 노드를 설치하도록 합니다. 노드 설치했다면 yarn을 설치합니다. $ npm instll -g yarn 이제 yarn을 통해 react app을 생성하도록 합니다. $ yarn create react-app react-practice react app이 생성되었으면 해당 디렉토리에서 필요한 라이브러리를 설치합니다. $ cd react-practice $ yarn add node-sass 이제 준비는 완료되었습니다. 아래 커맨드로 앱을 실행시키고 브라우저를 통해 http://localhost:3000 으로 접속하면 생성된 리액트 앱을 볼 수 있습니다. $ yar..

NVM은 다양한 버전의 NODE를 사용할 수 있도록 도와주는 툴입니다. 여러버전의 노드를 사용해야하는 상황이라면 유용하게 쓸 수 있는 도구입니다. (https://github.com/nvm-sh/nvm) curl을 통해 install 파일을 다운받고 실행시킵니다. $ sudo curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.35.1/install.sh | bash ~/.bash_profile 에 아래 내용을 추가합니다.(nvm을 설치하면 나오는 로그 하단에 있습니다.) export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm [ -s ..

Intro 개발 경력이 많지는 않지만 백엔드 개발을 하며 느낀 분석, 설계, 문서화에 대해 기술한 포스트입니다. 의식의 흐름대로 작성한 내용이라 부족한 부분이 많을 수 있는데 잘 못된 내용이나 수정되어야하거나 추가되어야 할 내용이 있다면 글을 읽고 지적 부탁드리고, 문의를 남겨주시면 최대한 답변드리도록 하겠습니다. 인간은 망각의 동물이다. 본인이 개발을 하더라도 시간이 지난다면 왜 그런식으로 개발을 했는지 잊어버리는 경우가 많다. 본인의 개발을 한 내용에 대해서도 그런데 다른사람이 개발한 내용은 어떠할까? 그 사람이 개발한 내용을 알기 위해 개발한 당사자를 찾아가서 왜 그런식으로 개발했는지, 어떤 이유가 있어서 이런 행위를 하는지 히스토리 확인을 해야된다. 이것도 그 사람과 알고있다는 가정하에 아주 좋은..

JVM? 정의된 스펙을 구현한 하나의 독자적인 프로세스 형태로 구동되는 Runtime Instance Java 프로그램의 모든 것들을 실행시키는 기본 데몬 Class 파일을 로딩하고 ByteCode를 해석하는 과정을 거쳐 메모리 리소스를 할당하고 관리하며 정보를 처리 Thread 관리 및 Garbage Collection과 같은 메모리 정리 용어 Java Source | 사용자가 작성한 Java 코드 Java Compiler | Java Source 파일을 JVM이 해석할 수 있는 Java Byte Code로 변경하는 Compiler Java Byte Code | Java Compiler에 의해 수행될 결과물(.class 파일) Class Loader | JVM 내로 .class파일들을 Load 하여 L..

기본 용어 @RequestMapping DefaultAnnotationHandlerMapping에서 매핑 url과 컨트롤러 메소드 매핑정보 생성 클래스, 메소드 레벨에 사용 가능 url, method, parameter, header 정보를 통해 구분 가능 url에 ANT스타일의 와일드카드 사용 가능 상속 가능 @RequestMapping("/home") @RequestMapping("/home*") @RequestMapping("/home/**/action") @RequestMapping("/user/{userId}") @RequestMapping({"/", "/index"}) @RequestMapping(value="/user/{userId}", method=RequestMethod.GET) @Req..

Spock Framework? Spock Framework는 Groovy 언어에서 동작하는 명세 프레임워크로 BDD를 편하게할 수 있도록 도와준다. Spock은 Java와 Groovy 어플리케이션을 위한 명세 프레임워크로 Groovy(DSL)로 작성하므로 간결하고 직관적인 장점이 있다. 또한, 기존의 Java의 JUnit, Hamcrest, Mockito를 전부 다 학습하는 것보다 손쉽게 학습할 수 있고, Mock, Stub, Spy등 사용이 편리하고 명세를 작성하기 편리하다. Java와 Groovy 어플리케이션을 위한 프레임워크이므로 Java환경에서도 사용할 수 있다. Lifecycle setup: 메소드 실행 전에 실행(given) when: 행위에 대한 명세를 작성 then: 행위에 대한 예측을 작..

BDD(Behavior-Driven Development)란? BDD는 TDD에서 파생된 개발 방법론으로 테스트에 대한 집중보다는 명세와 행위에 대해 비중을 두고 있다. TDD TDD는 Test Case(이하 TC)를 작성하고 실패를 확인 후 실제 비즈니스 코드를 작성, TC 성공확인을 하나의 반복주기로 잡고, 이를 반복해서 진행하는 것을 요구한다. 하지만 TC를 작성하는데 의문점이 있다. 코드가 없는데 무엇을 테스트할 것인가? TDD를 보면 무엇을 테스하는지에 대한 명시는 되어있지 않다. 또한, 보통 테스트라 하면 제품이 나오면 그 제품을 사용해보면서 제대로 작동하는지 확인을 해보는 과정인데, 제품이 나오지도 않았는데 테스트를 한다라는 것부터 모순이 생긴다. 이를 개선한 것이 BDD라고 생각을 한다. ..