Frontend Mentor에서 제공하는 디자인 시안을 바탕으로 Social Links Profile을 클론 제작했습니다.HTML/CSS만으로 구성되어 있으며, 반응형 UI와 접근성(WCAG 기준)을 고려해 제작하였습니다.완성 이미지프로젝트 개요제작 목적: 시멘틱 HTML 구조 및 반응형 카드 레이아웃 학습기술 스택: HTML5, CSS3 (Flexbox, Media Queries), Google Fonts (Inter)디자인 기준 해상도:Mobile: 375pxDesktop: 1440px사용 기술기술설명Semantic HTMLmain, ul, footer 등의 시멘틱 태그 사용Flexbox카드 중앙 정렬 및 수직 정렬 레이아웃 구성Media QueriesMobile-first 기반 반응형 대응Googl..

Frontend Mentor에서 제공하는 디자인 찬성을 바탕으로 Recipe Page를 클론 제작했습니다.HTML/CSS만으로 구성되어 있으며, 반응형과 타이포그래픽에 중점을 두어 UI를 완성했습니다.완성 이미지프로젝트 개요제작 목적: 시멘틱 마크업과 반응형 레이아웃 학습기술 스택: HTML5, CSS3 (Flexbox), Google Fonts디자인 기준 해상도:Mobile: 375pxDesktop: 1440px사용 기술기술설명Semantic HTML시멘틱 태그로 문서 구조를 명확히 표현Flexbox레이아웃 배치와 정리를 유연히 구성Media Queries모바일 우선(Mobile-first) 반응형 적용Google FontsYoung Serif, Outfit 포트 사용폴더 구조recipe-page/├─..

AccessToken이 프론트에서 넘어오지 않는 이슈 해결기상황로그인 후 AccessToken은 정상적으로 발급되어 localStorage에 저장됨하지만 다른 페이지 요청 시 서버에 토큰이 포함되지 않음인증 에러 발생 (401 Unauthorized)원인프론트에서 API 요청 시 Authorization 헤더를 설정하지 않았기 때문입니다.AccessToken은 저장만 되었고,실제 요청 시 header에 포함되지 않아 서버에서 인증 불가 상태가 됨해결 방법Axios 전역 설정 추가axios.defaults.headers.common['Authorization'] = `Bearer ${accessToken}`;이렇게 설정하면 이후 모든 요청에 자동으로 토큰이 포함됩니다.실무 팁localStorage, ses..