본문 바로가기

분류 전체보기

(65)
[원격 데스크톱]라이선스 구매없이 VirtualHere을 외부망(데이터)에서 사용하기 저번 글에 따르면 VirtualHere 체험판(Free Trial)의 경우, 외부망에서는 사용을 할 수 없으며,외부망에서 사용하고자 한다면 라이선스를 구매해야 합니다. 하지만 라이선스 구매 없이 사용할 수 있는 방법이 있습니다. 바로 VPN인데요, VPN이 무엇이냐? 서로 다른 네트워크에 있는 기기를 마치 하나의 네트워크에 있는 것처럼 쓸 수 있게 해줍니다. 즉, VPN을 사용해 주면 서버와 클라이언트 단말이 같은 내부망 취급이 되어 VirtualHere을 사용할 수 있게 됩니다. 오늘은 VPN을 활용해 라이선스 구매없이 VirtualHere을 외부망에서 사용해 보도록 하겠습니다. 1. 배경지식..(1-a) VPN이란?2. VPN 설치하기..(2-a) VPN의 종류..(2-b) VPN 설치3. Virtu..
[원격 데스크톱]한/영키가 안될 때 해결법_VirtualHere 사용법 우리는 Moonlight, 파섹, RDP, 점프데스크톱 등 여러 가지 프로그램을 활용해서 원격데스크톱을 하는데. 하지만 다양한 원격 데스크톱 프로그램에도 불구하고 공통적으로 가지고 있는 문제점이 있는데.. 바로 키보드나 마우스 등의 입력이 내 마음대로 안 되는 경우가 있습니다. 주로 많이 겪는 문제로는 한/영 키나 ALT키, 윈도우 키가 잘 입력이 안 되는 경우 등이 있습니다. 이를 해결하기 위해서는 키매핑, VirtualHere과 같은 프로그램 사용하기 등의 방법이 있는데, 우리는 VirtualHere이라는 프로그램을 사용해서 해결해 보도록 하겠습니다. 1. 배경지식 ..(1-a) VirtualHere이란? ..(1-b) USBIP Project란? 2. 설치 및 사용 방법 ..(2-a) 원격 클라이언..
[티스토리][JS]코드블럭 VSCode처럼 꾸미기(6)_적용하기 오늘 할 내용 및 서론 지난 시간에 만들었던 CSS를 이용해 직접 티스토리 사이트에 적용해 보도록 하자. codehead의 HTML 코드 우리는 지난 시간에, 기존의 코드블럭부분의 위에다 codehead(신호등 부분)을 붙이는 방식으로 방향을 잡았었다. 위 이미지를 바탕으로 수정하게 된다면, 아래의 코드(codehead)가 기존 코드의 윗부분, 즉 앞부분에 붙을 것이다. HTML수정하기(JavaScript 이용) 이제 codehead 부분이 완성되었으니, 이를 기존의 코드블럭 앞부분에 붙여줄 차례이다. HTML의 코드를 바꾸기 위해서는 요소.outerHTML 을 통해 수정이 가능하다. (요소.outerHTML 은 해당하는 요소의 태그 값을 전부 가져온다. 반대로 innerHTML은 해당요소를 제외한 내부..
[티스토리][JS]코드블럭 VSCode처럼 꾸미기(5)_CSS스타일 만들기 오늘 할 내용 및 서론 저번시간에 분석했던 디자인을 실제 코드로 옮기는 과정 중 하나인 CSS작성을 진행해 보도록 하자. 먼저, 아래의 글에서 우리는 코드블럭이 pre> code 부분에 해당한다는 사실을 알아냈었다. (또한 pre의 클래스는 사용언어의 종류, code의 클래스는 hljs 인 것도 확인이 가능했다) 해당하는 부분의 CSS 스타일은 어떻게 구성되어 있는지 확인해 보자. 2023.05.03 - [프로그래밍] - [티스토리][JS]코드블럭 VSCode처럼 꾸미기(2)_코드블럭분석하기 [티스토리][JS]코드블럭 VSCode처럼 꾸미기(2)_코드블럭분석하기 오늘 할 내용 요약 및 서론 먼저 본격적인 코딩에 앞서 티스토리의 코딩블럭은 어떤 구조로 이루어져 있는지 살펴보는 시간을 갖도록 하겠다. 웹사이..
[티스토리][JS]코드블럭 VSCode처럼 꾸미기(4)_디자인 분석 오늘 할 내용 및 서론 코드블록에 사용할 디자인을 만들기 위해서 비주얼스튜디오코드(VSC)의 디자인 양식을 분석해 보도록 하자. VSC CodeSnap 디자인분석 위 그림은 비주얼스튜디오코드(VSC)의 CodeSnap 디자인이다. 색상추출 먼저 색상을 알기 위해서 가장 간단한 도구인 그림판을 사용할 예정이다. 그림판으로 색상추출해 보면 검은 배경의 색상은 rgb(30,30,30), 빨간색은 rgb(255,95,90), 주황색은, rgb(255,190,46), 초록색은 rgb(42,202,68), 줄 숫자 표기의 색상은 rgb(133,133,133)이다. 요소들의 위치 및 간격 각 요소들의 간격 및 위치 등을 알기 위해서 그림판을 사용해 보도록 하자. 모서리 부분은 8픽셀*8픽셀 크기의 둥근 꼴을 가지고 ..
[티스토리][JS]코드블럭 VSCode처럼 꾸미기(3)_요소찾기 오류 발생 및 해결 오늘 할 내용 및 서론 저번시간에는 코드블럭이 웹페이지의 어느 곳에 위치하는지, 어떤 구조로 이루어져 있는지 확인하였다. 오늘은 이를 토대로 코드블럭을 수정해 상단바 부분을 만들어 보자. 코드블럭 요소 찾기 먼저, 자바스크립트를 통해 HTML코드를 수정하려면 수정하고자 하는 코드블럭 부분을 찾아야 한다. 저번에 코드블럭은 태그 아래의 code")사용') const codeblocksB = document.querySelectorAll("pre > code"); console.log(codeblocksB); console.log("길이:"+codeblocksB.length); console.log("==========================================\n"); console.log(..
[티스토리][JS]코드블럭 VSCode처럼 꾸미기(2)_코드블럭분석하기 오늘 할 내용 요약 및 서론 먼저 본격적인 코딩에 앞서 티스토리의 코딩블럭은 어떤 구조로 이루어져 있는지 살펴보는 시간을 갖도록 하겠다. 웹사이트는 기본적으로 HTML으로 작성되어 있으며 웹브라우저 상에서는 보통 F12버튼을 눌러 개발자 모드로 진입해 쉽게 확인이 가능하다. (크롬 기준) 2023.04.14 - [수업내용정리/자료구조] - [자료구조][C언어]큐(Queue)란?(4)_큐의 활용(백준10845번) [자료구조][C언어]큐(Queue)란?(4)_큐의 활용(백준10845번) 저번 시간에는 큐를 배열을 활용해 구현해 보았다. 이번엔 저번 시간에 구현한 큐를 가지고 활용해 보도록하자. 아래에 큐를 활용하기에 좋은 백준 문제가 하나 있다. https://www.acmicpc.net/problem/10..
[티스토리][JS]코드블럭 VSCode처럼 꾸미기(1)_시작하기 서론 티스토리에 코드들을 포스팅하면서 불만이 하나 있었다. VSC를 계속 사용해 온 나에겐 티스토리에서 제공해 주는 코드블록의 기본 디자인이 너무 익숙하지 않다는 것이었다. 그래서 이번에는 코드블록 디자인을 VSC랑 비슷하게 바꿔보도록 하는 시간을 갖겠다. 기존의 코드블록 디자인 살펴보기 먼저, 티스토리의 코드블럭에선 다음과 같은 디자인들을 제공해 준다. 그러나 흑백의 비주얼스튜디오코드 디자인이 없어서 직접 만들기로 결심하였다. 위 사진을 보면 줄간격이 생각보다 너무 크고 폰트도 약간 익숙하지 않다는 단점이 있다. 앞으로 만들 디자인 살펴보기 참고할 디자인은 CodeSnap의 디자인이다. CodeSnap은 VSCode의 확장프로그램인데 이렇게 코드를 드래그한뒤 우클릭하면 뜨는 CodeSnap을 클릭하고 ..