Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
演習:GitHubの操作(応用編) / GitHub Practice Github Adva...
Search
kaityo256
November 05, 2021
Education
2
1.3k
演習:GitHubの操作(応用編) / GitHub Practice Github Advanced
物理情報工学ソフトウェア開発演習
kaityo256
November 05, 2021
Tweet
Share
More Decks by kaityo256
See All by kaityo256
論文紹介のやり方 / How to review
kaityo256
14
75k
デバッグの話 / Debugging for Beginners
kaityo256
9
1.3k
ビット演算の話 / Let's play with bit operations
kaityo256
5
370
GNU Makeの使い方 / How to use GNU Make
kaityo256
15
5.1k
制限ボルツマンマシンの話 / Introduction of RBM
kaityo256
3
1k
論文の読み方 / How to survey
kaityo256
219
160k
リンゴゲームと貧富の差 / Origin of the disparity of wealth
kaityo256
14
14k
渡辺研Slackの使い方 / Slack Local Rule
kaityo256
9
8.9k
時間の矢について / Time's arrow
kaityo256
12
17k
Other Decks in Education
See All in Education
Nodiレクチャー 「CGと数学」講義資料 2024/11/19
masatatsu
1
310
【2024 DojoCon】懇親会LT
teba_eleven
0
100
AWS Well-Architected Labを活用してつよつよAWSエンジニアになろう!!! #jawsug_tokyo
masakiokuda
0
300
Tips for the Presentation - Lecture 2 - Advanced Topics in Big Data (4023256FNR)
signer
PRO
0
210
複式簿記から純資産を排除する/eliminate_net_assets_from_double-entry_bookkeeping
florets1
0
310
Info Session MSc Computer Science & MSc Applied Informatics
signer
PRO
0
110
Initiatives on Bridging the Gender Gap in the Technology Sector
codeforeveryone
0
130
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
2.6k
Semantic Web and Web 3.0 - Lecture 9 - Web Technologies (1019888BNR)
signer
PRO
2
2.7k
Поступай в ТОГУ 2025
pnuslide
0
18k
1216
cbtlibrary
0
280
Da Necessidade da Devoção à Virgem Santíssima
cm_manaus
0
120
Featured
See All Featured
A Philosophy of Restraint
colly
203
16k
Mobile First: as difficult as doing things right
swwweet
223
9.4k
Thoughts on Productivity
jonyablonski
69
4.5k
Code Review Best Practice
trishagee
67
18k
GraphQLとの向き合い方2022年版
quramy
44
13k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
Unsuck your backbone
ammeep
669
57k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.6k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
250
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
46
2.3k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.7k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Transcript
1 36 演習:GitHubの操作(応用編) 慶應義塾大学理工学部物理情報工学科 渡辺 物理情報工学ソフトウェア開発演習
2 36 • GitHub Pagesを使ってウェブサイトを公開する • MNISTの学習済みモデルをウェブで試す • 簡単なブラウザゲームを作る
3 36 我々がインターネットを閲覧する時、クライアントとウェブサーバが通信している クライアント ウェブサーバ サーバのローカルデータ Chrome Safari Firefox Edgeなど
Apache nginxなど
4 36 クライアントが要求するのはURL (Uniform Resource Location) https://www.mext.go.jp/a_menu/shotou/new-cs/index.htm プロトコル ホスト+ドメイン名 ディレクトリ
ファイル名 https://www.mext.go.jp/a_menu/shotou/new-cs/index.htm
5 36 https://www.mext.go.jp/a_menu/shotou/new-cs/index.htm プロトコル ホスト+ドメイン名 ディレクトリ ファイル名 https://www.mext.go.jp/a_menu/shotou/new-cs/index.htm 1. httpsというプロトコルで
2. mext.go.jpというドメインに所属する 3. wwwというマシンの 4. a_menu/shotou/new-csというディレクトリにある 5. index.htmlというファイルの情報をください サーバのローカルデータ サーバ ブラウザ
6 36 実際にはサーバにはIPアドレスという番号が振られている サーバにアクセスするためにはIPアドレスが必要 「www.mext.go.jp」のIPアドレスを 教えてください 202.238.130.103 です ホスト名とドメイン名を合わせて FQDN(Fully
Qualified Domain Name)と呼ぶ FQDNからIPアドレスを教えてくれるのがDNS (Domain Name System) DNS クライアント
7 36 ウェブページを公開するためには • グローバルIPアドレスを持つサーバの • 適切なディレクトリに • ファイルをアップロードする 必要がある
サーバの ローカルストレージ サーバ
8 36 GitHub に公開しているリポジトリから、HTMLやJavaScript, CSSなどを取得し、ウェブサイトを公開できる静的ホスティ ングサービス 外からウェブサイトとして 閲覧できる ウェブサイトとして公開する リポジトリ、ブランチ、
ディレクトリを指定
9 36 リポジトリのFork https://github.com/appi-github/pages-sample にアクセスして、Forkボタンを押す
10 36 こんな画面になるので「Create Fork」 ボタンを押す 自分のアカウントのリポジトリが コピーされる
11 36 Pagesの設定 Forkされたリポジトリ(自分のアカウントに表示されたもの)のSettingsを押す
12 36 1 2 3 4 1. Pagesを選ぶ 2. mainブランチを選ぶ
3. フォルダは /docsを選ぶ 4. Saveを押す
13 36 Saveボタンを押してから数分待ってからリロード 「Your site is live at ....」という表示が現れたら「Visit site」をクリック
14 36 https://github-watanabe.github.io/pages-sample/?1 もし404と表示されたら、しばらく待ってからアドレスの 最後に「?1」を追加してエンターキーを入力 GitHubアカウント名
15 36 数字認識できることを確認 マウスでここに入力 判定結果 ニューラルネットへの 入力画像
16 36 認識が誤判定する結果を作り、スクリーンショットを提出 なぜ誤判定したか考察すること 判定失敗
17 36 https://github.com/appi-github/tyrano_sample をforkする
18 36 先ほどと同様の手順でPagesを公開する 1 2 3 4 5
19 36 Saveボタンを押して数分待ってからリロード 「Your site is live at ....」という表示が現れたら「Visit site」をクリック
20 36 こんな画面が出たら成功 テストプレイをしてみよう マウスクリックでメッセージ送り 選択肢が出たらマウスクリックで選ぶ
21 36 リポジトリのクローンのため、リモートURLをコピー 1 2 3 4 1. 自分のアカウントの 2.
Codeをクリックし 3. SSHを選んで 4. コピーボタンを押す
22 36 cd cd github git clone
[email protected]
:github-watanabe/tyrano_sample.git cd tyrano_sample
Git Bashで以下を実行 ここはコピーされているはずなので、マウス右クリックから「Paste」
23 36 VS Codeの「フォルダーを開く」で「/z/github/tyrano_sample」を開く ここにTYRANO_SAMPLEと表示される
24 36 ブラウザは勝手にローカルファイルにアクセスできない もしアクセスできると、悪意あるサイトに個人情報を 引き抜かれる可能性がある クライアント ウェブサーバ 原則として、ユーザが直接指定したファイルのみ サーバに送信できる
25 36 ブラウザはローカルファイルを自由に見ることができない → ブラウザゲームのローカルでのテストができない 解決策1:ブラウザのセキュリティレベルを下げる(非推奨) 解決策2:ローカルにウェブサーバを立てる ローカルストレージ ウェブサーバ ウェブサーバの
ローカルなのでアクセスできる ブラウザ 動作確認 ファイル修正
26 36 1. 拡張機能をクリック 2. 検索窓に「Live Server」と入力 3. インストール
27 36 1. docs/index.htmlを開く 2. Go Liveをクリック
28 36 ブラウザが開いてゲームができれば成功 このタブはデバッグに使うので閉じない事
29 36 docs/data/scenario/first.ksを開く
30 36 *start [title name="怒れセリヌンティウス"] [hidemenubutton] [wait time=200] [freeimage layer="base"]
タイトルを変更して保存する
31 36 タイトルが変更されれば成功
32 36 first.ksを修正し、オリジナルゲームを作成する 必要に応じて画像ファイルを追加する 背景画像は docs/data/bgimageにファイルを置く
33 36 first.ksの保存忘れに注意。push前に保存すること。 VS Codeのファイル名のタブの隣が•になっていたら、保存されていない Xになっていたら大丈夫
34 36 Git Bashで、カレントディレクトリが /z/github/tyrano_sampleになっていることを確認 以下の手順でpushする git add . git
commit -m “updates” git push
35 36 GitHub Pagesで動作確認 1 2 3 Visit siteをクリックして現れたページで自分のゲームが表示されれば成功
36 36 https://アカウント名.github.io/tyrano_sample/ ゲームのスクリーンショットと 以下のURLをレポートに提出 • 公序良俗に反するような内容にしてはならない。 • (たとえ友人であっても)特定個人を揶揄するような内容にしてはなら ない。有名人も題材としない。
• 画像を用いる場合は、ライセンスに問題ないものを利用する。 • 面白い作品は別の場所で紹介する可能性があるため、紹介されたくな い場合はその旨をレポートに明記すること。 注意: