하수도키의 성장일기

책일기

[북리뷰] 러닝 리액트 2판

최근 프론트엔드 개발자로 일하면서 React는 빠질 수 없는 존재다. 페이스북에서 사용하고 있어 Vue 보다 더 점유율이 높고 React-navtive까지 지원하니 많은 사람들이 관심을 갖고 공부를 하고 있다. 그중에 나도 한 명인데 관심만 갖고 공부를 하지 않고 있는 상태였다. 책 사고 스터디하고 강의 결제하고 딱 여기까지 보고 공부하고 듣지를 않는다. 이번에 한빛에서 지원받은 책이 러닝리액트 2판(Learning React)라서 타이밍 좋게 집중하고 힘들게 책을 읽어봤다. O'REILLY 출판사에서 나온 책답게 표지 동물은 멧돼지이다. 아주아주 무섭다. 쓰다 보니 러닝 리액트 1판도 예전에 구매했던 기억이 생각났다. 1판(2018년)에서는 리덕스(redux)에 대한 내용을 다뤘다면 2판에서는 훅스(h..

개발일기/Javascript

[Javascript] URL페이지를 Location, Redirect, Reload 통해 살펴보자.

Javascript를 통해 URL 페이지를 관리할 때 loaction.load, location.href 등을 많이 사용했다. 사용할 때마다, 자연스럽게 손에 익어 타자를 치고 실행을 했지만 정확하게 살펴본 적이 없었다. 운 좋게 미디엄 포스팅에서 관련 내용이 있어서 한번 의역 위주로 번역해보았다. 원문은 아래 링크를 참고 https://betterprogramming.pub/redirect-refresh-and-access-the-url-of-the-current-page-in-javascript-3d9160e8317e Redirect, Refresh, and Access the URL of the Current Page in JavaScript JavaScript’s location object be..

책일기

[북리뷰] 한 권으로 끝내는 Node & Express(2판)

한 권으로 끝내는 Node & Express 소개 초판이 아니고 2판이다. 개정판으로 생각하면 된다. Express 4.0을 바탕으로 알려준다.(현재는 Express 5.0 alpha가 나온 상태) 안정성을 인정받은 최선 버전으로 진행된다. 아래부터는 책 내용을 인용했다. 대상 독자는 자바스크립트와 노드, 익스프레스로 웹 애플리케이션을 만들고자 하는 프로그래머를 위한 책이다. 2판에서 달라진 점은 API와 정적 자원의 서버로 익스프레스를 사용하는 법을 설명하고, SPA 예제도 수록해 진화한 노드와 익스프레스를 체험할 수 있도록 개정했다. 책의 뒷편을 참고하면 자바스크립트 개발 스택의 핵심인 노드와 익스프레스로 동적 웹 애플리케이션을 만들어보세요. 이 책은 웹 사이트 개발 과정을 살펴보며 익스프레스 기본..

개발일기/Vue.js

[Vue.js] Vue 애니메이션(Animate) #1 - Transition

이번 포스팅은 Vue 애니메이션에 대해 알아보자. 애니메이션을 이용해 사용자 경험을 향상할 수 있다. 버튼 같은 곳에 마우스 호버상태 일 때 클릭률을 높이거나 강조해야 되는 문구, 영역 등에 애니메이션을 적용해 집중력을 높일 수 있다. 목차 Transition(이번 포스팅) Page Transition Transition Group Javascript Hooks + Velocity GSAP Transition(트랜지션) Vue에서 Transition 래퍼(Wrapper) 컴포넌트를 기본으로 제공하고 있다. 이 Transition 컴포넌트를 이용해 다양한 애니메이션 효과를 낼 수 있다. Transition은 번역하자면 전환이다. 말 그대로 from → to로 되는 것이 전환이다. 전활 될 때 애니메이션을 ..

개발일기/Vue.js

[Vue.js] Vue 3 + TypeScript #4 - 타입 기초(Type Fundamentals)

타입스크립트의 기본 개념 중 하나인 개발을 향상하는 데 사용하는 정적 타입 정의하는 방법을 살펴보자. 이번 포스팅에서는 타입스크립트에서 유용하고 자주 사용하는 일부 타입들을 살펴본다. 2021.03.09 - [개발일기/Vue.js] - [Vue.js] Vue 3 + TypeScript #3 - 컴포넌트 만들기(Creating Components with TypeScript) [Vue.js] Vue 3 + TypeScript #3 - 컴포넌트 만들기(Creating Components with TypeScript) 지난 포스팅에서 Vue3 + TypeScript를 세팅 완료했으니 이제 컴포넌트를 만들어보자. 타입 스크립트에서는 어떻게 Single File Components가 변경되었는지 살펴보자. Typ..