01 / 06
それ、もう誰かが書いている
日付をきれいに整える。数字にカンマを入れる。パスワードを安全にしまう。
こういう「よくある処理」は、世界中の誰かがもう書いていて、しかも無料で使えるように公開してくれていることが多い。自分で書くと1日かかることが、借りれば5分で終わるんだ。
もちろん自分で書く力も大事。でも、作りたいものに集中するために借りる、という判断も同じくらい大事だよ。
ファイルを分ける・借りてくる
INPUT · スライド
01 / 06
日付をきれいに整える。数字にカンマを入れる。パスワードを安全にしまう。
こういう「よくある処理」は、世界中の誰かがもう書いていて、しかも無料で使えるように公開してくれていることが多い。自分で書くと1日かかることが、借りれば5分で終わるんだ。
もちろん自分で書く力も大事。でも、作りたいものに集中するために借りる、という判断も同じくらい大事だよ。
02 / 06
公開されているコードはパッケージという単位でまとまっている。中身はこれまで書いてきたものと同じで、関数やクラスを export したファイルの集まりだよ。
つまり、前のレッスンでやったことがそのまま通じる。取り込む相手が自分のファイルから他人のファイルに変わるだけなんだ。
03 / 06
本物の開発では、パッケージはターミナルから取ってくる。下のコマンドを打つと、node_modules というフォルダにダウンロードされて、import で呼べるようになる。
ただし正直に言うと、manabiya はブラウザの中だけで動いているアプリだから、このコマンドは走らせられない。この画面では、あらかじめ入れてあるパッケージを使う。
手順そのものは覚えておいて、自分のパソコンで開発するときに使えばいいよ。
npm install aisatsu04 / 06
この教材で使えるパッケージは次の3つ。どれも manabiya が練習用に書いた小さなものだよ。
aisatsu … 時間帯を渡すと、あいさつの文を返すkeisan … 数の見た目を整えたり、合計を出したりするmojiretsu … 文字をくり返す、逆さにする、長さを数える本物の npm にあるものではないので、名前を検索しても出てこない。使い方の練習にはこれで十分だよ。
05 / 06
パッケージを取り込むときは ./ を付けない。名前だけを書くんだ。
./ が付いていたら自分のファイル、付いていなかったらパッケージ。この見分け方は、人の書いたコードを読むときにも役立つよ。
// main.jsimport aisatsu from 'aisatsu';console.log(aisatsu("asa"));実行結果
おはよう
06 / 06
パッケージの中がどう書かれているかは、使うときには気にしなくていい。知りたいのは何を渡すと何が返るかだけだよ。
aisatsu の場合はこう。
"asa" を渡すと おはよう"hiru" を渡すと こんにちは"yoru" を渡すと こんばんはやあそれじゃあ、取り込んで使ってみよう。