메뉴 건너뛰기

박영식 홈페이지

[소개] 개츠비, 넷틀리파이, 깃허브로 웹사이트 만들기

suritam92019.07.04 15:49조회 수 919댓글 0

  • 1
    • 글자 크기

이제 귀찮음이 하늘을 찔러, 서버도 싫고, 소스를 업로드하는 것도 싫고, SSL 세팅도 모두다 귀찮아졌다.

 

마이크로 서비스인 JAMstack; javascript, API, Markup 을 이용한 웹사이트를 만들 수 있는 다양한 방법들을 제공하여 한달정도 눈싸움을 하다가 성공했다.

 

소개 사이트들에는 nodejs 로 설치하여 해당 소스를 github 에 올려서 netlify 로 배포한다고 서술되어 좀 어려워 보인다.

 

서버나, 로컬에서 nodejs로 gatsby를 이용해 원하는 소스를 다운받아 실행해 볼 수 있기는 하나 필요없다.

 

github에서 gatsby gallery 에 있는 마음에 드는 소스를 fork 하고, netlify에 해당 repository를 지정하면 바로 웹사이트를 만들 수 있다.

 

goddady에서 신청한 도메인의 네임서버를 아래와 같이 설정하고, 10분 정도 기다려 custom domain을 설정하면, https 까지 클릭 몇 번 으로 사이트를 만들 수 있다.

dns1.p08.nsone.net

dns2.p08.nsone.net

dns3.p08.nsone.net

dns4.p08.nsone.net

 

fork 된 repository 소스를 원하는 글과 이미지로 수정하면, 서버도 없고, ftp 도 필요 없는 정적 사이트를 금방 만들 수 있다.

 

github.io 로 만드는 것은 한개의 계정의 github 세팅을 수정해야 했지만, netlify 로 하면 좀 더 수월하게 구성할 수 있다.

 

nodejs로 로컬이나 서버에서 테스트하고 싶다면 아래 명령어를 이용해서 8000서버로 운영해 볼 수 있다.

 

그러나 백그라운드 작업이 되지 않아, 영구적으로 자체 서버에서는 운영이 안 되므로 결국 외부 호스팅을 사용하는 것이 편하다.

 

github에서 수정한 소스가 수분 내에 배포되므로 편리하게 수정하여 적용할 수 있는 최상의 방법이다.

 

curl -sL https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh -o install_nvm.sh bash install_nvm.sh source ~/.profile

 

nvm ls-remote

nvm install 10.16.0

 

npm install -global gatsby-cli

gatsby new blog https://github.com/alxshelepenok/gatsby-starter-lumen

gatsby develop

 

 

실시간 배포 및 error log 확인으로 수정해야할 부분까지 파악 가능하다! Wow!!

 

real.jpg

 

  • 1
    • 글자 크기

댓글 달기

[리뷰] 1000 달성

[원문보기]
 기록된 리뷰의 수가 1000을 기록했다.

2006년 9월 8일부터 2010년 4월 17일. 기록에 의한 것이고, 누락된 것도 있으니, 4월 8일로 치면, 4년 7개월, 55개월이고, 날짜로는 1310일 정도 된다. 네이버 리뷰 작성 체계가 바뀌면서 다른데로 옮길까 하는데, 끌리는데가 없다. 좀 더 찾아봐야 할 듯.

[달리기] LIG 8회 마라톤대회

[원문보기]
55분 29초
9시 14분 38초 출발
10시 10분 7초 도착

사람이 너무나 많았다.

여자 선수들이 많아 달리는 재미가 있었다. ^^;;;;

[번역] XML 암호구성 및 처리과정

[원문보기]
한달 만에 번역을 다했다.

물론 국내 표준을 참고했다.

그것은 오타와 오역이 난무했다.

곧 수정과 정오표 작성을 시작해야겠다.

[달리기] 2010-2012한국방문의해기념 한강관광 마라톤대회

[원문보기]
일본을 비롯해 여러 국가의 업체와 대사관 로고가 찍힌 배번호를 달고 달릴 수 있다.

[달리기] 2010~2012 한국방문의해 기념 한강관광마라톤

[원문보기]
마포대교 -> 서강대교 -> 양화대교 -> 성산대교
반환
다리 밑이라 엄청 추웠다.
10km 를 달리고, 라면과 막걸리 강냉이를 좀 먹었다.

[저자강연] 꿈은 기회비용을 요구한다.

[원문보기]
심현수 님의 강연회에 다녀왔다.

장소 변경까지 겹쳐 여러 문자를 수신했다. 싹 지워야지~

강연 내용이 책이랑 거의 비슷해 재미가 별로 없었지만, 에너지를 얻는데는 충분했다.

사인펜이 없어서, 기다리는 동안 재빨리 가서 '기사시험' 때 받았던 사인펜을 내밀어 1등으로 사인을 받을 수 있었다.

기회는 이렇게 찾아온다. 이봐염! 목표에 대한 절실함을 가지삼.

[수상] 자랑스런 IT인상

[원문보기]
상금이 인상된 건지, 석사라서 많이 준 건지는 몰라도. 지난 해보다 두배다!

[구글차트] Bar width and spacing

[원문보기]

 막대차트를 그리다 보면, width가 chs만으로 조절이 안 될 때가 있다. 4번째 그림 옆에 width가 계산되는 식이 나와 있다. 이런 계산을 무시하고 싶다면, chbh옵션을 a로 줘서 자동적으로 전체 width에 맞게 막대의 굵기를 설정해 주면 된다. 슬림하고, 보기 좋은 막대를 그리기 위해선 계산이 필요하다. 역시 고통이 따르는 것이다.

Description Example

This chart uses the a value to resize values automatically.

The first chart specifies no group spacing, so groups are not apparent. The second chart adds some spacing (15 pixels) between groups.

Vertical grouped bar chart in blue and black, bars and spaces are automatically sized

chbh=a




chbh=a,5,15

This chart uses the r value to specify sizes relative to the bar width. In this chart, spacing between bars is 0.5x bar width, and between groups is 1.5x bar width.

Vertical grouped bar chart in blue and black, bars are automatically sized, spaces expressed as percentage of chart width

chbh=r,0.5,1.5

The first chart has five values in each series, but the chart is too small to hold all the bars with default values:

10 * 23 pixels for bars +
5 * 4 pixels for spacing +
4 * 8 pixels for group spacing                         
282 pixels -- More than the 190 pixel chart width

...so some bars are clipped.

The second chart specifies absolute bar and spacing values to fit all bars in the chart.

Vertical grouped bar chart in blue and black, bars have the default width

chbh omitted
chs=190x125
two series, five values/series


Vertical grouped bar chart in blue and black, bars are automatically sized

chbh=10,5,10

[qt] qt 프로그래밍을 배우기 시작했다.

[원문보기]

 qt creator는 apt-get으로 설치가 안 된다.(2010년 2월 10일 기준)

http://qt.nokia.com/downloads 에서 LGPL을 누르고, 각 OS에 맞는 설치 파일을 다운로드한다.

Ubutu 8.4에서는 일반 linux 파일을 받아서, 실행권한 주고(설명에 나온대로) 따라하면 된다.


기타 라이브러리는 시냅틱 관리자나 

$ sudo apt-get install libqt4-core
$ sudo apt-get install libqt4-debug
$ sudo apt-get install libqt4-dev
$ sudo apt-get install libqt4-gui
$ sudo apt-get install qt4-designer
$ sudo apt-get install qt4-dev-tools
$ sudo apt-get install qt4-doc


위의 명령어를 입력하면 된다.

이전 1 ... 48 49 50 51 52 53 54 55 56 57... 78다음
첨부 (1)
real.jpg
29.8KB / Download 28
위로