본문으로 건너뛰기

· 약 5분
brown

Intro

블로그 만든지 1달 정도 되었나...?

깜짝 놀랄만한 일이 생겼다.

솔직히 본인이 유명인도 아니고! 홍보를 하는 것도 아니고!! 그렇다고 대단한 글을 작성하는 것도 아닌데!!!

생각보다 많은 분들이 이 블로그를 봐주신 것이다!!!!! 😎

searchConsole ga

모든 콘텐츠가 한국어 인데 why...?

Thanks!!!

도대체 어떻게 알고 봤는지 신기하기만 하다.

그래서 생각하고 있던 docusaurus 작업 중

  1. 검색 붙이기
  2. 테마 수정하기
  3. 메인 수정하기

검색 붙이기를 하면서 + 후기를 남긴다.

DocSearch

알게 된 것은 친구의 블로그 덕분이다.

dgle

아니 저 기능 뭐지 탐난다...! 라는 생각으로 작업했다.

1. 공식문서 체크

docusaurus알골리아 DocSearch에 대한 최고 수준의 지원을 제공합니다.

2. apply docsearch program

서비스는 모든 오픈 소스 프로젝트에 대해 무료입니다.
대상 여부를 확인하고 DocSearch 프로그램에 지원하세요.

docsearch program에 등록해본다.

본인 블로그는 아직 빌딩단계라서 해당없다는 회신을 받았는데, 딱히 상관은 없다.

3. 알고리아 회원가입

algolia에서 회원 가입을 진행해준다.

4. create application

어플리케이션을 생성해주는데

app

  1. app 이름 적고
  2. 꼭 FREE Plan을 선택하자!!
  3. data는 샘플데이터 같은 것 넣으면 된다.
  4. index name 은 사용하는 값이다.

5. API Key 체크

overview 화면에서 API Keys를 누르자

사용하는 key는 Application ID,Search-Only API Key,Admin API Key이다.

6. Data crawling

최신 권장방식 문서이다.

본인은 아래의 방법을 사용했다.

이 방식은 Legacy 입니다!

관련 문서

  1. 이 단계에서는 도커 이미지를 통한 데이터 크롤링을 위해 docker, jq가 설치 되어 있어야 한다.

    • brew install --cask docker
    • brew install jq
  2. .env 작성 환경 변수를 작성해야 한다.

    APPLICATION_ID=어플아이디
    API_KEY=어드민키
  3. project 최상단에 config.json 작성 참조 링크 index_name, start_urls,sitemap_urls만 본인에 맡게 변경하시라.

    {
    "index_name": "braurus", // 1
    "start_urls": ["https://braurus.dev/"], // 2
    "sitemap_urls": ["https://braurus.dev/sitemap.xml"], // 3
    "sitemap_alternate_links": true,
    "stop_urls": ["/tests"],
    "selectors": {
    "lvl0": {
    "selector": "(//ul[contains(@class,'menu__list')]//a[contains(@class, 'menu__link menu__link--sublist menu__link--active')]/text() | //nav[contains(@class, 'navbar')]//a[contains(@class, 'navbar__link--active')]/text())[last()]",
    "type": "xpath",
    "global": true,
    "default_value": "Documentation"
    },
    "lvl1": "header h1",
    "lvl2": "article h2",
    "lvl3": "article h3",
    "lvl4": "article h4",
    "lvl5": "article h5, article td:first-child",
    "lvl6": "article h6",
    "text": "article p, article li, article td:last-child"
    },
    "strip_chars": " .,;:#",
    "custom_settings": {
    "separatorsToIndex": "_",
    "attributesForFaceting": ["language", "version", "type", "docusaurus_tag"],
    "attributesToRetrieve": [
    "hierarchy",
    "content",
    "anchor",
    "url",
    "url_without_anchor",
    "type"
    ]
    }
    }
  4. 스크래퍼 이미지 실행
    docker run -it --env-file=.env -e "CONFIG=$(cat ./config.json | jq -r tostring)" algolia/docsearch-scraper

  5. 알고리아 본인 앱 화면에 보면 데이터가 갱신 되어 있을 것이다.

7. docusaurus.config.js

이 문서를 참조 하자!

// 본인 코드
...
algolia: {
// 알골리아에서 제공한 appId를 사용하세요.
appId: "BW2ZDYYT4N",
// 공개 API 키: 커밋해도 문제가 생기지 않습니다.
apiKey: "4a0c2546c188aacd5f5277a7a9b34896",
indexName: "braurus",
contextualSearch: true,
},
...

드디어 완성이다.

searchBtn


검색기능을 붙이고 이 글을 쓰기까지 생각보다 시간이 걸렸지만, 누가 볼 수도 있다고 생각하니 살짝 기대 된다.



Reference

· 약 8분
brown

서론


시간은 모두에게 공평하다. 하루 24시간 그 이상을 사용하는 사람도, 그 이하를 사용하는 사람도 없다.

세상은 불공평하지만, 시간은 공평하고 개인이 할 수 있는 최선은 본인에게 주어진 시간을 최대한 효율적으로 쓰는 것이다.

하지만 시간을 잘 활용하는 것은 어렵다. 30년 동안 살면서 본인의 행동에서, 혹은 학창시절, 대학시절등 주변에서 느낀 것은, 이 사람이 열심히 사는구나 싶은 사람은 사실 100명중 10 ~ 15명정도였다.

본인은 열심히 사는 사람 옆에 열심히 살지 않는 사람이었고, 중고딩시절에 게임만 했다.

그리고 대학교 입학하고도 학점 관리도 안하고 25살 까지는 해놓은 것도 없이, 하고 싶은 것도 없이 놀았었다.

그러다 26살에 미래에 대한 위기감 + 해외취업을 한번 해봐야겠다는 목표로 토익점수 900 이상 올리고, 학교에서 진행했던 어학연수도 가고, 무역관련 자격증들도 따고 k-move 프로그램으로 결국 취업도 했었다.

그렇게 짧은 직장생활을 잠깐 했는데, 뭔가 일반 사무직은 전문성이 약한것(개인적인 의견) 같았고, 해외에서 일하기에 개발자가 좋을 것 같아서 20년 6월부터 개발공부를 본격적으로 시작해서 21년 6월 8일에 개발자로 커리어 전환을 시작 할 수 있었다.

서론이 장황했는데 26살 부터는 나름 인생을 열심히 살려고 노력했었고, 갈수록 더 열심히 살고 있다.

사실 열심히 살 수 밖에 없는 것 같다. 시간은 흐르고 나이는 먹는데 뭐라도 하지 않으면 뒤쳐질테니까. 학창시절에 지금처럼 살았으면 훨씬 잘됐을 것 같지만, 그땐 몰랐지


시간 관리


열심히 사는 것의 첫 번째는 시간관리라고 생각한다.

시간관리에 대해 신경쓰지 않으면 하루에 날리는 시간이 생각보다 많고, 나이 먹을수록 시간은 더 빨리간다.

첫 번째 스텝은 그렇게 흐르는 시간들을 체크하고 최대한 줄이는 것이다. 특별한 것은 없다.

다만 그 순간의 귀찮음, 하기 싫음 등을 컨트롤 하는 것이 필요한데, 그러한 감정들은 일시적이라는 것을 명심하면 된다.

두 번째 스텝은 일상을 단순화 하는 것이다.

불필요한 일들은 하지 않고, 내가 알 필요 없는 것들을 알려고 노력하지 말자.

물론 사람은 기계가 아니다. 모든 시간을 자기계발에 쏟을 수 없고 휴식 시간은 꼭 필요하다.

본인은 사람이 하루에 할 수 있는 일의 양, 집중시간등에 한계가 있다고 믿기때문에, 일상을 단순화 하는 것만으로도 시간관리에 큰 효과를 준다고 생각한다. 그래서 자동화를 좋아한다


생산성 관리


개인적으로 느끼기에, 본인은 하루에 많은 시간을 개발에 쏟고 있다고 느낀다.

직장인으로서 개발하는게 일이고, 그외의 시간에도 자체 야근 😵, 개발 학습, PS 등 딴에 열심히 하려고 노력하고 있다.

잘하는 개발자가 되고 싶으니까. 돈도 많이 벌면 더 좋고 😎

어짜피 인생은 100명중에서 노력하는 15명 안쪽에서 경쟁하는 것이다.

개발자 직군은 아무래도 공부를 많이하는 성향의 사람들이 할 확률이 높으니 개발자의 30% 라고 가정해보자.

이 레벨에서는 업무역량향상을 위해 시간을 투자하는 것은 기본이다.

투자한 시간(input)대비 얼마만큼의 생산성(output)을 뽑아내는가가 차이를 만들어낸다고 생각한다.

그래서 어떻게 해야 생산성을 올릴 수 있을까?

시간 대비 많은 결과물을 내고, 많은 분량의 학습을 소화할 수 있을까?

이것이 요즘 난제다.

그래서 느낌 오는 컨텐츠들을 정리 해봤다.

물론 시간관리 + 생산성관리까지 한다고 엄청 높은 위치까지 올라간다는 보장은 없다.

학습에도 선천적인 역량 차이가 있다고 믿기 때문이다.

그럼에도 불구하고, 우리가 노력해야 하는 이유는 대부분의 사람들은 비슷비슷하고 그 사람들 앞에서는 설 수 있기 때문이다.

헬스쪽에는 자신의 유전자내에서, 최대를 뽑아내는 것이 가장 멋진 것이라는 말이 있다.

요즘 삘 받아서 열심히 살려고 계속 노력하고 있는데, 언제쯤 번아웃이 올지 기대된다.


obsidian custom

옵시디언 처음 쓰시는 분들 첫 세팅할 때 쓰시면 좋을 것 같습니다.

obsidian-template

· 약 5분
brown

1편에서 이어집니다

역시 이런건 작업하면서, 글도 써야한다.

이틀밖에 안됐는데 가물가물...

4. domain 구매

배포 및 호스팅은 vercel 에서 알아서 해준다. awesome!

도메인을 설정하려면 당연하게도 도메인을 사야하는데, 중요한 것은 어디서 살 것 인가이다.

처음에는 그냥 국내업체에서 구매할까 했지만, 아는 사람한데 물어보고 검색 좀 해보니까

해외 도메인 업체를 이용하는 것으로 그 중에서도 porkbun 으로 결정했다.

why? -> 제일 싸니까

도메인은 고민 끝에 brown + docusaurus = braurus

거기에 개발자 티내야 하니까 braurus.dev로 결정해서 구매했다.

구매하는 방법은

  1. 회원가입
  2. 도메인을 선택
  3. 결제

본인은 카드도 오직 체크카드, 그것도 국내결제 밖에 안되는 카드인데!?

라고 생각하면서 진행했는데, 구글 결제 선택하니까 알아서 플레이스토어로 어떻게 결제가 되더라.

그렇게 생각보다 싸게 도메인을 일단 2년치로 구매했다.

5. domain assign by vercel

개인 도메인을 구입했다면, vercel 프로젝트 세팅의, domain에서 등록하고 그냥 하라는대로 하면 된다.

  1. DNS RECORDS 세팅 ~~2. NAMESERVERS -> 포크번 디폴트 네임서버를 버셀 네임서버로 변경 ns1.vercel-dns.com
    ns2.vercel-dns.com

버셀 네임서버로 변경하고 버셀에 레코드 등록하니까 search-console에서 인증이 안됌

6. GTAG

개인 도메인을 붙여놓으니, 물론 아무도 안보겠지만 정말 아무도 안보는지 매우 궁금해졌다.

그런고로 GTAG를 달아야겠다!

  1. 링크로 들어가서 gtag를 만들고 측정 ID 저장

docusaurus 에서는 gtag 관련 플러그인을 제공해준다.

  1. npm install --save @docusaurus/plugin-google-gtag 로 설치를 하고,
  2. docusaurus.config.js에서 위의 측정 ID를 설정하면 끝

gtag 추적 아이디는 어짜피 사이트에서 다 보이니 굳이 감출 필요는 없는 것 같다.

측정 ID스트림 URL 일치가 중요!

잘 등록되면 저렇게 뜬다.

gtag

7. Search Console

하는 김에, search console도 해보자!

도메인을 산 사람들은 왼쪽이다. 본인의 도메인을 넣고 누르면 DNS 레코드를 통해 도메인 소유권을 확인하라고 하는데 어렵지 않다.

그냥 등록하면 끝인 작업인데, 도메인은 포크번에서 구입하고, 버셀네임서버로 변경한 뒤 버셀에다 등록하니까 도메인 소유권 인증이 안되더라. 포크번 네임서버로 변경하고 거기다 등록하니 마무리 되었다.

google search

참고로 구글 애널리틱스, 서치 콘솔 둘다 등록 하면 search console insights라는 페이지를 볼 수 있다.

8. sitemap

사이트 맵 주소는 $address/sitemap.xml이다 docusaurus.config.js 에 url을 본인 도메인으로 변경해주고, search console에 제출하자.

· 약 3분
brown

1. blog를 시작해보자

블로그를 시작하자 라는 구체적인 영감을 받은 것은 퇴직한 동료개발자가 러브콜을 받는 모습을 봤을 때이다. 나도 노력한 증거를 남겨야지

왜 노력한 증거를 남기는 방식이 블로그인가?

만만해서, 이참에 글 쓰는 연습을 해보려고

2. docusaurus 세팅

수많은 static site 생성 tool(Jekyll, Gatsby... )중에서 왜 docusaurus 인가?

선임개발자였던 luke의 추천 facebook에서 만들어서 트렌디해보여서? 😎 너무 쉽게 나름 이쁜 블로그가 생겨버려서

docusaurus 는 그냥 문서보고 하면 된다. 심지어 번역도 되어있고 쉽다. 사실 글 작성외에 아직 기본 세팅에서 바꿔본게 없다...

3. deployment by vercel

이것도 정말 미쳤다. workflow도 작성할 필요없이 그냥 레포지토리만 등록하니까, defalut branch에 push만 하면 자동으로 배포된다.

client-docusaurus-brown2243.vercel.app 이런 식으로 서브 도메인으로 제공해준다.

여기까지의 상태로 3주 정도 쓰고 있었다. 어짜피 처음 블로그를 개설하고 글 몇개 쓴다고 갑자기 방문자들이 엄청 생기는 건 아니니까 천천히 개선해 나갈 생각이었다.

그런데 obsidian 을 이쁘게 세팅하고 나니, 블로그의 글이 너무 밋밋해 보이는 문제가 생겼다.

blog

img1

obsidian

img1 그래서 블로그 초기 세팅 작업을 하려고 한다. blog 초기 setting 후기2로 계속


8월 2주차 주 회고

뭔가 글을 잘 안쓸 것 같고, 주제도 별로 없을 것 같아 주 회고는 반드시 작성해야지 라는 취지로 주 회고를 기획 했는데 생각보다 쓸게 많고 재밌다.

이번주에 글을 4편이나 작성해서 , 주 회고를 따로 쓰기보단 묶어서 쓴다.

나름 열심히 보낸 일주일이었고, 앞으로도 Keep going 해봐야지!

· 약 4분
brown

Obsidian theme custom 후기

최근 판교뚜벅초님 영상을 보고 옵시디언에 꽂혔다.

올려보자 나의 생산성... 제발!!!

그러면서 옵시디언 사용법 + 제텔카스텐에 대한 글을 하나 써보려 했는데...

obsidian 기본 테마도 나름 괜찮지만 새로운 테마를 적용하고, 커스텀한 후기를 먼저 작성하려고 한다.

이거는 지금 안쓰면 잊어먹는다...

obsidianate theme

open settings -> appearance -> theme 보면 사람들이 올려 놓은 테마를 볼 수 있다.

본인의 눈에는 그 중에서 obsidianate가 젤 이뻐서 다운 받았다.

warp 와 느낌이 유사한게 아주 마음에 들었다.

막상 사용해보니 아쉬운 점이 보이더라

  • [] 가 보이지가 않는다(link 작성할 때 불편)
  • 에디터 모드의 [] 안에 붉은 색 라인이 별로다.
  • strong 그라디언트가 내눈에 별로다.
  • 그외...

그러니까 이 글은 obsidianate 커스텀 글이다.

필자는 옵시디언을 안지도 1주일이 안됐고, css는 어제 오늘 합쳐 이틀 커스텀 했다. 고로 초급자용 글이다.

css 파일 등록

.obsidian/snippets경로에 css파일 생성 open settings -> appearance -> css snippet 옵션에서 플러그인 처럼 css로 켜주어야 한다.

켜줘야 하는 걸 간과해서, 안되는 줄 알고 리로딩 엄청 했었다... 삽질 😵

본인이 작성한 css파일이든, $theme.css 파일이든 수정하면 바로 적용 된다.

어떻게 바꿀 것인가

  1. 설치한 theme의 깃허브를 체크해라

    • 어떻게 변경 하라는 건지에 대한 내용이 있으면, Thanks
    • .obsidian/themes 폴더안에 $theme.css 가 아마 있을 것이다.
    • $theme.css 파일을 분석하다보면 느낌온다.
    • obsidianate github
  2. obsidian에 어떻게 custom css를 적용하는지 체크해라

위 사항은 공통이고 아래는 본인이 작업한 방식이다.

  1. colorhunt에서 원하는 색조합을 찾았다.
  2. 변수 세팅하고 노가다 시작...!

옵시디언은 오픈 소스가 아니다.

그러므로 내가 잘못 안것이 아니면 위의 1,2번 을 보고 뭐랄까 장님 코끼리만지듯 진행해야 한다.

img1

img2

  1. .workspace

  2. .side-dock-ribbon

  3. workspace-leaf

    • .workspace-leaf-content[data-type="search"] 이런 식으로 개별 leaf를 선택할 수 있지만 명칭을 알 수가 없다 ㅋㅋ;
    • .workspace-leaf.mod-active 로 클릭 상태 시 css 처리
  4. nav folder ~~~

알아내고 변경했던 섹션 클래스들은 위처럼 되어 있고, 개별 part들은 obsidian css 여기서 찾으면 쉽게 변경 할 수 있다.

이글을 작성하는 현재 상태 너무 빤딱빤딱한가..? img3

obsidian-template

작성한 커스텀 css 및 shortcut을 나름 vscode 처럼 맞춘 obsidian-template repo를 참고해주시라!!!

· 약 2분
brown

Nextjs Error Boundary 적용기

신생 프로젝트를 작업하면 이것저것 할게 많다. 그래서 많이 배운다.

ErrorBoundary 적용해야 한다고 생각 했지만, 더 시급한 업무 때문에 우선 순위에서 약간 밀려있었다.

그러다 테스트 환경에서 사파리로 특정 페이지 접속 시 에러가 뜬다는 소식을 들었다.

결론부터 말하자면 원인은 Array.prototype.at() 때문이었다.

최신 문법이라서 브라우저 호환성을 체크 했어야 했는데...! 😵

그래서 관련 부분 수정을 하고, 이참에 아래의 방식으로 ErrorBoundary를 작업 했다.

  1. 공식문서 체크
    내용중에서 이러한 부분이 있다.
    To use Error Boundaries for your Next.js application, you must create a class component ErrorBoundary
    클래스 컴포넌트 써본 지 1년은 넘은 것 같은데 + 예시코드가 jsx밖에 없네...
  2. TS 예시코드 체크
    서치를 해보니 해당 링크에 원하는 예시 코드가 있었다.

그런데 바로 설득 당했다.

Option 1: Using react-error-boundary React-error-boundary - is a lightweight package ready to use for this scenario with TS support built-in. This approach also lets you avoid class components that are not that popular anymore.

이렇게 react-error-boundary를 적용했다.

딱히 설명 할 것도 없이 보고 하면 된다.

· 약 4분
brown

8월 1주차 회고(Weekly Retrospective)

사내 프로젝트의 2주 스프린트를 마무리했고, 무중단배포 기능과 상품 상세 페이지를 배포 했다.

개인적으로 아쉬운 것은 기존에 넣기로 했던 상품관련 차트를 넣지 못한 것이다.

특정 차트를 D3로 구현하라는 요구사항이었는데, 여기서 나의 실수는 D3 라이브러리에 대해 잘 모르면서 알겠다고 동의를 한 부분이다.

기존에 거래소일때 trading-view 라이브러리, chartjs등을 사용해봤고, 간단한 차트는 캔버스로 그려도 봤으니 사실 쉽게 생각했었다.

그런데 라이브러리를 설치해서 사용해보고, 알아볼수록 러닝커브가 생각보다 훨씬 높았다. 예전 취준 할 때 찍먹해본 threejs수준이 아닌가 😵 !

안그래도 메인프로젝트 + 어드민 + 기타 업무량이 많았는데, D3의 최소 1 ~ 2주를 요구하는 러닝커브에 굴복해서 결국 그 부분은 다르게 대체를 했다.

일은 일대로 열심히 했는데, 그렇게 마무리하니까 좀 찝찝한 마음이 남았다. 앞으로는 이러한 부분에서 더욱 확인을 하고 진행을 해야지.


일일커밋을 하겠다고는 생각 안했지만, 퇴근하고 뭔가 새로운 걸 학습 및 구현해보는 참 개발자가 되고싶은데 현실은 퇴근을 못하고 있다;;

기존에 둘이서 할 때도 그랬지만 지금은 혼자서 프론트단을 맡아서 하고 있다보니, 뭐랄까 내 개인 프로젝트가 아님에도 내 개인 프로젝트 같다.

회사 일은 업무시간 내에 처리하고 싶은데, 참 그게 쉽지 않은 것 같다. 그래서 개인 시간이 정말 팍팍하지만, 주 회고는 꾸준히 써야지!

docker-compose volume

docker에서 volumes으로 연결할 때는 꼭 경로를 폴더로 잡아줘야 한다.

경로를 파일로 잡아주면 파일 자체는 컨테이너에서 찾을 수 있지만, 컨테이너 외부에서 파일 내용을 변경해도 변경사항 전달이 안된다.

폴더로 잡아주면, 파일의 변경사항이 공유 된다.

· 약 5분
brown

첫 외주? 경험

오늘 아침에 일어나서 기묘한 이야기 시즌4 7화를 보다, 리액트 단톡방을 잠깐 보는데 아래의 메세지를 보았습니다.

**카카오맵 API관련 페이지 작업 해주실 분 구합니다 보수는 다음날 오전에 12만원 드립니다.**

뭔가 쉽고 재밌을 것 같아서 한다고 했습니다.

요청자는 졸업작품 작업 중인 대학생이셨습니다.
요청사항은 카카오맵 api로 검색해서 결과값들을 불러 놓는 것까지는 구현했는데, 그 값들의 버튼을 클릭했을 때, 다른 컴포넌트에 이동시키는 것이었습니다.

솔직히 듣자마자 전역 상태 관리 쓰면 바로 해결 될 것 같아서, 요청자와 협의 후 코드를 받아 작업 시작했습니다.

솔직히 놀랐습니다.

  • git 을 사용하지 않아 압축파일로 파일을 전달 받은 것
  • css 관리를 모듈조차 쓰지 않은 점
  • 전역 상태관리를 모르는 상태에서 데아터를 여기저기 옮기려 시도했어서 인지, 컴포넌트 구조가 엉망
  • 기타...

잘 모르는 상태에서 결과물을 내기위해 여기저기서 코드를 많이 가져오신 것 같았습니다.

검색어 입력시 카카오맵 API로 결과값들을 가져오는 부분은 잘 동작 했기 때문에, 그부분은 그냥 두고 상태관리 툴로 zustand 사용해 요구사항을 구현하고, 컴포넌트를 정리 하고, 불필요한 로직을 삭제 했습니다. css도 좀 정리하고 나니 2시간 정도 걸렸습니다.

그분도 처음이라 하셨는데, 저도 처음이어서 그런지 2시간 일하고 10만원 받는게 과한 것 같았습니다(사기?). 그래서 상대도 학생이고 8만원을 받겠다고 했는데, 요청자분이 페이지네이션기능도 요청 하시더군요. 그래서 페이지네이션, 결과 값 특정 컴포넌트에 추가,제거 , 추가 시 스크롤 이동 이것저것 기능을 넣다 보니 3시간 정도 추가로 작업 했습니다. 페이지네이션 컴포넌트를 예전에 만들어 놨던 걸 붙였는데, 카카오맵 API의 페이지네이션과 맞지 않아 거기서 시간을 좀 썼네요.

5시간에 10만원이면 시급 2만원, 회사에서 받는 돈이랑 같은 수준이지만 우연히 이런 경험도 해보고 회사 밖의 일로 돈을 벌었다는 것에 나름 신기 했습니다. 😎

요청사항보다 더 열심히 작업 해드렸는데 그분이 입소문 내줬으면 좋겠습니다. 😄

· 약 5분
brown

1주년 회고

생각해보면 정말 많은 일이 있었습니다.

2020년 6월부터 개발 공부를 시작해서 1년 간 정말 열심히 공부했고, 운이 좋아서 2021년 코인 거래소 관련 스타트업에 FE 개발자로 취업 했습니다.

  • 이벤트페이지의 일부를 작업해서 처음으로 배포되는 서비스에 기여
  • 수익률 html 캡쳐 기능(clipboardAPI)
  • 트레이딩 뷰 차트의 스크롤 로딩 구현
    • 그 당시, 한번만 요청하고 추가적인 요청을 넣지 않았음
  • 거래화면 UI 개편
  • 인증 관련 토큰 리프레쉬 로직 수정
    • 기존의 로직은 토큰을 리프레쉬하기 힘들었음
    • 사용자가 특정 시간이 지난 후, 유효한 토큰(access)을 사용하고 있을 때, 토큰을 리프레쉬해서 최소 사용시간을 보장
    • 차후, 401시 refresh 토큰으로 refresh 요청하고 api 재요청 하는 방식으로 변경
  • 특정 라이브러리(axios, dayjs...)들을 그냥 import 하는 방식에서 특정파일에서 import해서 관련 함수들을 만들고 관련 함수들을 사용해서 사용하도록 변경
  • 메인화면 UI 개편
  • redux 관련 코드개선
    • connect 함수 제거
    • 리렌더링을 최소화(useSelector 잘게 쓰기, 자주 변하는 데이터와 변하지 않는 데이터 따로 묶기)
  • react-router v5 -> v6 버전 업
  • 번역팩 자동화 기능
  • 거래 관련 로직 수정
  • 기타...

개발자로 첫 직장생활이라서 열정도 있었고, 거래소 관련 비즈니스에서 일하고 싶었었기에 1년동안 정말 즐겁게 회사를 다녔습니다. 유능한 개발자들도 많아서 비즈니스만 잘 되었으면 참 좋았을 텐데, Lxnacoin이 사망하게 되면서 이러저러한 이유로 거래소 프로젝트를 종료하게 되었습니다.

회사는 다른 비즈니스로 방향을 틀었지만 규모가 크지 않은 프로젝트였고, 이러저러한 이유로 많은 분들이 아쉽게 퇴사를 하셨습니다.

다행인 것은 최근에 한번 모임을 가졌는데, 나가신 분들이 다들 짧은 기간임에도 불구하고 좋은 회사들과 계약을 마치거나, 협상 중이라는 소식이었습니다.

저의 시선에서 유능한 사람들이 시장에서도 좋은 평가를 받는 것 같아서 기분이 좋으면서도, 내가 시장에 나가면 어떻게 될까에 대해 고민하게 되었습니다.

결론은 기존에 가지고 있던 나만 열심히 하면 되겠지라는 생각에서 노력한 증거를 남기고 공개하자는 것입니다.

앞으로

  1. WIL - weekly i learned
  2. 일일 커밋(에 준하는 꾸준한 커밋)

를 실천 할 예정입니다.