[학습기록] ~day85: 블로그 만들어 배포해보기

그동안은 미니프로젝트2 기록으로 웹개발일기를 쓰지 않았었네요.이후에는 쉬엄쉬엄 수업 시간에 작은 미니프로젝트로 개별로 개인 블로그를 만드는 시간을 가졌습니다.처음 해보는 배포는 정말 쉽지 않았습니다. 프론트는 vercel, 백엔드는 render를 통해서 무료배포를 진행했습니다.다끝냈다고 생각했는데, 배포를 한 이후 모바일과 데스크탑을 오며가며 테스트를 해보니 치명적 오류를 발견했습니다ㅜㅜ 마이페이지를 전부 쿠키를 통해 정보를 주고 받고있어서,해당 아이디로 작성한 글이어도.... 다른 기기에서 동일한 아이디로 접속해서 보면 마이페이지에서 확인할 수 없습니다.충격적;; id끼리 매칭했다고 생각했는데, 뭐가 문제죠?고쳐주실 분 찾습니다 ㅋㅋㅋㅋ 그리고 메타데이터 오탈자도 수정했는데 왜 계속 '공간간'으로 나오..

• format_list_bulleted 웹 개발 일기/[LG유플러스] 유레카
• · 2025. 5. 31.
• textsms

[Project: 잡생각 - 진로탐색 및 채용연계 서비스] - 최종

잡생각(JobThoughts) 잡생각은 사용자의 성향, 선호도, 선택 데이터를 기반으로 적합한 직업을 추천하고,해당 직업과 관련된 실시간 채용정보까지 연결해주는 진로 탐색/채용 연계 서비스입니다. 주요 기능기능설명1. 성향 선택형 테스트커리어넷 직업 가치관 검사를 통해 사용자의 기호와 선호 활동을 파악2. 직업 추천커리어넷 API 기반으로 적합한 직업 추천3. 실시간 채용 정보 조회추천된 직업의 채용 공고를 바로 조회 가능( 현재 mock데이터 사용중: 사람인API 승인 허가가 안됨 ) 작업물특히 팀노션에는 작업물, 작업과정, WBS, 기획서 등 모든 기록이 일목요연하게 정리되어 있기에,팀노션으로 살펴보시는 것을 추천드립니다.🔗팀노션 🔗배포 사이트🔗깃허브 레포지토리 🔗피그마 🔗발표자료 프로젝트..

• format_list_bulleted Project & Challenge/[Project] 잡생각 - 진로탐색 및 채용연계 서비스
• · 2025. 5. 23.
• textsms

[Project: 잡생각 - 진로탐색 및 채용연계 서비스] - 0519/0520

0519 진행 사항Design: 전체페이지 모바일뷰 반응형 완벽 구현Design: 전체페이지 레이아웃 다듬기 유저의 입장에서 꼼꼼히 리뷰하며 UX 전체적으로 개선 및 업그레이드 !!처음 이용하는 유저를 위한 온보딩 페이지 만들기로딩이 너무 긴 페이지에는 로딩 스피너 외에도이미지와 다양한 멘트를 캐러셀로 구현하여 유저 경험 개선시키기가치관 검사 페이지에 카드 애니메이션 속도감 빠르게 개선하여 답답함 줄이기스킵하게 되는 섹션이 없도록 스크롤 속도감 통일되게 각 섹션 사이즈 조정하기Fix: 애니메이션 요소 무한튕김 현상 해결0520 진행 사항발표 자료 준비 : PPT, 대본코드 전체 리팩토링gitHub Readme꾸미기 오늘은 마감일(0520 자정) 직전 입니다.그래서 19일은 전체적으로 유저의 입장에서 계속..

• format_list_bulleted Project & Challenge/[Project] 잡생각 - 진로탐색 및 채용연계 서비스
• · 2025. 5. 22.
• textsms

[Project: 잡생각 - 진로탐색 및 채용연계 서비스] - 0516

0516 진행 사항Fix: HeroSection-100vw로 인해 생기던 우측 여백 문제 해결Feat: 직업 가치관 검사 페이지 검사 질문지 커리어넷 api 연동Feat: 유저 선택값 저장 구현 Fix: HeroSection-100vw로 인해 생기던 우측 여백 문제 해결[CSS] 100vw vs 100% – 스크롤바 때문에 생기는 의외의 레이아웃 깨짐 해결법 [CSS] 100vw vs 100% – 스크롤바 때문에 생기는 의외의 레이아웃 깨짐 해결법제가 참여했던 잡생각 프로젝트에서는 HeroSection에 스크롤에 따른 타이포그래피 애니메이션을 넣게 되었습니다. 스크롤에 따라 폰트가 점점 커지는 모션에서 자연스럽게 다음 섹션의 black 화면kenco.tistory.com API 명세written by 팀..

• format_list_bulleted Project & Challenge/[Project] 잡생각 - 진로탐색 및 채용연계 서비스
• · 2025. 5. 22.
• textsms

[CSS] 100vw vs 100% – 스크롤바 때문에 생기는 의외의 레이아웃 깨짐 해결법

제가 참여했던 잡생각 프로젝트에서는 HeroSection에 스크롤에 따른 타이포그래피 애니메이션을 넣게 되었습니다. 스크롤에 따라 폰트가 점점 커지는 모션에서 자연스럽게 다음 섹션의 black 화면으로 넘어갈 수 있도록 구현했었는데요. 이때 애니메이션 효과를 위해 추가한 요소였던 BlackSection으로 인하여 어마어마한 가로 스크롤이 생겼었고,이를 방지하기 위해 overflow-x: hidden을 적용했었습니다. 그런데?!HeroSection에 overflow-x: hidden을 잘 적용했음에도 계속해서 오른쪽에 거슬리는 black 영역이 나타났습니다!!사소하지만, 우리 서비스의 첫 진입 영역이므로 어떤 디테일도 오차가 있으면 안됩니다!! 결론은애니메이션을 위해 추가한 요소들로 인하여 가로 스크롤이 ..

• format_list_bulleted Study Notes
• · 2025. 5. 21.
• textsms

[Project: 잡생각 - 진로탐색 및 채용연계 서비스] - 0515

0515 진행 사항직업 가치관 검사 페이지: TestInformSection 구현Card컴포넌트 TestInformSection용 추가화면 진입 애니메이션 추가뷰포트 흔들림 문제 해결직업 가치관 검사 페이지: TestCompleteSection 구현Button컴포넌트에 누락된 스타일 요소 추가Card컴포넌트 TestCompleteSection용 추가 직업 가치관 검사 페이지TestInformSection 구현📝 변경 사항 Card컴포넌트에 TestInform페이지용으로 export할 Card를 추가 제작했습니다.TestInformSection구현을 완료했습니다.메인 페이지에서 TestInform으로 넘어올 때 너무 뚝 끊기는 느낌이 들어, 화면 진입 애니메이션을 추가했습니다.화면 진입 애니메이션 작동시..

• format_list_bulleted Project & Challenge/[Project] 잡생각 - 진로탐색 및 채용연계 서비스
• · 2025. 5. 16.
• textsms