전체 글 (510) 썸네일형 리스트형 유티엠 - 유알엘 빌더 애널리틱스는 기본적으로 유입되는 매체나 소스를 구분하는 기능을 제공합니다. 하지만, 각 소스를 세부적으로 보여주는 것이 아니라 채널이라는 그룹으로 묶고 해당 그룹으로 보여주기 때문에 특정 매체를 통해 광고를 하면서 해당 매체광고 성과를 파악하고자 하는 경우 유용한 정보가 되지 않을 수 있는데요. UTM은 수동으로 URL에 추가정보를 더하는 도구로 언급한 대로 다수의 매체에서 광고를 하면서 각 매체에서 유입되는 트래픽을 파악하고자 할 때 유용합니다. 사용하기 먼저, 사용할 URL을 생성합니다. URL생성은 기본 주소에 매개변수를 추가하는 방식으로 사용가능한 매개변수들은 아래와 같습니다. ▶ utm_id 캠페인 아이디로 GA4로 데이터가 유입되기 위한 필수 값입니다. ▶ utm_source 유입되는 소스를 .. 지네릭 타입제한은 오류를 사전에 발견할 수 있게 하여 안정성을 높이지만 반대로 정해진 타입만 사용가능하므로 코드의 재사용성을 감소시킵니다. 지네릭은 타입제한을 통한 안정성과 코드의 재사용성을 함께 제공하는데요. 코드를 통해 어떻게 지네릭이 사용되는지 보겠습니다. 타입제한 없음 먼저, 아무런 타입제한이 없는 경우의 코드입니다. 타입의 제한이 없기 때문에 배열에 아무런 값이나 들어갈 수 있습니다. // generic.ts class storage { private data:any[] = []; addData(newData) { this.data.push(newData) } } const data = new storage(); data.addData('new') data.addData(1) 타입제한 하지만, 해당 배.. 라이브러리 - 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.. 이전 1 ··· 40 41 42 43 44 45 46 ··· 64 다음
