웹 서비스/애플리케이션 개발 문제 만들기
웹 서비스/애플리케이션 개발 문제는 채점모드, 제출모드, 실행모드로
문제를 생성할 수 있습니다.
이 문서에서는 웹 서비스/애플리케이션 개발 문제를 입력하는 내용만을 다룹니다.
새로 문제를 만들 때 기본적으로 입력하는 사항들에 대해서는
"문제 가져오기 및 공통 설정" 도움말을 참고해주세요.
'웹 서비스/애플리케이션 개발 문제'는 서버 사이드 언어를 이용하여,
웹 서비스/애플리케이션에서 필요한 기능을 구현할 수 있는지 평가할 수 있는 문제입니다.
이 문제 유형은 다양한 서버 사이드 웹 프로그래밍 언어 및 프레임 워크를 지원하며,
수강자가 최대 5개의 소스코드 파일들을 편집하며 문제를 해결하게 할 수 있고,
나이트워치(Nightwatch.js)라는 자동화된 웹 애플리케이션 UI 테스트 툴을 이용해서 채점을 할 수 있습니다.
웹 서비스/애플리케이션의 경우 하나의 파일 만으로 이루어져 있을 경우
하이퍼링크를 통한 페이 지간 이동과 같은 웹 서비스 특유의 강력한 특징을 살릴 수 없기 때문에,
다른 문제들과는 달리 여러 개의 소스코드 파일을 수정할 수 있도록 환경을 마련했습니다.
웹 서비스/애플리케이션 문제는 문제 출제자가 기본 틀이 되는 미완성된 웹 프로젝트를
zip 형식으로 압축해서 업로드를 한 뒤, 출제자가 접근 가능한 파일 리스트를 지정하면
수강자가 해당 파일들을 수정하여 완성된 웹 프로젝트로 만든 뒤 제출하는 방식으로 이루어집니다.
채점모드의 경우, 출제자가 입력한 Nightwatch 테스트 코드를 이용해서
채점을 실시하고 점수를 산정합니다.
제출모드의 경우, 수강자가 작성한 소스코드를 제출하여 강의자가 열람할 수 있도록 합니다.
'문제 해결 언어'에서는 수강자가 작업할 웹 프로젝트에 관련된 내용을 설정할 수 있습니다.
웹 서비스/애플리케이션 개발 문제는 출제자가 여러 개의 파일들로 이루어진 프로젝트 형태의
zip파일을 업로드하고, 파일들 중 수강자가 열람 및 수정 가능한 파일을 지정하는 방식으로 출제됩니다.
수강자는 주어진 파일들을 열람 및 수정하여, 문제에서 요구하는 기능을 구현하게 됩니다.
(수강자는 추가적인 파일을 생성하거나 기존에 존재하는 파일을 삭제할 수 없습니다.)
현재 구름EDU 웹 서비스/애플리케이션 문제에서 지원하는 백엔드 언어 및 프레임워크는 5가지 입니다.
- PHP (Apache2 Server)
- Node.js
- Django(Python Framework)
- Flask(Python Framework)
- Ruby on Rails(Ruby Framework)
'문제 해결 언어'의 '언어' 탭에서 사용할 백엔드 언어 혹은 프레임워크를 하나 선택합니다.
'기본 프로젝트' 탭에서 zip 형식으로 압축된 웹 프로젝트 파일을 업로드하면,
'프로젝트 설정' 탭에서 해당 압축파일 내부에 있는 파일 리스트가 나타납니다.
프로젝트 파일 내부에 실행파일이 지나치게 많을 경우 문제만들기가 실행되지 않을 수 있습니다.
이러한 경우에는 불필요한 라이브러리를 제거하거나 꼭 필요한 파일만 남긴 후
다시 프로젝트를 zip 형식으로 압축하여 업로드 하시면 됩니다.
'프로젝트 설정' 탭에서 응시자가 열람 및 수정할 수 있는 파일들을 선택합니다.
수강자가 문제 해결을 위해서 꼭 수정해야 할 파일들과,
구조를 확인해야 할 필요가 있는 파일들을 선택하면 됩니다.
Ctrl(Mac OS 기준 cmd)키를 이용하여 복수개의 파일을 선택할 수 있으며,
현재는 최대 5개까지 선택이 가능하도록 설정되어 있습니다.
구름EDU에서는 웹 서버를 실행해보고자 할 때, 웹 서버가 제대로 실행 되었는지 자체적으로 확인한 뒤
사용자에게 보여줍니다.
웹 서버가 실행 되었는지 확인하기 위한 정보 입력란이 '웹 서버 확인 및 실행 설정' 탭입니다.
- 첫번째 입력란을 보면 HTTP / TCP / SSL의 세가지 항목이 있는데, 이는 웹 서버 실행 확인 방법을 의미하며, 현재는 HTTP만 지원하고 있습니다. TCP와 SSL는 추후 확장될 가능성에 의해 인터페이스가 유지되고 있습니다. HTTP 방식은 두번째 및 세번째 입력란에서 지정한 값을 토대로 URL을 만들어서 해당 URL에 HTTP 요청에 대한 응답 코드의 값이 200인지 확인하는 방식을 의미합니다.
- 두번째 입력란에 80이라고 쓰여 있는 항목은 포트번호를 의미합니다. PHP 프로젝트의 경우 apache2 서버가 기본적으로 80번 포트로 구동되도록 설정되어 있으므로 변경 할 필요가 없습니다.
- 세번째 입력란은 웹 서버 확인 경로입니다. 기본 값은 '/' (루트 경로)이며, 설정하지 않을 경우 자동으로 루트 경로로 입력되게 됩 니다. 예를 들어 로컬 호스트에서 웹 서버 실행시 다음 경로에 메인 페이지가 나타나게 된다면, 웹 서버 확인 경로는 /main.php가 될 것입니다(http://localhost/main.php).
PHP의 경우에는 apache2 서버를 리눅스 서비스로 사용하므로 따로 실행 스크립트가 필요하지 않지만,
나머지 언어 및 프레임워크들은 서버를 실행하기 위한 서버 실행 스크립트가 필요합니다.
서버 실행 스크립트가 필요한 언어나 프레임워크를 선택하게 되면, 하단 부분에
#!/bin/bash 로 시작하는 bash 쉘 스크립트 입력란이 나타납니다. 이 부분이 서버 실행 스크립트 작성란이며 이 부분에 스크립트를 작성하면
추후 서버를 실행해야 할 때마다 해당 스크립트를 실행하게 됩니다.
이 부분에 서버를 실행시키는 스크립트를 작성해주시면 됩니다.
하단의
▶실행해보기 버튼을 클릭하여 업로드한 웹 서버가 잘 동작하고
웹 서버 실행 확인 로직이 잘 동작하는지 확인할 수 있습니다.문제 해결 언어의 백엔드언어 및 프레임워크별
▶실행해보기에 대한 자세한 내용은
아래의 링크를 참고해주세요.
실행해보기 버튼을 누르면 웹 서버가 팝업 형태로 나타나게 됩니다.
만약 작업중인 웹 브라우저에 팝업차단이 설정되어 있다면
팝업 계속 차단 기능을 해제시킨 뒤
▶실행해보기를 하셔야 합니다.팝업 창을 종료하게 되면 해당 웹 서버도 종료됩니다.
웹 서비스/애플리케이션 개발 문제는 UI 테스트 자동화 툴인 Nightwatch를 이용하여
정답여부를 판단하여 작성한 답안에 대하여 채점을 하고 있습니다.
그러므로 문제 출제자는 채점모드의 웹 서비스/애플리케이션 개발 문제를
작성하기 위해서는 Nightwatch 채점 스크립트를 작성할 수 있어야 합니다.
해당 내용은 아래의 링크를 참고해주세요.
Last modified 2yr ago