목록분류 전체보기 (385)
만족
이미 다른 RecyclerView에 사용된 LayoutManager를 사용하려 할 때 발생하는 문제다 해결법은 그냥 각각 만들어서 주면 된다
기존 사용하던 서버에서 Apache+php 조합을 사용하고 있기 때문에 nginx를 새로 설치하기는 부담스러워 apache+express 조합으로 서비스할 것이다. node/npm은 기존에 설치되었다고 가정한다. 설치하지 않았다면, soojae.tistory.com/25 를 참고해 설치를 진행하면 된다. apache의 경우엔 단순히 sudo apt-get install apache2 하면 된다. 버전 정보 Ubuntu 16.04 Apache 2.4.18 아파치 설정 sudo nano /etc/apache2/sites-avaliable/000-default.conf 를 이용해 vhost정보를 수정할 것이다. ... ServerName [도메인명(ex: test.com)] ServerAdmin [관리자 이메..
http://test.com 에 배포하기로 했다고 해보자. npm run build (yarn build)로 빌드한 후, 서버에 업로드했을때 정상적으로 표시되는 것으로 보인다. 그런데 /가 아닌 다른 경로로 처음 접속하면 404 페이지가 보인다. 리액트 프로젝트를 빌드하면 html파일은 index.html하나뿐이기 때문에 /, /index.html이 아니면 다른 경로로 접속했을 때 index.html을 읽어올 수 없기 때문이다. 즉, 어떤 경로로 접속하더라도 index.html 파일을 읽을 수 있도록 apache설정을 조금 만져주어야 한다. Ubuntu 16.04, Apache 2.4.18을 기준으로 설명한다. sudo nano /etc/apache2/apache2.conf 설정파일을 열고 (nano 대..
waifu2x.udp.jp/index.html waifu2x waifu2x Single-Image Super-Resolution for Anime-Style Art using Deep Convolutional Neural Networks. And it supports photo. Show full demonstration | Go to GitHub This website uses Google Analytics to help us improve the website content. waifu2x.udp.jp 다른 곳도 많지만 대부분 몇개까지만 무료로 변환해주고 결제를 요구하는데 위의 사이트에서는 무료로 무제한 변환이 가능하다. 그 대신 하나씩 해야 한다는 단점이 있다... 성능 확실하구만...
오류 로깅이나, 버그 접수 시 사용중인 버전 정보 확인이 필요하다. 그래서 package.json을 임포트하여 version값을 뽑아오려 했으나 오류가 발생한다. package.json은 프로젝트 루트 위치(src보다 상위 레벨임)에 있기 때문에 임포트가 불가능하다. 따라서 다른 방법을 사용해야 한다. ... "scripts":{ "start": "node scripts/start.js", "build": "node scripts/build.js", ... } ... package.json의 scripts 값을 보면 다음처럼 되어 있을 것이다. 여기서 nodejs에 환경 변수를 넣어줄 것이다. ... "scripts":{ "start": "REACT_APP_VERSION=$npm_package_versi..
리액트로 개발 도중 에러가 발생하면 다음과 같은 화면을 볼 수 있다. 그런데 이건 개발 중일 때 보여지는 화면이고, 프로덕션에서 오류가 나면 아무것도 표시되지 않는다. 말 그대로 페이지가 백지가 되버린다. 당연히 사용자 경험상으로 좋지 않을 뿐더러, try-catch로 모든 컴포넌트의 로직을 감쌀 수도 없는 노릇이니 개발자로서도 에러가 어디서 어떻게 발생하는지 가늠하기도 어렵다. 이럴 때 Error Boundary를 사용하면 문제가 해결된다. class ErrorBoundary extends React.Component { constructor(props) { super(props); this.state = { hasError: false }; } static getDerivedStateFromError..
window.addEventListener('online', ()=>{ /*끊김->연결로 변경될 때 호출*/}); window.addEventListener('offline', ()=>{ /*연갤->끊김으로 변경될 때 호출*/}); window.navigator.onLine //true== connected, false == disconnected 몇몇 웹사이트는 네트워크 끊김/연결될 때 시각적으로 알려주던게 신기해서 한번 알아봤다.
HOC가 뭘까? A higher-order component (HOC) is an advanced technique in React for reusing component logic. HOCs are not part of the React API, per se. They are a pattern that emerges from React’s compositional nature. Concretely, a higher-order component is a function that takes a component and returns a new component. HOC는 리액트에서 컴포넌트 로직 재사용을 위해 사용하는 고급 기술입니다. HOC는 React API의 일부가 아니며, 단지 리액트의 집합 특성에..