Ted's Codding study

로컬 스토리지를 활용한 Todo 예제 정답입니다.절대 제가 작성한 코드가 무조건 적인 정답은 아니며, 여러분의 생각과 다르다면 그것이 정답일 것입니다~~HTML 코드 Add Task CSS 코드body { background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0;}.container { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1); width: 500px;}..

해당 페이지는 연습용으로 질문만 있고 정답은 다음 글에서 공개합니다HTML 코드와 CSS 코드를 복붙한 후 main.js를 생성해서 아래 설명대로 한번 작성해보세요!HTML 코드 Add Task CSS 코드body { background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0;}.container { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1); width: ..

1. localStorage.getItem(key)의 기본 사용법localStorage.getItem 메소드는 지정된 키에 해당하는 값을 로컬 스토리지에서 검색하여 반환키에 해당하는 데이터가 없으면 null을 반환해당 메소드는 데이터를 조회할 때 사용되며, 매우 간단하고 직관적인 API를 제공'key'는 데이터에 접근하기 위해 사용되는 식별자해당 식별자를 통해 저장된 값을 검색 가능사용 예제// localStorage.setItem('username', '테드');// localStorage.setItem('key', 'value'); // 앞선 예제에서 넣었던 setItem 목록let value = localStorage.getItem('key');console.log(value);let usernam..

1. JSON 구조JSON 내부에는 JS에서 사용할 수 있는 기본 데이터 타입인 문자열, 숫자, 배열, 불리언, 그 밖의 다른 객체 또한 포함 가능JS의 배열과 객체를 활용하여 어떠한 자료의 형태를 표현하는 형식'key-value' 즉, '키-값'를 쌍으로 데이터를 구조화하는데 사용형태 자체는 js의 객체와 유사하지만, json은 순수한 텍스트 형식이기 때문에 키를 항상 따옴표로 묶어야 함.값에는 함수 등은 사용 불가문자열은 큰따옴표 사용을 권장 2. JSON 사용서로 다른 시스템 간에 구조화된 데이터를 전송하는데 사용json형태로 여러 자료형을 나타내는 방법let data = [ { name: '테드', age: 25, job: 'developer', hobby: { f..