본문 바로가기

Programming310

[React] React 그동안 기초적인 토대를 세웠다면 이제는 한 걸음 나아갈 차례입니다. 자료구조와 디자인 패턴 정리를 마치고 리액트를 시작할까 했지만, 어떤 동기로 인해 마음이 조금 급해져서 병행하려고 합니다. 하지만 우선은 자료구와 디자인 패턴을 먼저 업로드하고, 리액트 정리는 그 다음에 시작하려고합니다. 그래서 두 카테고리의 포스팅이 끝날 때 까지는 이 카테고리의 업로드가 조금 늦을 수도 있습니다. 이 포스트는 리액트 공식문서와 Velopert님의 리액트 강의 블로그를 참조해서 정리한 포스트들임을 미리 밝힙니다. https://ko.reactjs.org/docs/getting-started.html 시작하기 – React A JavaScript library for building user interfaces ko.re.. 2021. 9. 20.
퍼사드 패턴 Façade Pattern 퍼사드(Façade)란 프랑스어로 건물의 출입 외벽을 의미합니다.아래 그림처럼 건물 외관에 대한 디자인을 의미합니다. 이처럼 퍼사드 패턴은 건물 외벽으로 전체를 간략하게 나타내주는 패턴입니다. 1. 퍼사드 패턴 퍼사드 패턴은 어떤 객체에 대해 서브 시스템들의 통합된 인터페이스를 제공하는 패턴입니다. 퍼사드를 이용해서 서브 시스템에 쉽게 접근할 수 있게됩니다. 다시말하자면, 통합된 인터페이스 서브 시스템에 대해 쉬운 접근을 하게 해주는 패턴이 퍼사드 패턴입니다. 2. 최소 지식 원칙 최소 지식 원칙은 정말 가까운 친구 사이에서만 상호작용을 허용한다는 원칙입니다. 이 원칙은 객체를 만들면 그 객체와 상호작용을 하게될 클래스의 수와 방식에 주의를 기울여야 합니다. 그러니까 객체들 끼리 복잡하게 얽혀서 보수과정.. 2021. 9. 20.
이진 트리 Binary Tree 1. 이진 트리 트리마다 자식 노드 수가 제각각이라면, 연산에 대해서 오버헤드가 굉장히 버겁고, 구현도 복잡해지게 됩니다. 그래서 이런 문제를 해결하기 위해 트리의 구조를 일정하게 만드는데, 그 구조 중 대표적인 것이 이진 트리입니다. 이진 트리란, 모든 노드의 차수를 2 이하로 제한 시켜 트리의 차수가 2차 이하인 트리를 의미합니다. 이진 트리는 노드의 차수가 2이하 이므로, 자식 노드가 0개, 1개, 2개까지는 모두 허용이 됩니다. 여기서 트리의 모든 노드의 차수가 2인 트리를 완전 이진 트리라고 하고, 차수가 2미만인 트리가 하나라도 있으면 이진 트리라고 합니다. 다음 그림을 이진 트리라고 합니다. 모든 노드의 차수가 2이하임을 볼 수 있습니다. 2. 일반 트리를 이진 트리로 바꾸기 일반 트리는 이.. 2021. 9. 20.
트리의 개념 Tree 이번 포스트부터 몇개의 포스트에 걸쳐 이야기할 자료구조는 '트리(Tree)'입니다. 특히 이번 포스트에서는 트리의 개요에 대해서 따로 다루고 넘어가려고합니다. 그동안 다뤘던 자료구조랑은 또 다른 이해가 필요하기 때문이죠. 1. 트리 개요 트리(Tree) 나무와 스펠링이 같습니다. 보통 우리가 생각하는 나무는 어떻게 생겼죠? 아래는 넒고 위로 갈수록 좁아지는 형태를 갖고있습니다. 이처럼 트리도 위에서 아래로 갈수록 자료가 많아지는 구조를 가지고 있습니다. 가만보면 여태까지 배운 리스트나 큐, 스택, 데크를 보면 뭔가 통 느낌이 났는데 이건 통이라고 하기 애매한 부분이 있는 것 같다고 생각이 듭니다. 왜냐하면 트리는 계층 관계를 표현하는 자료구조이기 때문입니다. 2. 트리 이해하기 트리는 비선형, 1:1이 .. 2021. 9. 19.
어댑터 패턴 Adapter 패턴 다른 패턴 이름들과 다르게 어댑터라는 이름은 실생활에서도 많이 들어봤을 것입니다. 특히 110v 전압을 쓰는 나라에 여행을 가게 될 때는 우리가 110v어댑터라는 것을 껴서 우리가 사용하는 220v에서 전환을 합니다. 1. 어댑터 패턴 소개 서론에서 언급했듯이 보통 어댑터를 전압에 따라 교체합니다. 스마트폰 충전기도 태블릿이냐 노트북이냐에 따라서 20w 어댑터로 교체하고 50w 어댑터로 교체하기도 하고 하죠. 이처럼 어댑터를 우리 입맛에 맞춰서 바꿔서 이용합니다. 디자인 패턴의 어댑터 패턴도 사용자의 입맛에 맞춰서 쓸 수 있게 해줍니다. 어댑터 패턴은 인터페이스를 사용자가 원하는 기능에 맞도록 변화시켜주는 패턴입니다. 위의 예시에서 콘센트와 전자 제품은 객체고 어댑터가 인터페이스가 되는 것 입니다. 콘센.. 2021. 9. 19.
데크 Deque 이번에 소개할 자료구조는 데크(덱)입니다. 어떤 문서에서는 데크, 다른 문서에서는 덱이라고 하길래 저는 제가 배웠던 '데크'라는 명칭으로 소개하려고합니다. 1. 데크 데크는 새로운 자료구조 같지만 큐의 변형 자료구조 중 하나입니다. 데크의 의미는 Double Ended Queue로써 끝이 2개인 큐를 의미합니다. 기존의 큐는 아래 그림처럼 한 끝에서만 삽입, 다른 한 끝에서만 삭제가 이루어졌습니다. 하지만 데크는 양 쪽 끝에서 삽입과 삭제가 모두 가능한 자료구조입니다. 한 가지 착각 하지 말아야 하는 점은 연결 리스트처럼 중간 삭제는 불가능하고 스택과 큐처럼 자료구조 양 끝에서만 삽입 삭제가 이루어 진다는 점입니다. 구현 방식은 데크의 특징을 잘 생각해서 다음 두가지만 명심하고 구현하면됩니다. front.. 2021. 9. 18.
300x250