전체 글(355)
-
[Spring Boot] Spring Boot로 프로덕션 환경 배포 준비하기 - (2) Configuration Properties
어플리케이션의 복잡한 설정을 지정하는 방법에 대해서 알아보겠습니다. 현재 통신하고 있는 통화 서비스가 있고, 이 서비스의 여러 값을 설정한다고 가정해보겠습니다. 위의 이미지와 같이 application.properties에 설정값들을 설정하고 그 외에 다른 기타 부수적인 설정들도 존재한다고 가정하겠습니다. Spring Boot를 사용하여 이 어플리케이션 설정들을 관리할 수 있는 방법은 무엇일까요? 여기서 Property 값을 정의하고 Spring Boot 어플리케이션에서 활용할 수 있는 방법은 무엇일까요? 어플리케이션을 위해 어필리케이션 설정을 많이 생성하려고 하는 경우 Spring Boot 에서 권장되는 방식은 Configuration Properties를 사용하는 것입니다. Configuration ..
2023.09.02 -
[Spring Boot] Spring Boot로 프로덕션 환경 배포 준비하기 - (1) Profile
이번에는 프로덕션 환경에서 사용 가능한 어플리케이션을 쉽게 만들어 배포할 수 있도록 하는 Spring Boot의 중요한 기능을 몇 가지 알아보겠습니다. Profile 기능 첫 번째로 살펴볼 기능은 Profile을 사용하여 어플리케이션 설정을 관리하는 기능입니다. 어플리케이션에는 다양한 환경이 있습니다. 개발 환경, QA 환경, 스테이지 환경, 프로덕션 환경 등등. 동일한 어플리케이션의 다양한 환경에서는 다양한 설정이 필요합니다. 동일한 코드에서 다양한 환경에 대한 다양한 설정이 있어야 할 필요가 있죠. 다른 데이터베이스와 통신하거나 다른 웹 서비스를 호출할 수도 있습니다. 개발 환경은 개발 데이터베이스와 통신하고 테스트 환경은 테스트 데이터베이스와 통신하며, 프로덕션 환경은 프로덕션 데이터베이스와 통신합..
2023.09.02 -
[Spring Boot] Spring Boot DevTools로 빠르게 빌드
DevTools를사용하면 개발자의 생산성을 높일 수 있습니다. 개발자들이 어플리케이션을 빌드할 때면 아주 빠르게 빌드하기를 바랍니다. 그래서 개발자에게 있어 생산성은 정말 중요하다고 볼 수 있습니다. 흔히 처음 개발을 접하거나 주니어 개발자들이 코드를 변경하거나 할 때 수동으로 서버를 재시작하는 모습을 볼 수 있는데 그렇지 않고 자동으로 서버를 다시 시작하고 코드에 대한 변경사항을 적용하는 것을 DevTools를 통해 수행할 수 있습니다. DevTools 사용 DevTools를 사용하려면 pom.xml을 사용하거나 build.gradle을 사용해야 합니다. 저의 경우 gradle 환경이기 때문에 build.gradle을 사용합니다. 그리고 spring-boot-devtools 디펜던시를 추가해줍니다. 그..
2023.09.02 -
[React] Spread 연산자
Spread 연산자는 기존에 길게 작성되었던 코드를 단순화하여 줄일 수 있는 연산자입니다. 예를 들어 if문으로 여러 조건을 가진 코드를 spread 연산자를 통해 줄여줄 수 있습니다. 이를 arrow function과 useState 에 접목해서 사용하는 방식에 대해서 알아보겠습니다. 기존 방식의 긴 코드 작성 App.jsx import React, { useState } from "react"; function App() { const [contact, setContact] = useState({ fName: "", lName: "", email: "" }); function handleChange(event) { const { name, value } = event.target; setContact..
2023.08.31 -
[React] Complex한 state 관리
이번에는 기존의 state 관리하는 방법보다 좀 더 복잡한 state를 관리하는 방법에 대해서 정리해보겠습니다. Complex State란 자바스크립트 개체 상태를 좀 더 복잡한 관리를 말합니다. 개체의 이전 값을 돌려받거나 사용해야할 경우의 관리를 말합니다. 예를 들어 웹사이트에 두 가지의 값을 입력하면 두 가지 입력 정보를 이용해 사용자에게 보여지게끔 할 수 있게 만드는 것입니다. 예시로 든 두 가지의 값 입력 사이트로 확인해보겠습니다. 기존의 useState 관리 방식 App.jsx import React, { useState } from "react"; function App() { const [firstName, setFirstName] = useState(""); const [secondNam..
2023.08.31 -
[에러] npm ERR! code ENOENT / npm ERR! errno -4058
[Reason] React app을 만드는 명령어를 입력했을 때 발생된 에러이다. npm 이 정상적으로 설치되지 않아 발생된 에러이다. [Solution] npm install -g create-react-app 명령어를 통해 npm을 다시 설치해준다. 그 후 다시 npx create-react-app {리액트 프로젝트 명} 명령어를 입력하면 정상적으로 react app으로 설치되는 것을 볼 수 있다.
2023.08.31