✍️ 6월 9일부터 27일까지는 프로젝트 진행 과정을 기록하기 위해 매일 프로젝트 회고를 작성할 예정이다.날짜블로그 주소날짜 카운트2025년 6월 9일휴가사용, 글x 2025년 6월 10일 2025년 6월 11일 2025년 6월 12일 2025년 6월 13일 2025년 6월 16일 2025년 6월 17일 2025년 6월 18일 2025년 6월 19일 2025년 6월 20일

📆 6월 4일배포 https://labbitlog.vercel.app/ LabbitLog labbitlog.vercel.app https://github.com/yshls/LabbitLog-Frontend GitHub - yshls/LabbitLog-FrontendContribute to yshls/LabbitLog-Frontend development by creating an account on GitHub.github.comhttps://github.com/yshls/LabbitLog-Backend GitHub - yshls/LabbitLog-BackendContribute to yshls/LabbitLog-Backend development by creating an account on GitH..

📆 2025년 6월 2일Vercel을 통한 SPA(싱글 페이지 애플리케이션) 배포 과정에서 여러 번의 시행착오가 있었다.vercel.json 파일을 추가하여 SPA 라우팅 문제를 해결하려고 시도했다.모듈 수정 및 설정 변경, 파일 삭제/재생성 등 다양한 방법을 시도하며 문제의 원인을 찾으려 노력했다.관련 코드 예시 (vercel.json){ "rewrites": [ { "source": "/(.*)", "destination": "/" } ]}이 설정은 SPA에서 새로고침 시 404가 뜨는 문제를 해결하기 위해 모든 경로를 index.html로 리다이렉트하는 역할을 한다.2) 스타일 개선CSS 오타 수정, 불필요한 box-shadow 제거, 아이콘 스타일 개선 등 UI를 더 깔끔하게 다듬었다...

📆 5월 30일 마이페이지 데이터 연동 (내 글/댓글/좋아요/정보)내 게시글 가져오기 (/users/:username/posts)const posts = await Post.find({ author: username }).sort({ createdAt: -1 });유저별로 author 기준 필터링최신순 정렬(sort({ createdAt: -1 }))프론트에선 리스트로 출력내 댓글 가져오기 (/users/:username/comments)const comments = await Comment.find({ username }).sort({ createdAt: -1 });작성자 기준으로 댓글 조회마찬가지로 최신순 정렬좋아요한 글 목록 (/users/:username/likes)const likedPosts..

사용자 정보 수정 기능 추가 작업 기록 (Express & React)1. 백엔드 (Express) – 사용자 정보 수정 API 구현API 엔드포인트:PUT /user/update동작 방식:클라이언트의 쿠키에서 JWT 토큰을 꺼내 인증토큰을 검증해서 로그인한 사용자 ID를 파악전달받은 정보로 사용자 데이터 수정(비밀번호 변경이 요청되면 bcrypt로 해싱)업데이트 결과 반환app.put('/user/update', async (req, res) => { try { const { token } = req.cookies; if (!token) { return res.status(401).json({ error: '로그인 필요' }); } const userInfo = jwt...

📆 2025년 5월 28일 작업물 요약1. Mypage.jsx 생성 및 사용자 데이터 렌더링사용자 정보(프로필 사진, 닉네임)를 표시하는 구조/auth/profile API를 호출하여 사용자 정보 불러옴받아온 데이터를 바탕으로 마이페이지 상단에 표시useEffect(() => { const fetchProfile = async () => { const data = await getUserProfile(); setProfile(data); }; fetchProfile();}, []);2. 스타일링 (Mypage.module.css) 추가.mypage-wrapper, .profile, .avatar, .nickname 등 사용자 UI에 특화된 CSS 작성프로필 이미지: 원형으로 출력 (bo..

댓글 기능, 좋아요 기능, 글 수정 및 상세보기, UX 개선까지 포함된 의미 있는 날🔥댓글 기능 전반 구현1. 백엔드: comments 컬렉션 설계MongoDB에 comments 컬렉션을 새로 만들고, Post와 User를 참조하는 구조로 설계했다.// models/Comment.jsconst commentSchema = new mongoose.Schema({ postId: { type: mongoose.Schema.Types.ObjectId, ref: 'Post', required: true }, userId: { type: mongoose.Schema.Types.ObjectId, ref: 'User', required: true }, content: { ..

📆 2025년 5월 26일 작업물 요약axios.defaults.withCredentials = true 전역 설정.env에서 VITE_BACK_URL 사용로그인/로그아웃/회원가입 요청 함수 작성인증 상태 확인용 getUserProfile() 함수 작성요청 전 console.log로 디버깅 로깅 추가쿠키 기반 인증 처리를 고려한 백엔드 통신 설계1. axios.defaults.withCredentials = true의 중요성설정 위치: axios.js 또는 API 모듈 초기화 파일에서 설정의미: 모든 HTTP 요청에 대해 자동으로 쿠키 포함실전 효과:JWT 토큰을 쿠키에 저장한 백엔드와 세션 유지 가능로그인 이후 새로고침에도 사용자 상태가 유지됨axios.defaults.withCredentials =..

📆 2025년 5월 23일 코딩 작업 기록FrontendQuillEditor.jsximport { useRef } from 'react'import ReactQuill from 'react-quill-new'import 'react-quill-new/dist/quill.snow.css'// import './QuillEditor.css'const QuillEditor = ({ value, onChange, placeholder }) => { const quillRef = useRef(null) // Quill 에디터 모듈 설정 const modules = { toolbar: { container: [ [{ header: [1, 2, 3, false] }], ..