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
第01回Network講座2019
Search
北海道科学大学 電子計算機研究部
May 07, 2019
Education
0
120
第01回Network講座2019
北海道科学大学 電子計算機研究部
May 07, 2019
Tweet
Share
More Decks by 北海道科学大学 電子計算機研究部
See All by 北海道科学大学 電子計算機研究部
第12回Network講座2019
densan
1
37
第11回Network講座2019
densan
0
65
第10回Network講座2019
densan
0
34
第09回Network講座2019
densan
1
130
第08回Network講座2019
densan
0
40
第07回Network講座2019
densan
0
40
第06回Network講座2019
densan
0
47
第05回Network講座2019
densan
0
41
第04回Network講座2019
densan
0
62
Other Decks in Education
See All in Education
会社紹介リーフレット(株式会社東進ビルシステム)
tbs_official
0
340
WordPressを教える人のための視点と考え方
crebowinfo
0
210
6ヶ月間の授業でここまでできた。コンテスト参加に向けての授業内容と生徒の様子を紹介!
asial_corp
0
360
千葉県印西市立・原山小学校における新たな学び「情報探究の時間」実践報告』
codeforeveryone
1
490
MySmartSTEAM2324
cbtlibrary
0
110
5 занятие. Разбор метода "8 кубиков"бизнес-модели #ideaNN 16.02.2024.
karlov
0
170
Frederick Douglass versus George Fitzhugh
oripsolob
0
460
Tangible, Embedded and Embodied Interaction - Lecture 9 - Next Generation User Interfaces (4018166FNR)
signer
PRO
0
1.2k
Padlet opetuksessa
matleenalaakso
3
11k
情報Iの「縦糸」と「横糸」を意識したプログラム教育の実践
asial_edu
0
160
Baa Baa Black Sheep
haiinya
0
110
Railsチュートリアルの歩き方 (第7版)
yasslab
PRO
1
1M
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
130
6.2k
Clear Off the Table
cherdarchuk
82
310k
Building Effective Engineering Teams - LeadDev
addyosmani
25
1.8k
GraphQLの誤解/rethinking-graphql
sonatard
48
9.1k
How to Ace a Technical Interview
jacobian
272
22k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
5
1.4k
Designing on Purpose - Digital PM Summit 2013
jponch
109
6.4k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
39
4.3k
How GitHub Uses GitHub to Build GitHub
holman
467
290k
Agile that works and the tools we love
rasmusluckow
323
20k
Why Our Code Smells
bkeepers
PRO
330
56k
Documentation Writing (for coders)
carmenintech
59
3.8k
Transcript
ネットワークチーム 第1回 2019 北海道科学大学 電子計算機研究部
2 INDEX ⚫ ブラウザについて ⚫ テキストエディタ - VSCode導入 - 拡張機能
⚫ Git - Gitについて - gitインストール
ブラウザについて Google Chrome
ブラウザについて 4 コンソールや要素の検証など 開発者ツールをよく利用するため 本講座では Google Chrome を 使用します。
テキストエディタ Visual Studio Code Install & Extensions
テキストエディタ 導入 6 Visual Studio Code ⚫ Microsoft 開発のテキストエディタ ⚫
高機能で軽い ⚫ 拡張機能が豊富
テキストエディタ 導入 7 https://code.visualstudio.com/
テキストエディタ 拡張機能 8 1.左バーの一番下のアイコンをクリック 2.検索フォームに「japanese」と入力 3.候補の一番上をクリック 4.「Install」をクリック VSCodeを再起動 1 2
4 3
テキストエディタ 拡張機能 9 同じ要領で以下もインストール ⚫ Bracket Pair Colorizer 2 ⚫
HTML Snippets ⚫ Prettier ⚫ GitLens ⚫ Material Icon Theme ⚫ HTMLHint 自分の好きな拡張機能を導入してみよう!
テキストエディタ 10 コマンド 内容 Ctrl + Shift + P コマンドパレット
Ctrl + N 新規ファイルを開く Ctrl + S 上書き保存 Ctrl + F ファイル内の単語を検索 Ctrl + / 行をコメントアウト Ctrl + W 編集中ファイルを閉じる ショートカットキー(一部抜粋)
Git Version Control System
Gitとは ⚫ 分散型バージョン管理システム - いつでも・どこへでも戻れる - 誰が何を編集したかわかる ⚫ GitHub などが代表例
⚫ ソフトウェア開発の基盤 - もはや使わない選択肢は無い! - しかし、学校では教えてくれない…… 12
Gitのしくみ リモートリポジトリ 13 編集 編集 コミット コミット プッシュ プル ローカルリポジトリ
ローカルリポジトリ ローカルPC ローカルPC
Git 用語 ⚫ リポジトリ(Repository) 開発に必要なソースコード、資料や それらの変更などの一元的に 保存する貯蔵庫 ⚫ リモートリポジトリ オンライン上で共有するリポジトリ
⚫ ローカルリポジトリ 自分のPC上のリポジトリ ファイルの変更はローカルリポジトリへ コミットする 14
Git 用語 ⚫ コミット(commit) ファイルの変更を記録すること ⚫ プッシュ(push) ローカルリポジトリの変更をリモートリポジトリへ アップロードすること ⚫
プル(pull) リモートリポジトリの変更をローカルリポジトリへ ダウンロードすること ⚫ クローン(clone) リモートリポジトリ自体を複製すること 15
Git 16 https://commons.wikimedia.org/wiki/File:In_case_of_fire_git_push_first.jpg
Git セットアップ Install git and register for GitHub.
git インストール (1/6) 18 https://git-scm.com/ へアクセスし 「git」をダウンロード&インストール
git インストール (2/6) 19
git インストール (3/6) 20
git インストール (4/6) 21
git インストール (5/6) 22
git インストール (6/6) 23
GitHub登録 24 https://github.com/ にアクセスし情報を入力する メールアドレスは大学のものを推奨
git 初期設定 25 「Git Bash」を起動して以下を入力 $ git config --global user.name
“ユーザー名“ $ git config –global user.email メールアドレス
GitHub リポジトリ作成と環境設定 (1/6) 26 1.「Github」にログイン 2. [Repositories]の[New]を選択
GitHub リポジトリ作成と環境設定 (2/6) 27 3.新規リポジトリ作成画面が表示されるので [Repository name]を入力して [Private]を選択する [Create repository]でリポジトリを作成
GitHub リポジトリ作成と環境設定 (3/6) 28 4.[Clone or download]をクリック リポジトリのURLが出てくるので コピーする
GitHub リポジトリ作成と環境設定 (4/6) 29 5.任意のフォルダを開き アドレスバーに「cmd」と入力する フォルダに移動した状態で コマンドプロンプトが開く
GitHub リポジトリ作成と環境設定 (5/6) 30 6.コマンドプロンプトが起動するので git clone [リポジトリのURL] と入力して Enter
7.リポジトリ名のフォルダが作成されている ことを確認する (この場合はNetworkTeam という フォルダが作成されている)
GitHub リポジトリ作成と環境設定 (6/6) 31 8.[ファイル(F)]から[フォルダーを開く…]を選択 9.作成されたフォルダを選択して [フォルダーの選択]をクリックする
Git コミット・プッシュ commit push
Git コミット・プッシュ 33 1.ファイルタブを選択 2.ファイルを新規作成する 3.[net1.html]と入力 1 2 3
Git コミット・プッシュ 34 4.エディタ画面で ! と入力して Tabキー を押下 HTMLのテンプレートが入力された!
Git コミット・プッシュ 35 5.gitタブを選択 6.コミットメッセージを入力 7.コミットボタンを押す 5 6 7
Git コミット・プッシュ 36 8.[…]から[プッシュ]を選択 リモートリポジトリへプッシュされた!
本日の講座はここまで お疲れ様でした