Copy Coding

아마존에서 쇼핑할 때 영어를 몰라도 사진이 잘 나와 있어서 제품과 가격만 보면 되기 때문에

번역의 필요성이 그리 크지 않지만 사용법이 간단해 잠시 알아보도록 하겠습니다.

1. 영어 번역하기

아마존 사이트에 들어가서

페이지 아무 곳에서나 마우스 우측 버튼을 클릭 합니다.

그럼 메뉴 창이 나타 나는데

[한국어(으)로 번역]을 선택 합니다.

그럼 바로 번역됨 창이 나타나고 상세 설정을 할 수 있는 메뉴가 있습니다.

여기서 [원본보기]를 선택하면 다시 영문으로 설정 하는거고

[옵션]을 선택하면 상세 설정 창이 하단에 나타납니다.

여기서 [영어 항상 번역]을 클릭하고 한글로 쇼핑을 합니다.

2. 영어 번역 취소

번역 취소는 브라우저의 url 입력란 뒤에 있는 조그마한 아이콘을 클릭하면 메뉴 창이 나타납니다.

여기에서 [원본보기]를 선택하면 해당 페이지만 영문 원본으로 볼 수 있습니다.

[옵션] 메뉴를 클릭해서 나오는 하단 메뉴 중 [영어 번역 안함]을 선택 하면 번역이 완전 취소 됩니다.

WebStorm으로 기존에 eclipse로 생성했던 프로젝트를 하나 실행해 보려고 합니다.

WebStorm 설치 방법은 단순하지만 필요하다면 아래 링크를 참조 합니다.

[WebStrom] 웹스톰 설치 (WebStorm-2018.3.2.)

설명은 4단계로 진행 됩니다.

1. WebStorm 실행

2. 프로젝트 열기

3. 프로젝트 실행

4. 결과 확인

1. WebStorm 실행

설치된 웹스톰 프로그램을 실행 합니다.

2. 프로젝트 열기

기존에 작성한 프로젝트를 실행해 보려고 하는 것이니 Open을 선택 합니다.

아이콘 테스트를 했었던 myNgProject가 눈에 띄는군요.

선택하고 [OK] 버튼을 클릭 합니다.

프로젝트가 WebStorm으로 올라 옵니다.

WebStorm을 처음 사용해 보는거라 잠시 깜놀 했습니다.

내가 안드로이드 스튜디오를 열었나???

3. 프로젝트 실행

다시 본론으로 돌아와서

좌측 파일들에서 package.json을 찾아봅니다.

찾으셨으면 마우스를 대고 우측버튼을 클릭해 줍니다.

아래쪽에 [Show npm Scripts]가 보이는군요 클릭을 합니다.

툴모양이 변경되면서 하단에 package.json 항목이 나열됩니다.

여기서 start를 더블클릭 합니다.

처음 실행을 하면 보안 경고가 나옵니다.

[엑세스 허용] 버튼을 클릭하면 이 팝업은 다음부터는 보고 싶어도 볼 수가 없습니다. 굳바이...

또 하단에 창이 하나 딸려나오면서 머가 잔뜩 써져 있습니다.

많이 보던거네요.

ng serve도 있고

http://localhost:4200도 있고

Compiled successfully.도 있네요.

4. 결과 확인

그럼 빨리 웹 브라우저를 하나 열어서 http://localhost:4200으로 접속해 봅니다.

잘 나오는 군요.

- copy coding -

WebStorm이 강력하다고 해서 얼마나 좋은가 구경 한번 해보려고 설치를 해보았습니다.

WebStorm을 설치 하기 위해 JetBtains 사이트의 WebStrom에 접속 합니다. https://www.jetbrains.com/webstorm/

Webstorm 홈페이지

WIndows 버전은 그냥 가운데 있는 Free 30-day trial 위에 있는 DOWNLOAD를 선택합니다.

윈도우즈 이외의 운영체제를 선택 하려면 우측 상단의 Download를 선택 합니다.

자신의 운영체제를 선택 하고 DOWNLOAD를 클릭 합니다.

운영체제가 32-bit, 64-bit 선택은 설치를 진행 하면서 적용 됩니다.

다운받은 파일을 실행 해서 설치를 진행 합니다.

WebStorm-2018.3.2.exe

[Next] 버튼을 선택 합니다.

설치 위치를 변경 하려면 [Browse...] 버튼을 이용하여 Path를 변경합니다.

[Next] 버튼을 선택 합니다.

운영체제 bit만 선택했습니다.

[Next] 버튼을 선택 합니다.

[Next] 버튼을 선택 합니다.

설치가 진행 됩니다.

바로 실행해 보려고 Run WebStorm을 체크 했습니다.

[Finish] 버튼을 선택 합니다.

다시 설치를 하는게 아니라서 설정이 없습니다.

[OK] 버튼을 선택 합니다.

응. 니꺼야.

[I confirm that I have.....]를 체크 합니다.

[Continue] 버튼을 선택 합니다.

[Don’t send] 버튼을 선택 합니다.

인류의 미래를 위해 [Send..]를 선택해도 됩니다.

바탕 화면 색상 선택입니다.

skip 해도 됩니다.

추가 설치관련 입니다.

그냥 skip 합니다.

구매한게 아니니 Evaluate for free를 선택 하고

[Evaluate]를 선택 합니다.

이제 설치된 WebStorm을 실행해 봅니다.

저는 설치 중에 실행을 선택해서 자동으로 실행 됩니다.

설치가 완료 되었습니다.

- copy coding -

아래 내용은 이전에 설명한 Tensorflow 개발환경 구성과 연결된 내용입니다. 혼란을 주고 있어 안내드립니다.

[텐서플로우] Windows 용 Tensorflow 개발환경 구성 (Version 1.12.0)

그리고 최신 Tensorflow2 관련 해서는 다음 링크를 참고 하세요.

[텐서플로우] 아나콘다(Anaconda)에 TensorFlow2 설치

아나콘다를 설치 하면 주피터 노트북(Jupyter Notebook)도 같이 설치가 됩니다.

주피터 노트북은 프로그램을 작성하면서 주석도 기입하고 code의 line 별로 실행도 할 수 있는

유용한 툴이라고 하는데 기본적인 파일 생성, 실행, 편집, 삭제 기능을 알아 보겠습니다.

1. Jupyter Notebook 실행

시작버튼에서 주피터 노트북을 찾아 선택합니다.

검은색 콘솔 창이 나타나고 잠시 후 웹 브라우저에 주피터 노트북이 나옵니다.

자세히 보면 하단에 리스트된 내용이 [내 컴퓨터(내 PC)]의 디렉토리 정보가 나타나는걸 알 수 있습니다.

2. 파일 생성

주피터 노트북 화면의 우측 상단에 있는 [New] 버튼을 선택하면 메뉴 창이 열립니다.

실제 프로젝트라면 폴더를 만들고 그 안에 파일을 만들어야 겠지만

여기서는 간단히 설명만 하기 때문에 그냥 [Python 3]을 선택 합니다.

현재는 파일명이 Untitled1으로 되어있는데 [Untitled1]라고 쓰인 이름 선택하면 파일명을 변경할 수 있습니다.

그냥 Test라고 적고 [Rename] 버튼을 선택 했습니다.

파일명이 Test로 변경 되어 있습니다.

3. 코딩

코딩을 시작 하는데 라인이 하나밖에 없습니다.

[+] 표시를 클릭해서 라인을 하나씩 추가해주며 코딩을 진행 합니다.

라인 하나에 한문장만 기입 하는게 아니라 부분별 테스트를 진행할 블록 단위라고 생각하면 됩니다.

4. 실행

첫번째 블록을 선택하고 [Run]을 클릭하면서 실행 테스트를 진행 합니다.

[Run]을 클릭 할때 마다 한 블럭씩 실행을 진행 됩니다.

마지막 라인을 넘어가면 결과 확인이 가능 합니다.

5. 기타

5.1 이동

이동할 라인을 선택하고 화살표를 이용해서 코드의 위치를 변경할 수 있습니다.

다른 기능들은 아이콘을 보면 아시겠지만

저장, 삭제, 복사, 붙여넣기 등등의 기능들 입니다.

5.2 편집

저장 후 다음에 다시 편집을 하려면 주피터 노트북 메인 화면에서 파일을 찾습니다.

찾았으면 선택을 해야겠죠?

그럼 상단에 안보이던 버튼들이 나타납니다.

상단으로 가볼까요?

여기서 [View]를 선택해야 편집화면으로 이동이 됩니다.

삭제는 당연히 쓰레기통을 누르면 파일이 삭제 됩니다.

지금까지 기본적인 사용법이었습니다.

좀더 많은 기능은 사용하시면서 익히시기 바랍니다.

- copy coding -