분류 전체보기
-
[React Hooks] useEffect , useCallback 사용법카테고리 없음 2020. 6. 17. 15:27
useEffect const KaKaoLoginButton = () =>{ const classes = useStyles(); const kakao = new Kakao(); React.useEffect(()=>{ //렌더링 될때마다 작업수행 queryString.parse(history.location.search); }); return ( 카카오로 시작하기 ) } useEffect 는 componentDidMount 와 componentDidUpdate 를 합친 형태라고도한다. 1. 렌더가 다된직후 , 2.상태 업데이트되서 렌더링다시한 직후 에 useEffect를 실행한다. 그러므로 useEffect 사용하면 같은코드를 componentDidMount 와 componentDidUpdate 를 나눌 필..
-
[React에러]InvalidCharacterError: Failed to execute 'createElement' on 'Document': The tag name provided ('/static/media/hanwha-logo.8adf5b39.svg') is not a valid name.개발/react 2020. 6. 17. 10:22
import React from 'react'; import HanwhaLogo from 'src/assets/img/hanwha-logo.svg' const MainFooter = () =>{ return ( POWERED BY ); } export default MainFooter; svg 파일 로드하여 로고를 불러오려했으나 다음 과 같은 에러가 발생했다. svg 를 부를 때는 React component 로 불러야한다. import {ReactComponent as HanwhaLogo} from 'src/assets/img/hanwha-logo.svg' 이렇게 import 하면 정상적으로 svg 파일을 불러올수있다. 개발자 이직 비법 보러가기
-
Flutter 빌드시 Installing build\app\outputs\apk\app.apk 에서 하얀화면과 함께 멈출때개발/flutter 2020. 5. 25. 10:06
빌드를 할때 하얀화면에서 넘어가지않고 터미널에서는 Installing build\app\outputs\apk\app.apk ... 이상태에서 멈춰 있는경우가있다. 높은사양의 디바이스에서는 일어나지않으나 lg g4 g3 같은 저사양 폰에서 일어난다. 설정> 개발자옵션 > 로거버퍼크기 4M 이상으로 높이고 기존앱 삭제및 flutter clean 을실행시킨후 빌드하면 된다.
-
travis CI - elastic beanstalk 연동하기개발/docker 2020. 5. 5. 19:14
깃헙에 푸쉬 되는순간 travis ci 가 도커를 빌드하는 작업을 했었다 이후에는 aws 엘라스틱 빈스타크를 통해 배포하는 작업을 명령하려한다. deploy : # deploy 할때 이거써라 provider : elasticbeanstalk # 빈스타크에 url(region),appname(app) 에 명시되어있음 region : "us-west-2" app : "docker" env : "Docker-env" # s3버킷 s3검색하면나옴 bucket_name : "" bucket_path : "docker" on : branch : master provider 에는 배포할 툴을 명시해주고 region 은 elastic beanstalk 의 url 을 보면 us-west-2 라는 지역이있다. 이 지역은 ..
-
AWS Elastic Beanstalk 시작하기개발/docker 2020. 5. 5. 16:44
elastic bean stalk elasctic beanstalk 를 시작함에앞서 어플리케이션 생성을 해야하는데 위의 부분 설정만해주면 된다. 플랫폼 브랜치의경우 amazon linux 2의경우 플랫폼 버전 이없으므로 amazon linux 를 선택해주면된다. 두번쨰 줄이 url 이될것이다. elastic beanstalk 는 아래 사진의 Load Balancer 를 보면 알수있듯 사용자들이 우리 웹에들어올떄 자동으로 새로운 vm 을 생성해 도커를 run 해준다.
-
travisCI - Github 연동해서 docker 빌드하기개발/docker 2020. 5. 3. 17:18
travis ci 깃헙으로 가입하면 알아서 연동이됨. 깃헙으로 푸시하면 travis ci 가 할일을 하게하기 위함이다. 그 할일을 지정하기 위해서 .travis.yml 을 작성해야한다. 1. docker 를 카피 2. Dockerfile.dev 으로 이미지만들기 3. test run 4. aws 배포 # 권한? sudo: required # we need docker services: - docker # id를 복붙할수업으니 태그사용(아무거나 가능) before_install: - docker build -t khdrogba/docker-react -f Dockerfile.dev . # run test # test 끝나면 exit 함(-e) script: - docker run -e CI=true khd..
-
docker로 react 빌드하기개발/docker 2020. 5. 3. 16:41
docker로 react app 을 빌드하려할때 이미 빌드할때 수많은 npm 패키지들을 설치했으므로 또 다시 설치하는것을 막아야한다. 그리고 nginx 를 사용해 web server 를 만들어야 하는데 이때는 node 가 아닌 nginx 베이스이미지를 써야한다. 그래서 두단계로 나누어진행한다. 1단계에서 node 이미지로 npm install 을 하고 run build 를 한다. 2단계에서 nginx 이미지로 run build의 결과물을 카피한후 start nginx 한다. #build phase FROM node:alpine as builder WORKDIR '/app' COPY package.json . RUN npm install COPY . . RUN npm run build 1단계를 Docker..