[서평] 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 Native] 안드로이드 시뮬레이터 실행 안되는 문제 해결하기

[React Native] 안드로이드 시뮬레이터 실행 안되는 문제 해결하기 iOS 시뮬레이터에서는 정상 실행이 되는데, 안드로이드에서만 실행시 에러가 뜨는 문제가 있었다. Dismiss 버튼을 누르면 에러창이 사라지고 실행할 수는 있지만 그래도 매번 실행할 때마다 에러창이 뜨니 여간 불편한 게 아니었다. TypeError | TypeError: _RNGestureHandlerModule.default.flushOperations is not a function (it is undefined), js engine: hermes | 해결 StackOverflow에 동일한 문제를 해결한 내용이 있어서, 참고했다. https://stackoverflow.com/questions/77959387/error-typ..

• format_list_bulleted Mobile/React Native
• · 2024. 3. 6.
• textsms

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

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

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

[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 – 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

[React] 리액트 작업환경 준비 - node.js, yarn, webpack, babel

https://react.vlpt.us/basic/02-prepare.html 2. 작업환경 준비 · GitBook 2. 작업환경 준비 참고: 만약, 여러분이 현재 사용중인 컴퓨터에 프로그램을 설치 할 수 없는 환경이라면, Codesandbox 의 리액트 샌드박스 를 사용하여 개발을 하시면 됩니다. 앞으로 계속해서 튜토 react.vlpt.us 다음과 같은 항목들을 설치한다. 1. Node.js Webpack과 Babel 같은 도구들이 자바스크립트 런타임인 Node.js를 기반으로 만들어져있다. 때문에 해당 도구들을 사용하려면 Node.js를 설치한다. 2. Yarn 조금 개선된 버전의 npm이라고 생각하면 된다. npm은 Node.js를 설치할 때 같이 오는 패키지 매니저 도구이다. 프로젝트에서 사용되..

• format_list_bulleted Front-End
• · 2023. 6. 14.
• textsms