Frontend 개발자 - hyo.loui

🎯목적 : Post, Edit post, Detail - 페이지 별 텍스트 에디터 변경 기존 : Toast UI Editor 변경 : UIW Markdown Editor 🥸 장-단점에 따른 결정 : Toast UI Editor : 이미지 업로드 기능이 있으나 번들 사이즈가 무겁고 SSR 지원이 안됨. UIW Markdown Editor : 마크다운 기본 내장, 번들사이즈 가볍고 , 이미지 업로드 기능 없음 UIW Markdown Editor 툴바 커스텀하여 사진 업로드 및 삽입 드래그 앤 드랍, 붙여넣기 기능 구현 기록 목차 에디터 적용 에디터 커스텀 이미지 업로드 이미지 삽입 드래그 앤 드랍, 붙여넣기 구현 결과 화면 1. 에디터 적용 우선 공식문서를 참고해서 MDEditor를 가져온다. 하지만 us..

📝 WIL: Weekly I Learned Work done this week 이번 한 일! Project : Codefolio = 프로젝트 진행중 ( 폴더링, 중간 발표, KTP 회고 ) 배운 내용 컴포넌트 별 작업 후 페이지에 적용 supabase 연동하여 서버통신 Next에서의 dev dependency array Project review 테스크 관리, 프로젝트 프로세스가 잘 진행되는 깊은 팀 프로젝트 경험을 하고 있습니다. 더욱 발전 되도록 기여하고 싶습니다! 3주차 중간 발표 튜터님 피드백 최종 발표시 + 부가설명이 필요. readme 데이터 모델링 추가. 트러블 슈팅 아주 칭찬합니다. 버그 개선하여 최종 발표까지 준비 잘 하길. 중간 발표에서는 캠프 측에서 7분의 발표시간을 꼭 준수해달라고 ..

3주차까지의 후기 및 소감 3주차까지의 후기 및 소감 A new tool for teams & individuals that blends everyday work apps into one. www.notion.so 1. MVP 중간발표 자료(기입) https://drive.google.com/file/d/1KOrHStRDEbr5ntKfacaeIZujRm3_U3Iy/view?usp=share_link codefolio-중간발표 drive.google.com 2. 기술적 의사결정 & 트러블슈팅 기록 라이브러리 선정 https://github.com/react-challengers/Codefolio/issues/44 https://github.com/react-challengers/Codefoli..

🎯목적 : Supabase Auth - 로그아웃, 로그인 상태(recoil) 1. recoil + supabase getSesstion() import { atom } from "recoil"; const userLoginCheck = atom({ key: "userLoginCheck", default: false, }); export default userLoginCheck; 전역 상태관리를 위해 프로젝트에서 recoil을 도입했다. 사용법은 다른 전역 상태관리 라이브러리에 비해 너무 간단하다. atom을 import해준 후 useState처럼 사용하면 된다. 타입스크립트로 인해 defaul의 타입을 지정해주고, atom에 전달되는 object는 key와 value로 구성되며 key에 선언할 text와..

🤢 문제 내용 : supabase 사용 시 필요한 키를 .env 에 입력했으나, 인식을 못하고 에러 발생.. 🎈 문제 해결 방법 : 기존 NEXT_PUBLIC_SUPABASE_API_KEY로 설정되던 값을 예약어인 NEXT_PUBLIC_SUPABASE_ANON로 변경해주었습니다. AS-IS # .env.local NEXT_PUBLIC_SUPABASE_URL=URL NEXT_PUBLIC_SUPABASE_API_KEY=API_KEY TO-BE # .env.local NEXT_PUBLIC_SUPABASE_URL=URL NEXT_PUBLIC_SUPABASE_ANON=API_KEY ✨ 알게된 것 라이브러리를 사용 할때에는 예약어를 기본값으로 가지고 있는지 확인해야 합니다. 또한 사용 전 공식문서를 꼼꼼하게 읽어야..