안드로이드 & 지멘스 프로그래밍

Axios 1. react 에 권고 2. 설치 필요 3. fetch 보다 기능 많음. 4. Promise based 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 let url = 'https://someurl.com'; let options = { method: 'POST', url: url, headers: { 'Accept': 'application/json', 'Content-Type': 'application/json;charset=UTF-8' }, data: { property_one: value_one, property_two: value_two } }; let response = await axios(options); let responseOK ..

안녕하세요. 훈츠입니다. 금일은 리덕스 사가에 대해 정리 합니다. 몇몇 한국 블로거들 및 유투버의 도움으로 2일간 학습하며 실습 했는데, 기본이 부족 해서 이해? 하는데 힘들었습니다. 잘안되서 그냥 쓰지 말까? 고민하다가 어느 인도 유투버님의 동영상을 보고 정리 했습니다. 여러므로 감사하네요. ^^ 저도 누군가에게 인도 유투버님 같은 사람이 되고 싶다는 마음에 글을 적어 봅니다. 물론 부족 하지만 초보자가 겪은일을 다시 초보자가 본다면 도움이 될것 같아서요. 리액트 비동기 처리 리액트에서 비동기 처리를 하기 위해서 몇가지 방법이 제시 됩니다. 1. 클래스 : componentDidMount() 와 callApi 2. 함수 : useEffect(()) 3. 성큰 (사용 안해봤습니다.) 4. 리덕스사가 클래..

안녕하세요. 훈츠입니다. 금일은 노드JS 익스프레스 서버와, 리액트와의 통신을 위한 글을 남깁니다. 사실 간단하게 프록시 설정하면 된다고했는데, 안되서 몇일 고생했어요. 외국 개발자분이 소개해주신 블로그 보고 해결했네요. ^^ 아하 모멘트~~~~!! 클라이언트 Json 파일을 이용한 프록시 설정 [노드 JS Express and React] yarn dev 를 이용한 서버와 리액트 프론트 동시실행 안녕하세요. 훈츠입니다. 금일은 노드JS Express 서버와 리액트 클라이언트를 동시에 실행하는 방법에 대해 포스팅 합니다. 목 차 프로젝트 트리 구조 관련 라이브러리 설치 JSON 파일 수정하기 - 서 rain2002kr.tistory.com 위의 방법으로 하였는데, 안되서 아래 미들웨어를 설치 하여 해결했..

안녕하세요. 훈츠입니다. 금일은 리액트 기본포트 3000번 포트를 변경하는 방법에 대해 포스팅 합니다. 실행 포트 변경방법 다음 두가지 방법이 있습니다. 첫번째 방식은 간단 합니다. Package.json 파일에 스크립트 스타트 부분 변경 react-scripts start 파일에 포트 주는 부분을 직접 변경 package.json 파일 수정 위와 같이 간단하게 "set PORT = 3002 "라고 추가 해주면 됩니다. react-scripts start 파일 구조 및 찾아보기 위의 스크립트 파일을 가리키는 곳이 어딘지 몰라 찾아 보았습니다. 그안에서 포트 변경해도 됩니다. 굳이 이곳 까지 들어와서, 변경하는것보다는 첫번째 방식을 선호 합니다.

훈츠의 블로그 안녕하세요. 훈츠입니다. 기억 이라는것이 무섭네요. ㅎㅎ Create-React-App 프로젝트 시작 하는 방법 입니다. 목 차 npm install create-react-app -g 프로젝트 폴더 만들기 프로젝트 폴더에 create-react-app 폴더 만들기 npm start or yarn start 로 확인 create-react-app -g 설치 create-react-app 프로젝트를 시작 하기 위해서, 저 모듈을 설치 해야 합니다. 설치를 위해서는 당연이 node.js 와 npm이 설치가 되어 있어야 겠죠? 아래와 같이 어느 폴더 에서도 실행 가능하도록 -g 옵션을 줍니다. 실행법 c:> npm install create-react-app -g 위와 같이 입력하면 create..

훈츠의 블로그 입니다. 안녕하세요. 훈츠입니다. 요즘 Web 프로젝트를 경험해보고 싶어서 새롭게 공부하고 있는 리액트 리덕스에 대한 정리 글입니다. 저 역시 리덕스를 잘모르는 관계로 정리 형태로 글을 남겨 봅니다. 원래 알고 있는데 기억이 안나시는 분에게는 도움이 될것 같습니다. 사실, 제가 나중에 기억 안날까봐 적는것도 있어서요. ^^ 글 목록 리덕스 설명 및 설치 방법 리덕스 동작 레이아웃 설명 리덕스를 이용한 샘플 프로그램 동작 설명 리덕스를 이용한 샘플 프로그램 코드 설명 리덕스 DEV TOOL : 시간 여행 가능 Log 및 status 샘플 프로그램 코드 공유 리덕스 란? ( 원 스토어 시스템 ) 리덕스 스토어라는 곳에 하나의 저장소를 만들고, 다른 여러곳에서 이 저장소에 있는 내용을 읽고 쓰게..

훈츠의 블로그 입니다. 안녕하세요. 훈츠입니다. 요즘 Web 프로젝트를 경험해보고 싶어서 새롭게 공부하고 있는 리액트에 대한 정리 글입니다. 저 역시 리액트를 잘모르는 관계로 정리 형태로 글을 남겨 봅니다. 심도 있게 리액트를 학습해보시길 원하시면 생활코딩 혹은 다른 글을 참조하세요. 글 목록 CRUD 란? Create 구현 및 설명 리액트 에서 Form 태그 사용법 배열에서 push 와 concat 의 차이 shouldComponentUpdate 함수로 랜더링 결정하기 배열에서 concat 대신 사용하는 Array.From 함수 객체에서 concat 처럼 내용을 복사하는 Object.assign 함수 JavaScript 의 코드의 변칙성을 일관 시켜주는 immutable.js CRUD 란? Create..

안녕하세요. 훈츠입니다. 요즘 Web 프로젝트를 경험해보고 싶어서 새롭게 공부하고 있는 리액트에 대한 정리 글입니다. 저 역시 리액트를 잘모르는 관계로 정리 형태로 글을 남겨 봅니다. 심도 있게 리액트를 학습해보시길 원하시면 생활코딩 혹은 다른 글을 참조하세요. 글 목록 콤포넌트 관련 간단한 설명 Props, State, Event Props 사용법 State 사용법 Event 사용법 코드 공유 콤포넌트 관련 간단한 설명 Props, State, Event 리액트에서는 콤포넌트를 상속하여, 새로운 콤포넌트를 만들수 있습니다. 이때 안에는 rander 함수를 호출하게 되어있는데 이 Rander 함수가 유사 자바스크립트, 유사 HTML 을 자바스크립트와 HTML 코드로 바꿔주는 일을 합니다. 그리고 유사 자..