전체 글123 실시간 채팅구현(1) - 서버에 따른 통신 도구 설정 이번 WEB IDE 프로젝트에서 실시간 채팅 구현! 을 맡게되었다.예전부터 구현해보고싶었던 기능인데 좋은 기회🎶 즐겁다. 우선, 어떻게 구현 해야할지 감이 안와서 검색을 해보았다. 보통 사람들이 사용하는것을 보면 socket.io, stomp, websoket 등등.. 이 있던데대체 뭐가 다른건지, 프론트는 뭘 해야하는건지.. 뭘 사용해야 적합한지 알아보다 마침내 결론내렸다. 백엔드를 무엇으로 구현하였냐!에 따라 달라지는것같다.우선, 채팅은 소켓을 기반으로 실시간 통신을 한다.이걸 어떤 방식으로 구현을 할지는 서버가 Node.js냐,Spring이냐에 따라 적합한 도구가 달라진다. 실시간 통신은 WebSoket이 담당하고, STOMP, Socket.io, Sockjs가 도와주는 방식이다. 여기서 Soke.. 2025. 4. 12. 3. JWT 토큰 어디에 저장하는게 좋을까? 로컬,세션,쿠키 로그인을 할때 JWT 토큰을 이용하기로 하였다. (요즘 자주 사용하는 방식이라고 한다.)그러면 이 토큰을 어디에 저장할지도 정해야하는데 어디에 저장해야할까요? 어디에 저장해야 좋을까요?하고 팀장님께서 숙제를 내주셨다.. 나의 예전 학교 수업시간 기억을 되살려..세션이 아무래도 브라우저를 삭제할때 지워지니까 이게 보안적으로 안전하지 않을까?하고 답했는데호오 정말요? 보안에서 괜찮을까요? 그럼 다른건 보안이 별로인가요? 라고 되물어보셔서..더이상 내 나약한 지식으로는 안되겠다싶어"공부해오겠습니다.." 하였다. 그러면 어디에 저장하면 좋을까? 한번 알아보자.우선 JWT 토큰이란 JSON Web Token의 줄임말이다.사용자 인증에 사용되는 토큰 기반 인증 방식중 하나로,보통 로그인을 할때 발급받아 서버와 클라.. 2025. 4. 12. 2. 배포의 기본과 동적배포, 정적배포 우선.. 배포에 대해 얘기해보자.배포 방법에는 두가지가있다. 서버와 프론트엔드를 함께 배포하는것 (보통 풀스택 프로젝트에서 많이 사용한다.)서버 따로, 프론트엔드 따로 배포하는것. 이건 회사마다 다른 방식으로 배포한다고 하지만..보통 프로덕션에서는 프론트 따로 백엔드 따로 배포한다고 한다.그리고 프론트에서 api엔드 포인트를 백엔드 서버 url로 지정하는 방식으로 연결하는것이다.그러면 프론트는 뭘로 배포하던지 서버랑은 상관이 없다또는 백엔드 서버에서 /api 경로와 하위 경로 외에는 프론트엔드로 잡고 static 파일로 배포하는 방법이 있다. 아무튼, 이 프로젝트에서는 프론트 따로, 백엔드 따로 배포를 하기로 했다.그러면서 팀장님이 배포를 정적배포로 할건지? 동적배포로 할건지? 물어보셨다.나는 데이터가.. 2025. 4. 12. 1. 클라이언트사이드 렌더링, 서버사이드 렌더링 이 둘의 차이점은? 새로운 프로젝트를 진행하게 되었다. 기존에 팀장님이 만들어놓으신 웹 사이트가 있었는데,이건 Java로 구현해 놓은것이고, 디자인이나 이런걸 개편해서 API 연결 방식으로 바꾸기로 했다.어쨌든 이 홈페이지를 개선하는데 기여해보고싶었고, 프론트 개발로 참여하게 되었다! 아무튼, 그건 그렇고.프로젝트에 참가한지 1주차.프로젝트 팀장님께서 프론트를 배포할 때 어떻게 배포할건지 결정하라고 하셨다.그러면서 클라이언트사이드로 작업할것인지, 서버사이드로 작업할것인지 물어보셨다.그냥 배포하고 암거나 개발하면 되는거 아닌가? 했는데 전혀 아니었다! 그래서 며칠동안 물어보고, 찾고 하다가 어느정도 이해가 된 듯 하여 정리한다.이 프로젝트로 많이 성장하게 해주시는것같다! 감사합니다 ㅎㅎ크게 나누자면 서버사이드 렌더링 (SSR.. 2025. 4. 12. Vite + React + TypeScript, ESLint + Prettier 프로젝트 세팅 이번에는 내가 프론트 프로젝트 베이스 세팅을 하게 되었다.이번 프로젝트는 Vite, React, TypeScript, ESLint, Prettier를 사용할 예정이다.create-react-app이 공식적으로 지원이 끝난것도 있고, 조금 더 빠른 개발을 위해 Vite를 채택했다.그리고 코드의 일관성 관리를 위해 ESLint, Prettier도 도입했다.리액트 테스트도 사용할까 해보았는데, 실질적으로 개발 기간이 2주이고,빨리 개발해야하는 프로젝트 + 아직 MVP 단계인 상태에서 수정 가능성이 많을 경우에는테스트를 도입했을 경우 개발 속도가 느려질 수 도있고, 굉장히 번거로워 질 것이라 하여 테스트는 빼기로 하였다.이건 최종 프로젝트에서 사용하기로! 아무튼, 처음 세팅을 해본거라 배운 점도 많기도 해서.... 2025. 4. 11. [프로그래모] 2025년 3월 31일 회의와 커피를 쏴버린 나 3월 31일 팀별 2차 회고와 발표가 있고 나서 팀 재정비를 했다.4월에 있을 프로젝트를 위해서는 약간의 "강제성"이 필요하다 생각했고팀 규칙을 새로 새웠다. 그리고 노션 페이지도 새로 정비했다.프로필이랑 헤더 5분만에 급하게 후다닥 만들어봤는데 꽤 그럴듯하다.위에서 보았듯이, 출석체크 제도를 새로 도입했다. 이렇게 디스코드 출석체크 방에 책상에 앉은 사진과 함께 출석 글을 올리면 된다. 9시까지 출석이며, 9시 10분까지는 출석 인정이 된다. 그러나..이 제도를 시작하기로 한 4월 1일 늦잠을 자버린 나. 그렇게 제가 첫 커피를 사게 되었습니다.. 어느새 디코 스티커까지 만든 팀원들..ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 그렇습니다.. 그렇게 제가 커피를 쏘게 되었습니다..다음에는 지각하지 않을거에요 2025. 4. 1. 이전 1 2 3 4 ··· 21 다음
