도시로우트가 Cloud IDE에서 GitHub Pages와 Bitbucket에 정적 웹사이트를 게시해 보았습니다.

0. 처음에

저는 엔지니어가 아닌 단지 도실로트입니다.

먼저 PWA를 공부하고 싶었고 https :를 사용할 수있는 무료 호스팅 목적지를 찾고있었습니다.

조사하면 GitHub Pages가 https를 지원하는 것을 알았습니다.

GitHub Pages
htps : // 퍼지 s. 기주 b. 코m/

빨리 HTML 파일을 올려 확인하려고 했는데 모처럼이므로 내 가난한 Windows10 PC가 아닌 무료 Cloud IDE를 로컬 환경으로 만들고 싶었습니다.

그래서 무료 Cloud IDE를 조사하여 Codenvy를 찾았습니다. 무료로 3GB의 컨테이너를 사용할 수있는 것 같습니다.

PRICING & PACKAGES - 코덴비
htps // 코덴 vy. 이 m/p 로즈 ct/그리고 x. php#p리신g

제대로 스쿠쇼 첨부로 소개하고 있는 일본어 사이트도 있었습니다.

Codenvy - 웹상의 개발 및 실행 환경
htps : // t. ly / 2 i lM1 h

사용자 등록은 Github 계정으로 쉽게 할 수 있으며, 먼저 위 기사대로 작업공간, 프로젝트를 아래와 같이 작성합니다.

작업 공간이 특정 언어의 개발 환경을 만드는 것은 아니므로 "Blank"를 선택

프로젝트도 마찬가지로 "Blank"를 선택

이 상태에서 Git의 최신판이 도입되었습니다. 매우 편안함.

1. GitHub Pages용 환경 만들기

Cloud IDE이지만 특히 GitHub Pages의 설명과 크게 달라진 부분은 없었습니다.

우선 설명대로 Github에서 리포지토리를 만들었습니다. 이것은 화면이므로 매우 간단.

여기에서가 명령이 되기 때문에 나 같은 도시로우트에는 난관입니다.

나 같은 초보자도 있다고 생각하므로 명령 입력 결과를 붙여 둡니다. Codenvy 화면 하단의 터미널에서 명령을 입력합니다.

user@xxxxxxxxxxxx:/projects$ git clone https://github.com/(Githubのユーザー名)/(Githubのユーザー名).github.io
Cloning into '(Githubのユーザー名).github.io'...
warning: You appear to have cloned an empty repository.
user@xxxxxxxxxxxx:/projects$ cd (Githubのユーザー名).github.io
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ echo "Hello World" > index.html
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ ls -l
total 4
-rw-r--r-- 1 user user 12 May 16 04:52 index.html
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ git add --all
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ git commit -m "Initial commit"

*** Please tell me who you are.

Run

  git config --global user.email "[email protected]"
  git config --global user.name "Your Name"

to set your account's default identity.
Omit --global to set the identity only in this repository.

fatal: unable to auto-detect email address (got 'user@xxxxxxxxxxxx.(none)')
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ git config --global user.email "(Githubに登録したメールアドレス)"
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ git config --global user.name "(Githubのユーザー名)"
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ git commit -m "Initial commit"
[master (root-commit) 8878b20] Initial commit
 1 file changed, 1 insertion(+)
 create mode 100644 index.html
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$ git push -u origin master
Username for 'https://github.com': (Githubのユーザー名)
Password for 'https://(Githubのユーザー名)@github.com':(Githubのパスワード)
Counting objects: 3, done.
Writing objects: 100% (3/3), 231 bytes | 231.00 KiB/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://github.com/(Githubのユーザー名)/(Githubのユーザー名).github.io
 * [new branch]      master -> master
Branch 'master' set up to track remote branch 'master' from 'origin'.
user@xxxxxxxxxxxx:/projects/(Githubのユーザー名).github.io$

GitHub Pages 의 설명과의 차이는 이하였습니다.

처음 commit했을 때에 메일 주소와 유저명을 유저 설정했다

푸시 할 때 Github 사용자 이름과 암호를 입력했습니다.

2. 실행 결과

당연합니다만 사진대로 (Github의 유저명).github.io의 페이지가 표시되어 있습니다.

3. 요약

단지 이것만으로 도시로우트가 클라우드 IDE 기반의 컨텐츠 업 환경을 만들 수 있었습니다.

PWA 공부용으로 사용해 가려고 합니다.

4. 추가

GitHub Pages에 사이트를 만들고 기뻐하고 있다면 무려 Bitbucket 에도 만들 수 있다는 것을 알았습니다.

게다가 Bitbucket은 여러 사이트를 만들 수 있습니다. 다음 기사에 자세한 설명이있었습니다.

Bitbucket으로 정적 웹사이트 게시

기사대로, Bitbucket에서 팀, 리포지토리를 만든 후에는 GitHub Pages의 절차와 동일하게 Codenvy에서 정적 웹사이트를 게시할 수 있었습니다.

일단 이쪽의 커맨드 입력 결과도 붙여 둡니다.

user@1b36d918ee5d:/projects$ git clone https://[email protected]/yyyyy/yyyyy.bitbucket.io.git
Cloning into 'yyyyy.bitbucket.io'...
Password for 'https://[email protected]':
warning: You appear to have cloned an empty repository.
user@1b36d918ee5d:/projects$ cd t*
user@1b36d918ee5d:/projects/yyyyy.bitbucket.io$ echo "welcome to yyyyy.bitbucket.io" > index.html
user@1b36d918ee5d:/projects/yyyyy.bitbucket.io$ ls -l
total 4
-rw-r--r-- 1 user user 35 May 18 04:47 index.html
user@1b36d918ee5d:/projects/yyyyy.bitbucket.io$ git add --all
user@1b36d918ee5d:/projects/yyyyy.bitbucket.io$ git commit -m "Initial commit"
[master (root-commit) 795bd40] Initial commit
 1 file changed, 1 insertion(+)
 create mode 100644 index.html
user@1b36d918ee5d:/projects/yyyyy.bitbucket.io$ git push -u origin master
Password for 'https://[email protected]':
Counting objects: 3, done.
Writing objects: 100% (3/3), 254 bytes | 254.00 KiB/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://bitbucket.org/yyyyy/yyyyy.bitbucket.io.git
 * [new branch]      master -> master
Branch 'master' set up to track remote branch 'master' from 'origin'.
user@1b36d918ee5d:/projects/yyyyy.bitbucket.io$

매우 쉽고 편리합니다. 이쪽도 https이므로 여러가지 시험할 것 같네요.

그 이상