sungwook

인턴으로 일한지 벌써 2달이 지났다.그동안 계속 내가 한걸 정리해야지 말만 하고 시간만 흘려보냈는데황금연휴기간을 갖게 된 지금에서야 정리해본다.. 회사에 들어간 첫날부터 스프린트를 뛰고 지금까지 정신없이 일을 해왔는데그렇게 배운 것도 많고 시행착오도 많이 겪었다.그 중에서 제일 기억에 남는 일부터 정리해보려 한다. 인턴으로 일한지 1달 조금 넘었을까 나에게 신규기능을 개발하는 작업이 주어졌다.메타 정보를 관리하는 컴포넌트로 사이트내에 백엔드에서 관리하는 용어들이 있는데 언어별로 다른 값을 보여주고 사용할지 여부와 하위값을 중복해서 선택할 수 있는지 여부를 선택할 수 있는 UI를 만드는 일이었다.좀 쉽게 말하면 해시태그를 등록하는거랑 비슷하다고 보면 된다.강의를 선택할 때 그 강의에 대한 태그 정보를 관리..

찌그러져도 동그라미입니다. 2024년 1년간 나의 삶을 가장 잘 표현한 글귀다. 2024년 1월에 나는 꽤나 공부를 열심히 하고 그래도 '좀 하는' 개발자라고 스스로 생각했다.물론 많이 부족하지만 신입 레벨에서는 잘하는 편이라고 생각하며 좀 우쭐했었던 것 같다. 취업 준비를 하면서, 회사를 다니면서, 그리고 재취업을 하면서...나는 생각보다 스스로 너무 실력이 부족하다고 느끼면서 슬럼프와 우울증이 찾아왔었다.지금까지 나는 힘든일이 많았어도 내가 노력하면 어느정도 다 이뤄왔었다.하지만 개발자로 길을 전향하고 취업을 하면서 대기업의 문턱이 너무나 멀게 느껴졌고대기업은 커녕 중소기업에도 취업하기 힘든걸 깨달으면서 많이 좌절했다.어쩌다가 운이 좋아 중간에 취업을 했을 때는 그래도 그동안 열심히 공부한게 보상을 ..

회사를 나온지 벌써 한달이 다 되어간다 제일 먼저 이력서와 포트폴리오를 작성하고 원티드에 1~3년차 10군데정도 지원해봤다.신입 포지션은 넣고 싶지 않아서가 아니라 존재하지 않았다..ㅋㅋ모두 코딩테스트나 과제전형은 보지 않는 곳들이었지만 그래서일까 아직까진 전부 서류탈락이다. 이유가 뭘까?물론 1분내로 합격통보를 받은 곳이 대부분이기에 전공, 경력으로 필터링 되어서 떨어진 것 같다.그렇게 필터링되지 않은 소수의 회사는 내 자신을 그만큼 어필하지 못해서 그런게 아닐까 조심스레 생각해 본다.경력이 부족한 건 어쩔 수 없지만 매력적으로 보이지 못한건 이제부터라도 조금씩 바꿔 나가야겠다. 우선 단기간에 내가 취득할 수 있는 자격증부터 시험 등록을 했다.OPIc 영어 시험 그리고 PCCP를 javascript로 ..

이전편에서 JSX를 이용해서 함수형 컴포넌트를 만들어보았다.이번에는 css 전처리기 모듈인 scss를 적용해보려고 한다. css 전처리기란 무엇일까?vanilla css를 사용할 수도 있지만 프로젝트를 할 때 css 전처리기 또는 CSS-In-JS를 많이 사용한다.css 전처리기는 mixins라는 것을 통해 재사용 가능한 CSS 규칙을 만들 수 있고 기존 스타일을 확장하거나상속받아 새로운 스타일을 정의할 수 있다. 이렇게 작성된 코드는 일반 CSS로 컴파일되어 사용된다. 이와 달리 CSS-In-JS는 동적으로 스타일을 생성하여 런타임에 스타일을 생성한다.JSX로 합쳐진 HTML, Javascript 파일에 CSS까지 추가할 수 있게 되는 것이다.동적인 스타일링을 할 때 유리하지만 런타임에 스타일이 적용되..

내가 이 프로젝트를 시작하면서 가장 먼저 하고 싶었던게 바로 이 JSX를 사용하는 것이다.물론 react를 사용하지 않으면서 말이다. 그렇다면 JSX는 뭘까?JSX는 Javascript XML의 줄임말이다. XML의 예시는 다음과 같다. Harry Potter and the Philosopher's Stone J.K. Rowling 1997 24.99 A Brief History of Time Stephen Hawking 1988 19.99  많이 낯이 익지 않은가?HTML 태그랑 비슷한 것 같기도 하고 React를 써봤다면 return문에 들어가는 형식과 똑같다는 것을 알 수 있다. HTML과 XML은 모두 마크업 언어인 SGML(Standard ..

프론트엔드 개발자로 살아남기 위해 필요한 역량이 무엇일까 생각을 많이 해봤다.javascript, html, css 를 기본으로 typescript도 알아야하고 React, Next.js, react-query, redux, webpack, babel 등등나열해보면 공부하고 알아야할게 끝이 없다. 그래서 이 모든걸 다 준비하고 다시 취업시장에 뛰어들기 보다는 초심으로 돌아가 기초를 다잡기로 마음먹었다.바로 vanilla javascript로 리액트라는 프레임워크를 구현하는 것이다. 단, 한가지 조건이 있다. 함수형 컴포넌트 제작으로 리액트를 쓸 때와 거의 동일하게 만드는 것이다. 이런 결정을 하게 된 이유는 다음과 같다.1. 자바스크립트와 리액트에 대한 이해도를 높이고 싶다.2. 리액트를 바닐라 자바스크..

버전 정보next 14.2.3 (app router)react 18.3.1@tanstack/react-query 5.40.1 suspense의 존재에 대해 알고 있었지만 시간에 쫓겨 대충 고차 컴포넌트로 로딩을 관리하면서 코드를 짜왔다.하지만 어제 suspense에 대해 좀 더 공부하고 react-query에서 useSuspenseQuery를 사용하면비교적 쉽게 도입할 수 있다는 것을 깨닫고 이를 진행중인 프로젝트에 도입해보기로 했다. 결과적으로 하루만에(야근은 덤..) 40여개의 api를 모두 useSuspenseQuery로 수정했고Next에서 서버사이드렌더링을 사용하면서 겪었던 이슈들을 정리해보려 한다. 1. prefetch로 서버사이드에서 미리 데이터 불러오기공식문서를 보고 prefetch가 서버사..