[HTML.005] Replit으로 온라인 코딩하기

[HTML.005] Replit으로 온라인 코딩하기

 

 

🚩 리플릿(Replit)이란?

• 리플릿(Replit)은 사용자들이 브라우저를 사용하여 코딩을 할 수 있는 웹 서비스이다.
• 리플릿에서 코딩을 하기 위해 별도의 프로그램 설치없이 회원가입만 하면 바로 코딩을 할 수 있다.
• 리플릿은 실시간 채팅 피드를 통한 실시간 다중 사용자 편집 기능을 포함하여 다양한 협업 기능도 갖추고 있다.
• 리플릿에서는 자바(Java), 파이썬(Python), HTML/CSS/JS, C언어, C++ 등  50개 이상의 프로그래밍 언어를 지원한다.
• 사용용자가 앱 및 웹 사이트를 만들 수 있고, 이 사이트는 코드 호스팅 플랫폼인 깃허브와 통합되어 있어 깃허브에서 프로젝트를 가져오고 실행할 수 있는 방법을 제공한다.
• 클래스(Class) 관리 기능을 가지고 있어서, 선생님이 여러 학생에게 코딩을 가르칠 수 있는 편의 기능도 제공한다(유료)

 

 

🚩 리플릿 사용해보기

[1] 구글 검색창에서 "replit"을 검색하여 나오는 상단의 링크를 클릭하여 replit.com으로 접속합니다. 

replit 검색

 

[2] 리플릿 사이트에서 회원가입을 하고 로그인을 한 뒤, 아래 그림의 (1) ~ (4) 번호 순서대로 선택하면 코딩을 할 수 있는 환경이 자동으로 만들어 집니다.

• ①번: 새로운 프로젝트 만들기
• ②번: 프로그래밍 언어 선택하기
• ③번: 프로젝트 이름 정하기
• ④번: 프로젝트 만들기

리플릿 프로젝트 만들기

 

 

[3] 아래 그림과 같이 리플릿 프로젝트 환경이 나타나면 이 곳에서 코딩을 하고 실행을 할 수 있습니다.

• ①번: 프로그램 파일(File)
• ②번: 코딩하는 부분
• ③번: 프로그램 실행 창
• ④번: 프로그램 실행 버튼(Run)
• ⑤번: 여러 가지 설정 메뉴

리플릿 코딩 환경

 

 

[4] 리플릿에서 코딩을 하고 프로그램을 실행하여 결과를 보는 일련의 과정이 아래의 이미지에 나타나 있습니다.

리플릿 코딩-실행

 

 

[5] Run 버튼을 누르면 코드 실행이 되고 오른쪽 화면에 실행 결과가 나타납니다.

 

 

[6] 내가 코딩을 하고 있는 환경에 다른 사람을 초대하여 동시에 여러 명이 하나의 코드를 제어할 수 있습니다.

아래 그림과 같이 Invite 버튼을 눌러 link를 상대방에게 공유해 주면, 상대방이 그 링크를 클릭하여 내가 코딩하는 환경으로 접속하게 됩니다.

 

 

 

[7] 아래 그림은 2명의 사람이 하나의 코딩 환경에 접속하였을 때, 한 명이 코딩을 하면 다른 사람의 화면에도 실시간으로 동기화되는 모습을 나타내고 있습니다.

 

 

🏁 리플릿(Replit)의 장점

• 별도의 프로그램 설치없이 웹에서 코딩을 바로 할 수 있다.
• 코딩 후 별도의 저장을 안해도 웹 클라우드에 나의 코드가 자동저장된다.
• 여러 사람이 하나의 코드를 동시에 코딩(페어 프로그래밍)할 수 있다.
• 선생님이 여러 학생들에게 코딩을 가르치는 클래스 기능이 있다.
• 50여개 이상의 프로그래밍 언어를 지원한다.
• 웹 프로그래밍을 할 때 별도의 서버 호스팅을 하지 않아도 싱글 웹 페이지 정도는 리플릿에서 호스팅이 가능하다(제한적임)