전체 글33 메모리 조합칩 : 다양한 입력에 대한 출력을 내는 칩 순차칩 : 출력이 현재 시점과 이전에 처리했던 입출력에도 영향을 받는 칩 시간의 진행 틱, 톡 이라는 2진 신호를 연속적으로 생성하는 클럭을 이용해 모델링 가능하다. 주기 : 틱의 시작과 톡의 종료 사이의 시간 → 모든 메모리 칩의 작동을 조절 메모리장치 컴퓨터 프로그램은 변수와 같은 데이터를 유지하는 추상화 개념을 지원하며 이는 메모리를 통해 구현된다. 클록과 0과 1사이를 왔다 갔다 거리는 시간의존적 게이트를 통해 논리게이트가 상태를 유지하고 시간이 변함에 따라 응답하도록 한다. 이러한 게이트를 데이터 플립 플롭 DFF (모든 메모리 칩을 만드는데 기본구성블록)이라 불린다. 순차 논리 시간에 따라 기억하는 능력을 칩들은 가져야 한다. 시간의 문제 지연이 .. 2024. 2. 6. styled component & next.js14 styled component(SC)를 next.js에서 사용 하기위해 노력을 했다. 정확하게 말하면 next의 장점을 최대한 가져가면서 SC를 어떻게 사용할까… 우선은 공식 문서 부터 살펴보자 https://nextjs.org/docs/app/building-your-application/styling/css-in-js#styled-components https://styled-components.com/docs/advanced#app-directory next.js 처음 부분을 보면 "경고: 런타임 JavaScript를 필요로 하는 CSS-in-JS 라이브러리는 현재 서버 컴포넌트(Server Components)에서 지원되지 않습니다. 서버 컴포넌트에서 지원이 안된다라… 서버 컴포넌트를 스타일링하려.. 2024. 2. 3. next.js 에서 data fetching 기존 react에서는 client에서 data fetching을 시도하기 때문에 비밀정보 등을 넣을 수 없다. 개발자 도구를 통해 network 탭에 들어가면 통신하고 있는 정보들을 볼수있기 때문이다. 또한 이렇게 정보가 유출되면 데이터 베이스와 통신도 할 수 없다. 또한 client 에서 data fetching을 진행하면 항상 usestate를 사용해야하며 그에 맞는 useEffect도 사용해야한다. 또한 항상 클라이언트 측에서 로딩상태는 존재하기 때문에 이에 대한 처리도 진행해줘야한다. sever에서 이를 data fetching를 진행하면 API 를 통해 데이터베이스에 접근할 필요가 없으며 위의 hook들을 사용할 필요가 없어진다. 또한 로딩상태는 클라이언트 쪽이 아닌 서버측으로 옮겨간다. nex.. 2024. 2. 2. CSR vs SSR (hydration, "use client") SSR vs CSR CSR 모든 렌더링 즉, 모든 ui구축작업이 모두 client측에서 일어나는 것 Rendering react code를 브라우저가 이해할 수 있는 html 로 바꾸는 작업 CSR의 단점 1. 렌더링 되기전 잠깐의 빈화면 브라우저는 html을 띄워준다. 그냥 React 환경에서는 CSR이기때문에 자바스트립트가 돌아가기 전 잠깐동안 빈 Html을 보여준다. 그러고 자바스크립트가 돌아가면 HTML을 자바스크립트가 redering 하고 그제서야 보여지게 된다. → 자바스크립트가 안돌아가거나 느리면 html은 비어있기때문에 아무것도 볼수없다. 2 .Seo 검색엔진 최적화 구글의 검색엔진은 html의 요소를 본다. 그렇기에 비어있는 html은 검색엔진 최적화를 할수없다. SSR 모든 렌더링이 서.. 2024. 1. 30. ERC 165 AccessControlEnumerable 컨트랙트를 구현하다가 ERC165에 대한 내용을 접하게 되어서 작성하게 되었다. 배포한 컨트랙트가 해당 배포한 컨트랙트의 표준을 따르고 있는지 확인하는 표준 (ERC721을 만들었는데 ERC721 표준을 정확히 따르고 있는가…? 에 대한걸 확인하는 표준) 우리는 해당 컨트랙트가 어떤 표준을 실제로 구현했는지 확인 할수있는 방법이 없다. 이를 확인 할수있게 해주는 것이 ERC165 표준이다. solidity 함수는 모두 selector(함수 시그니처 해싱값)라고 하는 함수 아이디를 들고있다. 그렇다면 ‘표준 인터페이스에 구현된 함수아이디’와 ‘작성한 컨트랙트의 함수아이디’를 비교하면 인터페이스를 구현하고 있구나를 확인할 수 있을 것이다. 하지만 각 함수 아이디를 .. 2024. 1. 25. 그래프 탐색 -BFS, DFS 그래프 탐색 (그래프 순회) 하나의 시작점 노드에서 연결된 노드들을 모두 찾는 것 BFS 너비 우선 탐색 시작 노드를 방문 표시 후 큐에 넣음 큐에 아무노드가 없을때까지: 큐 가장 앞 노드를 꺼낸다. 꺼낸노드에 인접한 노드들을 모두 보면서: 처음 방문한 노드면: 방문한 노드 표시를 해준다 큐에 넣어준다. BFS 알고리즘 시간 복잡도 BFS 노드 전처리 → O(V) 큐에 노드를 넣고 빼는데 걸리는 시간 → O(V) 큐에서뺀 노드의 인접한 노드들을 도는데 걸리는 시간 →O(E) ⇒총 O(2V+E) ⇒ O(V+E) DFS 깊이 우선 탐색 시작 노드를 옅은 회색 표시후, 스택에 넣음 스택에 아무 노드가 없을때까지 : 스택 가장 위노드를 꺼낸다. 노드를 방문 표시를 한다. 인접한 노드들을 모두 보면서: 처음 방문.. 2024. 1. 23. 그래프 연결 데이터를 저장 할 수 있는 자료구조 세상에는 다양한 연결 관계가 존재하기 때문에 그래프 자료구조는 이를 저장하기 유용하다. 그래프 용어 정리 노드 : 그래프에서 하나의 데이터 단위를 나타내는 객체 엣지: 그래프에서 두노드의 직접적인 연결 관계 데이터 엣지가 방향을 가지면 → 방향그래프 엣지가 어떤 정보를 나타내는 수치를 가지면 → 가중치그래프 차수 : 하나의 노드에 연결된 엣지들의 수 무방향 그래프 → 하나의 노드에 연결된 엣지들의 수를 나타낸다. 방향 그래프 → 노드를 떠나는 엣지의 수를 출력 차수 노드에 들어오는 엣지의수를 입력 차수로 부른다. 경로 : 한 노드에서 다른 노드까지 가는길 경로의 거리 비가중치 그래프 → 엣지의 수 가중치 그래프 → 엣지의 가중치 합 최단 경로 : 두노드 사이의 경.. 2024. 1. 22. 객체 지향 프로그래밍 _ SOLID 단일 책임 원칙 모든 클래스는 단 한가지의 책임만을 갖고 클래스 안에 정의 되어있는 모든 기능은 하나의 책임을 수행하는데 집중되어있어야한다. ⇒ 하나의 클래스로 너무 많은 일을 하지 말고 딱 한가지 책임만 수행하자 god object: 너무 많은 책임을 지니고 있는 객체 한 클래스는 한가지 책임에 관한 변경사항이 생겼을때 코드를 수정할수있도록 하자 개방폐쇄 원칙 클래스는 확장에 열려있어야 하며 수정에는 닫혀있어야한다. ⇒ 기존 클래스의 코드를 수정하지 않고도 기능을 확장할 수 있어야한다. 리스코프 치환 원칙 부모클래스의 인스턴스를 사용하는 위치에 자식 클래스의 인스턴스를 대신 사용했을 때 코드가 원래 의도대로 작동해야 한다. 형식적인 측면 : 자식클래스가 오버라이딩하는 변수와 메소드가 부모클래스에 있는 .. 2024. 1. 21. git & github git 버전관리란? 파일을 버전별로 저장하고 나중에 특정시점에 버전을 다시꺼내올수있는 시스템 장점 지난 과정확인 가능 이전 버전으로 돌아갈수있음 다른 컴퓨터에 작업물 전송가능 → 백업본을 만들수있다. 협업이 가능하다. git은 버전관리와 동시협업을 할수있게 도와준다. git hub 깃으로 버전 관리 해놓은 프로젝트를 올려놓을 수 있는 원격저장소의 역할을 해주는 서비스 레포지토리 (저장소) 깃이 버전별로 바뀌는 모습(커밋)을 기록해놓는 곳이 레포지토리 💡 .git 디렉토리 = 레포지토리 커밋 프로젝트 디렉토리의 특정 모습을 하나의 버전으로 남기는 동작 & 결과물 git init 현재 디렉토리를 git이 관리하는 프로젝트 디렉토리로 설정하고, .git 디렉토리 즉, 버전관리를 해주는 git 디렉토리를 생성해.. 2024. 1. 20. 이진 탐색 트리 (binary search tree) → 딕셔너리, 세트를 구현할 때 쓸수있다. 그 이유는 뒤에서 살펴 보겠다. 이진탐색트리속성 부모 노드 왼쪽에는 무조건 부모노드보다 작은 자식노드가 들어가고 부모노드 오른쪽에는 부모노드보다 무조건 큰 자식 노드가 들어간다. 배열이나 파이썬리스트로 구현하지 않고 노드 인스턴스를 연결해서 구현 모든 자식노드가 부모의 레퍼런스를 저장하고 있다. InOrder 순회를 하면 데이터의 값이 순서대로 출력된다. ⇒ ABCDEFGHI 삽입연산 새로운 노드 생성 루트 노드부터 비교하면서 저장할 위치 찾음 찾은 위치에 새롭게 만든 노드 연결 시간복잡도 : O(h) h=높이 탐색연산 주어진 노드의 데이터와 탐색하려는 데이터 비교 탐색하려는 데이터가 더 크면 노드의 오른쪽 자식으로간다. 탐색하려는 데이터가 더 작으면 노드의 왼.. 2024. 1. 19. 이전 1 2 3 4 다음
