본문 바로가기

전체 글

(20)
Hello Typescript - part.2 이전 포스팅에서는 타입스크립트의 기본적인 사양에 대해 훑어보았다면, 이번 포스팅에서는 실제 개발에 도움이 되는 몇 가지 주제를 같이 살펴보도록 합시다. 1. 진짜 타입스크립트... 1. Enum 타입 enum을 사용하면 이름이 있는 상수들의 집합을 정의할 수 있습니다. 숫자와 문자, 두 가지 열거형을 지원합니다. 우선 숫자 열거형부터 살펴봅시다. // 숫자 열거형 enum Direction { Up = 1, Down, Left, Right, } let direction: Direction = Direction.Up directon = 'Up' // string을 넣으려 하면 에러 위의 코드에서 Up이 1로 초기화된 숫자 열거형으로 선언되었습니다. 그럼 뒤따르던 나머지는 자동으로 증가된 값을 갖게 됩니다...
React 맛보기 - React Component Next.js는 React 기반의 프레임워크입니다. 본격적으로 개발에 들어가기에 앞서 React 기본이 되는 것들을 살펴보면 좋을 것 같아 이번 포스팅을 준비했습니다. *이 포스팅 시리즈는 Next.js 공식 문서와 React 공식 문서, 타입스크립트, 리액트, Next.js로 배우는 실전 웹 애플리케이션 개발을 참고하여 작성했습니다. 본 포스팅에서는 React에서 빠질 수 없는 컴포넌트와 훅에 관해 알아보겠습니다. 예제에 사용된 버전은 다음과 같습니다. npm 9.5.0 react 18.2.0 typescript 4.9.5 리액트 프로젝트를 생성해보겠습니다. 타입스크립트를 사용하기 위해 패키지를 추가합니다. npx create-react-app@latest study-react --template ty..
Hello Typescript - part.1 0. 타입스크립트 왜 씀? 말만 탈만 타입스크립트를 공부하기 전에 우리는 이 귀찮고 번거로운 친구를 왜 배워야 하는지 알아둘 필요가 있습니다. 그래야 타입스크립트를 포기하지 않고 사용할 수 있기 때문이죠. 타입스크립트는 마이크로소프트에서 개발하고 있는 오픈소스기반의 언어입니다. 정적 타입, 상위 호환 두가지 키워드로 정의할 수 있을 것 같습니다. 웹 애플리케이션의 발전으로 자바스크립트는 폭발적인 인기를 끌었으나, JS는 아직 불안정하거나 미성숙한 부분이 많습니다. 때문에 표준화 단체인 ECMA에서 명세를 계속 개선하고 있기도 하고요. 그럼, "자바스크립트를 보다 안정적이고 보다 성숙하게 업데이트하면 되는 거 아니야?"라고 생각할 수 있을 것 같은데, 이 친구는 하위 호환을 중시하는 언어입니다. 그래서 사..
우리가 Next.js를 공부하게 된 이유 올해 9월, 앱 런칭을 위해 우리 팀은 Flutter를 공부했고 정식 배포까지 마무리했습니다. 그리고 앱을 소개하기 위한 사이트를 React로 만들었고 Git Pages로 호스팅했습니다. 어느 날, 한 팀원을 통해 Next.js를 알게 됐습니다. 그리고 코드드림팀에서는 Next.js를 공부하기로 했는데요. 우리가 공부하게 된 이유와 과정을 포스팅을 통해 공유하려고 합니다. 이번 포스팅에서는 Next.js를 공부하게 된 이유를 소개합니다. *이 포스팅 시리즈는 Next.js 공식 문서와 React 공식 문서, 타입스크립트, 리액트, Next.js로 배우는 실전 웹 애플리케이션 개발을 참고하여 작성했습니다. 1. 프론트엔드 개발 변천 jquery의 시작과 끝 프론트엔드는 어떻게 변화해왔을까요? 저는 6년차 ..