고정 헤더 영역
상세 컨텐츠
본문
반응형
TL;DR 개발 입문자 또는 초기단계에서는 웹 IDE로 맛을 보고 시작하자 !!
개요
이번 포스팅에서는 웹 IDE 환경에서 개발환경에 대한 이야기를 해 보고자 합니다.
운동이든 자기개발, IT 분야이든지,
"나도 해봐야지~~"하고 결심을 할 때가 있습니다.
그렇지만, 이 결심은 최초실행 단계에서 70%, 두번째 단계에서 90% 정도 떨어져 나간다고 합니다. 예를 들면, 오늘부터 아침마다 수영을 해 봐야겠다... 라고 생각 했지만, 주변에 수영장이 없는 경우, 멀리까지 수영장을 찾아서 가지는 않고 그냥 포기한다는 것이죠.
IT개발 환경도 마찬 가지 입니다.
오늘부터 Python을....
오늘부터 Java를...
javascript를...
결심을 하지만,
우선은 Hello World 같은 작은 코드의 결과라도 실행을 해 봐야 계속 유지해 나갈 수 있습니다.
이러한 관점에서 첫 관문이 개발환경 구축 입니다.
개발환경 구축하는 과정에서부터 에러가 발생하거나 곤란함을 겪으면, 그 다음과정을 이어 나가기가 쉽지 않습니다. 그래서, 개발에 초기 입문자는, 웹 IDE에서 맛보기 개발을 진행해 보는 것을 추천 드립니다.
자.. 그래서, 첫 진입장벽을 아주... 아주 ... 쉽게 넘을 수 있는 방법을 소개 합니다. 바로,
웹개발환경(Web IDE)으로 개발 맛보기
웹 개발환경 (Web IDE)로 개발 진입장벽 쉽게 넘기
웹 IDE에는 다양한 종류가 있습니다. 크게 상용과 오픈소스 웹IDE로 구분 지을 수 있습니다.
오픈소스 웹IDE도 있으나, 개발이 중단되기도 하였고, 쉽게 진행한다는 취지에 맞지 않기 때문에 권해드리지 않습니다. 상용 웹IDE로는, 대표적으로 Cloud9, CodeAnyWhere 등이 있으며, 국내 웹IDE로 구름IDE (Goorm IDE)가 있습니다. 최근에는 VisualStudio Code 또한 웹환경에서 구동이 가능한 서비스도 등장하여, 이제는 어디에서든 개발을 할 수 있는 시대가 된것 같습니다.
그런데, 외산 웹IDE 또는 클라우드 IDE는 가격 정책이 생각처럼 만만하지 않습니다. 또한, 이러한 가격 정책 때문에 가입할 때 신용카드번호를 적도록 되어 있는 경우가 상당수 입니다. (아~~~ 귀찮아~)
그래서, 저는 웹IDE(웹개발환경) 중에서 국내 기업이 운영하는 구름 IDE 사용을 추천 드립니다. (저는 구름 IDE와 아무런 관련이 없습니다. )
제가 구름 IDE의 사용을 추천 드린 이유는 여러가지가 있지만, 일단
- 1) 일단 무료 입니다.
- 2) 무료 사용기간 제한이 없습니다. (다른 곳은 trial 7일.. 뭐 이렇습니다.) 동시구동 컨테이너수만 제한.
- 3) 가입이 편하고, 사용하기 쉽습니다. 또한 한글입니다. ^^;;;;
아마도, 구름 IDE의 수익구조는 국내대기업/국가기관/올림피아드 등의 입사/경쟁시험 등에 사용이 수입원인것 같습니다. 즉, 일반 사용자로부터 입소문을 늘리고, 기관으로부터 수익을 받는 구조라는 것이죠. 이쯤되면, 사용해주지 않을 이유가 없습니다. 혹시 취준생이라면 먼저 사용해 두어 익숙해 지면 그게 더 도움이 될 지도 모르겠네요.
구름 IDE - 오늘의 예상 결과물 (Output Image)
자. 이제 본격적으로 시작 해 보도록 하시지요. 구름 IDE의 가입 후, 오늘의 결과화면을 먼저 확인하고 진행해 봅시다. (결과물을 알아야 진행 할 맛이나죠 ^^~~)
그림을 붙여 넣고 나니, 뭔가 밋밋하긴 한데, 뭐~개발이라는것이 다 그런것 아니겠습니까. ^^?
그 보다도, 클릭 몇번 해서 복잡한 인스톨이고 Package 설정이고 뭐고 다 끝났습니다. 이거면 되었죠~
위 이미지의 경우, React-Native 개발 환경이며, NPM 인스톨, React 패키지, React native 패키지, 추가 어데이트, 디펜던지 모듈과, Android 및 iOS 등 구동환경 구축, 디버깅환경 등이 설치되어 있는 환경이 구성되었습니다. 처음 실행할 때 이 환경을 구축하면 빠른면 1~2시간, 꼬이면 하루종일도 걸릴 수 있죠. 이러한 환경은 클릭 몇번으로 세팅완료 하게 됩니다.
첫 문단에서도 이야기 했듯.. 일단 이것으로 맛을 보고, 좀 더 전문적으로 해 봐야 겠다라는 마음이 드시면 직접 구축할 것을 권고 드립니다.
아래 부터든 다음과 같은 순서로 진행 합니다.
- 1) 구름 IDE에 가입하고 로그인 한다.
- 2) 구름 IDE의 메인메뉴(대시보드)로 이동 한다.
- 3) 새 컨테이너 생성, 개발환경 템플릿 선택
- 구름 IDE : https://ide-run.goorm.io/
1. 구름 IDE 가입 - 소셜로그인으로 가입 매우 쉬움
우리나람 사람치고 왠만하면 하나쯤은 가지고 있는 서비스를 대부분 연동 하고 있습니다. 구글/페이스북/카톡/네이버 중 하나 이상은 가지고 계시죠? 별도 계정 생성없이 서비스 버튼을 누르시고, 계정연동으로 가입 하면 끝....!!!
(ex. 구글 버튼 클릭 -> 구글 로그인만 하면 끝)
혹시, 해당 서비스들 중 계정이 하나도 없거나, 계정 연동이 싫으시다면, 이메일을 아이디로 하여 새롭게 회원가입 하시면 됩니다.
2. 구름 IDE 메뉴로 이동
로그인을 하고 진입하면, 왼쪽 상단 메뉴에서 IDE 버튼을 누르거나, ide url (https://ide.goorm.io/)을 직접 입력하여 이동합니다.
구름 라는 서비스가 IDE외에 EDU 등 다양한 서비스를 하고 있어서 그런지, 로그인 하면 꼭 한단계 화면들 더 거쳐가게 되어 있네요.
3. 컨테이너 생성 > 개발환경 선택/이동
대시보드 화면으로 오면, 이제 본격적인 서비스를 이용할 수 있습니다. 대시보드 화면의 오른쪽 상단에 "새 컨테이너 생성"을 눌러 줍니다.
개발환경 미리 구성한 가상환경(컨테이너)을 복제하여다가 사용자별로 구동시켜 주는 것입니다. 이 때, 어떤 개발환경으로 구성된 컨테이너를 구동할 것인지 선택해 주어야 합니다. (사실 이게 전부 입니다.)
추가적으로, 컨테이너 구동 시점에 추가적인 실행과 추가모듈 설치 들이 있습니다만, 우선은 넘어가도록 하죠.이런것을 자꾸 생각하게 되면, 또 다른 진입장벽을 만나게 됩니다. (우선 One Click 실행이 목표 입니다.). 아래 이미지에서, 제 경우에는 기존에 생성한 컨테이너(React_native)가 생성은 되어있지만, 구동은 하지 않는 동면 상태로 있는 것을 확인할 수 있습니다.
우선 "새 컨테이너 생성"을 눌러서, 새로운 개발환경을 만들어 보겠습니다. 컨테이너를 표기할 이름 등 정보를 적당히 넣어 줍니다. 여기에서는 이름 : "React_Native_001" 로 넣어주고, 나머지는 기본 설정으로 진행하겠습니다. 지역은 가까운 곳으로 하는게 좋겠죠. 우린 대부분 대한민국에 사니깐... 서울로...
가장 중요한것은, 소프트웨어 스택 입니다. 앞서 말씀 드린, 이미 템플릿화 되어 있는 가상환경 (Container)를 선택하는 것입니다. 본인이 원하는 개발환경을 선택 하시면, 됩니다. C/C++, JAVA 등 전통적인 개발환경, HTML/CSS/JS 등 웹 FrontEnd, Python, Django, Flask 등의 파이썬 계열 환경, Node, React, React-native, Vue 등 javascript 계열 개발환경 등이 있습니다. 최근 AI관련된 Tensorflow, Pytorch, R 환경도 이미 구현되어 있네요. 정말 해당 개발환경 초기 입문 때 도움이 많이 될것이라는 생각이 드네요.
어떤 개발환경을 사용할 것이냐에 따라 선택하시면 되겠습니다. 제 경우는 "React Native" 환경은 선택 하였습니다. 배포 및 OS설정, 추가 패키지 설치 등 추가 설정들이 몇몇 있으나, 본 포스팅의 주제에 맞게 일단 기본으로 설정하고 넘어 갑니다. 설정이 끝났으면, 우측 상단에 있는 "생성" 버튼을 눌러 주도록 합니다.
컨테이너 생성이 완료되면, 실행을 눌러 줍니다.
생성 버튼을 누르면, 내부적인 세팅과 컨테이너를 구동하는데 시간이 몇분 소요 됩니다.
(약 5분 내외, 이런 과정을 클라우드쪽 분야에서는 Provisioning 이라고 부릅니다.)
자.. 이제 실행이 완료 되었습니다. 이제부터 기본 템플릿에 개발을 해 보면 됩니다.
일단은 Hello World 부터~~~
왼쪽 세로로 배치되어 있는 메뉴는, Visual Studio Code, Atom 등의 IDE와 매우 유사하다. 오른쪽 하단에는 터미널이 있기 때문에, 터미널 명령어를 실행하여 RUN 혹은 Debug message등을 확인 할 수 있을 것이다. 리소스 모니터도 확인 하자. 그 밖에 최근 IDE는 비슷한 UI를 가지고 있으므로 크게 어려움 없이 사용할 수 있을 것이다.
초기 코딩을 완료하면, 일단 실행을 해보고, Hello World가 잘 구동되는지 확인을 하고 진행 한다.
IDE의 메뉴로써 가장 자주사용하는 메뉴는 "프로젝트 메뉴"이다. 빌드 및 실행을 통해서, 개발결과를 구동해 볼 수 있다. "실행"에는 개발환경 별로 주된 Build 스크립트 들을 "실행추가" 할 수 있도록 구성되어 있으니, 참조하길 바란다.
추가적으로, 왼쪽 메뉴에는 버전관리부터 코드 공유까지 제공하고 있다. 팀간 협력개발할 경우에 사용하면 편리할 것이다.
https://play.google.com/store/apps/details?id=com.my2048
개발 환경 구축에 많은 시간 들이지 말고, 간단히 맛보기를 통해 꾸준히 노력 합시다~~
반응형
'개발 이야기' 카테고리의 다른 글
| [개발] 온라인 IDE - 개발 환경 구축 없어 어디서나 웹브라우저로 개발하기 (7) | 2020.05.09 |
|---|---|
| [개발] 파이썬 문법 5분만에 읽히기 - 파이썬 기본 문법 요약/정리 8 가지 (1) | 2020.05.09 |
| 애드몹(adMob) 테스트 디바이스 (testDevice) 등록 (1) | 2020.04.22 |
| Single Dex size 에러 - single dex file cannot exceed 64K (2) | 2020.03.29 |
| ADB와 Logcat 이용하여 스마트폰 디버깅 (2) | 2020.03.16 |
댓글 영역