728x90
반응형
SMALL
[서평] Do it! 리액트로 웹앱 만들기 with 타입스크립트 - 후기

[서평] Do it! 리액트로 웹앱 만들기 with 타입스크립트 - 후기

[서평] Do it! 리액트로 웹앱 만들기 with 타입스크립트 - 후기 프론트엔드 개발자를 꿈꾸며 React, Next.js 로 웹 개발도 진행했고, React Native로 앱을 개발해 출시도 해봤다. 하지만 따로 서적을 구매해서 이론지식을 정리한 적은 없기 때문에 아쉬움이 언제나 남아있었다. 그러던 중 마침 서평단 모집글을 보게 되었고, 지원하여 선발되었다는 메일을 받았다. 그리고 3/27(수)에 집으로 책이 도착했다..! 책의 목차 책의 목차는 대략 이렇게 구성되어있다. | 1장 리액트 개발 준비 | - 리액트 설치와 기타 개발 도구 준비 | 2장 리액트 동작 원리 | - 가상 DOM과 JSX 구문 - 컴포넌트와 이벤트 속성 | 3장 컴포넌트 CSS 스타일링 | - CSS 스타일링 - 테일윈드 C..

  • format_list_bulleted Front-End
  • · 2024. 4. 9.
  • textsms
[React] 리액트란 무엇인가요?

[React] 리액트란 무엇인가요?

📌 패스트캠퍼스 ‘올인원 패키지 : 만들면서 익히는 React의 모든 것 개발부터 배포까지 with 25개 스택’ 를 수강하며 적은 개인 공부용 기록물입니다. 리액트란 무엇인가? 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리. 인터랙션이 많은 웹 앱을 개발하기 위해 주로 사용 웹 앱을 만드는 다른 Tool인 Vue나 Angular와 많이 비교를 하게 된다. Library vs Framework 프레임워크 : 어떠한 앱을 만들기 위해 필요한 대부분의 것을 가지고 있는 것 라이브러리 : 어떠한 특정 기능을 모듈화 해놓은 것 프레임워크 안에 많은 라이브러리들이 있음. 프레임워크는 내가 작성한 코드를 호출하고, 내가 작성한 코드는 기능을 구현하기 위해서 라이브러리를 호출하게 된다. React는 ..

  • format_list_bulleted Front-End
  • · 2024. 1. 23.
  • textsms

[TypeScript] 24. 일관성 있는 별칭 사용하기

넓히기 과정 제어하는 방법constlet 대신 const로 변수를 선언하면 더 좁은 타입이 된다.const x = 'x'; let vec = {x: 10, y: 20, z: 30}; getComponent(vec, x);x 는 재할당 될 수 없기 때문에 ⇒ 더 좁은 타입 (”x”)로 추론할 수 있다. 타입 추론의 강도를 직접 제어하려면⇒ 타입스크립트의 기본 동작을 재정의해야명시적 타입 구문 제공타입 체커에 추가적인 문맥 제공const 단언문 사용 (const 단언문과 변수 선언에 쓰이는 let 이나 const와 혼동 x) const v1 = { x: 1, y: 2, }; // 타입은 { x: number; y: number; } const v2 = { x: 1 as const, y: 2, }; // 타입..

  • format_list_bulleted Front-End
  • · 2023. 7. 26.
  • textsms

[TypeScript] 17. 변경 관련된 오류 방지를 위해 readonly 사용하기

📚 Effective TypeScript 책을 읽고 공부한 내용을 정리한 글입니다. 변경 관련된 오류 방지를 위해 readonly 사용하기 function arraySum(arr: number[]) { let sum = 0, num; while ((num = arr.pop()) !== undefined) { sum += num; } return sum; } function printTriangles(n: number) { const nums = []; for (let i = 0; i < n; i++) { nums.push(i); console.log(arraySum(nums)); } }arraySum 함수배열 안의 숫자들을 모두 합치고계산이 끝나면 원래 배열이 전부 비게 된다.자바스크립트 배열은 내용을 ..

  • format_list_bulleted Front-End
  • · 2023. 7. 26.
  • textsms
[React] 리액트 공식문서 스터디 - Describing the UI (2) Importing and Exporting Components

[React] 리액트 공식문서 스터디 - Describing the UI (2) Importing and Exporting Components

React 공식문서를 읽고 정리한 글입니다. Describing the UI – ReactThe library for web and native user interfaceshttps://react.dev/learn/describing-the-ui Importing and Exporting Components component 의 장점은 재사용성에 있다.⇒ 다양한 component들로 구성된 component를 만들 수 있다. 하지만 component를 묶고, 또 구성하고 반복할 수록 다른 파일로 분리해야 한다는 것을 느끼기 마련이다.파일을 읽기 쉬워지고, 더 많은 곳에서 component를 효율적으로 재사용할 수 있게 될 것이다. The root component file Your First Compon..

  • format_list_bulleted Front-End
  • · 2023. 7. 26.
  • textsms
[React] 리액트 공식문서 스터디 - Describing the UI (1) Your First Component

[React] 리액트 공식문서 스터디 - Describing the UI (1) Your First Component

React 공식문서를 읽고 정리한 글입니다. Describing the UI – ReactThe library for web and native user interfaceshttps://react.dev/learn/describing-the-ui YourFirst Component React 애플리케이션 component 라고 불리는 고립된 조각들로 빌드된다. component 란 ?하나의 JavaScript 함수버튼과 같이 작을 수 있고, 전체 페이지만큼 클 수 있다. https://codesandbox.io/embed/affectionate-tdd-tefyif?fontsize=14&hidenavigation=1&theme=dark Components: UI building blocks My First..

  • format_list_bulleted Front-End
  • · 2023. 7. 26.
  • textsms
728x90
반응형
LIST