Browse Tag: 개발환경

[블록체인]스마트계약 2(geth 설치)

ether 개발 환경을 설정하는 과정에 대해 설명하는 글이다.

Geth를 사용하기 위해서는 “Go”가 먼저 설치 되어야 한다.

Go를 설치하는 과정은 편한 방법으로…

우선 우분투 환경(AWS 우분투 사용)에서

Go version 을 확인했으면 Go 설치완료

geth version 확인 했으면 geth 설치완료

 

이후 ether를 사설 테스트넷에서 사용해보기 위해서는 최초 블럭 정보가 필요하다. 최초 블록 정보가 포함된 파일을 ether에서는 genesis 파일이라고 부른다.

원하는 위치에 genesis.json 을 만들고 geth 에 genesis 파일의 위치를 알려주면 된다.

genesis.json 파일

이후 geth에 genesis.json 의 위치를 등록시켜 주자

그리고 geth을 console에서 실행시켜 주면 ether 개발 환경 준비 끝

 

 

출처 : 블록체인 애플리케이션 개발실전 입문@위키북스

[ReactJS] ReactJS 튜토리얼 따라하기 – 개발 환경 구성

이번 글은 https://facebook.github.io/react/tutorial/tutorial.html 의 튜토리얼을 따라해본 것이다.

Javascript 로 Jquery를 주로 사용했던 개인 경험에 비춰보면 이건 신세계다.

마치 backend에서 빌드 파이프라인을 구축하듯이 front-end 또한 파이프라인을 구축한다. (튜토리얼에 따르면 파이프라인 없이도 ReactJS를 사용 가능하다.)

“A modern build pipeline” 은 3가지로 구성되어 있다.

  1. package manager : npm , yam 같은 페키지 매니저 들인데, 이들은 에코시스템의 third-party 패키지들을 쉽게 설치/업데이트 가능하도록 도와준다.
  2. bundler : webpack, browserify 등이 있는데 Javascript의 모듈화를 도와주는 도구들이다. 모듈들을 작성하여 webpack으로 컴파일 하면 bundle.js 를 생성할 수 있는데 이를 통해 브라우져에서 실행 할수 있게 되는 구조이다. 자세한 내용은 http://d2.naver.com/helloworld/0239818
  3. compiler:  Babel 등이 있는데 ES6 같은 모던 javascript 문법들로 작성된 javascript 파일을 브라우져가 인식 할 수 있는 파일로 만들어 주는 도구들이다.

http://www.looah.com/article/view/2054 (사랑해요 javascript)

위의 3가지를 갖춘 후 ReactJS를 설치하고 사용해보자

npm 설치 후 webpack은 여기서 , Babel은 여기서. npm만 설치 된다면 다른 도구들 설치는 어렵지 않음(npm은 세계에서 가장 많은 모듈을 가진 저장소)

webpack을 베이스로 babel 모듈을 설치해서 개발 환경을 구성하였다.

webpack 에서 babel을 이용해서 빌드 할 경우 아래 두가지는 npm으로 설치

npm install –save-dev babel-preset-es2015
npm install –save-dev babel-preset-react

프로젝트 파일 구조는 일단 이렇게 가보자 ( 참고 : https://velopert.com/814 )

 

.

├── package.json        
├── dist            # 서버 운영 파일
│   └── index.html    # 메인 페이지
├── src               # React.js 프로젝트 루트
│   ├── components    # 컴포넌트 폴더
│   │   └── App.js    # App 컴포넌트
│   └── entry.js      # Webpack Entry point
└── webpack.config.js # Webpack 설정파일
이렇게 환경이 구성되면이제 드디어 ReactJS 튜토리얼을 따라해볼 수 있다.
개발 환경 구성이 길어지면서 튜토리얼 내용은 다음 글에서 정리하겠다.
p.s ReactJS는의 클래스는 첫글자가 대문자인 캐멀 네이밍 룰을 따른다는것을 기억하자
실제 튜토리얼은 여기서