이 글에서는 Kiloflow 프로젝트에서 사용자가 등록한 음식에 대해 다른 유저들이 추천 또는 비추천을 할 수 있는 기능을 구현하는 방법을 설명합니다. 이 기능을 통해 사용자는 음식에 대한 피드백을 제공하고, 다른 사용자들이 이를 참고할 수 있습니다.데이터베이스 스키마 users 테이블model users { user_id Int @id @default(autoincrement()) email String @unique password String nickname String profile_image String @..

이 글에서는 Kiloflow 프로젝트에서 사용자가 직접 음식을 등록하고, 이를 공공 API에서 가져온 데이터와 함께 리스트에서 검색하는 기능을 구현하는 방법을 설명합니다. 이를 통해 사용자는 자신의 음식을 등록하고 관리할 수 있습니다.데이터베이스 스키마 users 테이블model users { user_id Int @id @default(autoincrement()) email String @unique password String nickname String profile_image String @default("..

이 글에서는 Kiloflow 프로젝트에서 공공 API를 사용하여 음식 리스트를 검색하는 기능을 구현하는 방법을 설명합니다. 이 기능을 통해 사용자는 공공 API에서 제공하는 음식 데이터를 검색할 수 있습니다. 프론트엔드음식 리스트 컴포넌트  1. 상태값 정의 const FoodList: React.FC = () => { const [foodList, setFoodList] = useState([]); //음식 리스트 저장 const [searchList, setSearchList] = useState([]); //검색 결과 저장 const [keyWord, setKeyWord] = useState('');//검색 키워드 저장 const [currentUserID, setCurrentUserID] ..

1. 주간달력과 월간달력 구현을 위한 라이브러리 설정Kiloflow 프로젝트에서 주간달력과 월간달력을 구현하기 위해 react-calendar와 dayjs 라이브러리를 사용합니다.npm install react-calendar dayjs  2. 달력 컴포넌트 설정 및 기본 렌더링 2-1 상태값 정의 및 초기 설정 // 상태값 정의const [currentTab, setCurrentTab] = useState('week'); // 현재 활성화된 탭(주간 또는 월간)을 나타내는 상태값const [selectedDate, setSelectedDate] = useState(dayjs().toDate()); // 현재 선택된 날짜를 저장하는 상태값// 탭 변경 핸들러const handleTabChange = (t..

회원정보 수정 기능은 개인정보와 프로필 정보를 업데이트할 수 있도록 합니다. 프론트엔드 1. 사용자 정보 수정 페이지 컴포넌트 1-1 상태값 정의 const [activeTab, setActiveTab] = useState("personalInfo"); // 현재 활성화된 탭을 나타내는 상태값const [currentUserInfo, setCurrentUserInfo] = useState(null); // 현재 사용자의 기본 정보를 저장하는 상태값const [currentUserProfile, setCurrentUserProfile] = useState(null); // 현재 사용자의 프로필 정보를 저장하는 상태값const router = useRouter(); // Next.js의 useRouter 훅..

사용자는 로그인 후 키, 몸무게, 목표 몸무게, 감량 난이도를 설정하여 맞춤형 권장 섭취 칼로리를 계산받을 수 있습니다. 초기 설정이 완료된 후에는 더 이상 초기 설정 페이지가 뜨지 않으며, 회원가입 후 초기 설정은 한 번만 할 수 있습니다.데이터베이스 스키마 1. users 테이블model users { user_id Int @id @default(autoincrement()) email String @unique password String nickname String profile_image String @de..