본문 바로가기

IT_Developers/개발기타73

크롬 - 사이트 로딩속도 체크 하기 / 개발자도구 사이트 몇초 만에 뜨는지 확인하기 안녕하세요. 고코더 입니다. 개발자이거나 혹은 일반 사용자라도 특정 사이트의 로딩속도 사이트가 전부 완성 되는 속도가 궁금하거나 필요 할때가 있습니다. 이럴땐 크롬의 개발자 도구를 활용하면 좀 더 명확하게 로딩 속도를 알 수 있습니다 우선 알고싶은 사이트에 접속해서 F12를 누릅니다. ▼ Network로 이동 후에 새로고침을 하면 화면처럼 모든 로딩이 캡쳐가 됩니다. 그리고 아래에 Load 보면 로딩 속도가 체크 됩니다. 제 사이트 최근 글에 로딩속도는 3.05초 입니다. ▼오른쪽에 가로 그래프는 시간마다 로딩되는 바 입니다. 로딩 속도는 캐쉬때문에 최초의 접속과 이 후에 접속 시간이 상이하고 (나중에 접속하는게 더 빠르겠죠) 그리고 설치 해놓은 크롬의 확장프로그램에 따.. 2018. 6. 1.
카카오 개발 - URL 링크 미리보기 캐시 삭제 카톡 링크 보내기 뜨는 정보 최신화 하기 안녕하세요. 고코더 입니다. 지난 번 og태그를 강의 하였습니다. 어떤 개발자 분이 댓글로 태그를 수정해도 변경한 내용을 확인 할 수 없다고 말씀 해주셨네요. -> HTML - og(open graph) 태그 란? / 카톡,sns 미리보기 지정 이런 문제가 일어나는 이유는 각 서비스 에서는 og를 캐시로 저장을 해놓습니다.똑같은 요청을 효과적으로 처리하기 위해서죠. 그러므로 og태그를 변경하여도 일정 기간이 지나야 새로운 태그의 내용을 확인 하실 수 있습니다. 카카오톡 같은 경우에는 카카오 개발자 사이트에서 캐시 삭제가 가능합니다. ▼ 아래 링크에 접속하시면 Cache 삭제 도구가 있고 여기서 원하는 도메인의 캐쉬를 삭제할 수 있습니다. http://bit.ly/.. 2018. 4. 27.
사이트 -모바일 환경 홈페이지 반응성 테스트 / troy.labs.daum.net 반응형 홈페이지 디버깅 안녕하세요. 고코더 입니다. 개발자에게 필요한 사이트를 하나 알아내 리뷰를 남길려고 합니다 크롬에서 F12 를 누르면 모바일을 선택해 테스트를 가능하게 만들어 놓은 기능이 있습니다. 이 기능만으로는 훌륭하나 더 다양한 디바이스의 브라우저 크기를 알아내고 싶을때는 ▼ 트로이라는 사이트가 있습니다. http://troy.labs.daum.net/ ▼ 사용법은 설명 드리지 않아도 될 정도 입니다. URL을 기록하고 왼쪽의 디바이스를 선택하면 해당 환경으로 화면을 볼 수 있습니다. 왠지 다음 사내 개발자 스터디 모임에서 제작한 느낌이 나는데 도메인도 그렇고 그런거 같지 않나요.? 간단한 기능이지만 디버깅에 도움이 되는 사이트 같습니다. 마무리 크롬 개발자 도구 디바이스 모드 보다 편하네요 2018. 4. 26.
SQL - DB 쿼리 정렬 사이트 쿼리 정리 사이트 안녕하세요. 고코더 입니다. 길게 늘어지고 복잡한 쿼리를 본 적이 있을 것 입니다. 한숨을 쉬면서 눈으로 직접 정리하거나 각 IDE에서 정리하는 단축키가 있지만 도구 적으로 상황이 여의치 않을 때도 있고IDE 제공하는 정렬은 눈에 잘 안 들어옵니다. ▼ 이럴 때 바로 해당 사이트에서 쿼리를 정렬해보세요. http://www.dpriver.com/pp/sqlformat.htm ▼ 이 사이트는 7개의 SQL 포맷을 지원합니다. ▼ [Format SQL] 해당 버튼을 누르면 ▼상단의 입력한 쿼리를 아래 정렬을 해줍니다. select name,addr,age, from where name='gocoder' order by addr 개발자들이 눈에 익숙한 방법의 느낌으로 정렬을 해줍니다. 현장에.. 2018. 4. 20.
FTP - 파일질라(FileZilla) 다운로드 / 설치 파일질라 사용해보기 다운하기 안녕하세요 고코더 입니다. 오늘은 파일질라를 알아보겠습니다. IT종사자는 익숙한 프로그램 이지만 일반 사용자는 단어부터가 조금 생소합니다. 이전 강의에서 알FTP를 말씀드리면서 -> [IT_활용/프로그램] - 알FTP 구버전 v5.33 / 다운로드 / 설치방법 최강의 무료 FTP 프로그램이라고 안내해 드렸습니다. 그래서 이번 시간에 남겨보려고 합니다. ▼해당 사이트에 접속하여 보이는 거처럼 Download FileZilla Client 다운 받아 주세요 https://filezilla-project.org/ ▼저희는 FTP 중심으로 무료 버전을 이용 하려고 합니다. 다운로드 버튼을 눌러 주세요 ▼ 다운로드 받은 파일을 실행시켜 설치를 진행합니다. 동의를 눌러 주세요 ▼ 멀웨어.. 2018. 3. 4.
IE - 익스플로러11 개발자도구 실행 오류 diagnostic: exception in window.onload: error: an error has occurredjsplugin.3005 안녕하세요 고코더입니다.오늘은 개발자 도구 오류를 해결 해보겠습니다. 윈도우7에서 IE11 사용할때갑자기 개발자 도구를 키면 이상한 오류 화면만 보여집니다. ▼알 수 없는 오류입니다. 일반 사용자가 볼 수 없는 캐치 오류 메세지 같습니다. ▼ 그래서 마이크로 소프트 QA를 찾아보니 답이 있습니다.https://answers.microsoft.com/ko-kr/ie/forum/ie11-windows_7/%EC%9C%88%EB%8F%84%EC%9A%B0-7%EC%97%90%EC%84%9C/8b47b1cf-6424- 4564-9e43-35a470976e0e KB30.. 2018. 2. 4.
웹관리 - 사이트 엣지(edge) 접속 불가 / CV 삭제 이전 웹 기술과 관련된 문제가 발생했습니다. 이 웹 사이트는 이전 기술에서 실행되며 Internet Explorer에서만 작동합니다. 윈도우10부터 꾸준히 밀고 있는 엣지 브라우저 빠르고 신속하게 인터넷을 사용 할 수 있어서 간단한 정보검색에서 활용되고 있습니다. ▼그런데 항상 가던 사이트도 갑자기 이런 메세지와 함께 접속이 안되는 경우가 많습니다. 크롬이나 익스플로러로 접근하면 정상적인데 엣지만 이런 메세지와 함께 차단 되는 경우죠 ▼msdn에서 정보를 찾아보니 일명 "CV 목록"에 등록된 사이트들이 차단이 되고 있다고 합니다. https://msdn.microsoft.com/ko-kr/library/gg622935(v=vs.85).aspx ▼ 이유는 아래와 같다고 합니다. 1. Internet Exp.. 2018. 2. 2.
사이트 - hex에서 RGB로 값 변환 / 색상활용 hex -> RGB 변환 인터넷에서 보통 색상을 나타낼때 background:#7fd99b; 이런식으로 코드에 기입하기 위해 헥사코드 형식으로 나타냅니다. Q. 헥사(hex)코드란? - 16진수로 숫자를 표현하는 기법 0~9 그리고 A~F까지 이용한다. 보통 온라인에서 얻은 색상헥사코드를 포토샵이나 기타 다른 곳에 사용하기 위해서는 RGB 값을 기록하여야 합니다. Q. RGB란? - 빨강(RED), 초록(GREEN), 파랑(BLUE) 세 종류의 광원(光源)을 이용 혼합하여 색상을 나타내는 방식 헥사코드를 RGB 값으로 보여주면서 색상에 대해 활용 팁을 주는 사이트를 알려드리고자 합니다. 디자이너에게는 좋은 사이트겠네요 ▼해당 사이트에 접근하시고 -> http://www.color-hex.com/ hex .. 2018. 2. 1.
VPN - 시스코 접속 에러 / error 56: the cisco systems ... Error 56: The Cisco Systems, Inc. VPN Service has not been started. Please start this service and by again cisco VPN 프로그램 해당 오류가 발견될 때가 있습니다. 보통은 윈도 업데이트 후 혹은 시스템상의 변화가 있을 때 해당 오류가 발생합니다. VPN프로그램이 막히면 개발도 딜레이되니 빨리 오류를 수정해보겠습니다. ▼서비스를 실행 후에 ▼internet Connection Sharing(ICS)를 마우스 오른쪽 버튼을 클릭해 속성으로 들어갑니다. ▼그리고 해당 서비스를 수동으로 변경해줍니다. ▼그리고 중지되어 있는 Cisco Systems, inc. VPN Service 를 시작으로 변경합니다. ▼이제 정상적으로 .. 2018. 1. 26.