summer.log

첫 인턴 일지를 작성한 지 얼마 안 된 것 같은데 달력을 보니 5월이다. 벌써 인턴 생활의 절반이 지나갔다니 시간이 정말 빠르다. 첫 출근에는 겨울 코트를 입고 있었는데 어느새 벚꽃도 지고 반팔을 입을 계절이 다가오고 있다. 4월도 3월과 마찬가지로 정말 많은 일이 있었다. 먼저, 첫 월급을 받았다. 분명 받았는데.. 퇴근길에 우연히 간 강남의 애플 스토어에서 잃어버린 것 같다. 같이 간 친구가 애플 워치의 줄을 바꾼다고 해서 같이 골라주고 있었는데 어느새 내가 애플 워치를 차고 있었다.(ㅋㅋ) 2년 이상 쓰면 한 달에 대략 만 오천원~그 이하니까 나름 합리적인 소비라고 생각한다. 무엇보다 귀엽고 배경 화면 바꾸는 재미가 있다. (제일 중요하다) 두번째, 새 프로젝트가 시작됐다. 관련 내용은 아래에 계속..

[첫 인턴일지에 대한 마음가짐] 책을 읽고 감상문을 쓴 경험은 꽤 있다. 특정 주제에 대한 레포트를 쓰는 강의도 좋아해서 ‘글을 쓰는 것’ 자체는 어색하지 않은 편이다. 마찬가지로 개발도, 배운 것들이나 해야 할 것들을 문서화하는 것에는 익숙하다. 그런데 막상 인턴 일지를 쓰려고 생각해보니 개발+일상이 혼합된 글은 처음이라는 것을 깨달았다. 블로그에서 친구들과 소통하려고 쓴 낙서같은 글 외에는. 그마저도 쓰고 주기적으로 지워버린다. 그때그때 생각나는 대로 쓰다 보니 날것의 느낌이 강해서 다시 보면 왜 이런 글을 썼는지 스스로도 이해가 안 간 적이 많기 때문이다. (ㅋㅋ..) 하지만 인턴일지는 스스로에게 다시 봐도 괜찮은 글을 주고 싶다는 생각이 들었다. 이래놓고 이틀 전에 쓰기 시작했지만….. 좋은게 좋..

인턴십 당시에는 우리가 일부 페이지만 담당했기 때문 라우터와 연결할 페이지 수가 아주 적었다. 그래서 원래 하던 것처럼 해도 크게 불편한 점이 없었다. 그러다가 어느날 불현듯 찾아온 깨달음이 있었는데, 바로 메뉴와 하위 메뉴의 수를 합치면 어마어마하게 많다는 것이었다..개발이 진행될수록 페이지 컴포넌트도 늘어날텐데 그때마다 하나하나 추가하면 라우트 코드만 몇백줄이 되는건가? 다른 웹사이트도 그런지, 어떻게 관리해야하는 건지 궁금해져서 서치에 들어갔다. 그러다가 찾은 글이 바로 아래의 링크이다. 참고 https://tech.kakao.com/2022/07/13/active-routing-for-e-certificate/ 전자증명서 리액트 페이지 및 레이어 동적 라우팅 전자증명서 프로젝트란 카카오톡에서 주민..

JWT(Json Web Token) JWT와 같은 토큰 인증은 stateless → 인증 정보를 클라이언트가 들고 있어 서버에서 토큰에 대한 통제가 어렵다. 토큰은 발행과 함께 만료 기간이 정해지고, 토큰에 이미 새겨진 만료 기간은 변경할 수 없기 때문에 새로운 토큰을 발급해야 한다. 새로운 토큰을 발급 받아도, 기존 토큰의 기간이 아직 남아있다면 기존 토큰 또한 유효하다. (같은 시간 대에 유효한 토큰이 2개 이상 될 수도) 세션 세션은 의미없는 텍스트의 조합으로 식별자를 발행한다. stateful → 서버에서 통제 가능 만료 시간이나 사용자 식별 정보 등은 서버(DB)에서 관리되며, 필요 시 서버에서 연장 또는 만료할 수 있다. 처음에는 별 생각 없이 최신 기술인 JWT를 사용하려고 했으나 페이지 요..

src 내부 폴더 구조 프로젝트의 단위가 커지다 보면 관리해야 할 파일이 늘어나기 때문에 처음부터 구조를 잡고 가는 것이 중요하다는 것을 느꼈다. 인턴을 하기 전까지는 폴더 구조에 대해 생각을 크게 해 본적이 없었는데, 멘토님들의 도움으로 구조를 한번 잡고 나니깐 협업할때 훨씬 수월했다. Components 재사용한 가능한 공통 컴포넌트를 모아놓은 폴더 아토믹 디자인을 도입하는 경우 하위폴더로 Atoms, Molecules, Organisms을 추가한다. 아토믹 디자인이란? 👇 아토믹 디자인을 활용한 디자인 시스템 도입기 | 카카오엔터테인먼트 FE 기술블로그 정호일(harry) 카카오페이지에서 웹 프론트엔드를 개발하고 있습니다. 집보다 밖에 돌아다니는 걸 좋아합니다. fe-developers.kakaoe..

목적 웹 에디터에 이미지 첨부 별도의 파일 첨부 인턴십을 진행하며 노션에 정리했던 첨부파일 관리법을 블로그로 옮기면서 좀 더 다듬어 보았다. (1)편에서는 케이스에 따른 구현 방법의 차이가 없기 때문에 웹 에디터에 이미지를 첨부하는 경우를 집중적으로 작성했다. 1. 에디터 선정 - CKEditor 5 에디터는 CKEditor5를 선택했다. 다양한 버전이 있어 공식 문서(https://ckeditor.com/docs/ckeditor5/latest/index.html)를 살펴보고 필요한 기능에 따라 선택하면 된다. 아래는 Document editor이다. 2. 구현과정 웹 에디터에 첨부한 이미지는 게시물 저장 버튼을 클릭할 때 저장되는 것이 아니다. 왜 그런지 생각해보면, CKEditor5의 글은 html ..