둘러보기

Python

Python 예에서는 Flask 프레임워크를 사용합니다. 제공된 링크에서 전체 소스 코드를 다운로드할 수 있습니다.

필요한 경우 Python 3.7 이상을 설치하고 pip를 사용할 수 있는지 확인합니다.

python3 -m ensurepip --upgrade

새 Python 가상 환경을 설정하고 활성화하는 것도 좋습니다.

python3 -m venv .classroom-addon-env
source .classroom-addon-env/bin/activate

다운로드한 예시의 각 워크스루 하위 디렉터리에는 requirements.txt가 있습니다. pip를 사용하여 필요한 라이브러리를 빠르게 설치할 수 있습니다. 다음 명령어를 사용하여 첫 번째 둘러보기에 필요한 라이브러리를 설치합니다.

cd flask/01-basic-app
pip install -r requirements.txt

Node.js

Node.js 예에서는 Express 프레임워크를 사용합니다. 제공된 링크에서 전체 소스 코드를 다운로드할 수 있습니다.

이 예시에는 Node.js v16.13 이상이 필요합니다.

npm를 사용하여 필수 노드 모듈을 설치합니다.

npm install

자바

Java 예에서는 Spring Boot 프레임워크를 사용합니다. 제공된 링크에서 전체 소스 코드를 다운로드할 수 있습니다.

Java 11 이상이 아직 머신에 설치되어 있지 않으면 설치합니다.

Spring Boot 애플리케이션은 Gradle 또는 Maven을 사용하여 빌드를 처리하고 종속 항목을 관리할 수 있습니다. 이 예에는 Maven 자체를 설치하지 않고도 빌드가 성공적으로 이루어지도록 하는 Maven 래퍼가 포함되어 있습니다.

프로젝트를 다운로드했거나 클론한 디렉터리에서 다음 명령어를 실행하여 프로젝트를 실행하기 위한 기본 요건이 있는지 확인합니다.

java --version
./mvnw --version

또는 Windows에서는 다음 스크립트를 실행합니다.

java -version
mvnw.cmd --version

Python

• 디렉터리 루트에는 다음 파일이 포함됩니다.

  • main.py - Python 애플리케이션 진입점입니다. 이 파일에서 사용하려는 서버 구성을 지정한 다음 실행하여 서버를 시작합니다.
  • requirements.txt - 웹 앱을 실행하는 데 필요한 Python 모듈입니다. pip install -r requirements.txt를 사용하여 자동으로 설치할 수 있습니다.

  • client_secret.json - Google Cloud에서 다운로드한 클라이언트 보안 비밀번호 파일입니다. 이는 예시 보관 파일에 포함되어 있지 않으므로 다운로드한 사용자 인증 정보 파일의 이름을 바꾸고 각 디렉터리 루트에 복사해야 합니다.

• config.py - Flask 서버의 구성 옵션입니다.

• webapp 디렉터리에는 웹 애플리케이션의 콘텐츠가 포함되어 있습니다. 이 패키지에는 다음 도구가 포함되어 있습니다.

• 다양한 페이지의 Jinja 템플릿이 있는 /templates/ 디렉터리

• 이미지, CSS, 보조 JavaScript 파일이 있는 /static/ 디렉터리

• routes.py - 웹 애플리케이션 경로의 핸들러 메서드입니다.

• __init__.py - webapp 모듈의 이니셜라이저입니다. 이 이니셜라이저는 Flask 서버를 시작하고 config.py에 설정된 구성 옵션을 로드합니다.

• 특정 둘러보기 단계에 필요한 추가 파일

Node.js

워크스루의 각 단계는 자체 <step> 하위 폴더에서 확인할 수 있습니다. 각 단계에는 다음이 포함됩니다.

• JavaScript, CSS, 이미지와 같은 정적 파일은 ./<step>/public 폴더에 있습니다.
• 익스프레스 라우터는 ./<step>/routes 폴더에 있습니다.
• HTML 템플릿은 ./<step>/views 폴더에 있습니다.
• 서버 애플리케이션은 ./<step>/app.js입니다.

자바

프로젝트 디렉터리에는 다음이 포함됩니다.

• src.main 디렉터리에는 애플리케이션을 실행하는 데 필요한 소스 코드와 구성이 포함되어 있습니다. 이 디렉터리에는 다음이 포함됩니다. + java.com.addons.spring 디렉터리에는 Application.java 및 Controller.java 파일이 포함됩니다. Application.java 파일은 애플리케이션 서버를 실행하는 반면 Controller.java 파일은 엔드포인트 로직을 처리합니다. + resources 디렉터리에는 HTML 및 JavaScript 파일이 포함된 templates 디렉터리가 있습니다. 또한 서버를 실행할 포트, 키 저장소 파일의 경로, templates 디렉터리의 경로를 지정하는 application.properties 파일이 포함되어 있습니다. 이 예에서는 resources 디렉터리에 키 저장소 파일을 포함합니다. 원하는 위치에 저장할 수 있지만 application.properties 파일을 적절하게 경로로 업데이트해야 합니다.
  • pom.xml에는 프로젝트를 빌드하고 필요한 종속 항목을 정의하는 데 필요한 정보가 포함되어 있습니다.
  • .gitignore에는 git에 업로드해서는 안 되는 파일 이름이 포함되어 있습니다. 이 .gitignore에 키 저장소의 경로를 추가해야 합니다. 제공된 예시에서는 secrets/*.p12입니다 (키 저장소의 목적은 아래 섹션에서 설명함). 둘러보기 2 이상에서는 원격 저장소에 비밀을 포함하지 않도록 client_secret.json 파일의 경로도 포함해야 합니다. 둘러보기 3 이상에서는 H2 데이터베이스 파일 및 파일 데이터 스토어 팩토리의 경로를 추가해야 합니다. 이러한 데이터 스토어 설정에 관한 자세한 내용은 반복 방문 처리의 세 번째 워크스루를 참고하세요.
  • mvnw 및 mvnw.cmd는 각각 Unix 및 Windows용 Maven 래퍼 실행 파일입니다. 예를 들어 Unix에서 ./mvnw --version를 실행하면 다른 정보와 함께 Apache Maven 버전이 출력됩니다.
  • .mvn 디렉터리에는 Maven 래퍼 구성이 포함됩니다.

Python

OAuth 사용자 인증 정보

앞서 설명한 대로 OAuth 사용자 인증 정보를 만들고 다운로드합니다. JSON 파일을 애플리케이션의 서버 실행 파일과 함께 루트 디렉터리에 배치합니다.

서버 구성

웹 서버를 실행하는 방법에는 여러 가지가 있습니다. Python 파일 끝에 다음 중 하나를 추가합니다.

1. 안전하지 않은 localhost입니다. 이는 브라우저 창에서 직접 테스트하는 경우에만 적합합니다. 안전하지 않은 도메인은 클래스룸 부가기능 iframe에 로드할 수 없습니다.

   if __name__ == "__main__":
     # Disable OAuthlib's HTTPs verification.
     os.environ["OAUTHLIB_INSECURE_TRANSPORT"] = "1"
   
     # Run the web app at http://localhost:5000.
     app.run(debug=True)
   

2. localhost 보호 ssl_context 인수에 SSL 키 파일의 튜플을 지정해야 합니다.

   if __name__ == "__main__":
     # Run the web app at https://localhost:5000.
     app.run(host="localhost",
             ssl_context=("localhost.pem", "localhost-key.pem"),
             debug=True)
   

3. Gunicorn 서버 프로덕션 준비 서버 또는 클라우드 배포에 적합합니다. 이 실행 옵션과 함께 사용할 PORT 환경 변수를 설정하는 것이 좋습니다.

   if __name__ == "__main__":
     # Run the web app at https://<your domain>:<server_port>.
     # Defaults to https://<your domain>:8080.
     server_port = os.environ.get("PORT", "8080")
     app.run(debug=True, port=server_port, host="0.0.0.0")
   

서버 실행

Python 애플리케이션을 실행하여 이전 단계에서 구성된 대로 서버를 실행합니다.

python main.py

표시되는 URL을 클릭하여 브라우저에서 웹 앱을 확인하고 제대로 실행되는지 확인합니다.

Node.js

서버 구성

HTTPS를 통해 서버를 실행하려면 HTTPS를 통해 애플리케이션을 실행하는 데 사용되는 자체 인증서를 만들어야 합니다. 이러한 사용자 인증 정보는 저장소 루트 폴더에 sslcert/cert.pem 및 sslcert/key.pem로 저장되어야 합니다. 브라우저에서 이러한 키를 허용하려면 OS 키 체인에 이러한 키를 추가해야 할 수 있습니다.

파일을 git에 커밋하지 않으려면 *.pem가 .gitignore 파일에 있는지 확인하세요.

서버 실행

다음 명령어를 사용하여 서버로 실행하려는 올바른 단계를 step01로 대체하여 애플리케이션을 실행할 수 있습니다 (예: 01-basic-app의 경우 step01, 02-sign-in의 경우 step02).

npm run step01

또는

npm run step02

그러면 https://localhost:5000에서 웹 서버가 시작됩니다.

터미널에서 Control + C를 사용하여 서버를 종료할 수 있습니다.

자바

서버 구성

HTTPS를 통해 서버를 실행하려면 HTTPS를 통해 애플리케이션을 실행하는 데 사용되는 자체 인증서를 만들어야 합니다.

로컬 개발에는 mkcert를 사용하는 것이 좋습니다. mkcert를 설치하면 다음 명령어는 HTTPS를 통해 실행할 로컬 저장 인증서를 생성합니다.

mkcert -install
mkcert -pkcs12 -p12-file <path_to_keystore> <domain_name>

이 예에서는 리소스 디렉터리에 키 저장소 파일을 포함합니다. 원하는 위치에 저장할 수 있지만 application.properties 파일을 적절하게 경로로 업데이트해야 합니다. 도메인 이름은 프로젝트를 실행하는 도메인입니다 (예: localhost).

파일을 git에 커밋하지 않으려면 *.p12가 .gitignore 파일에 있는지 확인하세요.

서버 실행

Application.java 파일에서 main 메서드를 실행하여 서버를 시작합니다. 예를 들어 IntelliJ에서 src/main/java/com/addons/spring 디렉터리에서 Application.java > Run 'Application'를 마우스 오른쪽 버튼으로 클릭하거나 Application.java 파일을 열어 main(String[] args) 메서드 서명 왼쪽에 있는 녹색 화살표를 클릭할 수 있습니다. 또는 터미널 창에서 프로젝트를 실행할 수 있습니다.

./mvnw spring-boot:run

또는 Windows:

mvnw.cmd spring-boot:run

이렇게 하면 https://localhost:5000 또는 application.properties에 지정한 포트에서 서버가 실행됩니다.