20210309 21일차 그림일기장 수정 로직 구현

2021. 3. 10. 04:24·BootCamp_Codestates/Final Project

구현 내용

  • 그림판/일기장 로직 구현 완료

  • 그림 일기장 수정 로직 구현 중

 

나의 일기 페이지에서 수정하고 싶은 일기의 수정 버튼을 누르면 수정이 가능한 일기 쓰기 페이지가 열린다.

다른 로직과 마찬가지로, App 으로의 상태 끌어올리기를 통해 해당 글의 모든데이터를 일기쓰기 페이지의 컴포넌트의 필요한 부분

에 전달한다.

function App(): ReactElement {
	const [contentInfo, setContentInfo] = useState(0);
...
	const conveyContent = (e: any) => {
		setContentInfo(e);
		console.log(contentInfo);
	};
...

각 컴포넌트에서는 useEffect 를 사용하여 이 데이터의 유무에 따라 상태를 변경시키는데,  예를 들어

날짜, 그림, 제목, 내용, 기분, 공개여부 등이다.  여기서 주목할 점은 그림의 데이터는 좌표데이터이기 때문에 최초 그림을 그릴때와 마찬가지로 마지막 지우기 기능이 가능하다. (마지막 좌표 또는 선 부터 사라지는 기능).

 

해야할일

아직 API 를 통해 업데이트 요청을 보냈을 때 서버 에러가 발생해서 서버쪽에 확인이 필요하다.

그리고 상태 변화에 따라 예상치 못한 동작이 몇개 있어서(예를 들어, 뒤로가기 버튼을 누르고 다시 들어오면 상태가 그대로인 점.. 뒤로가기 버튼을 눌렀을때 contentInfo 가 있는 상태면 모든 상태를 리셋해주면 될 것으로 보인다.) 디테일한 에러 핸들링이 필요하다. 내일 글 수정 기능이 완성되면 바로 소셜로그인 구현을 시작할 예정이다.

 

요즘 너무 늦게 자는 것 같다. 새벽 네시라니.. 글 수정 기능을 왠만큼은 끝내고 싶었다. 자야지...

'BootCamp_Codestates > Final Project' 카테고리의 다른 글

20210311 23일차 카카오, 구글 소셜 로그인 구현 완료(OAuth)  (0) 2021.03.12
20210310 22일차 카카오 소셜 로그인 구현(중)  (0) 2021.03.11
20210308 20일차 그림판/일기장 로직 구현(99% 완성)  (0) 2021.03.09
20210307 19일차 그림판/일기장 로직 구현(85% 완성)  (0) 2021.03.07
20210306 18일차 로그인/로그아웃 로직 구현 완료  (0) 2021.03.07
'BootCamp_Codestates/Final Project' 카테고리의 다른 글
  • 20210311 23일차 카카오, 구글 소셜 로그인 구현 완료(OAuth)
  • 20210310 22일차 카카오 소셜 로그인 구현(중)
  • 20210308 20일차 그림판/일기장 로직 구현(99% 완성)
  • 20210307 19일차 그림판/일기장 로직 구현(85% 완성)
JTB
JTB
웹/앱 개발 정보를 공유하고 있습니다.
  • JTB
    JTechBlog
    JTB
  • 전체
    오늘
    어제
    • All About Programming;) N
      • Computer Science
        • Terminology and Concepts
        • Network
        • Operating System
        • Database
        • Data Structure
      • Frontend
        • Javascript Essentials
        • Perfomance Optimization
        • JS Patterns
        • Next.js
        • Flutter
      • Backend
        • Node.js
      • DevOps
        • Docker & Kubernetes
      • Coding Test N
        • LeetCode N
        • Programmers
      • Tech Books & Lectures
        • Javascript_Modern JS Deep d..
        • Network_IT 엔지니어를 위한 네트워크 입문
      • Projects
        • PolyLingo_2025
        • Build Your Body_2024
        • JStargram_2021
        • Covid19 Tracker_2021
        • JPortfolio_2021
      • BootCamp_Codestates
        • TIL
        • TILookCloser
        • Pre Tech Blog
        • IM Tech Blog
        • Daily Issues and DeBugging
        • First Project
        • Final Project
        • Sprint Review
        • Good to Know
        • Socrative Review
        • HTML & CSS
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

    • 글쓰기
    • 관리
  • 공지사항

  • 인기 글

  • 태그

    database
    스코프
    js pattern
    testing
    Data Structure
    모던 자바스크립트 Deep Dive
    Threads and Multithreading
    Binary Tree BFS
    How memory manage data
    커리어
    프론트엔드 성능 최적화 가이드
    VoiceJournal
    이벤트
    CPU scheduling algorithm
    need a database
    TCP/IP
    polylingo
    Operating System
    structure of os
    mobile app
    Time complexity and Space complexity
    JavaScript
    자바스크립트
    자바스크립트 딥다이브
    DOM
    Network
    leetcode
    딥다이브
    Shared resources
    indie hacker
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.5
JTB
20210309 21일차 그림일기장 수정 로직 구현
상단으로

티스토리툴바