[Vercel] 기본 도메인을 커스텀도메인으로 redirection하기

오늘은 유저테스트를 위해 도메인을 세팅했다!처음 배포했을 때 브랜치이름으로 도메인이 설정됐었는데, 그 도메인으로 접속하더라도 구매한 도메인으로 연결될 수 있도록 했다 vercel에서 프로젝트의 settings > Domains로 들어오면 기존 도메인과 등록해둔 커스텀 도메인들이 나온다 여기서 Edit 버튼을 눌러 어디로 리다이렉션할 것인지, 상태 코드는 어떤 코드로 지정할 것인지 설정할 수 있다!  이제 기존 도메인으로 접속해도 구매한 도메인으로 연결된다 ^-^ https://www.dream-card.co.kr/ 드림카드 | 나만의 모바일 청첩장모바일 청첩장을 직접 제작하고 커스텀할 수 있는 서비스입니다. 소중한 날을 더 특별하게 만들어보세요!www.dream-card.co.kr https://chal..

• format_list_bulleted Next.js
• · 2024. 11. 12.
• textsms

[팀프로젝트] 우리 팀의 협업 효율을 높인 규칙들

안녕하세요! 모바일 청첩장 제작 서비스 '드림카드'를 진행중인 도비팀입니다.내일배움캠프 수강생인 프론트엔드 개발자 5명, 디자이너 1명이 모여 열심히 프로젝트를 만들고있습니다. 드림카드는 내일배움캠프에서의 최종 프로젝트로, 이전보다 규모가 크고 기간이 길어진만큼 팀원 전체가 프로젝트의 흐름을 공유하고 정확한 규칙으로 협업 효율을 높이는 것이 중요하다는 생각이 들었습니다. 당장 기획하고 구현에 돌입하기도 마음이 급한데, 규칙을 정하기 위해 오랜 시간 논의했고 코드리뷰나 PR 작성 등 구현만 하는 것에 비해 시간이 더 소요되는 일들이 많아졌는데요. MVP 집중 구현 기간이 끝난 지금 돌이켜생각해보면 시간을 들여 디테일한 규칙을 정한 것이 오히려 빠른 흐름 속에 중심을 잡고 서로의 코드를 붙여나갈 중심점이 ..

• format_list_bulleted 팀 프로젝트
• · 2024. 11. 11.
• textsms

[Notiflix / CSS] 라이브러리 스타일 커스텀하기

중간발표까지 주요 기능들을 구현하기위해 토스트 알림은 라이브러리를 사용하기로 했다.여러가지 후보들을 두고 디자이너님과도 상의를 거쳤고, 빠른 구현이 목적이니만큼 커스텀에 공을 들이지 않아도 디자인 요구사항과 가장 유사한 Notiflix를 선택하게 되었다. https://notiflix.github.io/notify Notify | NotiflixNotiflix Notify module can be used to send non-blocking alerts/notifications. This module includes 4 types of notifications: "Success", "Failure", "Warning", and "Info".notiflix.github.io 기존에 react-tostif..

• format_list_bulleted HTML + CSS
• · 2024. 11. 3.
• textsms

[팀프로젝트] 스티커 마무리!! 그리고 일 나눠가져가기

주말부터 계ㅔㅔㅔ속 붙잡고있었던 스티커를 드디어 마무리했다..처음에 직접 구현하는게 욕심이나서 구현하다가 사이즈 조정에서 막혀서 너무 촉박해졌다..ㅠㅠ구현을 해보는 것도 좋겠지만 기한을 맞춰야하니까 빠르게 라이브러리를 알아보고 결정했다현재 상황에서 리사이즈만 추가하면 되는 상황이라 여기에 초점이 맞춰져있는 re-resizable을 사용했다다행히.. 기존 구조에서 바꿀 것도 크게 없는 상황이라 빠르게 마무리가 됐다정말정말 다행..그리고 다른 분들이랑 기능 합치고! 드디어 내가 맡은 부분이 어느정도 끝나서 일정이 밀리고있던 다른 기능을 구현하기 시작했다너무 정신없지만 뚝딱뚝딱 진행되는 것 같아서 뿌듯하기도하고..내일 연관 기능 이어서 개발할 수 있게 오늘 최대한 마무리해봐야겠다 아 그리고 스티커 불러오는 부..

• format_list_bulleted 일지
• · 2024. 11. 1.
• textsms

[Next.js + tailwind] tailwind public 폴더에서 버튼 backgroundImage 설정하기

src 폴더 하위가 아닌 바깥쪽 public 폴더에서 정적 이미지를 가져와 백그라운드 이미지로 사용하는 경우 설정이 조금 더 필요하다 1) public 폴더 생성 후 이미지 넣기2) tailwind.config.ts에서 extend에 backgroundImage 추가backgroundImage: { buttonBG: "url('/assets/images/button/buttonBg.svg')",}, 3) 버튼에서 사용하기! {children}tailwind.config.ts에서 설정한 이름으로 background 설정을 해주면 끝!나머지 설정들은 이 버튼에 필요해서 넣은거지 필수가 아니다!

• format_list_bulleted Next.js
• · 2024. 10. 30.
• textsms

[팀프로젝트] 241029 무한리렌더링..

어제까지 스티커를 px 단위로 이동시키는 기능을 구현하고, 크기가 다른 기기에서 제작한 청첩장을 확인했을 때 웨딩사진에 비례해 알맞은 위치로 가도록 하기 위해 웨딩사진에 대한 비율을 계산 후 %로 적용할 값을 구하는 기능까지 구현했다 그런데.. 무한 리렌더링이 발생하면서 폼이 엄청나게 깜빡거리기 시작했다 시도한 것들은1) 스티커 자체를 메모이제이션 (영향없음)2) style에 px을 적용하기위해 컴포넌트 외부에서 가상의 스크린사이즈를 상수로 두고 컴포넌트 내부에서 사이즈 계산하여 px로 적용 + 이 계산도 useMemo로 메모이제이션 (영향없음)3) .next 넥스트 캐시 지우기 (30분정도 괜찮다가 다시 안됨.. 왜지??)4) vercel 배포하여 확인해보기 -> 정상적으로 작동함..  5) 그러다 리..

• format_list_bulleted 일지
• · 2024. 10. 29.
• textsms