テクノロジー

2022年2月18日

【完全初心者向け】Ruby on Rails7を使って初めてのWebアプリケーション作成からインターネット公開までを一気に体験!#3

「プログラミング学習を始めたいけど、明確に何ができるようになるのか把握してから…」 という方、仕組みや背景など細かい説明は抜きにして、まずは体験してみましょう!

【完全初心者向け】Ruby on Rails7を使って初めてのWebアプリケーション作成からインターネット公開までを一気に体験!#3

【シリーズ記事一覧】



今回の記事で行うこと

前回の記事では、Ruby on Railsを用いて簡単なブログアプリケーションを作成しました!

今回は、作成したアプリケーションのソースコード(アプリケーションを構成しているコード群)を記録・保存していきます。
これは次回のインターネット公開の際に必要となる下準備です。

それでは始めていきましょう。

Gitとは

プログラムのソースコードの変更履歴を記録・追跡するための分散型バージョン管理システムである。元はLinuxカーネルのソースコード管理に用いるためにリーナス・トーバルズによって開発され、それ以降ほかの多くのプロジェクトで採用されている。
(Wikipediaより引用)

https://diveintocode.gyazo.com/799668bcecbc3318341884a92f7ceff2

Gitのユーザ登録

氏名を登録するコマンドを作成する

【手順】”画面左ツリー部分のWORKSPACEにある三点リーダをクリックする

Image from Gyazo

表示される [New File] をクリックして、新規ファイルを作成します
Image from Gyazo

作成するファイルの名前を聞かれますが、初期状態のUntitled.txtのまま、[OK] をクリックします
Image from Gyazo

作成されたUntitled.txtが開き、ファイルをテキストエディタとして使えます。

Image from Gyazo

【手順】 新しく開いたUntitled.txt欄を使って、コードを作成する

[コード] ※以下のコードをコピーして、Newファイル欄に貼り付けてください

$ git config --global user.name "Your name"

Image from Gyazo

この欄で、”“は消さずに ‘Your name’ の箇所のみをご自分の氏名に合わせて半角英数字で修正してください。nameと “” の間には、必ず「半角スペース」を入力してください。

Image from Gyazo

Gitユーザとして氏名を新規登録する

【手順】 前の手順で作成したコードをターミナルにコピペして、Gitにユーザ名を登録する

Image from Gyazo

Gitは恥ずかしがり屋のため、反応は何もありません。

Gitユーザとしてメールアドレスを登録する

【手順】 氏名の登録コマンドと同じ要領でコマンドを作成して、Gitにメールアドレスを登録する

[コマンド]

$ git config --global user.email "Your email"

Image from Gyazo

user.email と “” の間には、必ず「半角スペース」を入力してください。

Image from Gyazo

Gitは恥ずかしがり屋のため、反応は何もありません。

表示色を設定する

【手順】 gitコマンドの処理結果の文字列に色つけを自動で行い見栄えを良くするコマンドを入力し、[実行](エンターキー)を押下する

[コマンド]

$ git config --global color.ui true

Gitは恥ずかしがり屋のため、反応は何もありません。

【手順】 先ほどコマンドのメモ用に作成したUntitled.txtを削除しておく

ツリー表示の一番下にある、Untitled.txtを右クリックして、[Delete]をクリックする。

Image from Gyazo

本当に削除していいですか?といった警告文が表示されますが、[OK]をクリックしましょう。
Image from Gyazo

開いていたファイル名がUntitled.txt (deleted)になります。
[×] をクリックして閉じましょう。
Image from Gyazo

その際、再度警告が出ますが、[Don’t save] をクリックしましょう。
Image from Gyazo
これで削除完了です。

Gitに登録する

フォルダ構造とファイル群を全て登録する

【手順】 現時点の作成編集されたすべてのファイルを新規登録分としてGitに検知させる

[コマンド] ※半角スペースとドットも必要です

$ git add .

Image from Gyazo

”変更があった全てのファイルを検知させる”コマンドです。

【手順】 addで検知した内容を覚えさせる

[コマンド] ※このまま貼り付けて構いません

$ git commit -m 'First commit'

Image from Gyazo

【手順】 プロンプトが表示され、登録処理が完了したことを確認する

Image from Gyazo

登録確認

Gitに正常に登録できたか確認する

【手順】 検知したが未登録の内容がないか、Gitへの登録状況を確認する

[コマンド]

$ git status

【手順】 nothing to commit, working directory clean と表示され、問題なくすべて登録できたことを確認する

Image from Gyazo

【手順】 コミットされたログを確認する

[コマンド]

$ git log

【手順】 “commit ランダムな文字列 “の表示が出されるのを確認する

Image from Gyazo

設定した内容を確認する

【手順】 ここまでの手順で設定した内容をターミナルに表示させる

[コマンド]

$ git config --list

Gitに設定した内容を確認するコマンドです。

【手順】 user.name=やuser.email=が設定されていることを確認する

Image from Gyazo

お疲れ様でした!

今回は、前回の記事で作成したRuby on Railsのブログアプリのコードを、Gitを使用して記録する工程を体験していただきました。

次回は、今回記録・保存したアプリのコードをインターネットへとアップロードし、公開していきます!

次の記事:【完全初心者向け】Ruby on Rails7を使って初めてのWebアプリケーション作成からインターネット公開までを一気に体験!#4



ディープロの公式HPこちら
ディープロのオンライン個別説明会 & 相談会予約こちら
オンラインプログラミング学習サービス ディープロ Learningsこちら

ダイビックのことをもっと知ってみませんか?