Project12 [에러] could not find react-redux context value; 에러 메세지Unexpected Application Error!could not find react-redux context value; please ensure the component is wrapped in a 에러 발생 원인React-Redux를 사용하는 프로젝트에서, Redux Store를 React 컴포넌트 트리에 제대로 공유되지 않았을 때 발생합니다. 에러 해결 방법최상위 컴포넌트 (예: index.js, App.js, 또는 Next.js에서는 _app.js)에서 반드시 로 감싸야 합니다.Provider: 하위 컴포넌트인 App 컴포넌트와 그 아래에 있는 모든 컴포넌트에 Redux Store를 제공store: Redux Store 객체로 Provider 컴포넌트의 store prop으로 .. 2025. 4. 27. [개발일지] 10일차 : Spring Security (feat. JWT) 이번 인증/인가 리팩토링에서는 JWT 기반의 인증을 추가 구현하였습니다. 인증/인가 정책이 바뀔 경우를 대비하여 추상화된 인터페이스를 통해 다양한 인증 전략이 활용될 수 있도록 구현을 진행하였지만, 다른 기능의 비즈니스 로직까지 수정이 필요하고 유지보수 관점에서 쉽지 않을 것 같습니다. 실제 실무에서는 이와 같이 인증전략을 추상화하는 것은 어려울 것 같습니다.(그래서 이번 프로젝트는 JWT 기반의 인증/인가 전략만 사용할 예정입니다.) 1. 주요 컴포넌트 구성JWT 기반의 컴포넌트는 아래와 같이 구성하였습니다. Security에서 제공하는 필터와 인터페이스를 구현체로 Override하여 컴스텀하면서 구현을 진행하였습니다. 확실히 Session 로직 대비 코드 복잡도가 올라갔습니다. 코드를 구현하고 나.. 2025. 2. 21. [개발일지] 프로젝트 9일차 : Spring Security 로그인 인증 1. Spring Security 로그인 인증 기능 구현SecurityfilterChain을 통해서 로그인 인증을 구현하는 로직을 작성하였습니다. 인증 과정을 직접 경험하기 위해 시큐리티에서 제공하는 기본 form을 사용하지 않고, AuthencicationManager를 통해 인증 과정을 대략적으로 경험해보았습니다. 1.1. 로그인 인증 단계순서구분내용1로그인 요청- 클라이언트가 /login 엔드포인트로 email과 password를 포함한 POST 요청을 보냅니다. - SecurityAuthFilter가 이 요청을 가로채서 처리합니다.2인증 토큰 생성- SecurityAuthFilter의 attempAuthentication 메서드 동작 - 요청 body에서 email과 password를 추출 - .. 2025. 2. 19. [개발일지] 프로젝트 8일차 : Spring Security (feat. MyBatis) 제가 맡은 영역 중 먼저 구현을 시작한 것은 DB연동 & Spring Security 입니다. 우선 DB 연동을 위해 이미 코드 작업 중인 백엔드 팀원과 대화면서 JPA와 MyBatis 중에 뭘 사용할까 고민했습니다. 결론적으로 MyBatis & HikariCP를 사용하기로 했습니다. JPA는 객체 중심의 개발이 가능하고, Lazy loading을 지원하는 등의 장점이 있지만, MyBatis가 SQL 쿼리문을 직관적으로 확인할 수 있고, 동적 쿼리문 작성도 비교적 깔끔하기 때문에 선택하게 되었습니다. (사실 아직은 SQL이 직접 보여야 마음이 편합니다...ㅎ) [DB & MyBatis 연동 및 테스트]MyBatis 기반의 DB 연동을 진행한 후, 회원 객체(DTO)를 생성하여 DB 연동이 실제 이루어지.. 2025. 2. 18. [개발일지] 프로젝트 7일차 : ERD 설계 (feat. MySQL) Oracle, MySQL 데이터베이스를 사용해본 경험상 Oracle은 트랜젝션 관리 및 안정성이 MySQL 보다 좋다는 느낌을 받았지만, 대규모 프로젝트가 아닌 이상, Oracle의 사용은 오버 스팩으로 느껴졌습니다. 비용적인 문제도 있고.....실제 중소규모의 프로젝트에서 범용적으로 사용하는 MySQL이 개발속도, 가벼운 사용성 측면에서 지금 진행하고자 하는 프로젝트에 부합하다고 생각하였습니다. MySQL은 DBever를 통해 관리할 예정입니다. 이제 ERD를 설계해야 되는데... 처음부터 모든 테이블을 설계하려 하지 않았습니다. DB를 다루고 싶어하는 다른 팀원들도 있기에 기본적인 뼈대만 잡아가고 다른 팀원들도 Table을 생성하고 수정할 수 있도록 하였습니다. 물론 협업에서 그러면 절대 안되겠지만,.. 2025. 2. 18. [개발일지] 프로젝트 4~6일차 : 프로젝트 웹서비스의 전체적인 Flow를 이해하기 위해 페이지 명세를 기반으로 시퀸스 다이어그램을 작성하였습니다. 구현할 웹 사이트를 이해하는데 도움이 되었고, 각자 구현할 영역과 우선 구현 순서를 논의할 때, 많은 도움이 되었습니다. [프로젝트 시퀸스 다이어그램]https://github.com/FarmorAI/farm-web-react/wiki/03.-%EC%8B%9C%ED%80%B8%EC%8A%A4-%EB%8B%A4%EC%9D%B4%EC%96%B4%EA%B7%B8%EB%9E%A8 03. 시퀸스 다이어그램Contribute to FarmorAI/farm-web-react development by creating an account on GitHub.github.com [개발일정]기존 웹사이트 구현과 더불어 .. 2025. 2. 18. [개발일지] 프로젝트 1~3일차 : 프로젝트 기획 & 페이지 설계 프로젝트 기획 단계에서 서비스에 대한 전체적인 청사진을 그리기 위해 마인드맵을 활용하였습니다. 팀원들과도 이제부터 만들어갈 서비스에 대한 공통된 목표를 공유하기 위해 마인드맵은 유용한 Tool이였습니다. 우선 프론트엔드 1명, 백엔드 3명으로 구성된 팀이였고, 개발기간은 약 6주정도로 각자 프로젝트를 통해 개발하고 싶은 역량과 도메인에 대한 논의를 진행하였습니다. 회의를 통해서 제공할 핵심 서비스와 사용할 기술스택에 대해서 정의하였는데, 컴퓨터 비전 AI 서비스를 제공하고, DevOps 관련 스택도 활용했으면 좋겠다는 의견이 있어, 의견을 수렴하여 아래와 같이 주요 내용들을 정리하였습니다. 마인드맵을 그린 후, 프로젝트에 대한 세부내용을 정의하기 위해 GPT-4를 가지고 팀원들과 프로젝트 설계를 진행.. 2025. 2. 18. 프로젝트 팀 운영 가이드라인 # 팀 편성1. 자기소개 및 팀장 선정2. 커뮤니케이션 도구 선택 (디스코드, 슬랙, 카카오톡, 노션) 및 Rool 만들기3. Oranization 생성(권장) Organization > New organization > free(권장) Organization > People > Invite member레포 만들기레포에서 동료 초대 : settings > collaborators and teams > add people 4. 브랜치 전략 수립하기Git branch 전략 외에도 Git Actions setting, 코드 컨벤션(Black Formatter 등) 논의 5. github에서 Default 브랜치 재설정 (develop으로 변경)Default 브랜치를 변경하는 이유는 Pull Request 대.. 2024. 12. 9. 이전 1 2 다음 728x90
