본문 바로가기

웹 브라우저 점유율과 블로그 접속 웹 브라우저 점유율은 아래 자료를 참고했어요. https://www.netmarketshare.com/browser-market-share.aspx?qprid=0&qpcustomd=1 (클릭하면 새로운 페이지에서 확인할 수 있어요) 들어가서 보시면 데스크톱 버전으로 확인할 수 있고요. 모바일 + 태블릿 버전으로도 확인할 수 있어요. 데스크톱 버전에서는 1위 크롬, 2위 인터넷익스플로러 모바일 + 태블릿 버전은 1위 크롬, 2위 사파리 둘 다 크롬이 1등인데요 !!50% 이상씩 차지하고 있더라고요. 제 블로그에 들어오시는 분들은 어떤 웹 브라우저를 사용하고 있는지 확인해봤는데요. 숫자는 가렸어요 :-) 제 블로그는 모바일 보다는 데스크톱 환경에서 접속하는 분들이 많기 때문에 !! 인터넷 익스플로러가 2등을.. 더보기
atom installed packages / themes 제가 사용하고 있는 atom packages를 작성해두려고 합니다. 언제 또 개발 환경이 변경되고 atom을 다시 설치해야 하는 상황이 발생할지 몰라서요. atom-beautify 는 여러 파일의 indent를 맞추는데 사용하고 있어요. atom-ternjs 는 아마도 javascript autocomplete 를 위해서 사용하고요. autoclose-html 은 html 작성할 때 close tag를 제공하기 때문에 쓰고 있어요. autocomplete-python 은 이름 그대로 입니다 :) file-icons 는 atom의 밋밋한 파일 표현을 진짜 이쁘게 바꿔줘요. 꽤 맘에 들어요. multi-cursor 는 여러 줄을 한 번에 편집할 수 있어서 좋아요. highlight-selected 는 선택한.. 더보기
django rest : url in serializer django rest framework에서 serializer에 url field에 대해서 간단하게 기록해둡니다. django rest framework에서는 구현한 API를 테스트하거나 활용할 수 있는 웹 용 UI를 기본적으로 제공하자나요. 아래 그림과 같이 말이죠. 위 그림은 get 으로 모든 목록을 받아온 예시입니다. 그림에도 표시한 것 처럼 url 이라는 필드가 있고 그걸 클릭하면 id가 14인 객체 페이지로 이동하게됩니다. 아래 그림을 참고해주세요. GET 주소가 ~~~~/14로 변경된 것을 확인 할 수 있죠. 객체 페이지로 이동하면 delete나 update 기능을 수행할 수 있고요. url 필드는 기본적으로 제공되는 것인데요. 그러니깐 model에 url 이라는 필드가 존재하지는 않아요.se.. 더보기
웹 개발, 크롬 개발자도구, 스마트폰(모바일) 기기 추가 제목이 복잡하네요. 1. 웹 개발하는 과정에서 크롬 브라우저의 개발자 도구가 많이 사용되는 것으로 알고 있어요.2. 개발자 도구에서 모바일 기기에서 어떻게 보여지는지 확인할 수 있구요. 3. 여러 모바일 기기를 추가할 수 있어요!! 이번 포스팅에서는 3번 어떻게 추가하는지에 대해서 그림으로 정리해두려고 합니다. 1. 윈도우에서는 크롬 브라우저에서 F12를 누르면 개발자 도구가 보이고요. 리눅스에서는 Ctrl + Shift + i 를 누르면 보이고요. 맥에서는 Alt + Command + i 를 누르면 되요. 아래 그림과 같이 나오면 성공!! 2. 위 그림에서 오른쪽 상단에 쩜쩜쩜 세로로 찍힌거 누르면 아래 그림을 볼 수 있어요. 여기서 Settings를 선택 !! 3. Settings에 들어와서 Devi.. 더보기
Leaflet 기초 01 Leaflet 기초 정리 01 앞으로 몇 번의 포스팅을 통해 Leaflet에 대한 기초 내용을 정리해두려고 합니다. 참고)Leaflet과 유사하고 많은 기능이 있는 Mapping Library로는 OpenLayers가 있습니다.OpenLayers에 대한 내용도 가끔 포스팅한 적이 있구요. Leaflet과 OpenLayers를 비교한 슬라이드는 아래에 있습니다. 2015 FOSS4G에서 발표된 내용이네요. Leaflet vs OpenLayers : http://ivansanchez.github.io/leaflet-vs-openlayers-slides/#/ 1. Leaflet은 가볍습니다. OpenLayers에 비해서 말이죠. 저도 OpenLayers만 써왔지만 Leaflet이 여러 프로젝트나 서비스에 적용.. 더보기
크롬 캐시 지우고 웹 페이지 새로 고침하기 제목이 조금 복잡하네요 웹 개발하실 때 크롬 웹 브라우저로 테스트하고 있다고 가정하구요. 작은 이미지를 변경했는데 캐시된 상태라서 반영된 결과를 제대로 확인이 안되는 경우 아래와 같은 방법으로 캐시된 내용을 지우고 웹 페이지를 새로 고침함으로써 결과 확인이 가능합니다. 아오 풀어서 써도 어렵네요. 내용은 간단한데 말이죠 ㅋ 1. 크롬에서 요소검사 창을 열어주세요 (Ctrl + Shift + i). 윈도우 크롬에서는 F12로도 열리는거 같아요. 쉽게 말해서 콘솔창 보이고 엘리먼트 보이고 하는 그거요. 아래와 같이 생겼죠. 2. 새로고침 하는 버튼을 마우스로 길게 눌러보세요. 아래와 같이 총 3개의 서브 메뉴가 나타납니다. 아래 그림은 화면이 위 요소검사 창을 열어두지 않으면 안나와요. Normal Relo.. 더보기
웹 페이지 최적화에 도움되는 사이트 웹 페이지를 최적화하고 에러나 위험요소를 줄일 수 있는 방법이 많이 있지만 몇 개의 홈페이지에서 제공하고 있는 기능을 사용해보는 것도 좋네요. 1. CSS Lint (http://csslint.net/) 가운데 흰색 박스에 CSS를 입력하고 LINT 버튼을 누르면 에러나 워닝을 잡아줍니다. 모두 따를 필요는 없지만 그래도 문제가 될 수 있는 부분이라고 하니 적당히 고쳐주는게 좋을 것 같네요. 저도 한 30개 정도 나왔는데 주로 #id 가 문제였습니다. class로 변경하니깐 다 사라졌구요. 필요없는 CSS나 합칠 수 있는 CSS 코드도 발견해주니깐 더 깔끔한 CSS 작성에 도움이 됩니다. 2. JSHint (http://jshint.com/) JavaScript Hint입니다. JS 내용을 왼쪽에 입력하.. 더보기
CartoDB 소개 Web 기반 지도 제작을 할 수 있는 서비스가 몇 가지 있지만 CartoDB는 좀 괜찮네요. 벌써 이런 정도가 가능하다는 점이 대단한 것 같습니다. CartoDB 홈페이지 : http://cartodb.com/ 보유하고 있는 공간정보 데이터를 업로드 하거나, 직접 위경도를 입력해서 표현하는 것도 가능합니다. 위 그림은 직접 위경도를 입력한 것으로 잘 안보일까바 아래 그림도 추가합니다. 간단하게 127, 36을 입력했습니다. Data View에서 Map View로 전환하면 아래 그림과 같이 포인트로 127, 36에 표현된 것을 확인할 수 있습니다. 배경 지도를 변경하는 것은 당연히 제공하고 있구요. 이것을 그림 파일로 저장하거나 웹 상에서 공유하는 것도 가능합니다. 더보기
Swift 공부 관련 링크 Swift 공부를 저는 이제 하고 있습니다. 나온지가 한참 되었지만, 이제야 할 마음이 들었어요 ^^;; 공부할 수 있는 사이트가 많이 존재하는데요. 아래 사이트들은 너무나 당연하거나 쉽게 검색이 되긴 하는데요. 그래도 귀찮으신 분들이 계실까바 한 번 올려봅니다. 1. Swift Programming Language https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/TheBasics.html 애플에서 제공하고 있는 Swift 관련 내용이 총 정리되어 있는 웹 페이지 입니다. 제가 링크 건 것은 언어 기초 시작부분이니, 링크들어가 보시면 페이지 상단에 존재하는 Welcome to S.. 더보기
앱 추천(Android, iOS) - Pocket 앱 추천.. 사실 앱 이라기 보다는 서비스에 가깝죠. 앱은 서비스를 사용하는 인터페이스에 가까운 것이구요. Pocket : https://www.getpocket.com/ 데스크탑, iOS, Android에서 모두 사용 가능한 서비스로 웹 페이지를 보관할 수 있는 서비스입니다. Android나 iOS에 앱을 설치하면, 웹 브라우저에서 보고 있는 웹 페이지를 Pocket에 보관하고 언제든지 보고 싶을 때 Pocket 앱에 들어가서 볼 수 있는데요. 오프라인 상태에서도 가능합니다. 정말 좋은 웹 페이지.. 기사나 블로그일 수도 있고요. 혹은 문서가 나와 있는 페이지 일 수도 있죠. 하지만 지금 자세히 볼 시간이 부족하다 싶을 때 Pocket에 보관하도록 하고, 나중에 시간날 때 다시 꺼내서 보는 용도로 사용.. 더보기
크롬 웹브라우저 시작할 때 여러 페이지 열기 크롬 웹브라우저를 실행할 때, 내가 자주가는 사이트를 한 번에 열기 위해서는 아래와 같은 방법으로 가능합니다. 1. 브라우저 오른쪽 끝에 있는 제어 버튼을 클릭한다. 보시면 하단 쯤에 설정이 있죠? 그것을 클릭~~~ 2. 시작 그룹에서 맨 아래 라디오 버튼을 클릭하고 페이지 설정을 누른다. 아래 그림을 참고해서 클릭해주세요. 3. 페이지 설정에 내가 자주 가는 사이트를 추가해준다. 아래 처럼 말이죠.. 확인 누르시고, 크롬을 껐다 켜보세요. :) 더보기
리눅스 - 아파치 웹 서버 로그 보기 (Apache Web Server Log) 우분투 기준으로 작성하겠습니다. 일단은 아피치 웹 서버를 apt로 설치하셨겠죠?? ex) apt-get install apache2 아파치 웹 서버의 로그를 보기 위해서는 결론적으로 다음 명령어를 입력하시면 됩니다. tail -f /var/log/apache2/error.log /var/log 라는 폴더가 여러 응용프로그램들의 로그가 기본적으로 저장되는 곳입니다. 아파치 웹 서버도 마찬가지구요. tail -f 라는 명령어는 다음과 같이 설명되어 있는데요. Print the last 10 lines of each FILE to standard output. (tail --help 중 일부) -f 라는 옵션을 주어서, 에러로그를 한 번 출력하고 끝인 것이 아니라, 계속 모니터링 해줄 수 있습니다. 아래 그림.. 더보기