본문 바로가기

전체

 (94)
Development/기타 Tistory 본문 글 목차 자동 생성 기능 구현 들어가며 예전부터 해야지... 해야지... 했던 Tistory 목차 생성 기능을 구현했다. 기능 구현 난이도는 매우 쉬움이었으나, 귀차니즘 + 외주 프로젝트 개발로 인해 계속 미루어두고 있었다. 외주 프로젝트 개발이 잘 마무리되어 후기를 작성하다가 목차 생성 기능 구현이 번뜩 떠올라 구현 후 글을 작성하였다. 1. 개요 목차 생성 기능은 매우 간단하다. 해당 제목이 포함된 글 본문 태그를 찾아서 모든 제목 태그를 파싱한 후 새로운 목차 태그를 생성해서 넣어주기만 하면 되기 때문이다. Tistory를 포함한 대부분의 웹 페이지 본문 글에는 제목이 있으며, 이 제목은 주로 ~ 태그로 구성되어 있다. 이를 확인하려면 제목처럼 보이는 텍스트에 마우스를 올려놓고 우클릭하여 검사를 누르면 브라우저 개발자 도구에 해..
Development/회고록 백엔드 개발자, 첫 스타트업 퇴사일기 들어가며 11월 30일, 개발자로 커리어를 전향한 후 약 1년 3개월 동안 기여해왔던 회사에서 퇴사했다. 그간 많은 일이 있었고 하고픈 말 또한 많지만 삼키느라 애먹었다. 어디서부터 회포를 풀어가야 하는지 고민하면서 수차례 글을 쓰다가 지우고를 반복하는 과정을 통해 최대한 가지치기한 글을 남겨놓는다. 1. 서비스 소개 국내 후원 서비스에서 양대 산맥을 이루는 투네이션, 트윕을 뒤로하고 후발주자로 열심히 쫒고 있는 서비스이다. 회원가입자 수는 약 5만 명 정도이며, 일간 이용자는 약 150명 정도가 되는 작은 규모의 스타트업이다. 국내 후원 서비스의 낮은 수수료율, 한국이라는 작은 시장 규모를 탈피하기 위하여 올해 6월 말에 해외 서비스를 런칭했다. 해외 서비스 회원가입자 수는 약 2천 명이며, 일간 이용..
Development/기타 MySQL 8.0 Replication (2) - NestJS + TypeORM Multi Connection 들어가며 지난글에 이어서 이번에는 MySQL Replication을 통해 NestJS TypeORM에서 Multi Connection으로 관리하는 방법에 대해서 정리해보겠다. 1. 개요 실습 주제는 간단한 게시판 API 서버이며, 모듈 구조는 다음과 같다. classDiagram AppModule
Development/기타 Tistory에서 Markdown 작성 시 Mermaid 적용 시키는 방법 들어가며 필자는 주로 Markdown으로 글을 작성한다. 그러던 중 몇개월 전에 Mermaid라는 것을 알게 되었는데, 이를 티스토리에도 적용시키고자 한다. 1. 개요 Mermaid는 코드로 차트를 그릴 수 있도록 해주는 오픈소스이다. 공식 문서가 매우 친절하게 작성되어 있기에 Mermaid에 대해서 자세히 설명하진 않겠다. 관심 있다면 Mermaid 링크를 클릭해서 보시라. Markdown으로 코드를 작성할 때, 다음과 같이 mermaid라는 언어로 지정하면 차트를 그릴 수 있다. Markdown에서 작성한 mermaid 코드 ```mermaid pie title Pets adopted by volunteers "Dogs" : 386 "Cats" : 85 "Rats" : 15 ``` 위의 코드로 나타난..
Development/기타 MySQL 8.0 Replication (1) - Docker를 활용한 DBMS 서버 구축 들어가며 현재 회사에서는 Replication을 사용하지 않고, 단일 커넥션 풀로 관리하고 있다. 그러다보니, 동시 많은 요청이 들어오면(실제로 그리 많지도 않고, 약 100건 정도의 동시 요청이다) 데이터 조회 API 요청 시 응답 속도가 느려지는 이슈가 발생한다. 이를 해결하기 위해 DB 분산 처리에 대한 내용을 검색해 보던 중 MySQL Replication을 알게되었다. 이에 대해 공부하고 NestJS에 적용시켜 본 내용을 정리하여 작성하였다. 1. 개요 Replication은 복제를 의미하며, DBMS를 2대 이상으로 나누어 데이터를 저장하는 방식을 뜻한다. 이를 통해 실시간 Data 백업과 여러 대의 DB 분산 처리를 할 수 있다. 자세히 설명하기 전에 구조 먼저 알아보자. 1.1. 기본 구성..
Development/기타 Git Submodule을 활용한 공통모듈 관리 들어가며 커리어를 백엔드 개발자로 바꾼지 어느덧 1년이 훌쩍 지났다. 작은 스타트업에서 근무하는 동안 다양한 이슈들이 많았고, 개선하고 싶은 것들도 무수히 많이 쌓여간 반면, 바쁘다는 핑계로 블로그 글은 제대로 작성하지 못했다. 연속되는 신규 기능 업데이트, 전혀 반갑지 않은 버그 픽스, 개발 외 다른 업무 처리 등으로 정말 바쁘긴 빴다... 현재 내가 근무하는 곳은 명확한 업무 프로세스 또는 체계가 없고, 개발적으로만 보더라도 개선하고 싶은 점들이 정말 많다. 혹자는 이런점들이 스타트업의 단점이라고 하고 나 또한 그리 생각하나, 전화위복이라 하지 않았는가? 제대로 된 실적과 실력만 증명한다면 내가 그리던 시스템을 이곳에 적용시켜보고, 그 과정에서 스스로 성장하기 위한 매우 좋은 밑거름이 될 수 있다고 ..
기타 MacOS(맥북) M1, M2로 디아블로 실행하는 방법 들어가며 2023년 6월 6일, 블리자드는 디아블로 4를 공식 오픈했다. 디아블로 오픈 전, MacOS도 지원한다는 찌라시를 어디선가 듣고 설치하려 했으나, 역시나 MacOS를 지원하지 않았다. Macbook Pro 14 M2(RAM 16GB, SSD 1TB)를 구입한지 얼마 안 되어서 Windows PC를 구입하기에는 꽤나 부담스러운 취미가 될 것 같았다. 그러던 찰나에, 문득 "Macbook에서 Windows 프로그램을 실행시킬 수 있지 않나?"라는 물음표가 머릿속에 맴돌았다. 폭풍 구글링 후 약 12시간 정도 걸린 삽질 끝에 현재 맥북으로 디아블로 4를 실행할 수 있게 되었다. 오늘은 이 경험을 토대로 맥북에서 디아블로 4를 실행할 수 있는 방법에 대해서 기술하려고 한다. 설치 과정이 결코 간단하지..
Development/Web [AWS] NestJS & Elastic Beanstalk CI/CD 구축 들어가며 CI/CD 툴에는 Jenkins, Travis, Circle CI 등 다양하게 있지만, 나는 주로 Github Action을 이용하는데, 그 이유는 매우 간편하기 때문이다(위에서 언급한 다양한 CI/CD 툴은 나중에 직접 사용해보고 블로그에 정리하겠다). EB를 선택한 이유 AWS에서 배포 서버를 구축하는 방법으로는 EC2(+ CodeDeploy), Elastic Container Service(ECS), Elastic Beanstalk(EB) 등 다양하게 있다. AWS EB를 알기 전까지는 주로 EC2 인스턴스에서 CodeDeploy를 통해 배포하곤 했는데, Node.js, CodeDeployAgent를 설치하는데 소요되는 시간이 결코 적지 않았다. 따라서, 코드 작성에 조금 더 집중하기 위해..
Development/JavaScript Javascript의 병렬 처리에 관한 견해(동기, 비동기, blocking, non-blocking) 개념 정리 개요 Javascript를 공부해본 사람이라면 단일 쓰레드, 콜백, 비동기, 병렬처리에 대한 내용을 접해본 경험이 있을 것이다. 위의 용어 자체가 추상적이기도 하고, 쉽게 와닿지 않기 때문에 단번에 이해하기에는 꽤 어려운 개념일수도 있는데, 사실 위에서 언급 내용은 모두 연관성이 있기 때문에 Javascript의 동작 방식을 이해하고 나면 전체적인 그림이 그려질 것이라 생각한다. 이번 글은 100% 정확한 사실에 기반한 내용을 정리한 것이 아니라는 점을 참고하기 바란다. 병렬처리에 대한 주관적인 생각 구글링을 하다보면, 'Javascript는 병렬적으로 수행된다'라는 내용을 가끔 확인할 수 있다. 이 내용을 처음 보았을 때에는 '그런가보다'하며 넘어갔었는데, 단일 쓰레드, 콜..
Development/JavaScript JavaScript 위치 및 async/defer 속성에 따른 HTML 렌더링 효율성 위치에 따른 렌더링 시간 웹 브라우저의 역할은 서버로부터 웹 페이지를 이루고 있는 여러 파일을 전달(다운로드) 받은 후 HTML 문서를 위에서부터 한 줄씩 읽으며(parsing) 화면에 보여주는 것이라고 할 수 있다. HTML 파일에는 CSS, JavaScript와 같은 여러 파일이 링크된 상태로 포함되어 있는데, 이러한 파일들은 해당 파일을 링크하는 코드가 읽힌 후 다운로드 된다. 먼저, 웹 브라우저는 이 경우에는 웹 브라우저가 HTML 파싱을 모두 마친 후 JavaScript 파일을 다운로드하기 때문에 앞의 상황에 비해 훨씬 빠르게 웹 페이지를 화면에 나타낼 수 있다. 그러나, 해당 웹 사이트의 주된 컨텐츠가 JavaScript를 통해 생성되는 등 JavaScript에 의존적인 경우 정상적인 웹 페이..

티스토리툴바