Daehyunii's Dev-blog

App.vue {{ header }} SearchBar.vue 🔍 {{ title.Title }} Year : {{ title.Year }} / Type : {{ title.Type }} ➕ 더 보기 MovieInfo.vue 제목 : {{ result.Title }} 🗓 개봉일 : {{ result.Released }} ⏳ 상영시간 : {{ result.Runtime }} 📽 장르 : {{ result.Genre }} 🎬 감독 : {{ result.Director }} 🎥 배우 : {{ result.Actors }} 🏆 수상 경력 : {{ result.Awards }} 📝 줄거리 : {{ result.Plot }} ☑️ 평점 −{{ score.Source }}, {{ score.Value }}

이번 6주차 과제는 기존의 강의를 토대로 최적화 및 간단한 기능을 추가하는 간단한 과제였다. 우선 고양이 사진첩 만들기 강의를 통해서 그 동안 배웠던, 내용들을 복습하는 의미가 강했고 컴포넌트를 구성하고 API를 통해서 서버와 통신하고 또 받아온 데이터를 하위 컴포넌트에게 뿌려주어 이를 활용하는 일련의 과정을 다시 한 번 고양이 사진첩을 통해서 복습하는 과정이었고 그 과정에서 간단한 과제가 주어졌다.요구 사항은 아래와 같다. 과제 기본 요구 사항 1. 지금 구현된 코드에서는 state에 대한 정합성 체크를 전혀 하지 않는데, 이 부분을 보충해주세요. 2. 컴포넌트별로 올바르지 않은 state를넣으면 오류가 발생하도록 해주세요. 3. 각 컴포넌트의 setState를 최적화하여 이전 상태와 비교해서 변경사항..

노션 클로닝 약 10일 정도의 시간을 가지고 노션의 기본기능을 구현하는 개인 프로젝트를 진행했다. 우선 기본적인 요구 사항들은 다음과 같다. 화면 좌측에 Root Documents를 불러오는 API를 통해 root Documents를 렌더링 합니다. Root Documents를 클릭하면 오른쪽 편집기 영역에 해당 Documents의 Content를 렌더링 합니다. 해당 Root Document에 하위 Document가 있는 경우, 해당 Document 아래에 트리 형태로 렌더링 합니다. Document Tree에서 각 Document 우측에는 + 버튼이 있고, 해당 버튼을 클릭하면, 클릭한 Document의 하위 Document로 새 Document를 생성하고 편집화면으로 넘깁니다. 편집기에는 기본적으로..

3주차 과제 3주차 과제는 이번주 동안 공부한 내용들을 토대로 SIMPLE TODO LIST를 강화하는것이 과제였다. 기본적인 구현들을 되어 있었고, 추가적인 요구사항들이 있었다. 리스트의 삭제 버튼을 추가한다. 리스트를 클릭시 해당 text를 토글시킨다. 해야 할 일 전체 개수와 토글이 된 완료된 할 일의 개수를 표현하는 todoCount 컴포넌트를 구성한다. new 연산자 없이 호출한 경우 에러가 나도록 방어코드를 구현한다. status를 갖는 곳에 validation을 추가한다. 정도가 요구사항 이었던것 같다. 컴포넌트 방식으로 구현하는것이 처음이다보니 코드를 읽는것 조차 쉽지 않았던것 같다. 그래서 처음 과제를 제출해야하는 금요일에는 거의 40% 완성된,,내가 봐도 엉망인 코드를 제출할 수 밖에 ..

트라이 자료 구조 이번에 해결해야 하는 과제는 트라이 자료 구조를 이용하여 검색창의 자동 완성 기능을 수행하는 로직을 구현하는 것이다. 우선 트라이 자료 구조가 무엇인지 알아야 했다. Trie 란? 공간 복잡도가 큰 대신, 빠른 시간 안에 단어를 검색할 수 있는 트리의 한 종류이다. 트라이 자료구조란 쉽게 말해 문자열을 저장해서 검색할 때 활용하는 자료구조이다. 트라이 자료 구조의 경우에는 글로 설명을 듣는것보다 그림으로 이해하는것이 훨씬 직관적으로 받아드릴 수 있다. 그림이,, 양호하지 못한점 이해하기 바랍니다...; 그림을 설명해 보자면 Trie 자료구조의 root 노드는 value 값을 따로 갖고 있지 않는다. 즉 다시 말해 root 노드가 존재하지만 빈 문자열과 같이 아무런 값도 가지지 않는것이 ..

이진 트리 순회 구현 방법 이번 과제는 이진 트리를 순회하는 로직을 구현하는 것이다. 기본적으로 이진 트리의 경우에는 트리 자료구조가 갖는 규칙에 자식 노드를 최대 2개까지 가질 수 있다는 규칙이 추가된 자료구조이다. 이진 트리를 순회하는 방법으로는 BFS와 DFS 모두 가능하지만 이번 과제에서는 DFS를 활용하여 전위 순회, 중위 순회, 후위 순회를 구현하는 것이다. 전위 순회와 중위 순회, 그리고 후위 순회를 나누는 기준은 부모 노드를 기준으로 나뉘게 된다. 만약 부모 노드를 가장 먼저 순회한다면 전위 순회가 되는 것이고, 중간에 순회하면 중위 순회, 마지막에 순회하면 후위 순회가 되는 것이다. 내가 구현한 방법은 배열에 순회하는 요소 값들을 차근 차근 push( )해서 마지막에 반환하는 방식으로 순..