プログラミング学習初心者のための情報メディア
この記事では、Visual Studio Codeの設定で拡張機能アイコンが表示されない件のサポート記事です。
左側にあるアクティビティバーに拡張機能アイコンが表示されていない場合、
アクティビティバー部分で左クリック > 「拡張機能」項目をチェック
拡張機能アイコンが表示されます。
アクティビティバー部分で左クリックした設定画面で、 アイコンの表示・非表示の設定が出来ます。
コマンドパレットから「アクティビティバーの表示の切り替え」を実行します。
上部メニューバー「表示」 > 「コマンドパレット」
「アクティビティバーの表示の切り替え」と入力して、クリックします。
アクティビティバーが表示されました。
オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！
プレミアムプランを2週間無料体験しよう
今すぐ詳細を確認する
GitをWindowsOSにインストールする方法を説明いたします。
この記事は、オンラインプログラミング学習講座「Web開発入門完全攻略コース」と、Proglus（プログラス）で公開している「Git / GitHub入門 – ソースコードのバージョン管理をしよう」サポート記事です。
Windowsでは、Gitを利用するために、Git for Windowsをインストールする必要があります。
まず、Git for Windows公式サイトからインストーラーをダウンロードします。
2022年10月現在の最新のバージョンは2.38.1です。
ダウンロードしたインストーラーを実行します。インストーラーの画面の指示に沿って進めていきます。
GNUライセンスの画面が表示されます。Git for Windowsは無料で使用できますが、ライセンスの同意が必要です。
内容を確認しましたら、「Next」をクリックします。
インストール先のフォルダを選択します。
特に理由がない限りはデフォルトのまま、「Next」をクリックします。
オプションを選択します。
デフォルトのまま、「Next」をクリックします。
Windowsのスタートメニューに表示する名前を指定します。
デフォルトのまま、「Next」をクリックします。
テキストエディタの設定をします。
この学習では「vim」を使います。「vim」を選択して、「Next」をクリックします。
新規リポジトリ作成時のデフォルトブランチ名を選択します。
これまで、Gitのデフォルトのブランチ名は「master」でしたが、今後は「main」に変更されます。
「Override the default brand name for new repositories」を選択して、ブランチ名は「main」のまま、「Next」をクリックします。
パスの設定をします。
デフォルトのまま、「Next」をクリックします。
OpenSSHクライアントのインストールを設定します。
デフォルトのまま、「Next」をクリックします。
HTTPSの設定をします。
デフォルトのまま、「Next」をクリックします。
改行コードの自動変換を設定します。
デフォルトでは、自動変換が選択されていますが、予期せぬ変換が起きる可能性があるので、自動変換の設定をオフにします。
「Checkout as-is, commit as-is」 を選択して、「Next」をクリックします。
ターミナルエミュレーターを選択します。
デフォルトのまま、「Next」をクリックします。
git pull コマンドの設定です。
デフォルトのまま、「Next」をクリックします。
Credential Managerのインストール。
デフォルトのまま、「Next」をクリックします。
オプションの設定です。
デフォルトのまま、「Next」をクリックします。
試験運用中のオプションの設定です。
デフォルトのまま、「Next」をクリックします。
インストールが開始されます。
インストールが完了しました。
スタートメニューを確認します。
Git for Windowsのインストールが完了しました。
VScodeを開いて、メニューバー > ターミナル > 新しいターミナル をクリックしてターミナルを開いて下さい。
ここで、ターミナルを「Git Bash」を選択してGit Bash を起動して下さい。
Git Bash とは、Gitのコマンドラインツールです。これからの操作はここから行います。
git のバージョンを確認します。
$ git --version git version 2.34.1
学習のタイミングによって、バージョンが異なる可能性があります。
これで、GitをWindowsにインストールすることが出来ています。
オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！
プレミアムプランを2週間無料体験しよう
今すぐ詳細を確認する
この記事は、Proglusオンラインプログラミング学習講座「はじめてのRuby on Rails 7入門」とUdemyオンライン講座「はじめてのRuby on Rails入門-RubyとRailsを基礎から学びWebアプリケーションをネットに公開しよう」のサポート記事です。
セクション「インターネットにウェブサービスを公開しよう」で使用しているウェブサービス herokuは、これまで無料プランを利用して学習してきました。
しかしながら、2022年11月28日以降、無料の製品プランの提供が終了しました。
このサポート記事では、コースを受講する場合の想定される費用と利用設定方法について説明します。
Herokuを使った学習は、Ruby on Railsの学習の本質的なところでは無いなため、セクションをスキップしたり、動画視聴のみを行い、後に、herokuが必要になったタイミングで別途試してみるという方法でも構いません。
これまで、Herokuには、無料の製品プランがありましたが、2022年11月28日より、Herokuの無料の製品プランの提供が終了しました。詳細に関しては、公式ページをご確認下さい。
Herokuを使ったカリキュラム学習のために掛かる見積もりです。
今カリキュラムで利用するHerokuのサービスは、
コンテナ：Dyno Basic
データベース : Heroku Postgres Mini
を利用します。
コンテナとは、アプリの実行環境をまとめたパッケージのことです。
それぞれ掛かる費用です。（公式ページ「Heroku の価格 」参照）
Dyno Basicは、1時間に約$0.01かかります。
Heroku Postgres Miniは、1時間に$0.007かかります。
例えば、リソースを2時間程度学習に利用した後、すぐにクリーンアップをした場合を想定した見積もりをしてみます。
Dyno Basic
$0.01 × 2h = $0.02
Postgres Mini
$0.007 × 2h = $0.014
⇒$0.034
日本円で5円程度掛かる見積もりとなります。(1USD=150円換算)。
尚、実際にサーバーを立ち上げた時間や、為替レートなどにより、実際の金額は異なります。
学習を中断せずに、一気行うことで、費用を削減できます。
まとまって時間が確保（2時間程度）できるときに、学習することをおすすめします。
ここから、実際の利用設定について説明します。
まず、Herokuを利用する場合、クレジットを登録する必要があります。
1.ログインした状態で、ユーザーアイコン > Account settings をクリック。
2.クレジットカードを登録します。
Billingタブをクリックして、Add credit card ボタンをクリックしてクレジットカードの情報を登録します。
英語表記ですので、必要に応じてGoogle翻訳等を使って下さい。
3.【コース内の動画で説明します】クレジットを登録するとアプリケーションが作成できます。
$ heroku create --stack heroku-20 Creating app... done, ⬢ tranquil-savannah-04699 https://tranquil-savannah-04699.herokuapp.com/ | https://git.heroku.com/tranquil-savannah-04699.git
これでクレジットの設定完了です。
動画教材に戻って学習を続けて下さい。
デプロイ実行後に再度サポート記事に戻って下さい。
デプロイ実行後、コンテナとDBの設定と確認を行います。
※下記で表示されている、アプリは既に削除済です。
まず、コンテナをBasicに設定します。
次のようにコンソールに入力します。
$ heroku ps:type Basic
Basicとなっていることを確認します。
$ heroku ps
▸ Starting November 28th, 2022, free Heroku Dynos will no longer be available. To keep your apps running, upgrade to paid dynos. Learn more in our blog (https://blog.heroku.com/next-chapter).
=== web (Basic): bin/rails server -p ${PORT:-5000} -e $RAILS_ENV (1)
web.1: up 2022/12/03 05:39:25 +0000 (~ 14m ago)
続いて、データベースですが、デフォルトでPostgres Miniが選択されているので、確認してみます。
$ heroku pg:info -a (app_name) === DATABASE_URL Plan: Mini Status: Available Connections: 0/20 PG Version: 14.6 Created: 2022-12-03 05:39 UTC Data Size: 8.6 MB/1.00 GB (In compliance) Tables: 0 Rows: 0/10000 (In compliance) Fork/Follow: Unsupported Rollback: Unsupported Continuous Protection: Off Add-on: postgresql-elliptical-65100
念の為、heroku側の設定状況も確認します。
ダッシュボード > 対象のアプリ選択 > Resources
以上で設定完了です。
実際にアプリが表示されているかどうか、ブラウザで確認してみましょう。
上記で説明した通り、Herokuは使った時間分費用がかかります。
そのため、学習後に利用後は速やかにクリーンアップすることを推奨しています。
クリーンアップ（アプリの削除）の方法は、コース内で紹介します。
デプロイの練習とアプリの動作テストを行うカリキュラムとなります。
オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！
プレミアムプランを2週間無料体験しよう
今すぐ詳細を確認する
今、世界最大級のオンライン学習サイトUdemy（ユーデミー）が、プログラミング学習にとてもおすすめです。
なぜかというと、ITの最先分野に精通したエキスパートのオンライン講座を、安価（セール時には1講座、千円台〜）に受講できるからです。
動画を見るだけでなく、実際に手を動かしながら学ぶスタイルなので、実務で使えるスキルが身につきます。
独学とちがって、コースを受講する中で発生した不明点はQ&A形式で講師が手厚くサポートするので、安心です。
書籍で独学もできるけれど、著者に質問はできないですよね。
毎月定額で発生するサービスと違って、一度購入したコースは、無期限に視聴できるのもメリットです。仕事が忙しくても、自分のペースで学習することができます。
安心の30日間返金保証があるので、気軽にコースを受講し始めることができます。※iOSアプリからの購入は対象外
購入してみたものの、思ってた内容と違ったと思ったら、30日以内に返金すれば、なにもリスクはありません。
思い立ったが吉日！今すぐ、確認しましょう。
Udemyは、なんと世界で2,000万人以上が利用している巨大プラットフォームです。
米国シリコンバレー発祥のUdemyは、学びたい人と教えたい人をつなぐCtoCの学習マーケットプレイスです。
海外発のサービスなので心配される方もいると思いますが、
日本では、あの教育サービス大手で、こどもちゃれんじや進研ゼミを手がける、 ベネッセが事業パートナーとして運営しているので安心ですよ。
サポートも日本語で丁寧な対応を受けられるんです。
1つでも当てはまると感じた方は、ぜひチェックしてみましょう！
プログラミング入門ナビ編集部が選んだ、Udemyのおすすめのコースを紹介します。
価格は参考価格です。詳細はUdemyのサイトでご確認ください！
よって、世界最大級のオンライン学習サイトUdemy（ユーデミー）は、これからプログラミングを学ぶ方にも、今学んでいる方にもおすすめのサービスです。
学習したいテーマが決まっている方も、何か始めたいけどどこから始めたらいいかわからない方まで、 あらゆる方に応じたコースを熱意ある講師が公開していますので、ぜひチェックしてスキルアップにつなげましょう！
オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！
プレミアムプランを2週間無料体験しよう
今すぐ詳細を確認する
Udemyで公開している「はじめてのTypeScriptプログラミング入門」のサポート情報を掲載しています。
Windows10を使って検証しています。他のバージョンでは、動作が異なる場合が想定されます。
PS C:\Users\yourusername＞ tsc -v
tsc : このシステムではスクリプトの実行が無効になっているため、ファイル C:\Users\naka\AppData\Roaming\npm\tsc.ps1 を読み込むことができません。詳細については、「about_Exec
ution_Policies」(https://go.microsoft.com/fwlink/?LinkID=135170) を参照してください。
発生場所 行:1 文字:1
+ tsc -v
+ ~~~
+ CategoryInfo : セキュリティ エラー: (: ) []、PSSecurityException
+ FullyQualifiedErrorId : UnauthorizedAccess
PowerShellのデフォルト設定ではスクリプトの実行が禁止になっているため、有効にする必要がある。
下記、ア〜ウを順番に実施
ア） 実行ポリシーを確認
PS C:\Users\username> Get-ExecutionPolicy
Restricted
→ Restricted と表示される場合は、スクリプトの実行が禁止されている。
イ） 一時的に、Unrestricted（すべてのスクリプトを実行可能）を設定する。
PS C:\Users\username> Set-ExecutionPolicy Unrestricted -Scope Process
補足： この設定は、PowerShellを起動するごとに設定が必要となる。恒久的に設定する方法は存在するが、ご自身で調べて設定と問題解決ができる方を除き、セキュリティの観点で推奨しない。
ウ） Unrestrictedが設定されたか、確認する
PS C:\Users\username> Get-ExecutionPolicy
Unrestricted
Google Chromeで開く
Node.jsが、ファイアウォールでブロックされないように設定する。
ターミナルで、実行中のコマンドを終了するためにcontrol + cキーを押した時に、表示される。
「Y」キーを押してから、エンターキーを押すことで、終了できる。
オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！
プレミアムプランを2週間無料体験しよう
今すぐ詳細を確認する