전체 글 142

2023 회고

내 인생에서 가장 변화가 많았던 아주 긴 한해를 돌아보며 작년 겨울에 매일 나왔던 도서관에 약 3달여만에 나와 올해 회고를 작성한다. 우테코 이후 쓴맛을 보고 추운 겨울을 보냈던 기억이 난다. 기분은 좀 나빴지만 뭐라도 되겠지라는 마인드로 걱정은 크게 없었다. 2023년을 이렇게 다이나믹하게 보낼 지는 상상조차 못했다. 선택에 갈림길에 여러번 놓였고, 합리적인 선택들을 이어가기 위해 노력했다. 돈벌이 스타트2023에 가장 큰 이벤트를 뽑으라 하면은 뭐니 뭐니 해도 취업일 것이다. 퀘스트 깨기 느낌으로 이곳 저곳 다 넣어봤던 것 같다.까먹고 안적은것도 많은데 생각보다 많은 기업에 지원했었다. 서류탈락은 크게 신경 안썼는데 면접 탈락 부터는 조금 힘들더라(멘탈적인 것보다 체력적으로) 보다시피 무지막지하게 탈..

회고 2023.12.31

[Typescript] decorator, reflect-metadata, javascript Reflect

최근 BFF코드를 작성하며 익숙하지 않은 문법을 접했다. 자바의 annotaion을 떠오르게 하는 문법이었는데 알고보니 Typescript의 decorator라는 문법이었다. 아직Typescript에서 실험적인 기능이기는 하나, 의존성 주입이 필요한 경우에 꽤나 꽨찮은 구성 방법인 것 같아 내용을 정리해보고자 한다. 현재(23년 10월) 기준 5.2 버전에서 정식으로 제공하고 있다 https://www.typescriptlang.org/docs/handbook/release-notes/typescript-5-2.html#decorator-metadata 이전 버전에서는 실험적인 기능이기 때문에 tsconfig.json에서 experimentDecorators 컴파일러 옵션을 활성화해줘야 한다. { "co..

Typescript 2023.11.05

2023 팀네이버 공채 합격 후기 (feat. 나의 취준 여행기)

이 글을 쓸까말까 고민했지만 나도 무한 구글링을 한 입장에서 누군가에게 도움이 되길 바라며 적어본다. 제목은 유입률을 높이기 위해 합격한 회사를 적었지만 내가 어떻게 취준을 했는지도 끼워넣을려고 한다. 자소서 [필수] 1. 본 직군으로 지원을 결정하시게 된 계기와, 앞으로 팀네이버에서 어떻게 성장하고 싶은지 작성해 주세요. [필수] 2. 가장 열정을 가지고 임했던 프로젝트(목표/과제 등)를 소개해 주시고, 해당 프로젝트의 수행 과정 및 결과에 대해 기재해 주세요. [필수] 3. 다음 중 본인이 가장 자신 있고 희망하는 분야를 한 가지 선택해 주세요. 선택한 분야게 관심을 갖게 된 계기와 자신있는 이유등에 대해 구체적으로 작성해주세요. [선택] 4. 본인의 대표적인 개발 경험, 활동을 가장 잘 보여줄 수 ..

회고 2023.10.31

Javascript로 백준 풀기

체감상 점점 많은 기업들이 프론트엔드 코테의 경우 javascript로만 문제 풀이 언어를 제한하는 것 같다. 또 몇년 전까지만 하더라도 코테 언어로 javascript를 지원하는 회사들이 정말 유명한 회사 몇곳을 제외하고는 없었는데 플랫폼의 발전과 프론트엔드 분야의 성장(?)으로 대부분 javascript를 지원하고 있다. 물론 프로그래머스로만으로도 충분히 코딩테스트 대비를 할 수 있지만 압도적으로 많은 문제 수와 특이한 형식에 입출력에 익숙해지려면 백준으로의 연습도 필요하다고 생각한다(실제로 몇몇 기업의 경우 백준 형식으로 node.js입출력을 받는다) 개인적으로는 코테를 보며 때려 맞추는 형식을 많이 취한다는 느낌이 들었다. 프로그래머스의 경우 모든 입력값들을 보여주지는 않지만 그래도 몇개의 테스트..

알고리즘/공부 2023.03.13

Next.js로 나만의 블로그 만들기

https://prefer2-dev.vercel.app/ prefer2의 블로그 prefer2의 개발 블로그입니다 prefer2-dev.vercel.app 기술 블로그를 tistory를 통해 운영하고 있지만, 학습을 위해 가장 좋은 방법이라고 생각이 되어 나만의 블로그 만들기를 시작했다. 블로그를 만들게 된 이유는 아래와 같다. SSR, SEO 학습 백엔드 없이 정적으로 진행 가능 나만의 커스터마이징이 가능 간지 기술 스택은 아래와 같이 선택했다. Next.js Typescript Tailwind Vercel 스타일링의 경우 기존에 사용하던 css-in-js가 아닌 tailwind를 선택했다. 스타일을 위한 불필요한 컴포넌트가 줄어들었고, 일관성 있는 디자인으로 개발할 수 있는 것 같다. 옛날 옛적에 접..

프로젝트 2023.01.05

SEO(검색 엔진 최적화)

프로젝트를 진행할 때 백엔드 팀원이 이런 질문을 했었다. "우리 프로젝트도 구글에 롤링페이퍼를 검색하면 나오게 못 만드나? 검색 되면 사용자가 더 많아질 것 같은데..." 이 질문에 SEO를 향상시키면 된다는 답변을 했지만 왜 그런지, 그리고 어떻게 하는지에 대해 제대로 설명하지 못했던 기억이 있다. SEO란 무엇인지 그리고 어떻게 이를 향상시킬 수 있을지 알아보자. (사실 우리 프로젝트의 경우에는 회원끼리의 메시지라 SEO를 향상시킬 필요가 없다. 메타테그만 추가해주면 충분하다) SEO란 SEO(검색 엔진 최적화)는 웹사이트가 검색 결과에 더 잘 보이도록 최적화하는 과정이다. 검색 엔진 최적화를 진행하면 사이트의 사이트의 가시성이 향상되고, 더 많은 사용자가 사이트를 방문하도록 유도할 수 있다. 크롤링..

WEB 2022.12.26

우아한테크코스 회고

사실상 2022년 회고인... javascript의 j도 모르던 사람이 솔직하게 말하자면 자바스크립트를 제대로 모르고 우아한테크코스를 시작했다. 애매하게 알고있던 다른 언어의 지식이 자바스크립트를 학습하는데 어려움을 야기했다. 레벨1때 다양한 패턴들을 적용하는 다른 크루들의 코드를 보며 감탄을 많이 했다. 스스로 기본기가 부족하다는 것을 알았기 때문에 그냥 꾸준하게 자바스크립트 책들을 계속해서 봤다. 프로토타입에 대한 이해가 안되서 여러 책들을 살펴보며 끙끙거렸던 기억이 난다. 느리지만 뭐 어쩌겠어라는 생각으로 버티기를 진행했었다. 이때 키워드 마인드맵 + 여러 책 내용 정리하기 방법으로 학습을 했는데 이 방법이 꽤나 좋은 방법이었다. 레벨2부터는 리액트를 사용한다. 리액트 또한 거의 처음이었기에 쉽지만..

회고 2022.12.11

2022.11 회고

코딩테스트부터 면접까지 다양하게 배울 수 있었던 한달 선언적이란? 💡 나만의 정리 How보다 What에 집중하는 방법. 내부에 명령형 로직이 구현되어있는 것을 숨기는 일종의 추상화한 방법. 여기에 추가적으로 최대한 사이드 이팩트가 없고 순수해야한다는 의미가 부가되어야함. 리액트의 장점을 찾거나, 여러 라이브러리의 장점을 찾다보면 공통적으로 나오는 단어가 있다. '선언적'이라 좋다. 사실 여러 라이브러리에서 이 단어를 아무렇지 않게 사용하길래 대충 느낌만 알면서 나도 모르게 선언적이다의 의미를 모르고 장점으로 내새웠다. 선언적의 의미를 조금 더 자세하게 알아보자. 선언적이다라는 말을 실생활에서 설명할때 가장 흔하게 드는 예시가 있다. 도착지를 설명하는 방식이다. 명령형: 두 블록 간 후에 우회전 하고, 한..

회고 2022.11.27

[프로그래머스] 두 큐 합 같게 만들기 (level2, js)

문제 길이가 같은 두 개의 큐가 주어집니다. 하나의 큐를 골라 원소를 추출(pop)하고, 추출된 원소를 다른 큐에 집어넣는(insert) 작업을 통해 각 큐의 원소 합이 같도록 만들려고 합니다. 이때 필요한 작업의 최소 횟수를 구하고자 합니다. 한 번의 pop과 한 번의 insert를 합쳐서 작업을 1회 수행한 것으로 간주합니다. 큐는 먼저 집어넣은 원소가 먼저 나오는 구조입니다. 이 문제에서는 큐를 배열로 표현하며, 원소가 배열 앞쪽에 있을수록 먼저 집어넣은 원소임을 의미합니다. 즉, pop을 하면 배열의 첫 번째 원소가 추출되며, insert를 하면 배열의 끝에 원소가 추가됩니다. 예를 들어 큐 [1, 2, 3, 4]가 주어졌을 때, pop을 하면 맨 앞에 있는 원소 1이 추출되어 [2, 3, 4]가..

에러 처리 방식에 대한 고민

프로젝트 규모가 커짐에 따라 에러 처리의 중요성을 느끼고 구조 정리와 리팩토링이 필요성이 보였다. 왜 에러 처리의 중요성을 느꼈는지, 어떻게 일관성있게 정리하고 어떻게 에러를 보여줄지를 고민한 과정을 기록해보려고 한다. 기존의 에러 처리 방식 우선 프로젝트에서 어떤 방식으로 api를 관리하고 있는지 살펴보자. '내편' 프로젝트에서는 react-query와 axios를 사용하여 서버 요청들을 관리하고 있다. 이 두 조합을 사용하며 느낀 장점은 코드의 분리를 확실하게 할 수 있다는 점이었다. axios를 사용하여 api 요청 함수들을 도메인별로 정의해놓고, react-query의 useQuery와 useMutation에서 이 api 요청 함수들을 사용했다(use + CRUD + api명 형식으로 커스텀 훅을..

우테코 2022.10.30
반응형