はじめに
プロトアウトスタジオで行う授業に、自分でも参加できるのだろうか？と不安になる人がいるかと思います。 プロトアウトスタジオでは、実際に授業が始まる前に心配な方のために事前サポートを用意し、時間を取ってサポートをするので初心者の方でも安心して参加いただけます。
事前サポートを受けた方が良いか？自身で予習出来るかの判断となるようなチェックリストを用意しました。 今回は、その基礎編です。
その他チェックリストは以下です。
「迷ったら飛び込んできて欲しい！」ってのが率直な想いなのですが、なかなかそうともいかないとは思うのでこれが出来る人は問題ないよ！て項目をリストアップしておきます。
主にプログラミングを行うための環境構築や、コピペ力の判断になればと思っていますので、 詳細な解説は敢えて省いています。
どれか一つでも厳しそうな場合は事前のサポートを実施しますので、その際にサポートするので一緒にやっていきましょう。
チェックリスト
- VSCodeのインストール
- ターミナルの利用
- Node.jsのインストール
- 新規ファイルの作成
- プログラムの実行
- 簡単なプログラム
パッとみてこれが出来る人はこの記事を読み飛ばして大丈夫です。
VSCodeのインストール
Visual Studio Code(通称VSCode)はプログラミングをするために利用するエディタの一種です。
他にもエディタは色々ありますが、最近はエンジニアたちの間でもVScodeを利用するケースが増えていますので、こちらを利用していきましょう。
Windows版、Mac版、Linux版とそれぞれ公開されていますので、自身のパソコンにインストールしておきましょう。
インストールして起動できればOKです。
ターミナルソフトの起動
プログラムを実行するためのターミナルソフトウェアを起動します。また、VSCode内でもターミナルを起動することが出来ます。
表示はWIndows or Mac、VSCode内での起動なのかなどで異なります
起動できればOKです。
コマンドの入力
ターミナル上で簡単なコマンドを操作してみましょう。
$ ls
Applications Library
Desktop Movies
Documents Music
Downloads Pictures
Public
(注)Windowsの場合、機種によってはlsではなくdirコマンドの場合があります。
このようにホームフォルダ内のフォルダが表示されればOKです。
Node.jsのインストール
利用するソフトウェアのNode.jsをインストールしましょう。最新版(2020/7/3時点だと14.5.0)をインストールしてください。
Macの場合はこちらの記事を参考にインストールをしてください。
インストールが出来たら一度ターミナルを再起動して
$ node -v
を実行しましょう。
v14.5.0などバージョン情報が出ればOKです。
新規フォルダとファイルの作成
hello-protooutという名前のフォルダを作成- VSCodeで
hello-protooutファルダを開く hello-protooutフォルダ内に'app.js'ファイルの作成- 'app.js'内に以下のソースコードをコピーペーストする
console.log('Hello ProtoOut');
- VSCode内でターミナルを開きnodeコマンドで実行する
$ node app.js
Hello ProtoOutと表示されればOKです。
ソースコードの更新
app.jsを以下の内容に編集し、nodeコマンドで実行して下さい。
console.log(Hello ProtoOut);
以下のようにエラーが出たら(挙動確認として)成功です。
console.log(Hello ProtoOut);
^^^^^
SyntaxError: missing ) after argument list
作業の再現
一度PCを再起動してから、今度はapp2.jsを作成し、Hello n0bisukeと表示されるようにプログラムを記述し、node app2.jsで動作を確認してみましょう。
$ node app2.js
Hello n0bisuke
簡単なプログラム
簡単なプログラミングが出来るかのチェックです。 以下のプログラムを Node.jsで実行して結果を表示させていきましょう。
変数
const msg = 'こんにちは、';
const name = 'プロトアウト';
console.log();
このままだと何も表示されませんが、
msgとnameを利用し、値を変えずにこんにちは、プロトアウトと表示させましょう。
四則演算
const x = 2;
const y = 4;
console.log();
このままだと何も表示されませんが、 xとyを利用し、値を変えずに6が表示されるようにしましょう。
if文
const myPoint = 90;
const passingScore = 80;
if(条件式){
console.log();
}else{
console.log();
}
このままだとエラーが出ますが、
myPointとpassingScoreを変更せずに合格と表示させましょう。
else if
if文のプログラムを参考にmyPontが100の時だけ、大変よく出来ましたと表示させるプログラムにしましょう。
おわりに
おつかれさまでした！
これでプログラミングができる状態になり、簡単なプログラミングを編集することができました。