1. [Next.js] middleware.ts미들웨어는 요청과 응답 사이에 위치해 실행되는 코드입니다. Next.js 파일 최상단에 middleware.ts 이름으로 파일을 만들면 알아서 동작됩니다.req.nextUrl.startsWith("/path") : 경로로 시작하는 모든 요청을 검사 NextRequest와 NextResponse는 표준 웹 API의 request와 response를 확장한 것 3. [ Next.js 14]개발모드(npm run dev)에서는 getStaticProps가 해당 함수의 개념과는 달리 페이지 재접속시 해당 요청마다 호출합니다. 왜냐하면 개발모드에서는 개발자가 코드를 수정했을 때 수정결과가 바로 반영하도록 설계되어 있기 때문입니다. 따라서 getStaticPr..
오늘은 저번시간에 북마크 기능이랑 페이지네이션 적용하지 못해서 이를 적용하고 오류를 분석하는 시간을 가졌습니다. 또 supabase 를 Next.js 에 적용하며 오랜만에 억까를 당해 기력이 쇠했던 날이기도 하네요. 하하 그래도 시간이 지나 경험이 쌓이면 과거의 억까들이 신의 장난이 아니라 지식부족이였다는 걸 깨닫겠지만요. 당 떨어지는 하루였습니다 ;ㅅ; -2. [ supabase ] supabase에 Next.js 개같이 털리기 superbase 적용하는 시간이 너무 고생스러워서 꼭 정리해야 겠다 싶었어요.회원가입하고 새 프로젝트를 만들기를 눌러 프로젝트 이름, 비밀번호, 지역을 넣어서 프로젝트를 만듭니다. 여기서 프로젝트와 연결하는 과정이 개인적으로 어려웠는데요. 왼쪽 home 버튼누..
1. 새롭게 배운 점은? (Learned)"프론트엔드는 클린 코드보다 중요한 게 정확한 기능구현과 정확한 퍼블리싱" 라는 강사님 말씀이 인상깊었습니다. 그래서 오늘은 보다 정확한 퍼블리싱을 구현하도록 고민하고 시멘틱 태그를 다시 한 번 고민을 하는 시간을 가졌어요. 더 나아가서는 테일윈드 css 와 grid로 코드짜는 것에 익숙해지는 시간을 가졌습니다. 아래 내용은 새롭게 안 내용과 고민입니다.분석과 고민1. search-bar.tsx 파일 분석1-1. 조건부 렌더를 쉽게 작성하려고 만든 cn 유틸 함수 search-bar는 내부적으로 cn함수를 사용하는 데 살펴보니 utils 폴더 내부에 있는 사용자 정의함수이고 이는 조건부 렌더를 쉽게 작성하기 위해 만든 함수라고 합니다. //utils>inde..
1. 이번주 수업에서 좋았던 점은? (Liked)첫 수업, 첫 과제가 자신이 최종적으로 어떤 모습이길 희망하는지, 어떤 개발자가 되고 싶은지, 꼭 개발자가 아니더라도 해당 캠프를 통해 혹은 미래에 어떤 모습이길 희망하는지 적어보라는 것이었습니다. 이직 준비에 한창 열이 올라 포토폴리오 수정과 공부에만 집중하고 있었는 데 첫 과제를 받고 황당하더라고요. '그런 이상은 현재 등 따시고 배불러야 할 수 있는 생각이야.'라고, '한 공고에 300명이 몰리고 포트폴리오들도 전부 완벽에 가까운 포폴들이여서 현재 프론트엔드 신입 취업경쟁이 치열하다.'라고 선생님 방금 전까지 말씀하셨잖아요. 그냥 잘 먹고 잘살고 싶으니까! 공부하는 거죠. 솔직히 딱 든 생각들은 이랬어요. 근데 차근차근 과제를 수행하다보니 중요한..
