'1. 연구 모듈/비분류' 카테고리의 글 목록 (3 Page)

'1. 연구 모듈/비분류'에 해당되는 글 30건

2017.08.03 [겉핥기 프로젝트] React Native 설치 및 샘플 코드 실행 (안드로이드)
2017.07.17 [겉핥기 프로젝트] 자바스크립트 Canvas 라이브러리 Fabric.js
2017.06.28 라즈베리파이 제로 TRAVELShooting
2017.06.09 테스트용 웹 서버 간단히 구동하기 (Node.js 사용)
2017.02.12 Atom 에디터에서 Markdown -> 마인드맵 변환하기
2017.02.11 Perl을 사용하여 Markdown -> HTML로 변환하기
2016.12.02 [겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (이클립스 개발환경)
2016.11.22 [C++] STL map 사용시 주의사항

[겉핥기 프로젝트] React Native 설치 및 샘플 코드 실행 (안드로이드)

1. 연구 모듈/비분류 2017. 8. 3. 00:00

React Native는 react 문법을 사용하여 WebApp이 아닌 모바일 Native 앱을 작성할 수 있게 하는 기능을 제공한다.(안드로이드, 아이폰 지원)

[참고] 데스크탑용으로는 Native 어플리케이션 작성을 지원하는 react-native-macos(OSX용), react-native-windows(윈도우용)가 있고, WebApp 형태로 작성할 경우 OS별 테마가 적용된 react component인 react-desktop이 있다.

사전 설치 요구사항

Node.js
안드로이드 스튜디오

안드로이드 스튜디오 세팅

SDK Manager를 실행한다.
Android 6.0 SDK(Marshmallow, API Level = 23)를 설치한다. (주의: 현재 Android 7.0 SDK는 지원하지 않는다)
AVD Manager를 실행한다.
6.0 SDK를 사용하여 AVD를 생성한다.

React Native 설치

커맨드라인 상에서 아래와 같이 입력하여 React Native를 설치한다.
```
npm install -g react-native-cli
```

샘플 프로젝트 생성 및 실행

커맨드라인 상에서 아래와 같이 입력하면 샘플 프로젝트가 생성된다.
```
react-native init 생성할-프로젝트명
```
=> [참고] react-native init시 Unexpected token … 에러가 발생하는 경우
AVD(안드로이드 에뮬레이터)가 실행되어 있는 상태에서 아래와 같이 입력하면 프로젝트가 빌드되어 에뮬레이터 상에 실행되는 것을 볼 수 있다.
```
react-native run-android
```
[참고] IOS용 실행 커맨드는 참고로 다음과 같다.
```
react-native run-ios
```

참고 사이트

https://www.tutorialspoint.com/react_native/ - 튜토리얼

<테스트 환경>
- OS : Windows 7
- 안드로이드 스튜디오 버전 : 2.3.3
- node.js 버전 : 6.11.2
- react-native-cli 버전 : 2.0.1

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

Pandoc을 사용하여 Markdown -> HTML 변환하기 (0)	2017.12.18
[React Native] react-native init시 Unexpected token ... 에러가 발생하는 경우 (0)	2017.08.06
[겉핥기 프로젝트] 자바스크립트 Canvas 라이브러리 Fabric.js (0)	2017.07.17
라즈베리파이 제로 TRAVELShooting (0)	2017.06.28
테스트용 웹 서버 간단히 구동하기 (Node.js 사용) (0)	2017.06.09

[겉핥기 프로젝트] 자바스크립트 Canvas 라이브러리 Fabric.js

1. 연구 모듈/비분류 2017. 7. 17. 00:00

자바스크립트로 되어있는 HTML5 Canvas 라이브러리

사용 준비

다음 홈페이지에서 Fabric.js 최신 버전들 다운받아 압축을 푼다.
- http://fabricjs.com/

dist/ 디렉토리 밑의 fabric.min.js(배포용) 혹은 fabric.js(개발용) 파일을 포함하여 아래와 같이 뼈대 코드를 작성한다.

index.html

<html>
<head>
    <script src="fabric.min.js"></script>
    <meta charset="utf-8">
</head>

<body>
    <canvas id="c" width="400" height="400" style="border:1px solid #000000"></canvas>
    <script>
        // 이 부분에 fabric js 코드가 들어간다.
    </script>
</body>
</html>

사용 예제

다음은 작은 사각형을 그리는 예제이다.

// create a wrapper around native canvas element (with id="c")
var canvas = new fabric.Canvas('c');

// create a rectangle object
var rect = new fabric.Rect({
  left: 100,
  top: 100,
  fill: 'red',
  width: 20,
  height: 20
});

// "add" rectangle onto canvas
canvas.add(rect);

다음은 간단히 이미지 파일을 표시하는 예제이다. (같은 경로에 my_image.png 파일이 필요하다.)

// create a wrapper around native canvas element (with id="c")
var canvas = new fabric.Canvas('c');

fabric.Image.fromURL('my_image.png', function(oImg) {
  // scale image down, and flip it, before adding it onto canvas
  oImg.scale(0.5).setFlipX(true);
  canvas.add(oImg);
});

Canvas vs. StaticCanvas

Fabric.js는 기본적으로 각 오브젝트에 아래와 같이 크기 변경, 이동 및 회전이 가능한 핸들이 붙어서 출력되게 된다.

이를 원하지 않을 경우는 Canvas 대신에 StaticCanvas를 사용하여 Canvas를 생성하면 된다.

var canvas = new fabric.StaticCanvas('c');

참고 사이트

http://fabricjs.com/articles/ - tutorial

<테스트 환경>
- OS : Windows 7
- Fabric.js 버전 : 1.7.16

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

[React Native] react-native init시 Unexpected token ... 에러가 발생하는 경우 (0)	2017.08.06
[겉핥기 프로젝트] React Native 설치 및 샘플 코드 실행 (안드로이드) (0)	2017.08.03
라즈베리파이 제로 TRAVELShooting (0)	2017.06.28
테스트용 웹 서버 간단히 구동하기 (Node.js 사용) (0)	2017.06.09
Atom 에디터에서 Markdown -> 마인드맵 변환하기 (0)	2017.02.12

라즈베리파이 제로 TRAVELShooting

1. 연구 모듈/비분류 2017. 6. 28. 03:22

1. 모니터 / 키보드 없이 USB로 연결하기 ==> 가운데 포트에서만 동작

2. Modmypi Wifi Dongle ==> 가운데 포트에서만 동작

3. 따라서 USB로 연결하여 Modmypi Wifi Dongle 사용하기는 불가 (ㅠㅠ)

==> 알고봤더니 가운데 포트만 USB 포트. 가장자리 포트는 단지 전원 포트라고 함.

4. Raspian 사용시 디폴트로 SSH가 막혀있다. 이를 Enable 하기 위해서는 윈도우 파티션 루트에 ssh(확장자 없이)라는 이름의 빈 파일을 생성한 후 부팅한다.

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

[겉핥기 프로젝트] React Native 설치 및 샘플 코드 실행 (안드로이드) (0)	2017.08.03
[겉핥기 프로젝트] 자바스크립트 Canvas 라이브러리 Fabric.js (0)	2017.07.17
테스트용 웹 서버 간단히 구동하기 (Node.js 사용) (0)	2017.06.09
Atom 에디터에서 Markdown -> 마인드맵 변환하기 (0)	2017.02.12
Perl을 사용하여 Markdown -> HTML로 변환하기 (0)	2017.02.11

테스트용 웹 서버 간단히 구동하기 (Node.js 사용)

1. 연구 모듈/비분류 2017. 6. 9. 06:38

HTML과 자바스크립트 등으로 구성된 웹 서버 소스가 있을 때, 간단히 테스트용 웹서버 구동하기 (Node.js 사용)

설치
```
npm install -g http-server
```
실행
```
http-server <폴더명>
```

또 다른 방법 (global로 설치 필요없음)

npx http-server <폴더명>

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

[겉핥기 프로젝트] 자바스크립트 Canvas 라이브러리 Fabric.js (0)	2017.07.17
라즈베리파이 제로 TRAVELShooting (0)	2017.06.28
Atom 에디터에서 Markdown -> 마인드맵 변환하기 (0)	2017.02.12
Perl을 사용하여 Markdown -> HTML로 변환하기 (0)	2017.02.11
[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (이클립스 개발환경) (0)	2016.12.02

Atom 에디터에서 Markdown -> 마인드맵 변환하기

1. 연구 모듈/비분류 2017. 2. 12. 01:05

사전 준비사항

Atom 에디터에서 Markdown -> 마인드맵 변환하기 위해서는 markdown-mindmap 패키지 설치가 필요하다.

사용 방법

아래와 같이 헤드라인 요소를 사용하여 작성한 내용을 마인드맵으로 변환할 수 있다. <h1> ~ <h6>까지만 존재하므로 최대 깊이는 6으로 제한된다.

# Root Node
## Node 1
### Node 1-1
### Node 1-2
## Node 2
### Node 2-1

Packages 메뉴에서 Mindmap view를 켜면 아래와 같이 변환된 내용을 볼 수 있다.

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

라즈베리파이 제로 TRAVELShooting (0)	2017.06.28
테스트용 웹 서버 간단히 구동하기 (Node.js 사용) (0)	2017.06.09
Perl을 사용하여 Markdown -> HTML로 변환하기 (0)	2017.02.11
[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (이클립스 개발환경) (0)	2016.12.02
[C++] STL map 사용시 주의사항 (0)	2016.11.22

Perl을 사용하여 Markdown -> HTML로 변환하기

1. 연구 모듈/비분류 2017. 2. 11. 04:52

설치

Perl 프로그램을 설치한다. 여기서는 윈도우용 구현체 중 하나인 Strawberry Perl을 사용한다.
- https://www.perl.org/get.html
- http://strawberryperl.com/
마크다운 본진에서 마크다운 스크립트를 다운받는다.
- https://daringfireball.net/projects/markdown/

사용법

결과를 화면으로 출력
```
perl markdown.pl inputfile.txt
```
결과를 파일로 저장 (헤더는 붙지 않는다)
```
perl markdown.pl inputfile.txt > outputfile.html
```

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

테스트용 웹 서버 간단히 구동하기 (Node.js 사용) (0)	2017.06.09
Atom 에디터에서 Markdown -> 마인드맵 변환하기 (0)	2017.02.12
[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (이클립스 개발환경) (0)	2016.12.02
[C++] STL map 사용시 주의사항 (0)	2016.11.22
[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (Maven - 커맨드라인 개발환경) (0)	2016.09.07

[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (이클립스 개발환경)

1. 연구 모듈/비분류 2016. 12. 2. 06:13

사전 설치 요구사항

JDK 8
Eclipse EE버전

설치

Eclipse를 실행한다.
Help -> Eclipse Marketplace 메뉴를 실행한다.
vaadin으로 검색한다.
Vaadin Plugin for Eclipse를 설치한다.

프로젝트 생성

File -> New -> Project 메뉴를 선택한다.
Vaadin/Vaadin X Project 항목을 선택 후, 다음을 누른다.
프로젝트 명을 입력한다.
기본적인 예제 코드를 포함하는 프로젝트가 생성된다.

프로젝트 실행

프로젝트 오른쪽 클릭 후, Run As -> Run On Server 메뉴를 선택한다.
Next 버튼을 누른다.
실행할 프로젝트를 왼쪽에서 오른쪽으로 이동 후, Finish 버튼을 누른다.

<테스트 환경>
OS : Windows 7
Eclipse 버전 : Mars
Vaadin Plug-in 버전 : 2.3.6

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

Atom 에디터에서 Markdown -> 마인드맵 변환하기 (0)	2017.02.12
Perl을 사용하여 Markdown -> HTML로 변환하기 (0)	2017.02.11
[C++] STL map 사용시 주의사항 (0)	2016.11.22
[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (Maven - 커맨드라인 개발환경) (0)	2016.09.07
SyntaxHighlighter 적용하기 위한 태그 & 언어 종류 (0)	2015.08.28

[C++] STL map 사용시 주의사항

1. 연구 모듈/비분류 2016. 11. 22. 05:59

Embed from Getty Images

레퍼런스에 있는 내용이지만, 자주 까먹는 내용..

STL map 사용시, [] 연산자를 사용하여 참조를 할 때, 해당 엔트리가 없을 경우 엔트리가 추가된 후 NULL이 리턴된다.

map<A, B> some_map;

...

C = some_map[D];

엔트리가 추가되는 것을 원하지 않을 경우, find() 함수를 사용하여 미리 확인 후 참조하여야 한다.

if (some_map.find(D) != some_map.end()) {

C = some_map[D];

}

저작자표시 비영리 동일조건

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

Perl을 사용하여 Markdown -> HTML로 변환하기 (0)	2017.02.11
[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (이클립스 개발환경) (0)	2016.12.02
[겉핥기 프로젝트] Vaadin 샘플 코드 실행하기 (Maven - 커맨드라인 개발환경) (0)	2016.09.07
SyntaxHighlighter 적용하기 위한 태그 & 언어 종류 (0)	2015.08.28
[TortoiseSVN] 커맨드 프롬프트 상에서 TortoiseSVN 기능 사용하기 (0)	2015.07.22

이전 1 2 3 4 다음

« 2024/12 »
일	월	화	수	목	금	토
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31

'1. 연구 모듈/비분류'에 해당되는 글 30건

사전 설치 요구사항

안드로이드 스튜디오 세팅

React Native 설치

샘플 프로젝트 생성 및 실행

참고 사이트

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

사용 준비

사용 예제

Canvas vs. StaticCanvas

참고 사이트

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

또 다른 방법 (global로 설치 필요없음)

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

사전 준비사항

사용 방법

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

설치

사용법

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

사전 설치 요구사항

설치

프로젝트 생성

프로젝트 실행

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

'1. 연구 모듈 > 비분류' 카테고리의 다른 글

카테고리

최근에 올라온 글

최근에 달린 댓글

태그목록

달력

글 보관함

티스토리툴바