とある大手会社のWebサービスを、PHP100%でのアーキテクチャ仕様だったものを、Javascriptを交えたフレームワークに再構築した経験から、やっぱりJavascriptをもっと便利に、クリーンプログラミングしたいという思いが湧いてきました。
ということで、Javascriptエンジニアの行き着く先は、TypeScriptで、JavaやC#にできるだけ近い書き方ができるというメリットもある上、より安定的なプログラミングができるので、Javascriptでもそうした環境構築ができるというのは、かなりのメリットでしょう。
ネイティブJSとのコーディングの違いや、特性などの学習も踏まえて、自分の普段使っている環境に適合させる事を目的に、ブログにまとめておきたいと思います。
まだTypeScriptを触ったことがないWebエンジニアの人が、手っ取り早く理解して取り掛かれるようになる事を目的にしています。
（あと自分の備忘録）
TypeScriptはじめの一歩
TypeScriptは、
Nodejsで動作するモジュールで、
トランスパイル（コンパイルのようなもの）という処理を実行して.
tsファイル（Typescriptファイル）を.jsファイルに変換する
というコンパイル前プログラムです。
これでわかるとおり、scssのようなものだと理解するとわかり易いでしょう。
環境構築 : スタンダードなNodejs環境
1. node環境の構築
- ローカル環境であれば、dockerでnodeのインストールをするのがいいでしょう。
- compose.yaml ファイルを作って以下コードをコピー。
services:
node:
image: node:20
working_dir: /app
tty: true
volumes:
- ./:/app
2. コンテナを起動
docker compose up -d
3. コンテナにターミナルでアクセス
docker compose exec node bash
4. Typescriptのインストール
npm init -y
npm install typescript
npx tsc --init
5. インストール確認
- npmで確認
npm ls typescript
- バージョンを確認
npx tsc --version
Hello world
src/helloworld.ts
const message: string = "Hello, TypeScript!";
console.log(message);
コンバート
npx tsc src/helloworld.ts
src/helloworld.jsが作られます。
nodeで実行
node src/helloworld.js
> Hello, TypeScript!
コンバートされたjsファイル
var message = "Hello, TypeScript!";
console.log(message);
あとがき
Typescriptは、Javascriptをより厳密なプログラミングコードで書くことができるので、今現在人気急増中のプログラム言語です。
基本的には、Javascriptと同じですが、ほんのちょっとのルールの違いを理解しておくだけで、安定したコードに繋がるので、是非とも習得しておきたい言語でもあります。
Webエンジニアの人は、Typescript現場が増えているのも理解していると思いますが、知らない状態よりも、知っている方がはるかに自分にとってもメリットがあるはずです。
というわけで、Typescriptのプログラミング学習を、何日かに分けてブログで行っていきますので、学習好きな人は、読んで学んでくださいませ。
0 件のコメント:
コメントを投稿