본문 바로가기
  • soldonii's devlog

Javascript 공부123

리액트 1 *Udemy의"Complete React Developer in 2020"강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트와 리액트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) 1. create-react-app create-react-app은 개발자가 다른 것들은 신경쓰지 않고, 오로지 개발에만 집중할 수 있도록 기본적인 모듈들이 포함된 패키지이다. 이를 통해 새로운 프로젝트 폴더를 생성하면, 여러가지 폴더가 생성된다. # src 폴더 : react app과 관련된 모든 코드들이 들어있는 공간이다. 앱을 개발하면서 필요한 파일들을 저장하는 곳이라 보면 된다. # public 폴더 : create-react-app 패키지에는 bab.. 2019. 11. 20.
리액트의 탄생배경과 핵심 개념 *Udemy의"Complete React Developer in 2020"강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트와 리액트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) 1. 리액트의 탄생 배경 리액트의 등장 이전에도 프론트엔드 단에 수 많은 라이브러리/프레임워크가 존재했다.(jQuery, Vue.js, Angular.js 등) 제이쿼리의 경우, 여러 종류의 웹브라우저들마다 자바스크립트를 불러오는 방식이 달라 어려웠던 점을 해결해주었다. 브라우저들 간에 통일성을 가지도록 도와주면서 큰 인기를 끌었었다. 시간이 흐르면서 web app의 크기가 커지자, 자바스크립트 파일이 넘쳐나면서 통제가 어려워졌고, 이를 효율적으로 관리하기 .. 2019. 11. 20.
191118(월) : 코딩 인터뷰 완전 분석(1) # Chapter 8. 기술적 문제의 p.96 나중에 면접에서 나의 단점이 무엇인지 물을 때 대답할 수 있는 질문 중 하나이자, 실제로 내가 알고리즘 문제를 풀 때 고쳐야 하는 부분이다. 3. 무식한 방법으로 일단 해보기 예제가 완성됐다면, 무식한 방법(brute force)으로 먼저 시돼보라(문제에 따라 2단계(예제를 직접 그려보기)와 3단계의 순서를 바꿔도 된다.) 이 단계에서 만든 알고리즘이 최적일거라 기대하지도 않고 최적이 아니어도 괜찮다. 어떤 지원자들은 무식한 방법이 너무 명백하고 비효율적이라 언급조차 하지 않으려고 한다. 하지만 여러분이 생각하기에 너무 뻔해 보이더라도 누군가에게는 뻔하지 않을 수도 있다. 면접관은 여러분이 너무 쉬운 문제를 낑낑대고 있다고 생각할 수도 있다. 그렇게 생각하는.. 2019. 11. 18.
동적 프로그래밍 - 메모이제이션(Memoization) *Udemy의 "Master the Coding Interview : Data Structures + Algorithms" 강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) DYNAMIC PRGRAMMING is.. an optimization technique. dynamic programming = divide and conquer + memoization 언제 Dynamic Programming을 적용할지에 대한 Cheatsheet 1. Can be divided into subproblem? 2. Recursive Solution 3. Are ther repetitive subpr.. 2019. 11. 7.
자바스크립트 검색 알고리즘 3 : Depth First Search *Udemy의 "Master the Coding Interview : Data Structures + Algorithms" 강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) 1. Depth First Search(DFS) Breadth First Search(BFS)가 각 level에서 좌 → 우로 돌면서 탐색했다면, Depth First Search(DFS)는 가장 아래쪽 level까지 내려갔다가 끝에 다다르면 가장 가까운 조상으로 거슬러 올라간 뒤 탐색하지 않은 다른 자식 노드, 즉 형제 노드들을 탐색하는 방식이다. 글로는 설명이 어렵고 아래 사진이 이해하기에 직빵이다. DFS의 경우.. 2019. 11. 7.
자바스크립트 검색 알고리즘 2 : Breadth First Search *Udemy의 "Master the Coding Interview : Data Structures + Algorithms" 강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) Array, Hash Table, Queue, Stack, Linked List에서 Traversing하는 방법은 앞선 글들에서 정리해보았다. 그런데 Graph와 Tree에서는 Traversing을 어떻게 할 수 있을까? 이 자료구조형에서 Traversing을 하고, 원하는 값을 찾을 때 사용하는 알고리즘이 바로 Breadth First Search(BFS), Depth First Search(DFS)이다. 결론부터 .. 2019. 11. 7.
자바스크립트 검색 알고리즘 1 : Linear Search, Binary Search *Udemy의 "Master the Coding Interview : Data Structures + Algorithms" 강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) 앞서 정렬 알고리즘에 대해서 살펴봤다면, 이번에는 모든 노드들을 traversing하면서 검색하는 알고리즘에 대해서 살펴보자. 검색은 실생활에서 아주 많이 사용되는 기능이기 때문에 잘 살펴보자. 1. Linear Search 가장 단순하지만, 동시에 가장 비효율적인 검색 알고리즘이다. 단순히 list를 특정 값을 찾을 때까지 loop over하는 작업이다. 검색을 시작하자마자 찾게 되는 Best Case에서는 O(1).. 2019. 11. 7.
자바스크립트 정렬 알고리즘 9 : 활용 사례 *Udemy의 "Master the Coding Interview : Data Structures + Algorithms" 강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) 언제 어떤 정렬 알고리즘을 사용하면 좋을지, 간단한 예시로 알아보자. 아래 대답은 Andrei의 의견이며 정답은 아닐 수 있다. //#1 - Sort 10 schools around your house by distance: insertion sort input된 dataset의 크기가 무척 작기 때문에 Insertion Sort가 가장 빠르고, 공간복잡도도 효율적이다. //#2 - eBay sorts listings.. 2019. 11. 5.
자바스크립트 정렬 알고리즘 8 : Radix Sort, Counting Sort *Udemy의 "Master the Coding Interview : Data Structures + Algorithms" 강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) 여태껏 배운 Bubble Sort, Selection Sort, Insertion Sort, Merge Sort, Quick Sort는 모두 comparison, 즉 element들 간의 비교를 통해 정렬을 하는 알고리즘이었다. 이들 정렬 알고리즘의 경우, 시간복잡도에서 최선은 O(n log n)이었는데, 이를 더 개선시킬 수는 없을까? 이를 개선시키는 것은 수학적으로 불가능하다고 한다. 그러나 element 간의 비.. 2019. 11. 5.