Computer Science

more

WPF cefSharp HTML 파일에서 C# 코드 불러오기

 WPF에서 크로미움을 띄울 수 있게끔 해주는 오픈 소스가 있습니다. 이것을 사용한 이유는 Paypal 결제 연동 때문에 사용을 해보았습니다. https://github.com/cefsharp/CefSharp cefsharp/CefSharp .NET (WPF and Windows Forms) bindings for the Chromium Embedded Framework - cefsharp/CefSharp github.com https://developer.paypal.com/ PayPal Developer Documentation - PayPal Developer developer.paypal.com 문제..

C, C++, C# 2019.12.19 6

React Code Splitting(코드 분할)

 Code Splitting에 대하여 기록하고자 합니다. 해석을 해보면 코드 분할입니다. 보통 리액트 앱은 Webpack이라는 도구를 이용하여 하나의 파일로 번들링(Bundle)을 하는데요. 이 Bundle을 웹 페이지에 포함시켜 처음에 전체 앱을 한 번에 로드합니다. Client-Side-Rendering이라고 하며 단점으로는 서비스 규모가 커지면 번들 파일도 마찬가지로 커집니다. 번들된 파일이 크다면, 클라이언트 측에서 번들된 파일을 한 번에 실..

React, React Native 2019.11.29 0

자바스크립트 Chapter 30 Inheritance, Polymorphism and Code Reuse

자바스크립트 핵심 컨셉 33가지 Chapter 30 Inheritance, Polymorphism and Code Reuse 상속, 다형성 그리고 코드 재사용에 대하여 알아보겠습니다. 자바스크립트는 프로토타입 기반 언어입니다. 그래서 다른 언어와 다르게 상속을 프로토타입으로 구현하는데 이 부분이 중요한지 지속적으로 다루고 있습니다. 2019/05/06 - [Computer Science/JavaScript] - 자바스크립트 Chapter 14 Factories and Classes 자바스크립트 Chapt..

JavaScript 2019.08.02 1

React 페이지 전환 시 스크롤 복원

React Router의 Link을 사용해서 페이지를 이동했을 때 SPA이다 보니까 스크롤이 이전 페이지에서 중간에 멈췄으면 다음 페이지에서 중간에서 시작하는 점의 문제가 있었습니다. 아무래도 유저의 입장에서는 스크롤이 위에서 시작했을 때 위로 올릴 필요가 없으니까 편합니다. 친절하게도 React Router는 이 점에 대해서 제공하고 있었습니다. https://reacttraining.com/react-router/web/guides/scroll-restoration React Rou..

React, React Native 2019.06.28 0

자바스크립트 자료구조 그래프(Graph)

그래프(Graph)에 대해 알아보자. 그래프는 두 가지로 나눠진다. 방향 그래프(Directed Graph) 무방향 그래프(Undirected Graph) 위의 사진의 방향성이 없는 그래프를 의미한다. 그래프에선 노드를 정점(Vertex)이라고도 하고 정점을 이어주는 것을 간선(Edge)이라 한다. 차수(Degree)란 하나의 정점에 닿는 간선의 수를 의미하고 간선을 한 번만 통해 갈 수 있으면 인접(Adjacent)하다고 한다.  그래프를 인접 리스트(Adjace..

자바스크립트 알고리즘 선형 탐색(Linear Search), 이진 탐색(Binaray Search)

선형 탐색과 이진 탐색 알고리즘에 대해 알아보자. 선형 탐색(Linear Search) 찾으려고 하는 것을 처음부터 하나하나 탐색을 하고 찾으려고 하는 값과 일치하면 멈춘다. function linearSearch(arr, find) { for (let i = 0; i < arr.length; i++) { if (arr[i] === find) return `탐색(find)의 값이 들어있는 배열의 인덱스는 ${i}`; } return; } linearSearch([4, 5, 2, 1, 9], 9) // '탐색(find)의 값이 들어있는 배열의 인..

자바스크립트 알고리즘 선택 정렬(Selection Sort)

선택 정렬(Selection Sort) 선택한 값을 최소 요소로 선택하고 선택한 값보다 작은 요소가 있다면 그 값과 스왑 한다. 예를 들면, [4, 3, 5, 1] [1, 3, 5, 4] [1, 3, 4, 5] for 중첩 구문으로 min으로 지정한 값을 배열의 끝까지 비교를 하여 제일 작은 수를 찾아낸 후 temp라는 임시 변수를 생성하여 값을 스왑 한다. function selectionSort(arr, length = arr.length) { for (let i = 0; i < length; i++) { let min = i; fo..

자바스크립트 알고리즘 삽입 정렬(Insertion Sort)

삽입 정렬(Insertion Sort) 배열의 두 번째부터 시작하고, temp라는 변수를 만들어서 값을 임시로 저장을 하고, 저장한 임시의 값보다 0번째 인덱스 값이 크다면 스왑 해준다. 예를 들면, array[0] = 4, array[1] = 1 temp = array[1] array[1] = array[0] array[0] = array[1] array[0] = 1, array[1] = 4 for문 중첩 구문 및 조건을 생각하기가 난이도 있는거 같다. function insertionSort(array, length = array.l..

자바스크립트 알고리즘 버블 정렬(Bubble Sort)

버블 정렬(Bubble Sort) 배열의 두 수를 연속적으로 비교하여 위치를 바꾸어 정렬하고 시간 복잡도 O(n^2)인 알고리즘이다. [6, 5, 3] 을 예를 들면, [5, 6, 3] [5, 3, 6] 다시 처음부터 비교 [3, 5, 6] function bubbleSort(arr, length = arr.length) { while (length) { for (let i = 0; i < arr.length; i++) { if (arr[i] > arr[i + 1]) { let swap = arr[i]; arr[i] = arr[i + 1]; arr[i + 1] = swap; } } length--; } re..

자바스크립트 알고리즘 합병 정렬(Merge Sort)

합병 정렬(Merge Sort) 알아보자. 분할 정복(divide and conquer) 알고리즘 활용한 알고리즘이다. 재귀적으로 배열을 쪼갠 후 값을 비교하여 정렬한다. 개인적으로 퀵 정렬보다 난이도가 있다고 생각한다. 2019/06/16 - [Computer Science/Algorithm, Data Structure] - 자바스크립트 알고리즘 퀵 정렬(Quick Sort) 자바스크립트 알고리즘 퀵 정렬(Quick Sort) Quick Sort(퀵 정렬)에 대하여 알아보자. 병합 정렬(Merge Sort)..