전체 글 썸네일형 리스트형 [회고] 나의 삶은 어떤 문양을 띌까? 원체 미래를 상상하기보다, 지난날과 현재를 돌아보는 생각에 시간을 더 많이 쏟는 편입니다. 내가 학창 시절에 무엇을 좋아했고, 어떤 것에 열을 내었는지 자주 되짚어보곤 했습니다. 이제 와서 돌아보니 지금 나의 모습과 겹치는 당시의 모습들이 하나씩 보였습니다. 지금의 내가 만들어지는 과정이었겠죠. 그 모습들을 시간 순으로 생각나는 대로 한 번 짚어보려 합니다. 드러내고 싶지만 아직 정리되지 않는 나의 모습은 이후에 또 짚어보려 합니다. 시작은 학창 시절의 나로 시작할게요. 학창 시절, 이상적인 공동체를 꿈꾸며 스포츠를 참 좋아하였습니다. 친구들이 총 게임과 전략 게임을 할 때 저는 야구와 축구게임을 주로 즐겼습니다. 또한, 1:1 개인전은 잘하지 않았습니다. 꼭 팀을 이루어 2:2, 3:3 경기를 하며 실.. 더보기 [Web][Network] Session vs Token Authorization [ 2023/10 ] 2022/01에 작성한 내용을 보충하여 재발행합니다. 세션과 토큰, 백엔드와 프론트엔드가 용어를 이해하는 영역이 다르다. 그 말은 즉슨, 엔지니어 간에 제대로 소통하기 위해서는 양쪽에서의 올바른 이해가 필요하다. Authorization 과정에 대한 Session 과 Token의 차이점을 살펴보자. 세션 (Session) 세션으로 로그인하는 과정을 살펴보자. Client) user가 브라우저에서 로그인 폼을 제출한다. 이로 인해 로그인 정보로, HTTP 통신이 일어난다. Server) user 정보로, Session을 생성하여 DB에 저장한다. session에 해당하는 session ID를 Response로 반환한다. Client) session ID를 Cookie에 저장한다. (F.. 더보기 [GraphQL] How to use GraphQL Properly 목차 1️⃣ GraphQL이란? - GraphQL, - vs REST 2️⃣ GraphQL 주요 문법 - ... 3️⃣ GraphQL을 제대로 쓰기 위해 - Fragment Driven Development - Data Masking 1️⃣ GraphQL이란? - GraphQL, GraphQL은 하나의 쿼리 언어이다. 웹 클라이언트가 데이터를 서버로부터 효율적으로 가져오기 위한 목적을 가지고 페이스북에서 고안하였다. API의 데이터를 알기 쉽게 문서로써 제공하고, 클라이언트에서 필요한 것을 정확히 요청할 수 있는 권한을 제공하며, API를 더 쉽게 확장하고 유지관리 할 수 있게끔 제공한다. 이를 통해, FE 개발자는 nested한 연관된 데이터들을 한 번에 요청이 가능해 코드적으로나 네트워크적으로나 큰 .. 더보기 [Bundler] The meaning of migration to Vite 목차 1️⃣ Module Bundler의 이야기 2️⃣ Vite의 등장 3️⃣ Vite으로의 마이그레이션 과정 4️⃣ 글을 줄이며 CRA(Create React App)는 Webpack 기반의 React가 제공하는 명령어이다. (사실 이제는 공식문서에 모습을 보이지 않는다.) 이를 이용해 구축한 🔗 프로젝트에서 팀원과의 개발 속도가 늦어짐을 느꼈고, 고민 끝에 그 이유를 번들러의 긴 빌드시간이라고 생각하였다. 결국 Vite으로의 마이그레이션을 결정하였고, 그 과정을 기록해보고자 한다. 1️⃣ Module Bundler의 이야기 번들러를 알기 위해 옛날 JavaScript 이야기를 정리하고자 한다. 태초에 JavaScript는 module 개념이 없었다. 웹에서 간단한 동작만 하기 위해 만들어졌기에, 파일.. 더보기 [React] For react States that represent only Valid State (w. Reducer) 내리 추가하는 상태에 따라 지수적으로 복잡도가 증가하고 코드의 유지보수가 힘들어지는 경우를 한 번씩은 경험해보았을 것이다. 그런 경험을 반복하지 않기 위해, 정말 간단하지만 중요한 이야기를 해보고자 한다. 혹은 Reducer에 익숙하지 않은 분들도 보면 도움이 될 것이다. 💠 Type 관점에서의 "유효한 상태 표현" 타입을 설계할 때는 어떤 값들을 포함하고, 어떤 값들을 제외할지 신중하게 생각해야 한다. “유효한 상태”만을 표현하지 않고 “무효한 상태”를 함께 표현하는 타입은, 혼란을 초래하고 타입 체크 오류를 유발하게 된다. 알맞는 글을 불러와 나타내는 웹 페이지를 구현한다고 가정하고, 대표적인 다음 예시를 살펴보자. 페이지는 내용을 로드하고, 그 이후에 화면에 표시한다. 상태는 다음과 같이 설계한다... 더보기 이전 1 2 3 4 5 ··· 38 다음
