반응형 전체 글135 티스토리 - Google Search Console 연동 티스토리 블로그에 도메인을 연동한 후 구글 검색엔진에서 검색이 되도록 하기 위해 Google Search Console을 연동해보기로 합니다. 먼저 구글 서치콘솔에 접속합니다. https://search.google.com/search-console/about Google Search Console Search Console 도구와 보고서를 사용하면 사이트의 검색 트래픽 및 실적을 측정하고, 문제를 해결하며, Google 검색결과에서 사이트가 돋보이게 할 수 있습니다. search.google.com 본인이 사용하는 구글 계정을 이용해서 서치 콘솔에 가입해줍니다. 구글 서치 콘솔을 처음 사용하는 것이라면 위와 같이 접속하려는 도메인을 등록해줘야 합니다. 그리고 DNS 레코드 추가를 통해 소유자임을 인증해.. 2022. 11. 29. SVG 기초 - 도형 그리기 Part 3 (패스, path) svg는 사실 코드를 이용해서 직접 그려서 사용하는 것보다는 일러스트레이터 등의 툴에서 작업한 결과물을 가져와서 활용하는 측면이 크기는합니다. 그래도, svg가 그려지는 동작원리를 한번 살펴보고 이해해두면 여러 모로 공부가 클 것이라 생각됩니다. 그런 의미에서 이번 포스팅은 svg의 꽃 패스(path)에 대해 살펴보기로 합니다. 패스(path)로 그리기 - 직선(Line) 패스로 도형을 그려보기 위해 다음과 같이 코드를 작성해봅니다. 기존 예제 코드들은 제거하고 패스를 위한 아래 코드를 작성하였습니다. path : 패스로 그리겠다. d : data M : Move to (=그리지 않고 첫 좌표로 이동) L : Line to 선을 그리겠다. 좌표 원소 2개 필요 H : Horizontal Line to =.. 2022. 11. 28. SVG 기초 - 도형 그리기 Part 2 (타원, 직선, 다중선, 다각형 - ellipse, line, polyline, polygon) 지난 번 학습에서는 직사각형과 원을 그리는 방법을 살펴보았습니다. 이번에는 좀더 다양한 그리기 요소들을 살펴보려고 합니다. 중복되는 설명은 생략할 수 있으니 이 파트를 처음 보시는 분은 Part 1을 먼저 보고 오시는 게 좋겠습니다. 3. 타원 그리기 - Ellipse 타원(Ellipse)이 원(circle)과 다른 점이 분명히 있겠죠? 우선 전체코드를 살펴보고 아래 코드를 한번 살펴봅시다. ellipse = 타원 cx : circle x 좌표 cy : circle y 좌표 rx : radius x = x 축방향 반지름 길이 ry : raduis y = y 축방향 반지름 길이 즉, 타원은 rx와 ry를 사용한다는 것이 뽀인트! 가 될듯합니다. 중심좌표가 x200, y300이고 x축 반지름 150, y축 .. 2022. 11. 27. SVG 기초 - 도형 그리기 Part 1 (직사각형과 원, rectangle & circle) 최근에 SVG를 조금 들여다보면서 공부해보고 있습니다. 예전에는 잘 사용하지 않았는데 최근에 주목도가 매우 커진 것 같습니다. SVG는 Scalable Vector Graphics로서 브라우저에서 벡터 그래픽을 다루는 기술입니다. https://developer.mozilla.org/ko/docs/Web/SVG SVG: Scalable Vector Graphics | MDN **SVG(Scalable Vector Graphics)**는 2차원 벡터 그래픽을 서술하는 XML 기반의 마크업 언어입니다. SVG는 텍스트 기반의 열린 웹 표준 중 하나로, 모든 사이즈에서 깔끔하게 렌더링 되는 이미지를 서술하 developer.mozilla.org jpg, png, gif = 비트맵 그래픽 ai = 벡터 그래픽 .. 2022. 11. 26. 티스토리(Tistory)에 도메인(Domain) 주소 연결하기 제가 이용하는 티스토리의 주소는 kincode.tistory.com입니다. 사람이 기억하기에는 뭔가 좀 글자가 많긴합니다. 그래서!! 500원입니다! 이참에 도메인을 하나 구입해서 블로그에 연결해보기로 합니다. 먼저, 도메인이란 무엇일까요? 모든 웹사이트는 IP라는 숫자로된 주소를 갖습니다. 예를 들어, 123.123.123.123 과 같은 구조를 갖습니다.(IPv4) 이 숫자는 사람이 기억하기가 쉽지 않기 때문에 기억하기 쉬운 로 바꿔사용되는데 바로 이 것을 "도메인"이라고 부릅니다. (보다 정확한 명칭은, 도메인 네임) 예를 들어, 223.130.195.95 = naver.com 142.250.204.142 = google.com 브라우저 주소창에 223.130.195.95를 넣고 Enter를 치면 .. 2022. 11. 25. [Javascript] Number Index를 만들어 보자(ft. 숫자 카운트 애니메이션) 몇년 전부터 기업의 홈페이지 메인에 숫자 인덱스로 실적 지표를 보여주는 그런 형태가 유행하는 것 같습니다. 대충 이런 식으로요. 물론 디즈니 플러스의 경우에는 고정된 형태의 숫자이지만, 저 숫자들이 막 올라가는 형태도 많죠. 때마침 필요한 기능이기도 해서 한번 만들어 보기로 합니다. 숫자가 막 올라가는 카운트 모션 만들기 반응형을 고려해서 대략 이렇게 4개 칼럼으로 이루어진 형태를 계획하고 만들어보기로 생각해봅니다. 결과물을 예상해서 설계도를 그립니다. PPT로 만들어도 좋고 연습장에 손으로 그려도 좋습니다. 아무튼 목표점이 구체적이어야 할테니까요. 결론은 아래와 같은 모습의 형태. 처음부터 다 코딩하려면 쉽지 않죠. 일단 구글링을 시전해봅니다. 검색어를 바꿔가며 몇번 시도해봤더니 Jquery로 만들어진.. 2022. 11. 24. 이전 1 ··· 19 20 21 22 23 다음 반응형
