반응형 전체 글129 [knockoutjs] custom element 사용 관련 custom element 란 일반적인 태그를 컴포넌트 형태로 분리하여 custom element(custom tag)에 마음껏 붙일 수 있다. react에서 사용되는 컴포넌트의 개념과 비슷하다고 보면 된다. custom element 사용 방법 - template으로 사용할 html파일을 만들고 그 안에는 tag들로 구성 - ko.components.register('엘리먼트이름', {template:템플릿}); - 템플릿 부분에는 직접 string 형태로 태그를 넣어도 되지만, 외부에서 파일을 읽어오게 할 수 있다. 이때는 require를 사용하거나, require-text를 사용하면 된다. 사용 시 주의점 - custom element는 소문자와 대시로 구성된 이름을 사용해야한다. - 예상되는 원인.. 2023. 1. 19. [electron] BrowserWindow의 frame 옵션(상단바 없애기 + 클릭) electron에서 윈도우를 생성할때 BrowserWindow의 옵션중에 frame을 false로 주게 되면 기본 윈도우에 존재하는 최소화, 최대화, 종료 버튼을 없앨 수 있다. https://www.electronjs.org/docs/latest/api/browser-window BrowserWindow | Electron Create and control browser windows. www.electronjs.org 그런데 이렇게 하면 문제가 drag가 불가능 해지는 문제가 있다. 그래서 드래그가 가능하게 할 영역을 html로 만들고 css style에 "-webkit-app-region: drag"을 추가해주면 드래그가 가능해진다. 그런데 이렇게 하고 상단바를 커스텀하여 만들었지만 클릭이 불가능 .. 2023. 1. 18. [electron] 기본 개념 electron의 학습을 진행중인데 현재 느끼기에 가장 중요한 개념은 프로세스(Process) 이다. electron에는 두 종류의 프로세스가 있다. main이라는 불리는것과 renderer로 불리는 것이다. 일단 renderer 부터 알고 가면 main은 조금 더 쉽게 이해가 될듯 하다. renderer 사용자가 보는 화면을 renderer라고 이해하면 된다 main 웹 서버 개발을 할시 백엔드에 해당하는 부분이라고 이해하면 된다. 실제 코드는 로컬에 있지만 renderer와 통신을 하는 녀석이다. (틀렸으면 말해주세요!!!) 이렇게 두가지로 나뉘어지며, renderer와 main이 통신을 하기 위해서는 IPC통신 이라는 방법을 써야한다. 자세한 공식 문서는 아래와 같다. https://www.elec.. 2023. 1. 17. [knockoutjs] data-bind text에서 문자열을 추가하는 방법 knockoutjs에서 태그 안에 data-bind="text:변수"를 view model에 있는 값을 불러오도록 하는데 저렇게 하면 태그 안의 값이 치환되는 형태이다. 그렇다면 불러온값 외에 다른 string을 추가하는 것은 어떻게 하는 것인지에 알아보자. 직접 테스트한 샘플 코드는 아래와 같다. People foreach를 사용하였고 그 경우 index를 가져오는 방법, 그리고 view model에 있는 객체의 값을 가져오는 방법, 객체 안에 다시 객체로 되어져 있는 경우 값을 가져오는 방법으로 구성하였다. 2023. 1. 11. [knockoutjs]viewModel에 함수 정의 위치에 따른 차이 knockoutjs의 기본 예제에 있는 코드를 참고하여 submit에 사용되는 함수의 위치에 따른 코드 차이와 visible을 적용한 샘플 코드이다. 외부에 선언을 할 경우에는 생성을 하고 함수에 this를 bind해줘야 한다. addItem addItem2 2023. 1. 11. [knockoutjs]observable을 사용하여 데이터 관찰 객체와 함수형 차이 knockoutjs는 mvvm 패턴을 사용하여 데이터가 변하면 ui에 있는 값도 자동적으로 변경되게 해주는 라이브러리이다. https://knockoutjs.com/documentation/observables.html Knockout : Observables Observables Knockout is built around three core features: Observables and dependency tracking Declarative bindings Templating On this page, you’ll learn about the first of these three. But before that, let’s examine the MVVM pattern and the concept of .. 2023. 1. 11. 이전 1 2 3 4 5 6 ··· 22 다음 728x90