demun(대문블로그)

퍼블리셔/jQuery2019. 6. 5. 11:21

문서를 만들다보면 해당페이지로 이동후 원하는 위치까지 스크롤이 되는 경우를 원할때가 있습니다. 이때 문서가 html 이든 jsp(do), asp 든 상관없이 원하는 액션이 되길 원합니다. 이런 액션이 종종 있어서 아예 만들어봤습니다. 필요한 부분 index.html: 이동하기전 보여져야할 페이지(링크가 있는 페이지) target.html: 최종 이동할 페이지(스크롤할 영역이 있는 페이지) main.js: 해당영역까지 부드럽게 스크롤이 될 스크립트 아래 페이지의 내용은 이렇습니다. 링크를 보시면 'target.html#section1' 형식입니다. '해당페이지#해당영역아이디' index.html Go to section scroll-section1 Go to section scroll-section2 Go..

퍼블리셔/기술2018. 12. 20. 10:59

블로그상에서 코드를 이쁘게 보이기 위해서 여러가지 플러그인을 사용해봤습니다. 이전까지만해도 가장 많이 사용했던 플러그인은 highlightjs 였습니다. 구문강조 highlightjs 사용법 -> http://demun.tistory.com/2419?category=388459 블로그상에서 구문강조 할때는 여러가지 유의해야 합니다 막 바꾸다가는 이전 작업물이 제대로 나오지 않는다던가, 또는 다시 작업해야하는 양이 많아질수 있습니다. 저도 이전에 highlightjs 를 사용했기때문에 이번에는 prismjs 로 변경을 해서 작업해야하는 양이 좀 되긴 합니다. 제가 구문강조 플러그인 선택한 이유용량이 적습니다.(원하는 언어, 기능만 선택해서 사용가능)기능이 많습니다.(숫자 표시, 하이라이트 기능 등등 이것도..

퍼블리셔/VisualStudioCode2018. 10. 15. 07:45

vscode(Visual Studio Code)는 기본적으로 에디터 상단에 파일명 - 폴더명을 표시하게 되어 있습니다. 하지만 파일의 전체 경로가 필요할 때가 있습니다. 특히 숨김파일이나 설정파일 같은 경우죠. 설정파일을 한번 열어보겠습니다. 파일 - 기본설정 - 설정 또는 Ctrl + , 입니다. title 로 검색을 하면 아래와 같은 화면이 나옵니다. 설명이 다 되어 있으니 원하는 키워드를 입력해서 사용하세요. 저의 경우 전체경로를 보이게 하기위해 `${activeEditorLong}` 를 지정했습니다. 파일을 열어보면 전체 경로가 나온것을 알수 있습니다.

컴퓨터2018. 1. 25. 07:00

움짤을 만드는 방법은 여러가지가 있습니다. 제가 알려드릴 프로그램은 AllCap 입니다.이 프로그램은 동영상을 녹화하면 움짤인 gif 이미지로 만들어줍니다.예제로 만든 움짤 이미지를 한번 보세요.무설치 프로그램으로 한번 사용해보면 누구나 쉽게 움짤을 만들수 있습니다. AllCap -> https://blog.naver.com/ds3evx/220195337169 AllCap를 실행하면 아래와 같은 화면이 나옵니다. OK를 누르고 마우스우측버튼에 움짤 만들기를 클릭합니다. 그럼 아래처럼 캡쳐 영역이 나오고 하단에 설명이 나옵니다.마우스를 보시면 영역을 지정할 수 있습니다. 영역을 지정하면 아래 Record(F5) 를 클릭해서 동영상을 녹화합니다. 그럼 간단이 움짤이 만들어집니다. 편집후저장을 통해서 저장하기..

컴퓨터2018. 1. 25. 07:00

동영상을 녹화할때 키패드 누른것을 알려줄때가 있습니다. 단축키를 무었을 눌렀는지 나타내야하는데 이는 프로그램으로 할 수 있습니다.예제 이미지를 한번 보시죠. 웹상에 이런 프로그램들이 많이 있습니다.KeyCastOW PxKeystrokesForScreencasts KeyPose 하지만 제가 사용해본 결과 가장 좋은것은 PointerFocus 입니다.생김새는 아래와 같이 생겼습니다. 아래그림은 키보드 부분만 활성화를 시켜서 단축키를 누르면 위처럼 단축키가 표시됩니다.이 프로그램은 http://www.pointerfocus.com/ 에서 다운로드 받을수 있습니다.움짤 만들어주는 프로그램 AllCap -> http://demun.tistory.com/2529 과 함께 사용하면 좋은 움짤을 만들수 있습니다.

퍼블리셔/VisualStudioCode2018. 1. 11. 07:00

이글은 https://demun.github.io/vscode-tutorial/task/ 에서 볼 수 있습니다. 테스크는 grunt, gulp 등과 같은 작업주자 또는 빌드도구를 말합니다. vscode 에서는 빌드도구를 에디터 자체내에서 이용할 수 있도록 지원합니다. 타입스크립트 빌드하기타입스크립트는 빌드과정을 거쳐 자바스크립트로 변환해야 사용할 수 있습니다. 따로 빌드도구를 사용하지 않고 vscode 에서 빌드하는 과정을 알려드립니다. 콘솔창에서 아래와 같이 입력합니다. mkdir task-test # task-test 폴더생성 cd task-test # task-test 폴더로 이동 tsc --init # tsconfig.json 생성 code . # vscode 열기 코드 실행 모습 vscode 열..

퍼블리셔/VisualStudioCode2018. 1. 10. 07:00

이글은 https://demun.github.io/vscode-tutorial/debug/ 에서 볼 수 있습니다.vscode 에서 디버깅은 핵심기능중 하나입니다.vscode 에는 node.js 런타임에 대한 디버깅 지원기능이 내장되어 있어 JavaScript, TypeScript 및 JavaScript로 변환된 다른 언어를 디버깅 할 수 있습니다. 그러기에 기본적으로 디버깅은 하려면 nodejs 를 설치해야 합니다.다른 언어에 대해서는 확장기능을 설치해서 이용이 가능합니다. vscode 폴더에 wecome.js 라는 자바스크립트 코드를 하나 만들고 디버깅을 해봅니다.고급 디버깅을 하려면 환경설정을 해줘야 합니다. 상단에 'launch.json' 구성을 클릭하면 디버깅 환경설정파일이 생성됩니다.'launc..

퍼블리셔/VisualStudioCode2018. 1. 9. 07:00

이글은 https://demun.github.io/vscode-tutorial/git/ 에서 볼 수 있습니다. vscode 는 git 을 사용하기 위한 기능이 기본적으로 추가되어 있습니다. git 을 사용하려면 먼저 https://github.com 에 회원가입이 되어 있어야하고, git-scm 에서 git 프로그램을 다운로드하고 설치해야 합니다. 가입이 안되어 있다면 https://github.com 에 회원가입을 하고 프로그램도 설치하시길 바랍니다. 설치가 되어 있다고 가정하고 vscode 에서 git 을 사용하는 방법을 알아보겠습니다.최초설정git 에 내이름과 이메일등을 먼저 등록하는 것이 좋습니다. vscode 에서 git 을 사용하다보면 나중에 이름과 이메일을 물어옵니다. 그러니 먼저 설정해둡니..

블로그/블로그팁2018. 1. 5. 07:00

티스토리에 글을 포스팅하면 페이스북으로 자동으로 전송하는 플러그인이 있습니다.관리자화면 - 플러그인으로 갑니다.페이스북 글 보내기 플러그인을 선택합니다.아래 계정 연결하기를 통해 페이스북과 연결을 합니다.저의 경우 연결을 했기때문에 아래처럼 나오지만 연결을 안한경우는 연결하면 됩니다.그리고 적용하면 됩니다.이제 티스토리 블로그에서 글을 쓰면 자동으로 페이스북에 전송이 됩니다. 주의할 점티스토리에서 한번 저장하면 자동으로 페이스북에 전송이 되기 때문에 제목등이 잘못된채로 저장을 하면 잘못된 제목으로 전송이 됩니다.이럴때는 티스토리에서 제목을 수정하여도 페이스북에는 그대로 있습니다.이때는 티스토리에서 수정한후, 페이스북에 가서 수정을 해줘야 합니다. 페이스북에 가서 게시물의 우측에 더보기 버튼을 클릭해서 게..