clyde-yoon 님의 블로그

Link Issue: https://github.com/spring-bud/mate-fe/issues/12PullReq : https://github.com/spring-bud/mate-fe/pull/13 기술적 구현2025.01.18 - [React/React-query] - 서버컴포넌트에서 리엑트쿼리(prefetch)  1. 리엑트쿼리 prefetch로 서버컴포넌트에서 데이터 페칭 후 캐싱2. customImage로 user이미지 렌더링과정에서 오류생길시, 대안이미지 렌더링3. SEO를 고려한 시멘틱태그  고민&의사결정 과정프로젝트를 설계하면서 가장 중점을 둔 것은 컴포넌트의 관심사 분리와 폴더 구조의 체계화였다. 폴더구조를 서버컴포넌트와 클라이언트 컴포넌트로 나누고, 데이터 페칭 및 관련 API호출..

LinkIssue: https://github.com/spring-bud/mate-fe/issues/6PullReq: https://github.com/spring-bud/mate-fe/pull/7기술적구현 2025.01.09 - [분류 전체보기] - 마크다운 에디터 구현하기(+preview)  고민&의사결정 과정마크다운 에디터 구현과정에 서술개선되야할 사항이미지업로드 프로세스preview 이미지렌더링 코드드래그된 텍스트를 툴바아이템을 통해 변경하면 마크다운으로 변경되지만 재클릭 하면 취소되는 기능 미구현ex) text 에서 U 클릭하면 *ㅎㅇ* 하고 재클릭하면 취소되어야하지만 재클릭 하면 **ㅎㅇ** 한번 더 중첩됨.content길이가 길어질 수록 preview bar와 스크롤 위치 동기화프롭 드릴링렌..

LinkIssue: https://github.com/spring-bud/mate-fe/issues/4PullReq: https://github.com/spring-bud/mate-fe/pull/5  기술적구현 기술적인 구현은 없다. 디자인 조정을 위한 페이지 세팅이다. 고민&의사결정 과정 Oauth 인증 플로우를 어떻게 가져갈지 고민이다. 아직 해결하지 못했다.개선사항로고이미지가 svg로 필요하고 슬로건도 이미지나 괜찮은 폰트가 하나 필요할 것 같다.학습사항...에러슈팅...참고자료...

LinkIssue : https://github.com/spring-bud/mate-fe/issues/2PullReq : https://github.com/spring-bud/mate-fe/pull/3구현 사항 1. 먼저 프로젝트에서 쓰일 간단한 부분들을 세팅했다.shadCnreact-iconsframer-motiontailwind2. 전체 아키텍처를 잡고 Home에서 사용될 컴포넌트들을 생성했다.customImagebannercategorypopularItemheaderfooterpopularFreelancer3. 임시 mock데이터 객체 생성했다. 고민 & 의사결정 과정 1. Next 버전  이번 프로젝트에선 AppRouter로 사용하려 한다. SEO상태보존부분 렌더링서버액션2. 아키텍처  아키텍처는..

거진 2주일 가까이 디자인을 했던 것 같았다.  https://creatie.ai/file/146171983563366?fileOpenFrom=shared&fileTileSwitch=false&page_id=M&shareId=146171983563366  기존 피그잼으로 그린 초안의 와이어 프레임을 createAi를 통해 페이지를 생성하고, 어느정도 자리가 잡힌 프레임 내에서 원하는 디자인으로 수정을 한 최종 와이어프레임이다. 한번도 웹디자인툴을 배워본적이 없기에, 대부분의 포지션은 absolute position으로 하나하나 레고처럼 쌓아올렸다. 디자인은 프론트 구현을 하면서 최종적으로 맞추게 될 것이다. (이 작업을 통해 웹디에 흥미를 느꼈고 추후 간단하게 배워볼 생각이다.) 예상되는 유저 flow를..

생각은 충분했고, 이제는 구체적으로 시각화의 차례이다. 내가 생각한 슬로건은'Easy come, Here we go''Quick contact, Quick start' 사실 슬로건을 정한다는 것 자체는 약간 부끄럽기도 하다. 그러나 추후 기획과 더해질 여러 작업에서 길을 잃고 방황할 수 있기에 잊지 말아야할 초심은 반드시 필요하기 때문이다.슬로건은 후자를 선택했다.빠르게 시작할 수 있는 것이 이 프로젝트의 핵심이라 생각한다. (첫 번째는 입에 달라붙지않아 패기했다.)    피그마를 통해 전문적으로 이쁘게 디자인 하고싶었을 뿐이다.  Home 홈페이지에는 웹의 얼굴이기 때문에, 더욱 더 고민하기로 하고 일단은 모양만 을 잡았다.  1. How to work? 이 섹션을 통해 이 웹이 얼마나 쉽고 빠르게 사..

기획은 늘 어려운 일이다. 상상은 쉽고, 구체화는 매우 어려운 일이다. 마치 예술과도 같다고 느껴질 정도였다.  영감은 이 과정에서 나왔다. 구체화를 위해 내게 가진 부족한 무언가를 누군가 빠르게 채워줄 수 있으면 좋지않을까? 그리고 이 과정에서 개발과 디자인 그리고 기획 등, 원하는 세세한 것들을 값싸고 쉽게 의뢰할 어떠한 사이트가 있었으면 좋겠다고 느낌을 받았고, 관련 사이트를 검색해 보았을 때 다양한 것들이 부족하다고 느껴졌고 이러한 것들이 있었으면 좋지 않았을까란 생각이 시발점이다. 조사 1. 어려운 접근이 더 전문적인 것일까?  관련 사이트들은 내 의뢰를 맡아줄 프리랜서나, 또는 대행업체를 찾기까지의 과정에 여러 단계를 거쳐야한다. 어느곳은 AI와의 대화 끝에 대기시간을 걸쳐 추천하는 곳도 있었..