훈돌라

타입스크립트(TypeScript) 는 마이크로소프트가 개발하고 유지하는 오픈 소스 프로그래밍 언어이자 자바스크립트의 상위 집합으로, 자바스크립트 코드에 타입 시스템을 추가하여 코드의 가독성, 유지보수성, 그리고 오류 검출 능력을 향상시킵니다.   정적 타입 지정 let num: number = 5;let name: string = "John"; 타입스크립트는 컴파일 타임에 변수, 함수, 객체 등의 타입을 지정할 수 있다.이를 통해 런타임 오류를 미리 잡아낼 수 있다.타입 추론let num = 5; // 타입을 명시하지 않아도 number로 추론 타입스크립트는 코드의 맥락을 이해하고 타입을 자동으로 추론한다.인터페이스와 타입 엘리어스interface Person { name: string; ag..

TanStack Query TanStack Query는 이전에 React Query로 알려진 라이브러리로, React 애플리케이션에서 서버 상태 관리를 효과적으로 처리하는 데 사용됩니다.  서버 상태 관리:TanStack Query는 서버 상태(서버에서 가져온 데이터를 클라이언트에 캐시하는 것)를 관리하는 데 최적화되어 있습니다.일관되고 성능 좋은 방식으로 서버 상태를 가져오고, 캐시하고, 동기화하며, 업데이트할 수 있는 도구를 제공합니다.주요 기능:캐싱: 서버에서 가져온 데이터를 자동으로 캐시하여 성능을 향상시키고 불필요한 요청을 줄입니다.동기화: 백그라운드 리패칭 및 데이터 무효화를 처리하여 서버와 클라이언트 간의 데이터를 동기화합니다.에러 처리: 내장된 에러 처리 지원으로 에러를 처리하고 표시하는 ..

메인페이지    게시글 작성 crud       마이페이지    today' menu설문조사를 이용해 음식을 추천해주고, 레시피를 등록, 공유할 수 있는 사이트 supabase 를 이용해 로그인, 회원가입 기능 및 DB 를 관리했다. 전반적으로 기존에 사용하던 라우터가 아닌 새로운 라우터 버젼을 사용해서 낯설지만 새로운 경험이 됬고,리액트 쿼리를 실제로 적용해 볼 수 있는 좋은 기회였다.기획 단계에서 페이지 구조를 잘 설계하고 시작한다면 나중에 고생을 덜(?) 할 수 있다는걸 알게됬다.. 저번 프로젝트 때도 그렇고, 이번 프로젝트 때도 그렇고 기획 단계가 정말 정신없긴 하지만 신경을 많이 써야되는 것 같다.

supabase /table/ recipes / thumbnail 에 들어갈 이미지를 public url 로 변환 완료 (기존은 base64)  //레시피 추가 메서드  async postRecipe(recipe, file, userId, nickname) {    let thumbnailUrl = ''; // 기본적으로 빈 문자열 또는 기본 이미지 URL로 설정    // 파일이 있는 경우에만 이미지 업로드 시도    if (file) {      // 스토리지에 이미지 저장      const { data: uploadData, error: uploadError } = await supabase.storage        .from('images')        .upload(`recipeimages..

레시피 CRUD 를 구현중에 있고, 등록, 수정, 삭제는 구현했으나 이미지를 업로드 하기 전 미리보기를 위해 이미지 파일을 base 64 로 문자열로 변환하여 출력했고, 그 때문에 이미지가 base 64 (만줄이 넘음) 로 들어간다.변환하는 법을 팀원분이 알려주긴 하셨는데 이해가 잘 안 가서 내일 다시 여쭤보며 해결하려고 한다..  class RecipeAPI {  //레시피 추가 메서드  async postRecipe(recipe) {    console.log(recipe.imageSrc);    // const { data: uploadUrl, error: uploadError } = await supabase.storage    //   .from('images')    //   .upload('..

간단한 설문조사를 통해 오늘의 메뉴를 추천해주고, 사용자들이 직접 레시피도 공유할 수 있는 사이트를 기획했다. 그 중 내가 맡은 부분은 레시피 CRUD (Supabase 연동) 지난 프로젝트 때 Supabase 를 깊게 학습하지 못했어서 되려 좋은 기회가 될 것 같다.다만 걱정인건, 저번 주 예비군 4일 부재로 인해  tailwind, zustand, rtk, Tanstack Query  가 뒤쳐졌다는 점,,,,열심히 따라가봐야겠다..