spring boot 20

[웹 프로젝트] 피드백 적용하기 5 - 프로젝트 목적에 맞는 디테일 설정

문제 정의피드백 5.여행인데 지도가 없네요.물론 사진으로 대체가 된다지만 개발자 입장에선 구글 맵 api라도 연동해서 지도를 달아두고..이동 경로 패스를 여행 패스와 싱크를 시켜주면 좋을 것 같아요.그리고.. 여행기록을 작성하였지만..0다녀온 나라 수0여행 횟수0여행 기간(일)최근 여행지아직 첫 여행을 떠나지 않았어요이라고 나오네요.여행 게임이라고 생각하고 어디에 갔는데 이 아이템을 획득했다. 그리고 이 아이템을 팔겠다.이런 프로세스라도 있으면 더 재미가 있지 않을까요?아니면 어떻게 하면 된다라는 예제라도 작성을 해두어야… 해결 방향여행기록 게시판, 카드 로직 통합- 기존에 별도로 구현된 여행기록 카드 로직을 제거하고, 사용자가 게시판에 글을 작성하면 해당 글의 데이터를 가져와 여행기록 카드에 노출되..

[웹 프로젝트] 피드백 적용하기 4 - JWT 토큰 관리 확인

문제 정의피드백 4.로그인후 창을 두개띄우고 로그아웃시 하나의 창은 채팅이 계속쳐지네요.개발자모드보니 로그아웃시에 쿠키가없어지던데 프론트에서 jwt토큰을 다루고있는건가요? 해결 방향토큰 검증 로직 추가- 로그아웃해도 기존 WebSocket 연결이 끊기지 않아, 다른 탭에서 여전히 채팅 메시지를 보낼 수 있었음 서버에서 WebSocket 세션을 즉시 종료하기 복잡하므로, 메시지 전송 시마다 클라이언트와 서버에서 JWT 유효성을 확인하도록 수정 구현 상세토큰 검증 로직 추가 탭 두 개로 채팅방을 켰다. 그 뒤 한쪽에서 로그아웃하고 한쪽에서는 채팅을 쳐봤다. 근데 채팅이 전송된다..그래서 다른 것도 테스트해 봤다. 게시글 작성버튼을 눌렀을 때 로그인이 안되어있다면 작성페이지로 넘어가지 않는다. 이 테스트..

[웹 프로젝트] 피드백 적용하기 3 - 메뉴별 UI 차별화

문제 정의피드백 3.만드느라 수고가 많으셨습니다.사이트를 둘러보니 디테일한 부분도 꽤 많아 보이는데 고생 많이 하셨겠네요!개선의 여지는 아래 분들이 많이 피드백주셨지만 지금 기능에서 디자인을 좀더 개선하면 많이 좋아질거 같습니다.어떤 UI 컴포넌트를 사용했는지 모르겠지만 bootstrap같은걸 쓰면 좀 더 깔끔해 질거 같습니다.UI 적으로는 항목은 다른데(최신글, 여행기록등등) UI가 다 비슷비슷해서 메뉴별 카테고리별로디자인 차별화를 주는것도 좋을거 같습니다.고생하셨어요. 좀 더 디벨롭해서 좋은 사이트 만들어주세요 해결 방향메뉴, 카테고리별 디자인 차별화- 주요 메뉴마다 스타일을 다르게 지정해 사용자가 컨텐츠 성격을 한눈에 구분할 수 있도록 함 구현 상세메뉴, 카테고리별 디자인 차별화현재 메인페이지는..

[웹 프로젝트] 피드백 적용하기 2 - 게시글 상세 페이지 연결 UX 개선

문제 정의피드백 2.멋집니다! 기능도 많이 구현되어있네요!제목만 클릭이 아니라 카드 클릭하면 상세로 넘어가면 편할거같아요 ㅎㅎ 해결 방향카드 클릭 UX 개선- 기존에는 게시글 제목을 클릭해야만 상세페이지로 이동했으나, 카드 전체를 클릭하면 상세페이지로 이동하도록 변경하여 편의성을 높임 구현 상세공지사항 게시판- 기존 빨간 박스 안을 클릭해야 게시글 상세 보기로 넘어갔다. 수정 후에는 초록색 박스 안을 클릭해도 넘어가도록 했다. navigate(`/posts/NOTICE/${post.id}${type && keyword ? `?type=${type}&keyword=${keyword}&sortOption=${sortOption}&pageNumber=${pageNumber}` : `?sortO..

[웹 프로젝트] 피드백 적용하기 1 - 추천, 정렬과 검색 필터 최적화

문제 정의피드백 1.여행 기록 추천순 정렬하면 추천이 같으면 최소한 최신순으로 정렬해주는게 어떨지?오래된 순으로 나열된거같은데 정렬 순서를 좀더 신경써야할거같음여행 동료모집 검색 조건이 매우 불편. 무슨 조건인지조차 모르겠음. 모집하는 작성자에 대한 필터링인지?모집 내용에 대한 필터링인지? 나이대로 테스트해보니 아마 작성자 조건인거같은데 그에 대한 설명 부족검색 조건 전체 초기화 하는 방법이 없음. 그냥 탭 눌러서 다시 진입해야함.유형의 경우 전체 동행이 다른 조건들이랑 중복 체크가 가능한데 이러면 무슨 의미가 있는지? 해결 방향추천순 정렬 로직 강화- 추천수 기준으로 내림차순 정렬하되, 동일한 추천 수를 가진 게시글은 작성일 기준으로 최신순으로 노출검색 조건 초기화(Reset) 버튼 추가- 동료 모집..

[Spring Boot] Gzip 압축을 통해 로딩 성능 최적화 하기

1. 개요리액트 + 스프링부트로 진행 중인 프로젝트를 어느 정도 마무리 했다. 이제 배포전 성능테스트를 하며 최적화에 신경 쓰고 있다. 나는 'Lighthouse'를 사용해서 1차적으로 성능을 측정하고 문제점을 고쳐나가고 있다. 이때 만난 콘텐츠 로딩속도 문제에 관해 찾아보다가 Gzip에 관해 알게 되었다. 그래서 공부하고 기록할 겸 글을 작성한다. 2. Gzip?Gzip은 데이터를 압축하여 전송하는 표준적인 방법 중 하나로, 주로 웹에서 클라이언트와 서버 간의 데이터 전송 시 사용된다. Gzip은 텍스트 기반의 파일(HTML, CSS, JavaScript, JSON 등)을 효율적으로 압축하여 데이터 전송량을 줄이고, 페이지 로딩 속도를 향상시킨다. 3. Gzip 사용 시와 사용하지 않을 때의 차이Gzi..

중간점검

프로젝트를 시작한지도 3개월이 되어간다. 3개월동안 열심히 했던것도있지만 나태해졌던 기간도 있다. 아직 마무리 지을것은 많이 남았지만 중간점검을 하며 되돌아볼겸 스스로의 일지를 작성해본다. 1. GitHub 기록 서버작업할때는 pr템플릿을 사용해서 구분을 해뒀다. 하지만 화면작업(react)를 할때는 찾아가면서 천천히 할 생각이라서 따로 구분해두지 않았다. 지금와서 생각해보면 좀 아쉬운 부분이다. 템플릿의 유무에 따라 큰 차이가 있지는 않지만, 그래도 다시한번 내가 했던 작업이 어떤작업에 속해있는지 다시한번 생각해주는 부분이였던것같다. 2. 서버 테이블 현황 어느새 테이블만 해도 24개가 되어버렸다. 프로젝트가 마무리되어갈 단계에서 다시한번 검토해보며 설계적 실수를 확인하려한다. 기초단계에서 튼튼하..

서비스 런칭 도전 프로젝트 (Spring Boot + React)

1. 프로젝트 개요여행 관련 커뮤니티다. 자세한 카테고리는 제작해 가며 추가, 수정, 삭제할 예정이고 커뮤니티 카테고리에 따라 게시글 출력방식, 작성방식 등을 차별화하여 구성할 것이며, 화면도 가독성을 높여서 작성할 예정이다. 2. 기술 선택 이유Spring Boot (서버)안전성과 성능, 생산성, 확장성 React (화면)유연한 UI 개발, 빠른 렌더링 3. 설정 및 환경 구성Spring Boot (서버)Spring Boot 3.3.2JDK 17.0.7gradle 8.8 React(화면)React 10.8.2node 20.17.0 4. 계획사용해보지않은 react를 사용해서 화면을 구성할 예정이며 퇴근 후 2-3시간 정도 투자할 예정이다.다른 자격증이나 회사 업무에 대해 공부해야 할 것도 있기 때문에..

[Spring Boot] LogBack을 사용해서 로그파일 저장하기

1. 개발환경Java 17Spring Boot 3.1.8Gradle 8.5 2. LogBack이란?LogLogback은 자바 기반의 오픈 소스 로깅 프레임워크이다. Logback은 로깅 기능과 SLF4J(Simple Logging Facade for Java)와의 통합을 제공하여 강력하고 유연한 로깅 솔루션을 제공해 준다. SLF4J는 다양한 로깅 구현체를 추상화하는 인터페이스를 제공하고, Logback은 이러한 인터페이스를 구현하여 실제로 로그를 처리한다.Logback은 Log4j의 후속 버전으로 개발되었으며, Log4j보다 더욱 효율적이고 성능이 우수하다. Logback은 다음과 같은 주요 기능을 제공한다 3. LogBack의 주요 기능1 모듈화된 아키텍처Logback은 세 가지 주요 구성 ..

[Spring Boot] Global Exception으로 에러 처리하기

1. 개발환경Java 17Spring Boot 3.1.8Gradle 8.5 2. Global Exception은 무엇일까?Spring Boot 기반의 Restful API에서 예외처리의 유지보수성과 확장성을 향상하며, 명확한 에러 메시지를 제공하도록 도와준다. 에러코드와 메시지를 관리하며 GlobalExceptionHandler를 통해 이러한 예외들을 중앙에서 처리하도록 해준다. 3. Global Exception를 사용하는 이유1 코드 중복 감소동일한 예외를 반복해서 처리하는 것은 비효율적이다. 전역 예외를 사용하면 모든 컨트롤러에서 발생하는 공통 예외들을 한 곳에서 처리할 수 있으므로, 코드의 중복을 줄이고 유지보수가 용이해진다 2 일관된 에러 응답 형식일관된 형식의 에러 응답을 제공하면 클라이..

프로필사진

남건욱's 공부기록

반응형