Conversation
kku1403
reviewed
Jul 10, 2025
| export function getStorage(key) { | ||
| try { | ||
| const data = localStorage.getItem(key); | ||
| return data ? JSON.parse(data) : null; |
There was a problem hiding this comment.
현재 getStorage에서 데이터가 비었을 때 null을 반환하고 useTodos에서 다음 코드를 실행하고 있는 것으로 보이는데요
const [todos, setTodos] = useState(() => getStorage("todos") || []);getStorage에서 이미 분기 처리를 해주고 있으므로
null을 반환하기 보단 빈 배열을 반환하면, useTodos에서 null 확인을 또 안해줘도 될 것같아요!
참고하시면 좋을 것 같습니다 :)
|
|
||
| const handleSubmit = (e) => { | ||
| e.preventDefault(); | ||
| if (input.trim()) { |
There was a problem hiding this comment.
입력 검증은 생각하지 못했던 부분인데 디테일이 살아있으시네요...
현재 유효하지 않은 입력값이 들어왔을 때의 처리는 안하신 것 같은데, 단순하게 alert로 메세지를 날리는 것도 좋아보입니다!
| // 새 할 일 객체 만들기 | ||
| function createTodo(value) { | ||
| return { | ||
| id: Date.now() + Math.random(), // 유니크한 아이디 |
There was a problem hiding this comment.
고유한 아이디를 만들기 위해 Date 객체와 Math.random()을 사용하신게 인상 깊어요.
여태까지 Date.now 가 string인 줄 알았는데 number 였군요. 하나 배워갑니다 ㅎㅎ
|
코드 잘 봤습니다! 수고하셨습니다. |
|
LGTM! 깔끔하게 잘 만드신거 같습니다! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
✅ Todo List 만들기 (React + Vite + TailwaindCSS)
개요
이 과제는 React와 Vite를 사용해 간단한 Todo List를 구현하는 프로젝트입니다.
컴포넌트 구조와 상태 관리를 이해하고, localStorage를 활용한 데이터 유지 기능을 구현합니다.
할 일을 입력하면 목록에 추가되고, 삭제할 수 있으며, localStorage에 저장되어 새로고침해도 유지됩니다.
기능 요약
할 일을 입력하고 'Add' 버튼으로 새 할 일 생성
할 일 항목의 'Delete' 버튼으로 목록에서 삭제
체크박스 클릭으로 할 일 완료/미완료 상태 전환
(완료 시 텍스트에 취소선 표시)
모든 할 일 데이터가 브라우저 localStorage에 자동 저장
앱 실행 시 localStorage에서 할 일 목록 자동 불러오기
스크린샷