Projects

2023년 12월 10일 프로덕트 링크 사용 기술 스택: Next.js, styled-components(styling), Vercel(Continuous CI/CD) 발단 직접 만든 Figma로 작성한 발더스 게이트3 커스텀 캐릭서 설정 시트(일명 캐릭터 영수증)를 배포하기 위해 알아보던 중, 별도의 이미지 편집 툴 없이 안의 내용을 고쳐 이미지 파일의 형식으로 내보내는 솔루션이 없을까 고민함 프로젝트 목표 유저가 별도의 기술적 지식, 툴적 지식 없이도 간단하게 내용을 편집하고 이미지를 올릴 수 있는 툴 결과물을 이미지 파일의 형식으로 내보낼 수 있어야 함 유저가 Input에 글을 입력하면 그 안의 내용이 export될 이미지에 유저가 확인할 수 있는 형태로 실시간으로 업데이트되어야 함. Vercel의 CI/CD 기능을 활용하기 빠르게 디자인, 코딩, 배포까지 완료하기(결론적으로.. 10시간 이내에 이 모든 것들을 해냈습니다🥹👍) 프로젝트 진행 순서 디자인 6 Column 그리드를 베이스로, 왼쪽의 두 칼럼은 간단한 프로필 정보와 얼굴 사진을 넣을 수 있도록 만들고, 우측의 4 칼럼을 긴 글줄에 할애함. 간단하게 텍스트를 집어 넣어 요소들의 사이즈와 요소들 간의 마진을 미리 설정해놓음. 코딩 기술적인 이슈와 해결 방법