이번년에도 토스 개발자 컨퍼런스가 진행된다고 하네용<a target="_blank" rel="noopener noreferrer nofollow" href="https://toss.im/slash-24">https://toss.im/slash-24</a>요기서 참가 신청 가능합니다!<img src="https://image.until.blog/rolldeep-stepmerrily/article/1724388525975" alt="until-1264">작년에도 가보고 싶었는데 일정이 안되어서 못갔거던여 ㅇㅅㅇ;이번에는 꼭 가보고 싶네요! 시간표 공유 이벤트도 있어서 아래에 제 시간표 공유도 하겠슴다!<img src="https://image.until.blog/rolldeep-stepmerrily/article/1724388578718" alt="until-1265">넘나 설레는것이애오~

이번년에도 토스 개발자 컨퍼런스가 진행된다고 하네용https://toss.im/slash-24요기서 참가 신청 가능합니다!작년에도 가보고 싶었는데 일정이 안되어서 못갔거던여 ㅇㅅㅇ;이번에는 꼭 가보고 싶네요! 시간표 공유 이벤트도 있어서 아래에 제 시간표 공유도 하겠슴다!넘나 설레는것이애오~

토스 개발자 컨퍼런스 SLASH-24:

C++ Code

CI/CD

<blockquote>Cloudflare를 이용해 Vercel 커스텀 도메인을 설정하는 과정에서 "리디렉션한 횟수가 너무 많습니다" 라는 에러가 발생했고 이 문제를 해결하는 방법에 대해 다룬다.</blockquote><img src="https://image.until.blog/xeros/article/1727225490739.png" alt="until-1516"><h3>문제 원인</h3>Cloudflare와 Vercel간의 SSL 설정 충돌에 의해 발생하는 문제이다.Cloudflare는 SSL/TLS 암호화를 제공하며, Vercel도 자체적으로 SSL을 제공한다. 따라서 두 서비스간의 서로 양립된 SSL 설정으로 인한 설정 불일치가 리디렉션 문제를 야기하는것으로 보인다.<h3>해결 방법</h3><a target="_blank" rel="noopener noreferrer nofollow" href="https://vercel.com/docs/integrations/external-platforms/cloudflare">Cloudflare와 연동하는 방법이 기술되어있는 Vercel 공식 문서</a>이 문제를 해결하기 위해서는 Cloudflare의 SSL/TLS 설정을 수정해야 한다. 기본적으로 Cloudflare는 SSL 설정을 자동으로 관리하지만, Vercel과 연동해서 사용하기 위해서는 수동으로 전체 암호화 모드로 변경해 주어야 한다.<img src="https://image.until.blog/xeros/article/1727225713844.png" alt="until-1517"><ol><li>Cloudflare 대시보드에 로그인</li><li>SSL/TLS 메뉴로 이동</li><li>"암호화 모드" 옵션을 찾는다.</li><li>"전체 (Full)" 모드로 변경</li></ol>

Vercel 커스텀 도메인을 Cloudflare에서 설정하는 도중 발생한 리디렉션 오류를 수정하는 방법에 대해 소개한다.

Cloudflare와 Vercel 연동시 리디렉션 오류를 해결하는 방법

discord-bot-dev

<h3>Prologue</h3>초기 목표는 자주 사용하는 기능을 나만의 서버에서 사용하는 것으로 시작해 티켓의 개수를 입력하면 예상 보상을 출력해주는 디스코드 봇을 제작하였다. 그러다 서버로 이용했던 사이트의 아쉬운 성능과 해당 게임에 대한 관심이 떨어지며 자연스레 방치하게 되었고 디스코드 서버가 사라지며 정리를 하게 되었다. 그러다 다시금 찾게 된 게임을 통해 만난 사람들과 디스코드 서버를 꾸렸고 과거의 기억을 십분 발휘해 다시 봇을 개발하게 되었다.GIthub에 있는 과거의 코드를 통해 기억을 떠올렸으나 그 동안의 기간동안 버전이 많이 바뀌었다. 미리 선언한 전치사를 통해 명령어와 일반 채팅을 구분했던 디스코드에서 <code spellcheck="false">/</code> 전치사 통일로 바뀌었고, 해당 디스코드의 봇의 명령어를 미리 보여주는 기능이 생겼다.첫 봇에 제작하는 데 있어 난관이던 것은 게임사의 api가 제공되지 않아 사이트의 해당 기능을 크롤링을 해야했던 것이었다. 하지만 지금은 이미 제공되고 있는 기능으로 게임 속 다양한 부분, 요소들을 확인할 수 있었다.그렇게 빌고 빌었던 api는 우습게도 사용하기가 막막했다. 맨 땅에 헤딩식으로 했던 나의 공부 깊이는 너무나도 얕았던 것이다. 처음 사이트를 확인하고 벅찬 감정은 사라지고 이걸 어떻게 사용해야하는지를 한참이나 검색했다. 어찌저찌 찾아보고 코드를 짜 첫 원하는 결과물을 얻었을 때, 그 때의 기분은 잊을 수 없다. 막막했던 내게 힘껏 움직일 원동력이 되었다.<hr><h3>Goal</h3>캐릭터의 정보를 알 수 있는 기능을 디스코드 봇 명령어에 담고 싶었다. 단순하게 <code spellcheck="false">명령어와 캐릭터의 닉네임을 입력</code>하면 <code spellcheck="false">해당 캐릭터의 정보가 출력</code>되게끔 제작하는 것이 목표였다.해당 기능을 위해 axios를 사용하였다.<pre spellcheck="false"><code class="language-javascript">// components/axiosApiInstance.js
const axios = require('axios');
const dotenv = require('dotenv');

dotenv.config();

function axiosApiInstance(url){
 const axiosInstance = axios.create({
 baseURL: `${process.env.API_URL}${url}`,
 headers: {
 Accept: 'application/json',
 Authorization: `Bearer ${process.env.API_KEY}`
 }
 });
 return axiosInstance;
}

module.exports = axiosApiInstance;</code></pre>추후 다른 컴포넌트에서 반복적으로 사용될 것이라는 생각으로 따로 <code spellcheck="false">인스턴스</code>를 만들어 제작했다.<pre spellcheck="false"><code class="language-javascript">// components/research.js
const instance = require('./axiosApiInstance');

async function research(userNickName){
 try{
 const url = `...url/${userNickName}`;
 const inst = await instance(url);
 const res = await inst.get();
 return res.status === 200 ? await res.data : null;
 }catch(err){
 console.log(err);
 }
}

module.exports = research;</code></pre>코드의 결과는 JSON 형식의 파일로 요청대로 캐릭터에 대한 정보가 담겨 있었다. 아이템, 레벨, 직업 등등 정보를 담고 있었지만 세부적인 데이터는 문자열 타입으로 html 태그들과 뒤죽박죽 섞여있었다.<hr><h3>Regexp</h3>대학생 당시에 엉뚱하게 꽂히는 것이 있다면 수업, 학점 모두 신경쓰지 않고 몰두했었다. 정규 표현식 역시 한 때 이상하게 집착하고 찾아봤던 적이있었다. 그 때만 하더라도 이걸 어디에 사용할 지도 몰랐었는데 이번에 사용하게 되었다.<img src="https://image.until.blog/bakcy/article/1727161035482.png" alt="until-1462"><pre spellcheck="false"><code class="language-javascript">// components/regexp.js
export default function regexp(string){
 const str = /(&lt;([^&gt;]+)&gt;[\s]*)/gi;
 return string.replace(str, '');
}</code></pre>섞여있던 html 태그들을 지워 세부적인 정보들을 객체의 하위 데이터로 사용할 수 있도록 만들 수 있었다.<hr><h3>Object</h3>해당 객체에 정보들은 캐릭터의 성장치마다 다르게 출력되었다. 해당 성장치가 높으면 높을 수록 더 많은 양의 정보를 담고 있었다. <pre spellcheck="false"><code class="language-json">...
"Tooltip": {
 "Element_000": {
 "Type": "NameTagBox",
 "value": "+00 itemName"
 },
 "Element_001": {
 "type": "itemTitle",
 "value": {
 "bEquip": 0,
 "leftStr0": "itemGrade",
 "leftStr1": "itemQuality",
 ...
 }
 },
 "Element_002": { ... },
 ...
}</code></pre>해당 게임의 특성상 무기와 방어구 5종에 부여되는 특수한 옵션들을 표시해야하는 상황 속에서, 어떤 경우에는 <code spellcheck="false">Element_007</code> 그리고 또 어떤 경우에는 <code spellcheck="false">Element_009</code> 처럼 고정된 하나의 키값을 사용할 수 없었다.

Discord.js #1

<ul><li>os : macOS</li></ul><pre spellcheck="false"><code># 독시젠 설치
brew install doxygen

# 설정파일 생성
doxygen -g Doxyfile 

# 독시젠 문서 생성
doxygen Doxyfile</code></pre><h2>Doxyfile 설정</h2>문서 생성하기 전에 <code spellcheck="false">Doxyfile</code> 에서 다음과 같이 설정.<pre spellcheck="false"><code>PROJECT_NAME = "Example Project"
INPUT = ./example.h
RECURSIVE = NO
OUTPUT_DIRECTORY = ./docs
GENERATE_HTML = YES</code></pre><ul><li><code spellcheck="false">PROJECT_NAME</code><ul><li>생성되는 문서의 프로젝트 이름을 지정.</li></ul></li><li><code spellcheck="false">INPUT</code><ul><li>문서화할 파일이나 폴더의 경로를 지정.</li></ul></li><li><code spellcheck="false">RECURSIVE</code><ul><li>INPUT으로 지정된 폴더 내에 있는 파일을 서브폴더까지 포함하여 재귀적으로 검색할지 여부.</li><li><code spellcheck="false">NO</code> : INPUT 폴더의 최상위 파일만 문서화에 포함.</li><li><code spellcheck="false">YES</code> : 지정된 폴더의 모든 하위 폴더까지 포함하여 파일을 찾음.</li></ul></li><li><code spellcheck="false">OUTPUT_DIRECTORY</code><ul><li>Doxygen이 생성한 문서 파일이 저장될 경로.</li></ul></li><li><code spellcheck="false">GENERATE_HTML</code><ul><li>HTML 형식의 문서 생성을 활성화할지 여부.</li><li><code spellcheck="false">YES</code> : HTML 문서가 생성</li><li><code spellcheck="false">NO</code> : 생성되지 않음.</li></ul></li></ul>

Doxyfile 설정을 통한 C++ 프로젝트 문서화 가이드

C++ Docs with Doxygen 📘

Doxyfile 설정