개발일기/리액트6 [Centos7 + NodeJS]/ Centos에 NextJS기반 React 배포(웹사이트 서버에 올리는 방법) - 준비물 : Centos7, 완성된 React + NectJS 기반 결과물 개요 centos7, node 16설치 도메인 연결 front port 3000연결 (80으로 들어오는 포트 3000으로 우회하기 pm2 사용해서 node 무중단 프로세스 만들기 centos에 yarn 설치 (선택) curl --silent --location https://rpm.nodesource.com/setup_10.x | sudo bash - node설치 $curl -sL https://rpm.nodesource.com/setup_16.x | sudo bash $sudo yum install nodejs 버전 확인 $node --version $npm --version git 설치, clone $cd /home $mkd.. 2022. 1. 6. [react/es] 리액트 setState 값 적용 안될 때 이벤트 연결 하는 방법 #1 pakage.json "devDependencies" 아래 @babel/plugin-proposal-class-properties 추가 후 $npm install (yarn install) #2 construct 아래 선언해주던 state를 밖으로 빼고, 작성하던 setState형태도 arrow 방식으로 변경해 작성한다 그리고 함수호출 및 onClick에서 호출 방식도 아래와 같이 작성한다 #3 before / after 전체 소스 비교 import React, { Component } from 'react'; class Row extends Component { constructor(props){ super(props); this.state = { monitor_box_stat.. 2021. 3. 23. React에서 다음 KaKao 지도 API 사용 하는법 - 클릭이벤트, 좌표를 주소로 변환 geocoder, 커스텀 인포윈도우 등 요점 정리 리액트로 인포 윈도우 넣는 방법, geocoder 좌표-주소 변환하는 방법 등은 kakao api에 나와있지 않아 좀 애를 먹었죠 그래서 시험치기전 보는 필승 공략집 처럼 요점 정리 노트 하나 만들어 놓으면 좋을듯 해서 작성해봅니다. 다음 지도 시작하기 단순하게 지도를 띄우는건 간단한 코드 몇줄만으로도 가능합니다 우선 kakao map api 키를 발급 받고 index.html head라인에 다음과 같은 코드를 추가합니다. 그런다음 맵을 구현할 컴포넌트인 를 만들고 다음과 같이 작성해주었습니다. /*global kakao*/ import React from 'react'; class PopUp extends React.Component { constructor(props) { super(props); }.. 2020. 3. 3. 리액트 'img elements must have an alt prop, either with meaningful text, or an empty string for decorative images' 버그 해결 방법 위와 같이 적어서 버그가 났었음. 해결 방법 : alt="" 추가 해줌으로써 해결 alt 추가 해주니 버그남 이유는 차차 알아봐야 겠다... 알다가도 모를 ...이 아닌 까도까도 계속 모르는게 나오는 리액트의 세상 2020. 2. 5. 이전 1 2 다음
