wa_ter_ve

🌐 진행 중인 API 연동 요약• 메인 페이지사용자 위치 기반 맛집 표시/api/places GET • 검색 기능 (메인 모달)가게 이름, 메뉴 이름으로 검색/api/places/serchPOST • 맛집 상세특정 맛집 상세 정보 조회/api/places/place-idGET • 찜하기 기능찜 추가 / 삭제/api/favorites (추가) , /api/favorites/{id} (삭제) POST / DELETE • 마이페이지사용자 정보 조회 / 수정/api/members/my-page (조회),/api/members/update-my-page (수정)GET, PATCH • 리뷰 등록맛집 리뷰 작성/api/reviewsPOST • 리뷰 조회특정 맛집 리뷰 조회/api/reviews{revie..

💡 면접 팁 요약• 기술 용어는 너무 과도하게 쓰기보단 쉬운 말로 본질을 설명하는 게 더 좋음.• 잘 모를 경우: "정확히는 모르지만 제가 이해한 바는..."으로 시작.• 두괄식 구조로 답하기. (결론 먼저)• 되도록 3문장 이내로 끊고 말하는 훈련. 1. 자료구조 Q1. 배열(Array)과 연결 리스트(Linked List)의 차이점은?- 배열: 고정 크기. 메모리상 연속된 공간에 데이터 저장. 장점: 인덱스를 통해 빠른 접근. 단점: 삽입/삭제 비효율적.- 연결 리스트: 각 노드가 다음 노드를 가리키는 동적 구조. 장점: 삽입/삭제가 효율적.단점: 인덱스 접근 느림. Q2. 스택(Stack)과 큐(Queue)의 차이점과 예시는?- 스택: 후입선출(LIFO) 구조. 한쪽 끝에서만 삽입과 삭제가 나타..

https://contentcore.xyz/ ContentCoreCreate content in one place. Incredibly fast. Save as images or videos.contentcore.xyz https://www.behance.net/gallery/185600119/iPhone-15-Pro-Max-Mockup-FREE iPhone 15 Pro Max Mockup - FREE - Eka Restu D. PutraThis is the iPhone 15 Titanium mockup created for you, an App UI designer, to showcase your UI design to look good. The package download contains 3 PS..

📌 카카오 로그인 ✅ 로그인 흐름① 사용자가 '카카오 로그인' 버튼 클릭 ② 카카오 로그인 페이지로 이동 (인가 코드 받기)③ 카카오에서 redirect URI로 code 전달④ 프론트가 code를 받아서 → 백엔드로 전달 (API 호출)⑤ 백엔드가 토큰 요청 → 사용자 정보 받아서 회원가입 처리 📍 page > KakaoCallback.jsx 생성 KakaoCallback 함수 작성 {- 백엔드에 코드 전달- 토큰 저장- 로그인 성공 시, 메인페이지로 이동} 📍 App.jsx 라우터 수정} /> [Login 페이지] ↓ (handleKakaoLogin 실행)[Kakao 로그인 페이지로 이동] ↓ (로그인 후 Redirect)[http://localhost:5173/oauth/kaka..

🔎 key={idx}와 key={place.id} 차이점?☆ key={idx} (배열 인덱스 사용)→ 배열의 각 요소를 반복할 때 인덱스를 key로 사용하는 경우 {[...Array(5)].map((_, idx) => ( )} ☆ key={place.id} (고유한 ID 사용) → place.id는 각 아이템에 고유하게 할당된 ID로, 이 값은 데이터베이스나 API에서 제공되는 유일한 식별자 🔎 하단 스크롤바 안 보이게 하는 법 📍tailwind.config.jsimport plugin from "tailwind-scrollbar-hide";... plugins: [plugin],}; 📍Mainpage.jsx"scrollbar-hide" 추가...... 💭 추가 지식Tailwind ..

메인페이지에서 만들어 놓은 사이드바 UI를 가져와 사용하려고 했으나, 사이드바의 ✈️(mainModal),❤️(bookmarkModal) 버튼을 누르면 메인페이지의 지도 기반으로 모달이 작동되어야 함.따라서 기존대로 페이지 이동없이 사이드바 기능을 적용하면 문제가 생김.또한, 사이드바 코드가 다른 페이지에서도 쓰이려면, toggleMainModal, toggleBookmarkModal 사용 불가능 👉 버튼 누를 때 URL을 메인페이지로 이동시키면서, 쿼리나 경로를 통해 어떤 모달 열지 알려주는 방식으로 해결해보기 / → 메인페이지 기본/?modal=main → 메인페이지 + 장소 검색 모달 열기/?modal=bookmark → 메인페이지 + 찜 모달 열기/?modal=notification → 메인페이..

lucide-react icons 설치➡️ https://lucide.dev/$ npm install lucide-react jsx 파일에 import 해서 사용.import { '사용할 아이콘' } from "lucide-react"; 토글 1개 → 2개...const [isModalOpen, setIsModalOpen] = useState(false);... setIsModalOpen(false)} />⬇️⬇️⬇️...const [isMainModalOpen, setIsMainModalOpen] = useState(false);const [isBookmarkModalOpen, setIsBookmarkModalOpen] = useState(false);... setIsMainModalOpen(fal..

🚩 ‘활동 기록’ 글자 아래 점선과의 간격 늘리기→ mt 조절 해봤지만, 적용이 안 됨.지금은 border가 h2 자체에 있어서 글자와 선 사이에 여백이 안 생기게 되어 있음🚀 해결 방안pb(padding-bottom) 를 조절해 주면 됨! 🚩 프로필 부분이랑 활동기록 부분 사이에 여백을 조금 더 늘리기 ✅ 방법 1: pl-10 → 더 큰 값으로활동기록 부분쪽 여백을 늘리고 싶으면:↓pl-16 = 4rem = 64px(원래는 2.5rem = 40px이었음 ✅ 방법 2: 프로필 섹션에 오른쪽 마진 추가↓mr-6 = 1.5rem = 24pxleft-5와 함께 쓰면 더 자연스럽게 간격 조절 가능 max-w-screen-xl: 화면의 최대 너비 설정 (화면이 너무 좁아지면 main 콘텐츠가 더 이상 줄..