배너 이미지

개발

구구단 문제 리메이크 - React

구구단 문제 리메이크 - React

깃허브도전해보기 React랑 조금 친하게 지내보려고 예전에 만들어둔 것들을 React로 다시 짜보고 있습니다.로또 추첨기가 첫 번째, 구구단 문제가 두 번째, 다음으론 가사집을 생각하고 있습니다. 사용자가 종료하기 전까지 문제가 계속되고, 난도도 계속 상승하던 예전관 달리 난이도와 문제 수를 고를 수 있게 해뒀습니다.보통을 2 ~ 20, 어려움을 11 ~ 20, 아주 어려움을 11 ~ 30으로 해뒀다가, '보통'이란 난이도에서...

200614 블로그 제작일지

200614 블로그 제작일지

Animated GIF 업로드 이거 하나 때문에 작성하기 시작한 제작일지입니다.이제 Animated GIF(움짤)의 업로드도 지원합니다. 파일 목록은 주기적으로 확인하고, marshallku.com과 img.marshallku.com을 제외하고 어디서 파일을 요청하는지도 수시로 모니터링하고 있습니다.테스트용으로 올리신 건지 뭔진 모르겠지만, 가끔 괴상한 이미지(마이크로소프트 엣지 아이콘, 그림판으로 그린 것 같은 캐릭터 등)들이 올라오는데, 주기적으로 삭제하고 있습니다. Nginx Apache2에서 HTTP/2를 지원하려고 삽질 좀 하다, 성공하긴 했는데 Apache2는...

Apache2 서버를 Nginx로 교체하기

Apache2 서버를 Nginx로 교체하기

우분투 18.04에서 워드프레스 엔진을 교체하는 것을 기준으로 설명합니다.PHP를 사용하지 않으신다면 모듈 설치는 건너뛰시면 됩니다. 아래 과정을 따라 하시면 설치하는 중에 2~3초가량을 제외하곤 아무런 문제 없이 웹사이트에 접속할 수 있습니다. 참고로 워드프레스 등의 PHP를 사용하는 웹사이트를 운영하신다면, Nginx로 교체해도 성능이 체감될 만큼 향상되진 않습니다만, 개인적으로 관리가 Apache2보다 훨씬 편한 것 같습니다. 약간의 성능 차이도 있긴 하고요....

200526 블로그 제작일지

200526 블로그 제작일지

근 2개월 만에 적는 제작일지네요.확실히 잡다하게 하는 게 많아지니 블로그에 투자하는 시간이 확 줄어듭니다. Lazy Load 이제 이전 / 다음 글 썸네일, 카테고리 다음 글에도 지연 로드를 적용했습니다.4월 5일에 제작일지 적고 4월 6일에 업데이트한 거로 기억하는데, 이제야 제작일지에 쓰네요. 웹폰트 로딩 최적화 제 블로그엔 사이트 전반적으로 제주 고딕을 사용하고, 코드엔 둥근모꼴을, 원고엔 어비 찌풍딩체,총 3개의...

React로 로또번호 생성기 만들기

React로 로또번호 생성기 만들기

깃허브 약 9개월 전에 바닐라 자바스크립트로 만든 로또 추첨기를 리액트로 다시 제작해봤습니다. 손보는 김에 예전엔 모바일 기기에선 공을 세로로 일렬로 표시했으나, 이젠 3열로 표시하게 해뒀습니다.버리는 공간이 훨씬 적어진 느낌이라 마음에 드네요. 바닐라로 짤 땐 html에 .ball이란 div를 만들고, #button을 클릭하면 document.querySelectorAll(".ball")로 DOM에 접근해 내용을 바꾸는 방식으로 작업하는데, 리액트로 짜니 컴포넌트를 만들고, 버튼을 클릭하면 컴포넌트의 상태를...

Heroku로 디스코드 봇 호스팅하기

Heroku로 디스코드 봇 호스팅하기

Discord.js로 만든 봇을 Heroku에 호스팅하는 방법입니다.어떤 언어로 작성한 봇이건 호스팅 과정은 크게 다르지 않긴 합니다만, 세세한 부분은 다를 수 있으니 참고해주세요. 파일에 개별적인 접근이 불가능하단 치명적인 단점이 있긴 하지만, 아무래도 무료 호스팅에 많은 걸 바라긴 힘들지 싶네요.아이유 봇은 파일에 종종 개별적인 접근이 필요해 헤로쿠에 올리지 못하고 있습니다. 준비물 디스코드 계정 헤로쿠 계정 깃허브 계정 (선택)...

Frameless Gallery 1.2 업데이트

Frameless Gallery 1.2 업데이트

자동 다크 모드 해제 지금까진 사용자가 다크 모드를 사용하거나, 시간이 19시부터 06시 사이라면 블로그 주인이 설정한 테마를 무시하고 다크 모드가 적용됐습니다.이젠 옵션에 '자동 다크 모드'가 추가되어 이 기능을 끌 수 있습니다. 빠른 링크 로딩 prefetch 업데이트에서 추가했던 기능을 frameless gallery에도 추가했습니다.'빠른 링크 로딩' 옵션을 활성화하시면, 사용자가 링크에 마우스를 올리면 페이지의 내용을 미리 불러와 훨씬 빠르게...

Node.js 크롤러 제작 후기

Node.js 크롤러 제작 후기

개인적으로 배경화면을 굉장히 자주 바꾸는 편인데, 자주 가는 배경화면 줍는 블로그가 역병 때문에 문을 잠깐 닫았던 터라 요즘 여기저기 돌아다니며 배경화면거리를 찾고 있었습니다.헌데 배경화면을 다루는 사이트 대부분이 접근성이 굉장히 떨어지더라고요. 한 포스트에 한 장의 사진만 올리거나, 80장의 사진을 한 포스트에 쓰는데 그 포스트를 다시 여러 페이지로 쪼개서 한 페이지에 두 장씩 보여준다거나 하는 식으로요.참고 참으며...

200428 아이유 봇 제작일지

200428 아이유 봇 제작일지

오랜만에 4박 5일로 서울에 다녀왔는데, 짬날 때마다 업데이트했습니다.KTX 안에서 특히 시간이 많이 나더라고요. 타이머 타이머 기능을 추가했습니다.봇 업데이트를 위해 가동을 멈췄다 다시 시작할 때가 많아, 3시간 이상은 설정하지 못하게 해뒀습니다. 시간, 분, 초 단위를 사용할 수 있습니다.물론 "1시간 1분" 처럼 조합해 사용할 수도 있습니다. 제비뽑기 있으면 재밌겠다 싶어 만든 제비뽑기입니다.사람 여럿 언급하면 그 중 하나...

7891011