기본 콘텐츠로 건너뛰기

Gist를 이용하여 Blogger에 Github 소스 끼워넣기

프로그램 소스 코드와 같이 구문 강조(code highlight) 기능이 필요한 코드를 블로그에 끼워넣기(embeded)하기 위해서는 페이스트빈(pastebin)이라는 서비스가 필요하다.

대표적인 페이스트빈 서비스로는 자바스크립트 기반의 SyntaxHighlighter가 있으며, 이 밖에도 'code highlight'나 'syntax highlight'라는 검색어로 구글링해보면 다양한 프로그래밍 언어로 구현된 온라인 서비스와 SyntaxHighlight와 같이 블로그 소스내에 끼워 넣을 수 있는 소스로 제공되는 페이스트빈 서비스를 찾을 수 있다.

여기서는 깃허브에서 제공하는 페이스빈 서비스인 Gist를 이용하여 블로그에 소스 코드를 끼워 넣는 방법을 알아보겠다.

우선 깃허브를 가입하고 계정을 생성한다. 그리고 Gist로 접속하여 파일을 생성하면 끝!


참고. https://help.github.com/en/articles/creating-gists

먼저 확장자를 포함한 파일 이름를 입력한다.
본문에 소스를 입력한 뒤에 gist를 생성한다.
이때 secret과 public을 구분하여 만들 수 있는데 public은 외부의 검색을 허용한다는 정도만 이해하면 된다. Github의 private와 public 저장소의 차이와 비슷.

우측 상단에 끼워넣기(embed)를 위한 복사 기능이 있으므로 복사한 후 블로그 소스에 <script> 블럭을 끼워 넣으면 완료.


이 기능은 HTML 코드 편집을 지원하는 블로그에만 가능하며 HTML 코드 편집을 지원하지 않을 경우 Color Scripter와 같은 온라인 페이스트빈 서비스를 이용하면 된다.

댓글

이 블로그의 인기 게시물

ESP8266 마이크로컨트롤러에서 UART0과 UART2 동시 사용하기

ESP-12F와 2개의 FTDI를 UART0과 UART2에 연결 ESP8266은 3개의 UART 포트를 제공한다. UART0과 UART2는 같은 Serial 클래스에서 관리하므로 동시 사용이 불가능하므로 교대로 사용해야 한다. UART1은 Serial1 클래스에서 관리하므로 동시 사용이 가능하지만 출력 전용이기 때문에 TX만 정의되어 있다. UART0 UART1 UART2 RX GPIO3(RX) - GPIO13 TX GPIO1(TX) GPIO2 GPIO15 아두이노 클래스 Serial Serial1 Serial 비고 UART2와 동일한 클래스를 통해 관리됨 메시지 수신을 위한 RX는 정의되어 있지 않음 UART0와 동일한 클래스를 통해 관리됨 UART0과 UART2는 동시 사용이 불가능하므로 한 번에 하나의 포트만 사용하도록 Serial 클래스의 swap() 멤버함수를 사용한다. NodeMCU와 USB-UART 연결 NodeMCU는 ESP-12E 개발보드가 사용되었으며, micro-USB 포트를 제공한다. micro-USB 포트는 UART0 포트를 사용하며, RX(GPIO3)와 TX(GPIO1) 핀을 공유한다. USB-UART 연결 장치를 UART2 포트에 연결하기 위해 D7(GPIO13)과 D8(GPIO15) 핀에 연결했다. NodeMCU는 UART0 포트를 이용하여 Ardino의 시리얼 모니터로 출력을 보내며, UART2 포트의 출력은 별도의 터미널프로그램으로 접속하여 출력을 모니터했다.

NodeMCU에서 I2C 통신을 이용하여 OLED 디스플레이에 표시하기

준비물: NodeMCU 개발보드 1개, OLED SSD1306 디스플레이 1개, micro-USB 케이블 1개, 브레스보드 그림 1. 준비물 개발환경 아두이노 스케치 1.8.9 Wire 라이브러리 https://www.arduino.cc/en/reference/wire ESP8266 OLED SSD1306 라이브러리    https://github.com/ThingPulse/esp8266-oled-ssd1306 I2C란 I2C 버스는 80년대 초반에 저속의 부품들을 연결하기 위한 목적으로 필립스에서 개발한 직렬버스이다. "Inter IC"라고도 하며, IIC, I2C 버스라고도 한다. I2C 통신은 다음과 같은 특징들을 갖는다. SDA, SCL 등 2개의 통신선만 사용하므로 구성이 간단하다. 마스터-슬레이브 관계로 연결하여 1:n 연결이 가능하다. 슬레이브는 고유의 주소로 구분한다. 통신 최대속도는 100Kbit/s이며, Fast mode(400Kbit/s), High speed mode(3.4Mbit/s)도 지원한다. 실습내용 아두이노의 경우 디폴트로 SDA와 SCL을 위해 GPIO4 핀과 GPIO5 핀이 지정되어 있지만, ESP8266의 경우 소프트웨어적인 방식으로 구현되어 있기 때문에 임의의 핀을 이용할 수 있다. 여기서는 D1(GPIO5), D2(GPIO4)핀을 SCL과 SDA로 지정했다. ESP8266은 마스터로 동작하며 OLED 디스플레이는 슬레이브로 동작한다. Wire 라이브러리 ESP8266(마스터)에서 OLED 디스플레이(슬레이브)로의 데이터 전송은 먼저 버퍼를 준비하고, 버퍼에 데이터를 기록한 후 버퍼의 내용을 전달하는 3단계로 진행된다. 멤버 함수들을 사용하기 위해 우선 헤더 파일을 추가한다. #include <Wire.h> 초기화 void begin(int sda, int scl) sda: SDA(Serial data) 핀 번호 scl: SCL(Serial clock) 핀 번호 데이터...

자작 :: 아두이노 온습도계

사용부품: Arduino UNO 호환보드, DH-22 온습도 센서, 캐릭터 LCD(16x2글자), Potentionmeter 아두이노 온습도계 AM2302 DH-22 온습도센서는 다음과 같이 3개의 핀을 사용한다. Pin 1. Vcc (전원 3.3~ 5.5V) Pin 2. GND (접지) Pin 3. DOUT (데이터 송신, SDA핀 연결) 온습도 센서의 데이터 수신을 위해 DOUT 핀은 아두이노의 D2 핀에 연결했고, 전원과 DOUT을 10㏀ 풀업 저항을 달아 연결했다. 부품 구성도 LCD는 웹사이트의 카달로그로 보기에는 백색 LED 백라이트가 멋있게 보여 구매를 했는데, 가독성면에서는 옐로우-그린 LED가 더 나을 것 같기도 하다. 아두이도는 기본적으로 LCD의 D4 ~ D7까지의 핀으로 4bit 통신을 한다. D2 핀은 밝기 조절을 위해 가변저항의 가운데 핀과 연결했다. 백라이트 전원은 220Ω 저항을 달았다. 온습도 정보를 수집하여 LCD에 출력하기 위한 아두이노 소스는 다음과 같다. 소스코드:  https://github.com/Jeongsam/arduino-DH22-LCD1602 #include <adafruit_sensor.h=""> #include <liquidcrystal.h=""> #include <dht.h=""> #include <dht_u.h=""> /** * 현재 온습도를 디스플레이하기 * DHT22(AMS2302)로부터 데이터를 받아 LCD16x2 디스플레이에 표시 */ // 온습도 센서 설정 #define DHTPIN 2 // 온습도 데이터 연결 핀 번호 #define DHTTYPE DHT22 // AMS2302 DHT_Unified dht(DHTPIN, DHTTYPE); uint32_t d...