지난상에서는 웹어플리케이션을 만들고 이를 도커 컨테이너를 통해서 실행하는 방법을 알아보았습니다 이번시간에는 앞에 쓰였던 Dockerfile 명령어에 대해서 알아보도록 하겠습니다 Dockerfile FROM openjdk:11-jdk-slim ARG JAR_FILE=target/*.jar COPY ${JAR_FILE} app.jar ENTRYP...

지난장에서는 Docker 와 관련한 전반적인 내용을 다루어보았습니다 얕게나마 개념정도 알고 진행을 했습니다 이번시간에는 직접 웹 어플리케이션을 만들고 그 어플리케이션을 도커 이미지화 해서 만들어서 실행하는 방법까지 진행을 해보도록 하겠습니다 maven <parent> <groupId>org.springframework.boot...

이 장에서는 Docker 의 전제적인 부분을 할 수 없으므로 간단하게 Docker 의 정의가 무엇인지 왜 Spring MicroService 와 같이 사용되는지 그리고 간단한 어플리케이션을 만들어서 Docker 허브로 보내는거 까지 해보도록 하겠습니다 Docker 도커는 2013년 3월 dotCloud 설립자이자 CEO 인 솔로몬 하익스가 만든 리...

개인적인 프로젝트를 하다가 다음과 같은 상황에서는 react 는 어떻게 할 수 있을까 다음 상황은 아래와 같다 상황 1. 요소는 input 과 button 이 존재함 2. button 을 클릭할 시 input 의 focus 상태가 되어야 함 그럼 일단 react 로 하기 전에 위와 같은 내용을 바닐라 자바 스크립트로 한번 만들어보자 바닐라 자...

Lifting State Up 모든 프로그램이 그렇지만 데이터는 단방향으로 흘러야 합니다 리액트도 마찬가지입니다 부모컴포넌트 와 자식컴포넌특사 있으면 데이터의 흐름은 부모 -> 자식으로 흐르는것이 원칙입니다 예를 들어서 자식에서 수정한 state 의 값이 부모에게 반영이 되는건 데이터 방향도 맞지 않을 뿐더러 데이터라 단방향으로 흐르는 리액트의...

직접 웹페이지를 만들때 반복되는 HTML DOM 을 사용하고 할때 다음과 같이 사용했습니다 let _list_html_dom; for(let i = 0; i < 10; i++){ _list_html_dom+=`<li>${i}</li>`; } const ul_parents = document.querySelect...

리액트에서는 true , false 로 인해서 렌더링이 될지 안될지 결정하는 Condition Rendering 이 있습니다 오늘은 이에 대해서 알아보겠습니다 Truthy , Falsy 그전에 먼저 이에 대해서 알아보겠습니다 컴퓨터 프로그래밍 자료형에서 참 거짓을 나태내는 자료형은 Boolean 이라는 자료형입니다 이 자료형에는 true , fals...

우리는 지난시간까지 React 의 라이프 사이클에 대해서 공부를 해보았습니다 이번시간에는 Event 에 대해서 공부를 해보겠습니다 Event 웹어플리케이션에서 Evnet 라는것은 어떤 사건을 말합니다 이때 이 Event 는 정말 다양한데 어떤 버튼을 눌렀다 form 양식에 데이터를 입력했다 등 정말 수 많은 이벤트로 웹사이트가 이루어져 있습니다 우리...

지난시간에는 컴포넌트가 업데이트 되는것까지 확인을 했다면 이제는 마지막 라이프 사이클중 하나 컴포넌트가 unmount 일대를 살펴볼것입니다 마찬가지로 class 버전하고 function 버전 짜로 살펴보겠습니다 componentWillUnmount 리액트에서 컴포넌트의 생명주기(lifecycle) 중 unmount 단계는 컴포넌트가 DOM에서 제거되...

지난시간에는 Class 형 컴포넌트에서 state 가 업데이트 될때 자동으로 호출되는 componentDidUpdate 를 알아보았다 그렇다면 함수형 컴포넌트에서는 어떻게 이를 만들 수 있을까? 사실 이는 우리가 앞에서 한번 보았다 그래도 다시 함수형 컴포넌트로 만들어서 진행을 해보자 useEffect useEffect(() => {호출할 함...