[ JavaScript ] 구름 IDE 사용법 | 구름 IDE 기초 사용

 

 

 

ide.goorm.io/

구름IDE - 설치가 필요없는 통합개발환경 서비스

 

 

 

 

 

 

 

 

 

이번 포스팅은 구름에서 제공하는 IDE를 이용하는 방법에 대해 다뤄보도록 하겠습니다.

저는 지금 현재 구름EDU에서 강의를 듣고 있고, 특별히 따로 사용하는 IDE가 없기 때문에 구름 IDE를 사용합니다.

 

 

 

먼저, 로그인을 해주시고, 작업공간인 컨테이너를 만들러 가봅시다.

 

 

 

 

STEP 1 : 컨테이너 생성

 

 

 

 

 

 

 

메인화면에 보이는 대시보드 버튼을 클릭해봅시다.

 

 

 

 

 

 

 

 

화면 우측 상단의 새 컨테이너 생성 버튼을 클릭해줍니다.

 

 

 

 

 

 

 

 

 

 

위와 같이 이름, 설명, 지역, 공개 범위, 템플릿,  배포 유무,

GPU, 소프트웨어 스택등을 선택해주시고 생성버튼을 눌러줍니다.

 

저는 TEST 용도로 하나 만들어보았습니다.

 

 

 

 

 

 

 

 

 

생성시 조금 시간이 걸릴 수도 있습니다.

 

 

 

성공적으로 생성이 되었다면,

 

 

 

 

 

 

 

다음과 같은 화면을 볼 수 있을 겁니다.

 

대시보드로 이동해볼까요?

 

 

 

 

 

 

이렇게 컨테이너가 생성된 것을 확인해보았습니다.

 

 

Run 버튼을 눌러봅시다.

 

 

STEP 2 : Coding!

 

 

 

 

 

 

저는 소프트웨어 스택을 html, css, js로 설정했기 때문에,

index,html 파일과 style.css 파일이 기본적으로 생성되어 있는 것을 확인할 수 있습니다.

 

 

js 파일도 하나 생성해볼까요?

 

 

 

 

 

 

 

 

 

보통의 IDE들이 그렇듯이, 우클릭하여 새로 만들기 하면 됩니다.

저는 js 파일을 만들 것이기 때문에, 파일을 선택해줬습니다.

 

 

 

 

 

 

 

 

test.js 라는 이름으로 JavaScript 파일을 하나 생성해줍니다.

 

 

 

 

 

 

 

 

 

구름 ide는 html Preview 기능이 있습니다.

웹개발 할 때 브라우저 상에서 어떻게 보이는 지 바로바로 볼 수 있겠네요.

 

 

 

 

오늘 이렇게 구름 IDE를 사용하는 기초적인 방법에 대해 알아봤습니다.

다음 포스팅부터는 이 구름 IDE를 이용하여 CRUD 프로그램을 만들 수 있겠네요.