본문 바로가기
반응형

전체 글

 (464)
Single-Page-Application Single Page Application (SPA)은 화면의 일부를 동적으로 변화하는 방식으로 기존에 화면전체를 불러오는 방식과 달리 화면의 일부만 변경이 가능하며 세션의 변화가 없기 때문에 화면 로딩시간이 단축됩니다. 작동방법 전통적인 방식 (MPA: Multi-Page-Application)은 요청이 있을 때마다 화면전체 구성을 새로이 해서 전송합니다 (매 요청이 있을 때마다 HTML을 새로 다운로드). 하지만 SPA는 최초에 HTML파일이 다운로드되고 나면 해당 템플릿을 사용하여 변경요청이 있는 부분만 새로운 정보로 대체하며 HTML을 다시 다운로드하지 않습니다. 장점 SPA의 가장 큰 장점은 속도 향상인데요. 사용자에게 네이티브 앱과 같은 수준의 속도를 제공함으로써 사용자의 경험을 크게 향상할 ..
앵귤러 - Observable 하나의 웹사이트는 여러 개의 페이지로 구성되죠, 발달된 웹사이트 개발기술로 웹사이트에서 각각의 페이지로 이동할 때 너무 자연스러워 별개의 페이지라 상상하기 힘들지만 실제로는 각 페이지는 독립된 파일로 서로 간에 상태를 공유하거나 정보를 주고받는 것도 상상 이상으로 복잡한 경우가 많습니다. 전통적인 애플리케이션에서 이러한 정보의 공유는 해당 페이지를 따로 만들거나 서버에 공통으로 사용할 수 있는 데이터를 구축하고 이를 요청하고 갱신하는 형태로 이루어졌는데요. 앵귤러는 Single-Page Application으로 화면 내에 특정 컴포넌트만 교체하는 형식으로 구현되기 때문에 이러한 전통적인 방식은 효율성을 떨어뜨릴 수 있는데요. Observable은 이러한 문제를 해결하고 각 컴포넌트 간에 데이터공유와 상태..
생성된 구글애즈 수동전환 설정 변경하기 전환 페이지로 이동하기 수정하기 1. 전환이름 수정하기 2. 목표 및 최적화 수정하기 3. 값 수정하기 4. 소스 5. 횟수 6. 클릭연결 전환 추적 기간 7. 조회 완료 전환 추적 기간 8. 조회 후 전환 추적 기간 9. 기여 분석 모델 ..
캔버스 동적 크기 지정 캔버스의 너비, 높이 속성은 pixel을 기준으로 하는 반면 CSS 너비, 높이 속성은 스타일이 적용되는 박스의 크기와 비례해서 적용됩니다. 따라서, 캔버스를 활용한 애플리케이션 개발 시 크기지정은 다른 요소들처럼 CSS를 사용할 수 없고 자바스크립트나 HTML을 활용하여 지정하여야 합니다. 오늘은 화면의 크기에 따라 캔버스의 크기를 달리하는 동적크기를 지정하는법을 살펴 보겠습니다. HTML 삽입 미리보기할 수 없는 소스
[태그관리자] - 전환설정 페이지 뷰 태그관리자 해당 컨테이너에서 '작업공간' -> '태그' -> '새로 만들기' 순으로 선택 태그 구성 박스 선택 (자세히 알아보기 링크 외 박스 내부 아무 곳이나 누름) 'Google Ads 전환 추적' 선택 '전환 ID'과 '전환 라벨' 입력 ※전환링커가 존재하지 않는 경우 전환링커 설치 트리거 박스 선택 (이전 단계에서 설정하는 것도 가능) 우측 상단 '+' 버튼 클릭 '페이지 뷰' 선택 '일부 페이지 뷰' 선택 후 박스 하단에 첫 번째 칸 선택하여 'Page URL' 선택 홈페이지 URL에서 해당 페이지를 구분 가능한 경로 복사 두 번째 칸은 '포함'으로 두고 (포함을 사용하는 이유는 실제 광고로 유입될 경우 경로에 식별아이디가 붙어 테스트 환경과 정확하게 일치하지 않기 때문입니다) 복사한 URL 경..
[구글 태그] 사이트에 설치된 구글 태그 확인하기 구글 애널리틱스나 애즈를 사용하려면 사이트와 해당 제품의 태그를 연결하여야 하는데요. 연결작업 후 태그가 제대로 삽입되었는지, 작동은 제대로 하는지 눈으로 확인할 수 있으면 좋겠죠. 삽입된 태그와 작동여부를 확인하는 방법은 다양한데요. 하나씩 소개해 드리도록 하겠습니다. 1. Tag Assistant 구글에서 제공하는 확장프로그램으로 구글 관련된 모든 태그를 확인가능합니다. 사용을 위해서 프로그램 설치가 필요한데요 아래 링크를 클릭하고 크롬에 추가합니다. https://chrome.google.com/webstore/detail/tag-assistant-legacy-by-g/kejbdjndbnbjgmefkgdddjlbokphdefk?hl=en Tag Assistant Legacy (by Google) T..
티스토리 목차 링크 만들기 티스토리에서 글을 쓰다 목차가 필요해서 목차에 hyperlink를 다는 기능을 찾아보았습니다. 결론은 없더군요 ㅎㅎ 그래서 검색을 해 보니 결국 html블록을 통해 입력하는 형식으로 구현하길래 저도 한번 만들어 보았습니다. 방식은 가장 일반적인 목차를 태그를 사용하여 HTML블록에 지정하고 해당 섹션의 아이디와 연결하는 방법으로 구현하였는데요. 구현하기 먼저, 상단에 목차라는 글을 쓰고 아래 코드를 HTML 코드 블록에 삽입합니다. 미팅참석하기 화면공유하기 채팅하기 상대방이 공유한화면 크게보기 화면 레이아웃 바꾸기 전체화면 ※ HTML블록 찾기 그러면 저장된 글에서 아래와 같이 표시되는데요. 다음으로 해당 섹션을 id요소로 연결만 해 주면 됩니다. 주의할 점은 목차의 각 메뉴의 태그 href요소에 사용된..
구글 밋 (Google Meet) 사용하기 (화면공유, 챗, 설정 등) 구글 미트를 사용하는 방법을 보겠습니다.목차 미팅참석하기화면공유하기채팅하기상대방이 공유한화면 크게보기화면 레이아웃 바꾸기전체화면">HTML 삽입미리보기할 수 없는 소스 미팅참석하기">HTML 삽입미리보기할 수 없는 소스미팅링크 클릭참여준비 (마이크, 카메라를 사용하지 않을 경우 해당 아이콘들을 클릭하면 꺼집니다) 후 우측에 '지금 참여하기' 클릭화면공유하기">HTML 삽입미리보기할 수 없는 소스화면 아래 아이콘 중 네모박스 안에 화살표 위로된 거 선택 (발표시작)열린 팝업에서 '내 전체 화면' 선택.※ 창이나 탭은 해당 창 또는 탭만 표시하기 때문에 공유 중 다른 창 또는 탭을 공유해야 하는 경우 새로 공유를 해야 함.공유할 모니터를 선택하고 'Share' 선택※ 사용 중인 모니터가 하나인 경우에도 모니..
728x90

티스토리툴바