전체 글

안녕하세요. 사진과 철학에 관심이 많은 웹 프론트엔드 개발자 오원종입니다. 시간이 지나도 꾸준히 읽힐 수 있는 글을 쓰고 싶습니다. 재미있는 일만 하면서 살고 있는 사람입니다.
Prog. Langs & Tools/TypeScript

TypeScript 5.0 버전 주요 변경사항 정리

이 블로그 포스팅은 마이크로소프트 기술블로그에 나온 타입스크립트 5.0 버전 변경사항 글을 참고하여 작성했습니다. 데코레이터(Decorators) 데코레이터는 클래스와 클래스 요소(메서드, 프로퍼티 등)들을 재사용 가능한 방법으로 사용자 지정할 수 있도록 지원하는 곧 출시될 ECMA스크립트 기능이다. class Person { name: string; constructor(name: string) { this.name = name; } greet() { console.log(`Hello, my name is ${this.name}.`); } } const p = new Person("Ray"); p.greet(); greet 메서드는 간단하지만, 더 복잡해질 수 있다고 가정한다. 아마 비동기 로직이 있을..

끄적끄적/Book Review

2023년 3-5월 독서 정리

3~5월에는 이전보다 일정이 많아져서 책을 읽을 수 있는 시간과 여유가 부족해졌다. 합쳐서 6권 정도의 책을 읽었다. 5권은 개인적으로, 1권은 회사에서 읽었다. 1. 피로 사회 ⭐️⭐️⭐️⭐️한병철 저 / 인문, 사회 분야 독일에서 오랫동안 철학을 하셨던 한병철 철학자님의 성과주의 사회에 대한 깊은 통찰이 담긴 책. 자신의 능력과 성과를 통해서 주체로서의 존재감을 확인하려는 자아는 피로해지고, 스스로 설정한 요구에 부응하지 못하는 좌절감은 우울증을 낳는다는 주장이 특히 공감되었다.발터 벤야민은 깊은 심심함을 "경험의 알을 품고 있는 꿈의 새"라고 부른 바 있다. ... 이완의 소멸과 더불어 "귀 기울여 듣는 재능"이 소실되고 "귀 기울여 듣는 자의 공동체"도 사라진다. "귀 기울여 듣는 재능"은 깊은 ..

Web Frontend Developer

react-hook-form & zod 로 복잡한 오브젝트 관리하기 (feat. immerjs)

이 글의 목적 여러 뎁스로 중첩된 오브젝트 형태로 구성된 상태를 불변하게 유지하는 방법에 대해 고민이 있는 웹 프론트엔드 개발자가 참고할 수 있는 사례를 공유하기 위함 로직이 복잡하고 사이드 이펙트가 많이 발생할 수 있는 코드를 적절한 도구로 간결하고 명확하게 작성하는 방법에 고민이 많은 웹 프론트엔드 개발자에게 인사이트를 주기 위함 이 글의 예상 독자 react와 typescript로 웹 프론트엔드 개발을 하는 엔지니어 기본적인 react, typescript에 대한 선수 지식이 있다고 가정하고 설명 인트로 내가 속한 팀에서 담당하고 있는 웹 프로덕트는 현재 context로 상태를 관리하고 있으며, form 형태의 페이지는 react-hook-form 이라는 라이브러리를 사용하고 있다. 그리고 유효성 ..

Web Frontend Developer

[Three.js] 3D 라이브러리를 사용해서 태양계 만들어 보기

지난 2월까지 Febase 라는 프론트엔드 스터디를 했었다. 벌써 시즌 4까지 진행했다. Fabase는 프론트엔드 개발자들끼리 모여서 프론트엔드 관련 주제들을 가지고 학습하는 모임으로 매 시즌마다 다른 주제를 가지고 스터디를 진행한다. 이번 시즌인 시즌 4는 three.js 라이브러리를 공부하면서 3D 애니메이션을 만들어 보는 스터디를 진행했다. 강의는 three.js-journey 라는 웹 사이트의 강의를 들었다. 지금까지 전세계에서 2만7천 명 이상이 들은 three.js 강의이다. 이 강의가 시작된지는 꽤 오래되었고, 강사가 프랑스 분이신데 지속적으로 강의를 추가추가 해주시는 것으로 알고 있다. 강의를 들으면서 공부한 이후에 나를 포함한 4분 정도의 개발자 분들과 작은 프로젝트를 해 보았다. 여러가..

끄적끄적/Book Review

2023년 2월 독서 정리

2023년 2월에는 4권의 책을 읽었다. 1. 비탈린 부테린 지분증명 (원제 : Proof of stake) ⭐⭐⭐⭐⭐ 비탈린 부테린 저 / 여의도책방 출판 / 경제경영, 컴퓨터 분야 이더리움을 만든 비탈릭의 탈중앙화, 작업증명, 지분증명 등의 주제에 대한 이야기. 예전부터 블록체인에 관심이 많았고, 기술도 좋지만 왜 만들었고 어떤 문제를 해결하고 싶어하는지에 대해서 궁금했는데 그 질문에 대한 너무 어렵지도 너무 쉽지도 않은 블록체인, 이더리움의 교과서 같은 책. 이처럼 필요한 공공재에 더 많은 모금을 할 수 있도록 거기에 맞는 더 나은 사회적 기술을 만들어야 한다. 그리고 이는 일회성으로 끝나는 착한 누군가의 이타주의적 행동이 아니라 생태 경제학의 시스템 일부로 디자인되어야 한다. p292 2. 도시인..

끄적끄적/재테크

금리와 유동성을 공부해 보았다.

오늘 금리와 투자 관련 주제의 세미나를 들으면서 공부한 내용을 정리해 보려고 한다. 금리 금리(interest rate)는 돈에 대한 이자율이다. 다른 말로 돈의 가치 라고 이해하면 된다. 아래는 대한민국의 지난 15년간 기준금리 변동추이 그래프이다. 중앙은행은 성장률, 물가상승률, 금리를 적절하게 유지하기 위해서 노력한다. 이 세 가지 지표는 큰 틀에서는 일맥상통하다. 어떤 하나의 지표가 너무 높거나 낮으면 문제가 생길 수가 있기 때문에 중앙은행은 밸런스를 잘 잡는 것을 중요하게 여긴다. 미국의 경우는 이 수치가 매년 2%, 즉 성장률도 2%, 물가상승률도 2%, 금리도 2%를 꾸준하게 유지하는 것을 목표로 한다. 반면 한국은 조금 더 높아서 3% 정도를 목표로 한다. 많은 사람들이 물가가 오르는 것,..

Prog. Langs & Tools/JavaScript

[JS] 원시 타입과 객체 타입, 그리고 불변성에 관하여

자바스크립트가 제공하는 데이터 타입은 총 7가지가 있다. 숫자(number) 문자열(string) 불리언(boolean) null undefined 심벌(Symbol) 객체(Object) 이 중에서 7번 객체 타입을 제외하고는 원시 타입(primitive type) 이라고 부르며 객체 타입은 영어로 reference type 이라고 부르기도 한다. 데이터 타입을 이렇게 구분하는 이유는 원시 타입과 객체 타입이 근본적으로 다른 점이 있기 때문이다. 크게 3가지 정도 생각해 볼 수 있다. 원시 타입은 변경이 불가능한(immutable) 값이다. 반면에 객체(참조) 타입은 변경 가능한(mutable) 값이다. 원시 값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장 된다. 반면에 객체를 변수에..

끄적끄적/Book Review

2023년 1월 독서 정리

2023년 1월에는 총 5권의 책을 읽었다. 1. 이와타씨에게 묻다 ⭐⭐⭐ 호보닛칸이토이신문 엮음 / 이큰 출판 / 경영 분야 회사 동료분들과 같이 북 스터디를 하면서 읽은 책. 닌텐도 전 CEO 이셨던 이와타 사토루씨에 대한 에피소드를 엮은 책. 한 줄 요약 : 닌텐도가 괜히 오랫동안 잘 팔리는게 아니다. 거기엔 다 이유가 있었다. 원 픽 구절 : 지금까지의 흐름을 전부 돌이켜보면, 과정 중 작은 부분에서 "그랬더라면 좋았을걸"이라는 말은 얼마든지 나올 수 있지만, 완성된 Wii 자체에는 "그랬더라면 좋았을 걸"이라는 말이 이상할 정도로 없습니다. p135 2. Continuous Discovery Habits ⭐⭐⭐⭐ Teresa Torres 저 / 경영 분야 재은님 PM 북 스터디에 (비록 PM은 ..

DevOwen
오웬의 개발 이야기