본문 바로가기
반응형

전체 글83

[Java] 클래스 1. 인스턴스 메소드는 클래스 맴버에 접근 할 수 있다. 2. 클래스 메소드는 인스턴스 맴버에 접근 할 수 없다. - 인스턴스 변수는 인스턴스가 만들어지면서 생성되는데, 클래스 메소드는 인스턴스가 생성되기 전에 만들어지기 때문에 클래스 메소드가 인스턴스 맴버에 접근하는 것은 존재하지 않는 인스턴스 변수에 접근하는 것과 같다. 2020. 7. 29.
[Gatsby] gatsby develop 오류 gatsby-node를 수정한뒤 여러번 gatsby develop으로 재시작을 하여도, 계속 graphql로 가져온 데이터를 page component로 주지 않아서 `data is undefined` 라는 오류가 사라지지 않았다. 근데 아무리 다르게 해봐도 official docs를 따라 한거라서 코드에 문제는 없다. 계속 해봐도 안되길래 짜증났었는데 어느 순간 된다. 저번에도 이렇더니 이번에도 이렇다. 아주 싸발적이다. 2020. 7. 28.
react-navigation 의 Screen 에 props를 전달하는 방법 1. react-navigation 을 사용할때, 종종 이런 .Screen component에 props를 전달해야하는 경우가 생긴다. 이런경우에는 component에 고차 컴포넌트 형식으로 props를 포함한 컴포넌트를 전달해주면 된다. 아래와 같이 말이다. }/> 2. 하지만, expo에서는 warning이 발생한다. 이와 같이, component의 prop에 inline function을 전달했다는 오류이다. 말 그대로 해석하자면, Inline function을 전달하는 것은, component state가 re-render과정에서 소실될 수 있고, 또한 다시 생성되는 그런 비효율적인 현상이 발생할 수 있다는 경고 이다. 따라서 아래와 같이 코드를 수정하면 이를 해결할 수 있다. }/> 3. 1번의.. 2020. 7. 23.
setState 이후 업데이트 된 상태를 사용하지 못하는 이유. 1. 아래의 코드의 문제점을 찾아보자. const [items, setItems] = useState([]); const onClickEvent = (text) => () => { console.log('called') if (text) { let edit = {id: uuid(), name: name, message: text} setItems([edit,...items]); const upload = async ()=>{ console.log('upload called'); await db.collection('chatting').doc('chatting').update({chats: items})} upload() .then(()=>{console.log('upload finished')}) .ca.. 2020. 7. 16.
Functional Component 에서 Ref 사용법 1. 함수형 컴포넌트에서 렌더링 요소를 가리키기 위해서는 React Hooks 중 하나인 'usRef'를 사용한다. 2. import {useRef} from 'react'; //... const textInputRef = useRef(); //... react native 의 렌더링 요소에서 ref prop로 위에서 할당한 useRef 객체를 넘겨주면된다. 2020. 7. 15.
[React] Webpack - Module not found: Error: Can't resolve 'fs' , 'net' in ... 1. webpack을 사용하던 도중, 모든 것을 정확히 설정하였는데도 불구하고 webpack에서 오류메세지가 뜨기도 한다. node_modules 에 있는 모듈에 대한 오류인데, 에러메세지는 다음과 같다. 'fs'와 'net' 모듈을 resolve 할 수 없다는 에러이다. 사실 이러한 오류는 구글링을 조금만 해보면 바로 나온다. 해결책은 다음과 같다. 2. module.exports = { entry: './server.js', output: { filename: 'compiled.js' }, node: { fs: 'empty', net: 'empty', }, resolve: { extensions: ['.js', '.jsx'] }, module: { rules: [ { test: /\.(js|jsx)$.. 2020. 7. 13.
[React] Webpack - Module not found: Error: Can't resolve ... 1. webpack 을 사용하다가 이런 오류를 마주치곤한다. node_modules 와 관련된 문제라면 그러려니 하겠지만, 내가 import 한 모듈에 대한 문제가 발생한것이다. 그러나 이 에러의 해결법은 간단하다. 2. webpack docs 에서 resolve.extensions 부분을 읽어보면 아래와 같이 설명 되어 있다. resolve.extensions 는 import할때 확장자를 붙이지 않아도 되도록 하는 역할을 한다. 그러므로 webpack.config.js 을 아래와 같이 수정해주면 된다. module.exports = { entry: './server.js', output: { filename: 'compiled.js' }, resolve: { extensions: ['js','jsx'].. 2020. 7. 12.
[React] StaticRouter app.get('/*', (req, res) => { const context = {}; const app = ReactDOMServer.renderToString( ); }); The StaticRouter component expects a location and a context prop. We pass the current url (Express’ req.url) to the location prop and an empty object to the context prop. The context object is useful to store information about a specific route render, and that information is then made available to.. 2020. 7. 12.
TypeError: Cannot read property 'map' of undefined 1. import React, {Component} from 'react'; import {fromJS} from "immutable"; import {fetchUsers} from "./api"; export default class UsersContainer extends Component { state = { data: fromJS({ users: null, }) } get data() { return this.state.data; } set data(data) { this.setState({data}) } componentDidMount() { fetchUsers().then(users => { this.data = this.data.set('users', fromJS( users )) }) } .. 2020. 7. 12.
[React] react-router-dom 1. 라우터 자체는 아무것도 렌더링 하지 않는다. 단지 현재 URL에 따른 컴포넌트의 렌더링 여부를 결정한다. 만약 path 프로퍼티가 현재의 URL과 일치할 경위 Route는 MyComponent 컴포넌트로 대체된다. 2. 은 복수의 자식을 갖는 것을 좋아하지 않기 때문에, 요소를 포함해야 한다. (리액트&리액트 네이티브 통합 교과서) 2020. 7. 11.
반응형

티스토리툴바