전체 글
-
[Javascript] 브라우저가 Internet Explorer 인지 체크하기Coding/JavaScript 2020. 8. 18. 19:04
자바스크립트의 navigator.userAgent 객체에는 브라우저에 대한 정보가 나와있습니다. 따라서 현재 클라이언트가 접속한 브라우저가 익스플로어(IE)인지 체크하기 위해서는 appName에 익스플로어(msie)가 있는지 체크하기만 하면 됬죠. 실제로 서비스되는 웹 페이지에서 익스플로어에 호환 문제가 제일 많이 발생하기 때문에 아오 익스플로러 체크를 해서 따로 처리를 해주는 경우가 많습니다. (jQuery 3 이상은 IE 낮은 버전에서 사용이 안되고, history API 같은 경우는 IE 11의 일정 버전 이상에서만 작동합니다. 대체 왜?) 근데, IE 12 이후로 알 수 없는 이유로 익스플로어의 appName이 'Netscape'로 바뀌었습니다. 따라서 IE 12 이상도 대응을 하기 위해서는 다음..
-
[django] SEO를 위한 사이트맵(sitemap.xml)을 장고 프로젝트에 등록하기Dev 2020. 8. 14. 18:00
안녕하세요. 오늘은 검색 엔진 최적화(SEO)를 위해 사이트맵을 장고 프로젝트에 추가해 봅시다. 그전에, 사이트맵이 무엇인지 알아보아야겠죠? 사이트맵이란 무엇인가요?에 대한 ⭐구글 웹마스터 공식문서⭐의 대답 사이트맵은 사이트에 있는 페이지, 동영상 및 기타 파일과 각 관계에 관한 정보를 제공하는 파일입니다. Google과 같은 검색엔진은 이 파일을 읽고 사이트를 더 지능적으로 크롤링하게 됩니다. 사이트맵은 내가 사이트에서 중요하다고 생각하는 페이지와 파일을 Google에 알리고 이러한 파일에 관한 중요한 정보를 제공합니다. 예를 들어, 페이지의 경우 마지막 페이지 업데이트 시간, 페이지 변경 빈도, 페이지의 대체 언어 버전 등에 관해 알립니다. 사이트맵을 사용하여 동영상, 이미지 콘텐츠 등 페이지의 특정..
-
[django + s3] 장고에서 정적 파일 반영 후에도 바로 적용되지 않는 오류 해결하기Dev 2020. 8. 5. 18:03
안녕하세요 오늘은 장고에서 정적(static) 파일을 갱신할 때 발생하는 오류에 대해 알아봅시다. 사실은 굳이 장고에 국한되지 않고, 정적 파일을 웹 서버에 올리는 방식이라면 어떠한 환경에서도 발생할 수 있습니다. 백엔드 세팅 시에 정적 파일을 어떻게 처리할 것인지 설정을 했을 겁니다. 보통은 스태틱 파일을 웹 스토리지에 배포 하고 이를 꺼내오는 방식을 주로 사용하게 됩니다. 따라서 로컬에서 static 파일, 예를 들어 css파일을 수정한다고 쳐도 바로 반영이 되지 않고 이 웹 스토리지에 적용해 주는 작업이 필요합니다. 이러한 과정에서 저는 웹 스토리지로 amazon s3을 사용하였고, 정적 파일을 업로드 할때 python manage.py collectstatic 명령어를 이용하여 s3에 배포하는 과..
-
[History] SPA에서 URL을 업데이트하는 효율적인 방법Coding/JavaScript 2020. 8. 2. 20:46
안녕하세요 이번 포스팅에서는 History API에 대해 알아보겠습니다. 일반적으로는 주소에 따라 데이터를 띄울때 라우팅을 연결하는 것이 기본적입니다. 특정 URL로 접근하였을 때 로드될 내용을 잘 연결해 놓는다면 URL에 따른 적절한 내용을 로드할 수 있겠죠. 그렇기 때문에 우리는 보통 이러한 방법들을 이용하여 URL을 업데이트하고 페이지를 이동합니다. 1. window.location.href="" 2. form action="/" 3. server에서 리다이렉트 시켜주기 ... 하지만 SPA에서는 우리가 자주 사용하는 URL 이동 방법들을 사용하기 적절하지 않습니다. Single Page라는 특성상 데이터를 페이지가 올려져 있을 때도 비동기적으로 로드하기 때문에 페이지 새로고침이 일어나면 맨 처음으..
-
[HTML/jQuery] 짧은 코드로 Progress bar / Scrollbar 커스터마이징하기Coding/etc 2020. 8. 2. 20:15
안녕하세요 이번 포스팅에서는 여러분들의 블로그를 간단하게 꾸미는 방법에 대해 소개합니다. 1. Progress bar Progress bar는 진행 상황을 나타냅니다. 보통은 div나 span으로 구현하기도 하지만, 간단하게 외부 라이브러리를 이용하는 것도 좋은 방법이겠습니다. 다음 코드를 HTML 파일에 추가해 봅시다. (티스토리의 경우 스킨 편집 -> HTML 편집에서 추가할 수 있습니다) 제이쿼리를 사용하여 prognroll을 HTML 요소에 붙이는 것을 볼 수 있습니다. 티스토리의 경우는 제이쿼리가 옛날버전으로 추가되어 있지만, 다른 플랫폼을 사용하시는 경우 제이쿼리 cdn까지 추가해 주어야 합니다. 이때 중요한 점은 Progress bar가 적용될 부분입니다. 다음 코드에서는 body에 붙이고 ..
-
[Github] 협업 프로젝트에 필요한 아주아주 간단하고 기본적인 Git 명령어 모음Dev 2020. 7. 26. 21:36
안녕하세요😄 이번 포스팅에서는 여러 명이 참여하는 협업 프로젝트에서 제가 자주 사용했던 Git CLI 명령어를 공유합니다. 기본적으로 Git flow를 지향하며, 여러개의 브랜치(branch)를 나누어 작업하는 경우에 주로 사용하였습니다. 1. 브랜치 나누기 1) 브랜치(Branch) 만들기 Git flow에 따르면, master, develop, feature 등등 작업의 성격에 맞게 브랜치를 나눕니다. $ git branch [브랜치명] 으로 브랜치를 만들 수 있습니다. 이럴 경우 현재 위치해 있는 브랜치에서 분기하여 새로운 브랜치가 만들어집니다. 다른 곳에서 분기하는 브랜치를 만들고 싶다면 다음 명령어를 이용해 주세요. $ git branch [브랜치명] [부모브랜치명] 이럴 경우 로컬에 브랜치가 ..
-
2년차 개발 블로그의 애드센스 수입은 어느정도일까?Coding/etc 2020. 6. 9. 11:53
안녕하세요~ 오늘로써 제가 티스토리에 포스트를 업로드한지 대략 400일 정도가 되었습니다. 그동안 쉰 기간도 많고, 정말 하루에 2~3개씩 포스팅을 하며 불태운 기간도 있었는데요. 오늘 포스팅 주제는, 2년 차 개발 블로그의 애드센스 수입은 어느정도 나올 지에 대해 알아보도록 하겠습니다. 애드센스란 구글에서 제공하는 광고 프로그램인데요. https://www.google.com/adsense/new/u/0/pub-9382586972339738/home Google 애드센스 - 웹사이트에서 수익 창출하기 Google 애드센스의 웹사이트 수익 창출 기능을 사용하여 수익을 올려보세요. Google 애드센스에서 광고 크기를 자동으로 최적화하여 광고의 노출 및 클릭 가능성이 높아집니다. www.google.co...
