개발 카테고리 글

Before / After 이미지 슬라이더

Github 요즘 간간이 포토샵도 만지작거리는데, 보정 열심히 끝내면 원본이랑 비교해보는 재미가 쏠쏠하더라고요. 그러다 이미지 비교엔 슬라이더만 한 게 없단 생각에, 슬라이더를 한 번 제작해봤습니다.

웹 사이트를 PWA로 업데이트하기

PWA(Progressive Web App)란 웹은 높은 접근성을 가진 매력적인 플랫폼입니다.한 번의 코딩으로 거의 모든 기기에서 접근할 수 있고, 검색이나 주소의 공유로 누구나 어디에서나 접속할 수 있습니다. 별도의 업데이트 또한 필요없이 접속할 때마다 최신 상태를 보여줍니다. 하지만 유저를 묶어두기 힘들단 단점이 있습니다.앱을 설치하면 단순히 아이콘 한 번 클릭하면 앱을 실행시킬 수 있지만, 웹은 브라우저를 켜고 사이트에 접속하는

푸시 알림 구독 재추가!

6개월 전에 One Signal로 추가했던 푸시 알림 구독을 직접 구현해봤습니다! 구현을 위해 알림을 보내는 작은 서버를 하나 추가했습니다. Node.js로 https 서버 만들려다 고생만 실컷 하고 실패했는데, ssl 인증은 Nginx가 하고 proxy_pass로 Node.js 서버로 넘겨주니 간단하게 되더라고요.MongoDB도 처음 써봅니다만, 구독 정보도 JSON 형식이고, Node.js로 서버를 돌리니 제일 맞는 DB 같아 골랐습니다. 들어가기 전에, 댓글 알림 구현을

Imgur API로 이미지 업로드하기

Imgur API를 사용해 이미지를 업로드하는 방법을 알아봅니다.

Project SPA

티스토리에서 워드프레스로 넘어올 때도 이렇게 힘들진 않았던 것 같은데, 이번 대규모 업데이트는 정말 진이 다 빠지네요. 이번 대규모 삽질의 핵심입니다.이제 새 탭에서 열리는 링크가 아니면 DOM 내용만 업데이트됩니다. 되게 힘들었는데 한 줄로 정리되니까 슬프네요. SPA 깃허브, 유튜브 등의 웹사이트나 Ghost.js, Gatsby.js 등으로 만든 웹사이트를 보며 동경하던 게 개발자 도구에서 네트워크 탭 켜두면 저렇게 차곡차곡 내용이

200719 블로그 제작일지 및 앞으로 나아갈 방향

움짤 첨부 시 mp4로 변환 ffmpeg를 활용해 gif 이미지를 올리시면 mp4로 전환되게 해뒀습니다.예전부터 gif는 낡고 비효율적인 파일이라고 주장해왔는데, 정작 제 웹사이트에선 gif 파일을 첨부하면 gif 그대로 사용하던 아이러니한 일이 이젠 벌어지지 않습니다. ffmpeg를 처음 활용해봐서 처음엔 모바일에서 비디오가 재생 안 되는 문제가 있었습니다만, 이젠 Chrome(android + macOS + windows), Firefox(windows), Safari(iOS, macOS), Internet Explorer 등의

[워드프레스] 한글이 없는 댓글 자동으로 삭제하기

워드프레스 블로그를 운영하다 보면 하루에 10개가 넘게도 쌓이는 스팸 댓글 때문에 골머리를 앓는 게 한두 번이 아닙니다.블랙리스트를 사용해 특정 단어들만 차단해둬도 9할은 차단하긴 합니다만, 가끔 괴상한 내용으로 블랙리스트를 피하는 댓글이 있습니다. Akismet 등의 스팸 차단 플러그인도 괜찮은 선택지일 수 있겠지만, 한글로 블로그를 운영하면 굳이 무거운 플러그인 붙여다 스팸을 차단할 필요가 있나 싶습니다.글 작성자도 한글을 쓰니,

[티스토리] 댓글에 링크 및 이미지 추가하기

업데이트 2020.07.03 - innerHTML을 사용하지 않고 댓글 내용을 업데이트합니다. 단순히 텍스트밖에 적을 수 없는 티스토리 댓글에 링크, 이미지, 비디오, 유튜브 등을 추가해 화려하게 꾸미는 스크립트입니다. HTML 수정 <s_rp_container> 바로 아래에 있는 요소에 id가 없다면 하나 추가해주세요.방명록에도 사용하시려면 <s_guest_container> 아래에 있는 요소에 같은 id를 추가하시면 됩니다. [##_rp_rep_desc_##]을 감싼 요소에 class가 없다면 하나 추가해주세요. 댓글용과 답글용 2개가

워드프레스 로그인 페이지 차단의 필요성

꽤 예전에 로그인 페이지를 특정 IP를 제외하곤 접근할 수 없도록 막는 작업을 했었는데, 집 밖에선 로그인이 까다롭단 이유로 다시 모든 IP에서 접근할 수 있도록 바꿔뒀습니다.최근 유독 /admin/login.asp에 접근을 시도하거나 xmlrpc.php에 post 요청을 보내는 로그가 많이 보여, 이게 과연 괜찮은 걸까 싶어 블랙리스트를 만들 목적으로 로그인 실패 시 제게 메일이 오게 작업해봤습니다. function loginFailed() { $ip