블로그/블로그 개발8 [블로그 개발 기록-6] Atom 에디터 로컬에서 아마존 Lightsail Remote-FTP로 연동하기 아마존 AWS 서버내 코드 작업을 할때 내 로컬 환경의 Atom 에디터에 FTP로 연동하여 코드를 가져오고 올리는 방식을 소개한다. 먼저, FTP 통신 연동을 위해 서버의 SSH 키를 가져온다. 인스턴스의 SSH키 가져오기 아마존 Lightsail의 계정설정에서 SSH 키 설정을 가져올 수 있다. 우측 하단의 다운로드 키를 클릭하여 .pem 파일을 다운로드한다. 아톰 Remote-FTP 패키지 설치하기 그 다음 아톰 에디터에서 서버와 FTP 연동을 지원하는 플러그인을 받아주어야 한다. Ctrl + , 로 패키지를 검색하여 remote-ftp 플러그인을 설치한다. 이후 Ctrl + Shift + P 로 remote-ftp를 토글하여 좌측 토글창의 Edit configuration을 클릭한다. 이제, 아톰 .. 2021. 7. 25. 티스토리 Disqus 댓글 위젯 설치하기 디스커스 recent_comments_widget JS 코드 본 블로그의 경우 티스토리 자체 댓글 시스템이 아닌 디스커스 댓글 시스템을 사용하기 때문에 디스커스 서버에서 최근 댓글 목록을 받아와야 한다. 티스토리 테마 HTML 편집 페이지에서 디스커스 최근댓글 위젯은 따로 제공되지 않아 다음의 HTML 코드를 사용하도록 한다. 디스커스 Shortname 적용하기 여기서 호출하는 디스커스 최근댓글 Div 내 자바스크립트 링크는 아래와 같이 자신의 계정의 Shortname을 입력해주어야 한다. https://디스커스ShortName.disqus.com/recent_comments_widget.js?num_items=5&hide_mods=0&hide_avatars=0&avatar_size=32&excerpt_.. 2021. 7. 21. 티스토리 Disqus 댓글 연동 오류 해결하기 나는 현재 블로그에 Disqus 댓글 시스템을 이용중이다. 티스토리 플랫폼에 독립적으로 Disqus 엔진을 사용하면 SNS 계정 연동이나 Notification 등의 이점이 있어 사용해왔는데, 분명히 블로그에 달린 Disqus 댓글이 블로그에서 조회시 보이지 않는 문제가 있었다. Disqus 홈에서 아래와 같이 분명히 보이는 댓글이 실제 페이지에 들어가서 확인해보면, 위와 같이 아무것도 보이지 않는 것이 아닌가. 구글링 끝에 문제의 원인을 찾았는데, 이유는 크게 두가지로 볼 수 있다. 1) 내 블로그에서 사용하는 1차 도메인(algolstudy.tistory.com)과 2차 도메인(bloofer.net)이 따로 리디렉션 없이 혼재된 것 2) Disqus 시스템의 도메인을 활용한 댓글 정보 연동방식(내 블.. 2021. 7. 20. [블로그 개발 기록-5] .kr 도메인 구매 및 certbot HTTPS 인증서 설치 .kr 도메인 구매 고정 IP만으로 블로그를 운영할 수 없기에 필요에 따라 도메인을 구매하게 되었다. 구매한 도메인을 아마존 Lightsail 가상서버에 적용하는 방법은 다음과 같다. 먼저 계정설정의 네트워킹 항목에 접근한다. 그리고 나의 인스턴스에 해당하는 DNS 레코드에 구매한 도메인을 연결해준다. A 레코드를 선택, 하위 도메인은 @.내도메인을 입력하고 나의 고정 IP와 연동한다. 이후, Lightsail을 사용하여 도메인에 대한 DNS 레코드를 관리하기 위해 아마존에서 제공하는 네임서버를 사용하여 도메인 정보를 알려야한다. 나의 경우 hosting.kr에서 도메인을 구매하여 홈페이지 내 구매한 도메인의 DNS 서버를 아래와 같이 등록하였다. 아마존 네임서버 4개를 모두 등록한 후 5분 정도 이후 .. 2021. 7. 14. [블로그 개발 기록-4] Bootstrap 테마를 이용한 반응형 블로그 만들기 Bootstrap 무료 테마 이용하기 Start Bootstrap 페이지에서는 양질의 Bootstrap 테마 페이지를 무료로 제공한다. 여기서, 유료 테마를 구매해도 되지만 무료를 사용하여 틀을 잡고 이후 내맘대로 꾸며보고자 한다. 나는 아래 링크의 Clean Blog 테마를 사용하였다. Jekyll 기반의 깔끔한 블로그형 테마가 마음에 들었다. https://github.com/startbootstrap/startbootstrap-clean-blog StartBootstrap/startbootstrap-clean-blog A clean Bootstrap blog theme created by Start Bootstrap - StartBootstrap/startbootstrap-clean-blog git.. 2021. 7. 13. [블로그 개발 기록-3] 아마존 Lightsail 가상서버 SFTP 파일질라 연동 인스턴스의 SSH키 가져오기 아마존 Lightsail의 계정설정에서 SSH 키 설정을 가져올 수 있다. 우측 하단의 다운로드 키를 클릭하여 .pem 파일을 다운로드한다. 인스턴스 구성 및 Filezilla 연결 파일질라를 열어, 사이트 관리자 메뉴를 클릭한다. 새 사이트를 추가하고, 호스트에 해당 인스턴스의 고정 IP를 입력한다. linux ubuntu 사용자의 경우 사용자명에 ubuntu를 입력하고, 이전에 받은 pem 파일을 키 파일로 추가하면 된다. 이후 연결시, 아래와 같이 정상연동됨을 확인할 수 있다. Filezilla를 통해 대용량의 이미지 및 리소스 파일을 손쉽게 옮길 수 있다. 2021. 7. 13. [블로그 개발 기록-2] Uwsgi + Flask(Python) + Nginx 이용한 가상서버 연동 Uwsgi / Flask / Nginx란? Uwsgi : 미들웨어 역할을 하는 웹 인터페이스 Flask : 파이썬 웹 어플리케이션 개발을 위한 경량 웹 프레임워크 Nginx : Apache와 같은 웹서버, 비동기 이벤트 기반의 웹서버로 프록시/리버스 프록시 등을 지원 패키지 설치 및 환경설정 $ pip install flask $ apt-get install uwsgi $ apt-get install nginx 먼저 flask / uwsgi / nginx를 pip/apt-get 이용하여 설치한다. Uwsgi 설정하기 uwsgi.ini 파일을 다음과 같이 설정해준다. [uwsgi] chdir = /home/ubuntu/BlooferBlog callable = app plugin = python3 modul.. 2021. 7. 13. [블로그 개발 기록-1] 아마존 Lightsail 이용한 가상서버 호스팅 아마존 Lightsail의 요금 정책 블로그 개발을 다시 시작하게 되었다. 여러 국내외 가상서버 호스팅 업체를 비교하던 중, 지인의 추천으로 아마존 Lightsail을 사용해보기로 하였다. 아마존 Lightsail 가상서버의 과금정책은 아래와 같다. 보통 개인 개발블로그의 경우 비즈니스 페이지에 비해 트래픽이나 메모리 사용률이 그렇게 크지 않기 때문에 가장 저렴한 것을 사용한다. 나는 월 $3.5의 가장 저렴한 옵션을 선택하였다. 첫 1달은 과금이 무료라고 한다. 과금을 위해 카드번호 및 인적사항을 기록하여 가입하면, 이제 아마존 Lightsail 인스턴스를 생성할 수 있다. 아마존 Lightsail 인스턴스 생성 인스턴스를 생성하면 위와 같은 가상서버를 하나 할당받게 된다. 여기서 고정 IP를 생성하고.. 2021. 7. 13. 이전 1 다음
