GitHub

自作のnpmパッケージを公開しよう

by
自作ライブラリをnpmに公開する方法

npmはNode Package Manager（ノードパッケージマネージャー）の略で、コマンドラインからJavaScriptのライブラリを簡単にインストール、管理できるアプリケーションです。 ReactもVueもAxiosもすべて、このnpmのライブラリに登録されているパッケージになります。 今日は、自作したnpmパッケージを一般に公開する方法を紹介します。npmを使ったことがない人は先にこちらの動画を見ておいてください。 なぜパッケージを自作すべきか プログラマーのツールの大多数は無料で使えます。Reactも、Linuxもソースコードを公開してオープンソースとして社会に貢献しています。もし、アイディアがあれば、オープンソースのプログラムを公開することはサイドプロジェクトとして最適です。 また、通常、下記の行からライブラリをインポートしますが、実際にその中身がどうなっていることを知ることはとても重要になります。 GitHubのリポジトリを作成 まずはGitHubとGitを準備しましょう。使ったことがない人はこちらの動画でGitのインストールの仕方と、GitHubの使い方を説明しています。GitとGitHubはなくてもできないことはないですが、バージョンコントロールと、リポジトリの管理はプログラマーにとって必須のスキルですので是非覚えておきましょう。 この作業は後からでもできますが、リポジトリが決まっている場合は先に作っておきます。 では、GitHubに行き、リポジトリを作成します。 ここで作成（Create Repository）をクリックするとGitをinit（イニシャライズ）できるコマンドがあるのでそれらをコピペしていきます。 ではコマンドラインから上記のラインを一行ずつコピペしていきましょう。 git push でrefsのエラーが出た場合はセキュリティ対策としてSSHキーが登録されていないと使用できないものになります。 詳しいSSHキーの登録の仕方はこちらの記事を参照してください。 npmパッケージのイニシャライズ では、git initを行ったディレクトリ内にいることを確認して、npmパッケージのイニシャライズを行います。npmがインストールされていることを確認し下記のコマンドを実行していきましょう。 すべてを入力するとおなじみのpackage.jsonが作成されました。 途中で聞かれたエントリーポイントがnpmパッケージのメインのJavaScriptのファイルになります。 早速、index.jsを作成していきます。 もしファイル名を変更したい場合は、package.jsonの中にある”main”の対象先を編集してください。 では、index.jsにサンプルとして、下記の行を書いてみます。ストリングが一致するとtrueを返す関数です。 npm link npmのパッケージができたら、コマンドラインからnpm linkのコマンドを使い{prefix}/lib/node_modules/<package>の場所にリンクさせます。シンボリックリンクといいますが、これで、npmパッケージがインストールされたかのようになり毎回ビルドをすることなくテストを行うことができます。 npmパッケージのテスト では、npm linkを行ったら、適当な場所にフォルダを作成して、テストを行います。 コマンドラインで、テストディレクトリに移動して、先ほどのasameshiパッケージのリンクをインストールします。 コマンドを実行するとnpmのnode_modulesディレクトリが作成され先ほど作成したasameshiパッケージがインポートされました。 ではコマンドラインからJavaScriptファイルを実行します。 画像のようにtrueが返ってきました。これでパッケージが問題なく作動していることが確認できましたね。 npmアカウントの作成 npmのパッケージを公開するためにはアカウントが必要になります。無料でできるので作っておきましょう。 ではnpmの公式サイトからSign Upをクリックします。 では、下記の様にアカウント情報を入力していきます。 これでnpmのアカウントが作成できました！ npmのアカウントをローカルの環境に接続 では下記のコマンドでローカルのnpmにユーザーを追加します。 ではEmailでワンタイムパスワードを確認してnpmにユーザーを追加しましょう。 ちなみに登録したEmailは一般に公開されるので要注意！ npmパッケージの公開 ではnpmにユーザーを追加したところで、下記のコマンドでnpmのパッケージを公開しましょう。 これで下記の様にエラーがでなければ成功です。 ちなみに、パッケージ名がすでに取られている場合はエラーが出るので、ユニークなものにしてください。 公開したnpmを確認 では公式サイトからasameshiのパッケージを確認しましょう。 https://www.npmjs.com/package/asameshi … Read more

UbuntuサーバーのコードをGitHubにプッシュする方法

by
UbuntuサーバーからGitHubにプッシュ

GitHubにリポジトリを作成してコードを公開したい、もしくはプライベートで管理したいですよね。 今回はUbutnuサーバーでデプロイしているコードをコマンドラインからGitHubにアップロード（プッシュ）する方法をご紹介します。 これができるとちょっとしたコードの変更があった場合にGitHubにコマンドラインで更新できるのでバグ修正をすぐに行い公開することができちゃったりしますね。 でGitHubにあげたコードは自分のパソコンにクローンしてまた作業ができるようになります。 後からのGitでの更新作業を考えると、Git CloneでGitHubのリポを先にサーバー側にコピーしてあげるのが一番良いです。 今日の条件 ①Ubuntuサーバー（２２．０４）とSSHアクセス 他のOSでもよいですがコマンドが変わる可能性があります。 ②GitHubのアカウント 今回初めてGitとGitHubを使う人は下記の動画から基本を学んでみてください。 SSHが分からない人は下記の動画を見てください。 Gitをインストールする では、UbuntuサーバーにSSHで接続した状態にしてください。 で、ターゲットとなるディレクトリに移動して.gitファイルを作成します。 もし、GitHubからリポをクローンしている場合は飛ばしてください。 コミットができたのでRPGゲームでいうセーブが完了しました。 ではこのセーブデータをシェアするためにGitHubを接続します。 GitHubで使うSSHキーを作成する ではUbuntuサーバーでSSHキーを生成してGitHubにそのパブリックキーの方を渡すような流れになります。 SSHのフォルダーに移動します。 SSHキーを作成します。 ファイルの保管場所を聞かれるので問題がなければそのままエンター パスフレーズの聞かれるので必要に応じて秘密のパスワードを作成します。 なくても大丈夫です。その場合はただエンターを押して次に進みます。 これでid_rsaとid_rsa.pubの二つのキーができました。 では下記のコマンドでパブリックキーの方を閲覧します。 ではこれをコピーします。ターミナルでハイライトすると自動でクリップボードにコピーされますね。 GitHubでSSHのパブリックキーを登録 ではGitHubのサイトに行き、設定の画面を開きます。英語だとSettingsですね。 その中に、SSH and GPG Keysというオプションがあるのでそれをクリックします。 右上の緑のNew SSH Keyのボタンを押して先ほどコピーしたキーを貼り付けます。 タイトルは自分で管理するために使うので分かりやすいように説明を付けてあげてください。 Ubuntuサーバーからコードをプッシュする では、最初にコミットしたコードをGitHubにプッシュ（アップロード、更新）します。 ちゃんと.gitのある場所に戻りましょう。 GitHubのプッシュしたい先のSSHのURLをコピーします。 ではコードのプッシュ先を下記のコマンドで登録しておきます。 では下記のコマンドでGitHubにコミットしたコードをプッシュします。 ちなみにGitHubのブランチ名が何になっているか確認しましょう。 メインのリポにプッシュする場合はmainとかmasterになっているはずです。 もしブランチ名（枝名）をmainに変えたい場合はこのコマンドで。 レッツゴー！ yesと入力し接続を完了させます。 トラブルシュート もし、GitHubの接続先にすでにリポが存在する場合はエラーが発生します。 もし、強制的にサーバー側からのコードでプッシュしたい場合は下記のfフラグで更新できるようになります。 GitHubのリポが更新されました。 お疲れ様です。