본문 바로가기

프로젝트/재활용프로젝트8

[재활용 프로젝트][리액트] 재활용 플랫폼 완성 https://sejong-reuse-hub.vercel.app/ Sejong Reuse Hub sejong-reuse-hub.vercel.app재활용 플랫폼 링크  한 학기 하면서 드디어 프로젝트를 끝냈다. 초반에 느슨하게 하다가 막판에 몰아 달린 것 같다. 프로젝트를 하면서 많은 것을 배웠고 아직도 갈길이 멀지만 나름 완성하고 보니 성장한 것 같아 뿌듯하다. 메인 페이지    지도 화면     게시물 등록하는 페이지  게시물 페이지 2024. 6. 11.
[재활용 프로젝트][리액트] post edit page 구현 목차 완성된 모습 PostEditPage 코드 구현이미지 파일 수정은 추후 수정 예정import { useNavigate, useParams } from 'react-router-dom';import { useCallback, useEffect, useState } from 'react';import { Button } from '@mui/material';import { useRecoilState } from 'recoil';import { UserInterface } from 'configs/interface/UserInterface';import { userState } from 'store/atom/UserAtom';import { Position } from 'configs/interface/K.. 2024. 6. 7.
[리액트][재활용 프로젝트] 댓글 crud 구현 목차 완성된 모습  crud를 위한 로직 코딩 (usequery이용)시험기간이라 급하게 하다보니 조잡하다.. const { data } = useQuery({ //read 구현 queryKey: [`comments/${boardId}`], //쿼리키 queryFn: ({ signal }) => getData(`boards/${boardId}/comments`, signal), }); const { mutate } = useMutation({ //create 구현 mutationFn: postComment, onSuccess: () => { queryClient.invalidateQueries({ //데이터가 즉각 stale 상태(데이터가 만료된 상태)가 되어.. 2024. 6. 7.
[재활용 프로젝트][리액트] 메인 화면 재구상하기 목차 저번 화면이 너무 구린 것 같아서 메인화면을 다시 다 갈아 엎었따..기존거에 디자인 참고해서 다시 한번 수정해 보았다. 변경 전 모습변경 후 모습 컴포넌트들의 배치를 한 코드import styles from './HomeContainer.module.scss';import MainMapBackGround from './MainMapBackground';import MainLogo from './MainLogo';import Content from './Content';function HomeContainer() { return ( );}export def.. 2024. 5. 23.
728x90