분류 전체보기 (484) 썸네일형 리스트형 라이브러리 - RxJS RxJS (Reactive Extensions for JavaScript)는 Observable을 활용하여 리액티브 프로그래밍을 구현하게 해 주는 라이브러리로 이벤트 리스너, 비 동기 데이터 요청에서 사용되는 promise와 비슷한 기능을 하지만 오퍼레이터라는 함수들을 통해 데이터를 수정할 수 있으며, 또 하나의 값만 반환할 수 있는 promise와 달리 스트림이 닫히기 전까지 무한의 값을 반환할 수 있는 장점을 가지고 있습니다. 주요 개념 ▶ Observable 데이터 스트림으로 구독할 값들을 담고 있습니다. ▶ Subject Observable과 다수의 Observer가 동시에 구독할 수 있습니다. ▶ Observer Observable 내의 데이터 스트림을 구독하는 객체로 next, error, c.. 생성된 구글애즈 자동전환 설정 변경하기 먼저, 광고 중인 계정에서 상단 메뉴 '도구 및 설정' -> 측정항목에서 '전환'을 선택합니다. 수정하고자 하는 전환 액션을 선택합니다. 자동의 경우 모든 설정항목이 수동전환과 동일하나 경로지정하는 부분만 추가됩니다. 경로 수정하기 자동전환 발동조건이 되는 경로를 지정하는 설정입니다. 유형은 아래와 같이 세 가지가 있습니다. ▶ URL이 다음과 일치 우측에 입력된 주소가 전환이 발생하는 페이지의 주소와 반드시 일치해야 전환이 발생합니다 (광고 클릭으로 들어올 경우 식별아이디가 URL에 붙으므로 실 광고로 유입되는 전환 측정이 불가). ▶ URL이 다음과 포함 전환이 발생하는 페이지의 주소가 우측에 입력된 주소를 포함하면 전환이 발생합니다. ▶ URL이 다음으로 시작 전환이 발생하는 페이지의 주소가 우측에.. 자바스크립트 컴포넌트 - 확장 검색 창 구현 먼저 HTML에 검색창과 버튼을 생성합니다. CSS를 활용하여 기본 스타일을 적용합니다. /* main.css */ * { margin: 0; padding: 0; box-sizing: border-box; } body { height: 100vh; display: flex; align-items: center; justify-content: center; background-color: lightcoral; } .input-box { position: relative; } input { height: 50px; width: 50px; border-radius: 15px; transition: 0.4s ease; font-size: 1.7rem; border: none; } input:focus {.. 서버 아키텍처 - 프로젝트 분산하기 서버 구조 인터페이스는 서버에 대한 요청과 응답처리하며 데이터베이스에 전송할 쿼리를 작성하고 데이터를 받는 역할을 수행하는 인프라스트럭처 프로젝트에 의존합니다. 인프라스트럭처 프로젝트는 다른 프로젝트에 의존 없이 개체 등 비즈니스 로직을 담당하는 애플리케이션 코어 프로젝트에 의존합니다. 구현하기 1. 프로젝트 생성 먼저 solution을 생성합니다. dotnet new sln ▶ 인터페이스 엔트리 포인트를 담당할 웹 에이피아이를 생성하고 solution에 추가하고 dotnet new webapi -o API dotnet sln add API ▶ 인프라스트럭처 데이터베이스에 정보를 저장하고 불러올 데이터 프로젝트 생성 및 solution에 추가 후 dotnet new classlib -n Infrastru.. 자바스크립트 컴포넌트 - 사이드 메뉴 구현 먼저 HTML에 메뉴버튼과 메뉴를 생성합니다. Menu 1 Menu 2 Menu 3 CSS를 활용하여 기본 스타일을 적용하고 메뉴버튼과 메뉴의 위치를 조정합니다. /* main.css */ * { margin: 0; padding: 0; box-sizing: border-box; } body { background-color: black; font-family: 'Poppins'; overflow-x: hidden; } .menu-box { height: 200px; width: 200px; position: fixed; top: -100px; left: -100px; background-color: aquamarine; border-radius: 50%; transition: .4s ease; z.. 노드제이에스? 노드제이에스는 자바스크립트를 기반으로 한 백엔드 언어로 빠른 속도를 자랑합니다. 설치하기 아래 링크를 통해 노드제이에스 홈페이지로 이동합니다. Node.js (nodejs.org) Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 1. Window LTS 버전을 선택 (current 버전이 최신버전이긴 하지만 베타버전이라 안정성이 떨어짐) 다운로드가 완료되면 인스톨러를 실행합니다. 동의 후 'next' 추가도구는 설치는 선택사항이므로 원하는 경우 선택합니다. 아래 명령어를 통해 버전확인이 되면 정상적으로 설치가 완료 node -v 사용하기 먼저, 프로젝트 폴더를 생성 후 편집기를 열고 .js.. 노드제이에스 서버 만들기 (익스프레스) 웹 서버는 웹애플리케이션에 사용자가 접근 가능하도록 사이트의 모든 정보 (파일들)를 담고 있습니다. 해당 정보요청과 요청에 대한 응답은 HTTP(S)로 많이 이루어지는데요. 오늘은 웹 애플리케이션 프레임워크인 NPM express를 사용하여 Node.js 웹 서버를 만들어보겠습니다. 익스프레스? 익스프레스 (express)는 웹 애플리케이션 제작에 필요한 서버 측의 다양한 기능들을 미리 구현해 놓은 프레임워크로 웹 애플리케이션 제작에 필수기능들을 직접 코드작성 없이 사용하게 해 줍니다. 프로젝트 생성 먼저 npm 패키지를 실행하기 위해 아래 명령어를 실행합니다. npm init 설정할 때 아래 그림처럼 물어보는 게 많은데 아래와 같이 옵션을 추가하면 자동으로 모든 설정이 완료됩니다 (이후 package... 비주얼 스튜디오 코드 - [익스텐션] Sqlite 'SQLite'는 비주얼 스튜디오 코드 편집기에서 데이터베이스의 정보를 보거나 조작을 가능하게 해주는 익스텐션입니다. 설치하기 익스텐션 검색창에 'sqlite'를 검색하고 설치를 누릅니다. Sqlite 사용하기 1. Window 'ctrl' + 'shift' + 'p'를 눌러 전역 검색창을 열고 'SQLite: Open Database'을 선택 후 해당 데이터베이스를 선택하면 아래처럼 Sqlite 익스플로러가 열립니다. ▶ 데이터 보기 테이블 우측에 '재생' 버튼을 누릅니다. ▶ 데이터 추가하기 테이블 우클릭 후 'new query [insert]'를 선택 열린 파일에 아래와 같이 값을 추가합니다. VALUES (1, 'brush', 1), (2, 'soap', 1); 파일을 우클릭하여 'run quer.. 이전 1 ··· 37 38 39 40 41 42 43 ··· 61 다음
