가원이의 코딩 일대기

vs코드에서 실행시에 해당 오류 고치기 

남들은 다 그냥 포트 지정하라고하지만 언제까지 툴 안쓰고 터미널로 열순 없음 혹시 터미널로 열거면

flutter run -d chrome --web-hostname=127.0.0.1

나는 vs코드에서 툴을 이용해 F5로만 열고싶다!  그럼 해당 프로젝트 폴더 안의 .VSCODE의 launch.json에 

 "configurations": [
        {
            "name": "flutter_stagram",
            "request": "launch",
            "type": "dart",
            "args": [
            "--web-hostname",
            "127.0.0.1"
        ]
        },

코드 입력 후 실행

1. 이메일 시스템 구축 (SMTP와 IMAP 사용)

문제:

• SMTP 서버와의 연결 실패
  • 해결 방법: SMTP 서버 설정을 확인해야 합니다. 특히 포트, 호스트 이름, 인증 정보가 정확한지 확인해야 하며, TLS/SSL 설정이 필요할 수 있음. 외부 이메일 서버를 사용할 때는 방화벽 설정도 확인필요
• IMAP을 통해 메일 수신 시 메시지 인코딩 문제
  • 해결 방법: IMAP 프로토콜에서 수신한 이메일의 인코딩 형식을 확인하고, UTF-8로 변환하는 코드를 추가. 이메일 헤더의 Content-Type을 분석하여 적절한 인코딩 방식을 적용하는 것이 중요.

2. REST API 및 SOAP API 개발 (MSA 기반)

문제:

• API 호출 시 데이터 형식 불일치
  • 해결 방법: REST API와 SOAP API 모두 서로 다른 데이터 포맷을 지원 따라서 JSON과 XML 간의 변환 로직을 추가하여 클라이언트와 서버 간 데이터 형식의 일관성을 유지필요!!
• MSA 간 인증 문제 (JWT 토큰 만료)
  • 해결 방법: 마이크로서비스 간의 통신에서 JWT 토큰이 만료될 수 있음. 이를 해결하기 위해 Refresh Token 메커니즘을 도입하고, 각 서비스에서 토큰의 유효성을 주기적으로 검증하는 로직을 추가필요.

3. 프로젝트 '벌판' (Groupware 서비스)

문제:

• 전자결재 시스템의 데이터베이스 구조 설계
  • 해결 방법: 결재 문서와 관련된 복잡한 데이터 구조를 MongoDB에 저장할 때, 스키마를 명확히 설계해야 함. 특히 결재 문서, 승인 이력, 결재 상태 등의 정보를 잘 관리할 수 있는 스키마를 도입하고, 이를 효율적으로 쿼리할 수 있도록 인덱스를 설정필요.
• 공간 및 차량 예약 시스템의 중복 예약 처리
  • 해결 방법: 예약 기능에서 동일 시간대에 중복 예약을 방지하기 위해 트랜잭션을 사용하거나, 예약이 확정되기 전까지 일정 임시 저장소를 관리하여 중복 발생을 방지하는 로직을 추가필요.

4. 스케줄 관리 및 전자결재 시스템 (MongoDB 사용)

문제:

• MongoDB 연결 실패
  • 해결 방법: MongoDB의 포트, 인증 정보, IP 접근 설정을 확인해야함. 특히 방화벽 규칙이나 네트워크 연결이 문제일 수 있으며, bind_ip 설정이 로컬 호스트로만 제한되어 있을 경우 외부에서 접근할 수 없으므로 이를 수정필요.
• 결재 문서의 대량 처리 시 성능 저하
  • 해결 방법: MongoDB에서 대량의 결재 문서를 처리할 때는, 효율적인 인덱싱과 샤딩(Sharding)을 적용하여 성능을 최적화해야함. 또한, 자주 사용되는 쿼리에 대해 인덱스를 생성하는 것이 중요!!

5. 출퇴근 관리 시스템 (React, Axios 사용)

문제:

• 출퇴근 시간 변환 로직 오류
  • 해결 방법: 시간대 변환 시 Date 객체를 사용하여 사용자의 로컬 시간대로 변환하는 로직을 추가함. 시간을 관리하는 모든 데이터는 UTC로 저장하고, 출력할 때는 사용자의 로컬 시간대로 변환하여 사용.
• Axios를 통한 데이터 불러오기 시 지연 문제
  • 해결 방법: API 호출이 지연되는 경우 로딩 상태를 추가하여 UX를 개선함 useState와 useEffect를 사용해 로딩 상태를 관리하고, 데이터가 완전히 로드되기 전까지 로딩 스피너를 표시함.

6. Socket 통신 기반 실시간 채팅 기능 개발 (Kafka, WebSocket)

문제:

• Kafka에서의 데이터 누락 문제 (서버 재시작 후)
  • 해결 방법: Kafka에서 AUTO_OFFSET_RESET_CONFIG를 "earliest"로 설정하여 서버 재시작 후에도 모든 메시지를 불러오도록 설정가능. 이 설정이 없으면 Kafka는 마지막 읽은 오프셋 이후의 데이터만 가져오므로, 이를 방지하려면 컨슈머 설정을 조정해야 함.

채팅 서비스 개발 중 여러 문제들과 해결방법 간단 정리 

Frontend 문제 및 해결 과정

1. Uncaught TypeError: Cannot read properties of undefined (reading 'value')
   • 문제 설명: 데이터가 없는 상태에서 undefined 또는 null 값을 접근할 때 발생한 오류.
   • 해결 방법: JSX 내에서 요소가 존재하는지 조건부로 검사하여, 값이 있을 때만 접근할 수 있도록 조건부 렌더링을 적용.
2. 모달에서 참가자 선택 시 중복된 데이터 처리 문제
   • 문제 설명: 모달에서 참가자를 선택할 때 중복된 참가자가 추가되는 문제.
   • 해결 방법: item.id로 중복 여부를 체크하여, 중복된 값이 있으면 추가하지 않도록 로직을 수정함. map 함수와 filter 함수를 사용하여 중복을 제거.
3. 로딩 상태를 UI에 표시하기 위한 설정
   • 문제 설명: API 요청에 시간이 소요되기 때문에 로딩 상태를 나타낼 필요가 있었음.
   • 해결 방법: useState를 활용해 loading 상태를 관리하고, Axios 요청이 완료되면 로딩 상태를 해제하여, 로딩 중일 때는 프로그레스바를 표시하는 UX를 개선함.
4. Axios 요청 실패 문제 (403 Forbidden)
   • 문제 설명: 서버에 대한 POST 요청이 403 Forbidden 오류로 실패함.
   • 해결 방법: 요청에 필요한 헤더 정보, 특히 인증 정보 또는 권한을 확인하여 적절히 수정함. CORS 설정도 확인하여 클라이언트 요청이 서버에서 허용되도록 조정함.
5. 참가자 자동 추가 문제
   • 문제 설명: 모달에서 다른 사용자를 선택할 때 현재 사용자 정보가 자동으로 추가되지 않음.
   • 해결 방법: 현재 사용자 정보를 불러오는 autoSelect() 함수를 모달이 열릴 때 호출하고, 중복된 참가자가 포함되지 않도록 로직을 구현함.

Backend 문제 및 해결 과정

Kafka 브로커 연결 문제 (403 Forbidden)

• 문제 설명: Kafka 브로커에 접근 시, 권한 설정 문제로 인해 연결 실패.
• 해결 방법: Kafka 브로커 설정에서 올바른 서버 주소와 포트를 지정하고, CORS 및 인증 설정을 확인하여 수정함.

1. Kafka earliest 설정 적용 문제
   • 문제 설명: Kafka에서 컨슈머가 시작할 때, 처음부터 메시지를 읽어야 했으나 중간부터 읽기 시작함.
   • 해결 방법: Kafka 컨슈머 설정에서 AUTO_OFFSET_RESET_CONFIG 값을 "earliest"로 설정하여 처음부터 메시지를 읽을 수 있도록 구성함. 또한 ValueDeserializer 설정이 적용되어야 하며, 이를 누락할 경우 제대로 동작하지 않음을 확인함.
2. MongoDB와 Kafka 연동 문제
   • 문제 설명: 서버가 껐다 켜질 때 메시지가 제대로 유지되지 않음.
   • 해결 방법: Kafka와 MongoDB를 연동하여, Kafka에서 처리된 데이터를 MongoDB에 저장함으로써 서버 재시작 후에도 동일한 메시지를 불러올 수 있도록 설정. MongoDB가 데이터를 영구 저장하므로 데이터 손실을 방지함.
3. Kafka 컨슈머 그룹 리셋 문제
   • 문제 설명: Kafka 컨슈머 그룹이 특정 시점 이후의 데이터만 처리.
   • 해결 방법: Kafka CLI 명령어인 kafka-consumer-groups.sh를 사용하여 컨슈머 그룹의 오프셋을 리셋하고 처음부터 데이터를 읽도록 설정함. --reset-offsets 명령어를 활용하여 오프셋을 초기화함.
4. MongoDB 외부 접근 문제
   • 문제 설명: MongoDB Docker 컨테이너를 외부에서 접근하지 못함.
   • 해결 방법: docker-compose.yml에서 포트 설정을 수정하여 MongoDB 컨테이너의 포트를 외부와 매핑함. 27017:27017로 외부와 연결 가능하도록 포트 포워딩을 설정하고, 인증 정보(root 계정)를 통해 접근할 수 있도록 수정함.
5. Zookeeper 설정 문제
   • 문제 설명: Zookeeper 설정이 제대로 되지 않아 Kafka와의 연결이 불안정.
   • 해결 방법: Zookeeper의 설정 파일을 확인하고, Zookeeper와 Kafka 간의 네트워크 연결 설정을 수정함. Kafka의 zookeeper.connect 설정을 통해 Zookeeper 서버에 올바르게 연결되도록 함.