bekusib's develop story bekusib's develop story

react

• React 프로젝트 생성하기

  Frontend/react 2020. 1. 6. 15:31

  리엑트 글로벌 패키지 설치 npm install -g create-react-app 프로젝트 생성 create-react-app [프로젝트명] 생성 완료 babel, webpack 등 dependency package들은 ./node_modules/react-scripts 에 설치 되어 package.json엔 보이지 않는다. // package.json { "name": "", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.3.2", "@testing-library/user-event": "^7.1.2", "react": "^16..

  Read More
• [react native] 안드로이드 상태바 겹침 현상 해결 (Android header is overlapped)

  Frontend/react-native 2019. 9. 4. 15:49

  expo react native 앱을 개발하는데 아래 캡쳐와같이 상단에 상태바와 헤더가 겹치는 현상이 발생했다. 해결책을 찾아 구글링을 하고 https://github.com/react-navigation/react-navigation/issues/1478#issuecomment-301220017 Android header is overlapped · Issue #1478 · react-navigation/react-navigation On iOS I see this On Android I see this.. The code uses defaults const AppRoot = StackNavigator({ Home: { screen: HomeScreen, navigationOptions: ({ navi..

  Read More
• React chat app with serverless websocket (미완)

  Infra/AWS 2019. 8. 28. 16:55

  React 채팅 앱 & serverless websocket 예제사이트 serverless websocket 이해를 위해 websocket을 사용한 React 채팅 앱 예제를 따라해본다. 기본적으로 serverless websocket와 cognito 개념이 필요하다. 먼저 git에서 예제소스를 clone 한다. 구조는 크게 ./backend 와 ./frontend로 나뉘어져 있다. cognito User pool을 하나 만들어준다. ( 만드는 방법은 구글링) Pool id를 확인 할 수 있다. App clients 카테고리에 들어가면 App Client id를 확인 할 수 있다. 만약 없을 경우 새로운 App client를 생성하면 된다. backend us-east-1에서 테스트를 할 것이기때문에 r..

  Read More
• [react native] icon list (link)

  Frontend/react-native 2019. 8. 14. 17:24

  https://oblador.github.io/react-native-vector-icons/ react-native-vector-icons directory oblador.github.io https://docs.nativebase.io/Components.html#anatomy-headref Components · NativeBase type Ionicons AntDesign, Ionicons, Entypo, EvilIcons, Feather, FontAwesome, FontAwesome5, Foundation, MaterialIcons, MaterialCommunityIcons, Octicons, Roboto, rubicon-icon-font, SimpleLineIcons, Zocial Specif..

  Read More
• [Solved] Failed updating the 'react-native-numeric-input' component..

  Frontend/react-native 2019. 8. 13. 18:09

  https://www.npmjs.com/package/react-native-numeric-input react-native-numeric-input a stylish numeric input for react native www.npmjs.com 개발하는 앱에 위의 numeric input 컴포넌트를 적용했다. 그런데 랜더링시 value부분이 업데이트가 계속 안되어서 내 코드 문제인줄 알고 한참을 헤맸다.. 알고보니 모듈내 소스코드의 문제였다.. 해답 출처: https://github.com/himelbrand/react-native-numeric-input/issues/13 Value not updating on Numeric Input · Issue #13 · himelbrand/react-nati..

  Read More