본문 바로가기

분류 전체보기126

[Spring, React] Elasticsearch가 무엇일까? 좀 더 다양한 검색 환경을 제공하고 싶어서Elasticsearch를 넣어보기로 했다.그런데 정확히 Elasticsearch가 어떤 것이며, 무슨 기능이 있을까? 1. ElasticsearchElasticsearch는 분산형 RESTful 검색 및 분석 엔진이다.→ 여기서 분산형 RESTful 이란 말이 이해하기 어려울 것 같다. 분산형은 여러 대의 컴퓨터를 하나로 묶어 데이터를 나누어 저장한다는 뜻이다. 데이터가 늘어나면 컴퓨터만 더 추가하거나, 컴퓨터가 한 대가 고장이 나도 다른 컴퓨터에 복사본이 있어 데이터가 안전하다는 장점을 가지고 있다. 그리고 RESTful 통신 방식은 GET, POST, DELET를 써서 요청을 보내듯 Elasticsearch도 우리가 쓰는 웹 기술 방식으로 주고 받을 수.. 2026. 2. 28.

[Spring, React] Docker에 대해서 쉽게 알아보기! ElasticSearch를 사용하는 다양한 방법 중Docker를 통해 설치하고 사용하는 방법이 있었다.Docker가 무엇이고 어떻게 이뤄지는지알아보겠다. 1. Docker애플리케이션을 신속하게 구축, 테스트 및 배포할 수 있는 소프트웨어 플랫폼이다.소프트웨어를 컨테이너라는 표준화된 유닛으로 패키징한다. 이 컨테이너에는 라이브러리, 시스템 도구, 코드, 런타임 등 소프트웨어를 실행하는 데 필요한 모든 것이 포함되어있다.→ 설명 → 프로그램을 실행하려면 코드, 라이브러리, 런타임, 도구 등 필요한 것이 있다. 원래 개발자가 어떤 프로그램을 실행하기 위해 준비해야할 것들이지만, Docker는 컨테이너에 이 필요한 것들을 모두 포함하기 때문에 이런 수고를 줄여준다. 그래서 어떤 준비 없이 실행만 하면 된.. 2026. 2. 20.

[Spring, React] 페이지네이션, 고객 10명만 보여주고 페이지 넘기기. 고객 명단 표를 만들었다.그럼 이제 10명의 정보만 보이도록만들고싶다. 1. 동작화면 2. 페이지네이션 검색해서 찾아본 페이지네이션은, 방대한 정보 중 사용자에게 필요한 정보를 선별하여 일부분만 보여주는 기술을 말하는 것 같다. 아무래도 구글에 검색했을 때 구글이 가지고 있는 모든 정보를 다 보여준다면 아마 사용자의 메모리가 감당하지 못할 것이다. 그리고 무엇보다 기능에 의미가 없어질 듯 하다. 그래서 이 페이지네이션 기능을 활용하여 사용자의 메모리와 시간을 아끼는 듯 하다. 일단 내가 한 프로젝트는 이미 고객 정보가 기입된 상태이고 그걸 관리하는 것이다. 거기다 고객 명단이 그리 방대한 양이 아니다. 그래서 그리 어렵지 않은 페이지네이션을 구현해도 되겠다는 생각을 했다. 아래 링.. 2026. 2. 18.

[Spring, React] 고객 명단을 관리할 테이블(표) 만들기! 고객 정보를 보여줄표를 만들어보자! 1. 화면고객 정보가 화면에 보이도록 하며, 맨 끝에 수정과 삭제 버튼이 나오도록 만들어볼 것이다. 2. 전체 코드 {columns.map((data, i) => ( ))} {columns.map((data, i) => ( .. 2026. 2. 16.

[React] return 내에서 if문이 아닌 삼항연산자를 사용하는 이유 코드를 공부하다가간단하게 나타낼 수 있는 조건의 경우주로 삼항연산자를 사용하는 걸 알게됐다.왜 if문이 아닌 삼항연산자를 사용하는걸까? 1. 삼항연산자return ( {isLogin ? 환영합니다! : 로그인하세요.} );isLogin이 true이면 "환영합니다"가 보이고, false이면 "로그인하세요."가 보이도록 하는 것. 이런 방식으로 쓰는 걸 삼항연산자라고 한다. 코드를 찾아보면 return에 삼항연산자가 쓰인다. if문은 return 내에서 보지 못했다. 주로 익숙한 것은 if문이라서 굳이 왜 삼항연산자를 쓰는걸까? 의문이 생겼다. 2. 이유- if문 -const CustomerTable = () => { let message; if (isLogin) { m.. 2026. 1. 30.

[React] Spring으로 POST 보내는 두가지 방법_ then 방식과 async 방식 프로젝트를 하는 내내then 방식으로 Spring에 요청을 보냈다.그러다 다른 기능을 만들면서 코드를 찾아보니 async 방식으로 보내는 방법을 알게됐다.두방법의 차이가 뭘까? 1. 상황설명 고객 정보를 저장하려 한다. 고객 정보는 body에 넣어 POST 방식으로 Spring에 보내질 것이다. 그러면 Spring은 React의 요청을 받아 처리할 것이다. 이때 조건이 있다. 고객 정보에 들어가는 초대 코드 번호가 중복되어선 안되는 것이다. 만약 초대 코드가 중복일 경우 Spring에서 React로 409를 보낼 것이다. React는 409를 Spring으로부터 받으면 "초대코드가 중복되었습니다. 다른 코드를 입력해주세요." 문구가 사용자 화면에 alert 될 것이다. POST 방식으로 보낸다.상태 .. 2026. 1. 29.

이전 1 2 3 4 ··· 21 다음

티스토리툴바