npm

npm installでネットワークエラーが発生しました。どうやらIPv6での接続に失敗するようです。確かに当該ホストにpingしても到達できませんでした。 > npm install express npm ERR! code EHOSTUNREACH npm ERR! syscall connect npm ERR! errno EHOSTUNREACH npm ERR! request to https://registry.npmjs.org/express failed, reason: connect EHOSTUNREACH 2606:4700::6810:1423:443 > …

タイトルは半分嘘ですが。 やりたいこと 自分の作ったnodejsのプロジェクトを実行環境にデプロイしたい。 ただし、実行環境はRaspberry Piであり、アーキテクチャはarmかつOSは諸事情から32bit版しか使えない、 更に一部の依存モジュールはC++で記述されておりアーキテクチャに合わせてコンパイルが必要、という状況です。 もちろんRaspberry Pi上でnpm installすれば済む話ではあるのですが、npm installは非常に負荷が高くしばらくCPUを占有します。 なので可能であれば、CI等で依存モジュールを全て揃えて配布し、Raspberry Piでは実行するだけの状…

こんにちは！まいむです。 年末年始の休みに入ったら、ブログに書きたいことがたくさんあったのですが、FBCの課題や部屋の掃除なんかをやっていたらあっという間に大晦日になってしまいました・・・ 本当は分けて書きたかったnpmのリリースと2022年の振り返りを一気に書きたいと思います！！ dummy_email_address_makerというnpmをリリースした 案出しが大変だった www.npmjs.com 私が在籍しているフィヨルドブートキャンプではJavaScriptの課題の最後に自作npmの作成と公開があります。 自分でどんなnpmにするかを考えて実装するのですが、テーマ選びがとても大変で…

Laravel9で認証機能を実装しようとしたときにnpm installコマンドが正常に動かなかったので、そこまでの流れとその解決方法を紹介していきます。 laravelで認証機能を実装するため、以下のコマンドを打ちました。 $composer require laravel/ui その後にAuth関連ファイルを生成する(今回はvueで生成) $php artisan ui vue --auth そして次に打つコマンド $npm install$npm run build ← これはnpm installが正常に動作した後に実行するコマンド もしくは $npm install && npm r…

npm とは npm を使ってみる 参考 npm とは npm(Node Package Manager) は、JavaScript 系のパッケージを管理するツール。インストール時に依存関係を考慮してインストールしてくれる。 OS系パッケージ管理だと、 apt, dpkg, Homebrew のようなもので、言語系パッケージとしては Ruby の bundler に近いものと言える。 bundler 自体は パッケージ管理用の gem （パッケージ）らしいので微妙に違う🧐 npm パッケージを集めたリポジトリには、40万を超えるパッケージが登録されているらしい。 npm を使ってみる まずは、…

はじめに 別の記事でnpmコマンドでモジュールパッケージの環境構築の手順に付いて記載しましたが、今回はそのパッケージにtypescriptの環境を作るまでの手順を記載します。 手順 npmコマンドなどでpackage,jsonのあるディレクトリはすでに存在する想定です。 以下コマンドを実行し、typesciprtをインストールしてください。 npm install --save-dev typescript ts-node @types/node 以下コマンドを実行し、tsconfig.jsonを作成してください。 npx tsc --init 3.dirコマンドなどで確認してみてください。フ…

はじめに reactでモジュールパッケージを作成したいと思ったんですが、reactプロジェクトとして作りたいわけではなかったのでnpmコマンドを利用する手順を簡単に記載します。 手順 1.ディレクトリを作成して移動する。 mkdir project-name cd project-name 2.イカコマンドを実行し、質問に対して回答を記載していく。 npm init 対話形式で進みます。C押下でキャンセル可能。すべて進んだらyesを入力して実行してください。 完了し、package.jsonファイルが作成されています。中身が入力した内容通りになっているはずです。 おわりに コマンドプロンプトを…

Angular v15 がリリースされて既に数ヶ月が経過しました。 Angular チームが開発を行っている Angular Material も同時に v15 がリリースされています。 Angular Material v14 までは Material 2 の仕様に準拠したコンポーネント群を独自の実装で提供されていましたが、 v15 からは実験的に提供されていた Material Components for Web （以下 MDC ） をラップした内容へと大幅に中身が変更されています。本記事は MDC ベースの Angular Material において見た目をカスタマイズする方法について…

前回ちらっと紹介したReactコンポーネントライブラリreact-well-platesを使ってみました。公式のStorybookが参考になりました。 下準備 まず、create-react-appによるアプリの骨組み作成とnpmによるライブラリのインストールを行います。 npx create-react-app my-wellplate-app cd my-wellplate-app npm install react-well-plates メインコードの作成 my-wellplate-app/src/App.jsの内容を編集し、以下のような内容で保存します。propsのrowsとcolu…

Rust Solanaを触る過程で使い始めたんですけど、書き心地なかなか良いです。 それを支えるのはやはりrust-analyzerではあるので、これがなかったら無理ゲーな言語だなとは思います。 並列系の処理はパワフルだし、Result型によるエラーハンドリングの容易さ、非同期も書きやすいしいいトコ尽くし！！ …と言いたいところですが、堅牢さ故にjsonを扱うだけでもコード量が増えがちで、この辺はjavascriptやpythonを書くときのあの軽い感じが恋しくなったりもします。 enumとstructが入れ子になっているような型を扱うときなんかはいちいちif letやmatchを書かなくちゃ…

こんにちは、こんばんは、久保田です。 この記事ではSvelteKitにSentryを導入する方法を紹介します。 Sentryってなに？ 詳細は割愛します。ざっくりいうとアプリケーションのエラーを集約するSaaSです。 詳しくはサイトなり別途解説された記事を参照ください。 Application Performance Monitoring & Error Tracking Software | Sentry SvelteKitにSentryを導入する まず、SvelteKitでSentryを導入する際に気をつける点があります。 それは、「SSR時のエラーか、CSR時のエラーか」ということです。…

現在はこちらのはてなブログで記事を書いていますが、ブログを自作してみたいなとも思いました。 実際に移設するかどうかは置いておいて、とりあえず作ってみます。 方針を考える フロントエンドについては、最近のトレンドに倣って下記を採用します。 TypeScript React Next.js Styled Components 記事管理について、バックエンドのシステムを組んだり、ヘッドレスCMSの導入も考えられますが、 初期段階では一旦Markdownファイルで管理することとします。 デプロイ先はGitHub Pagesとします。 無料で利用できますし、ソース管理もGitHubで行うので、あとは少し…

なんかみんな外部パッケージのrimrafを使っていた気がするんだけど, 「わざわざ外部パッケージいるんかい」と好きになれなかった. さすがに今は簡単にできるらしい. nodeは16.16.0で試した. "clean": "node -e 'fs.rmSync(`./dist`, {recursive: true, force: true})'", "export": "npm run clean && next build && next export -o dist"

あらすじ 私の解決方法 あらすじ 皆様は DevContainer というVSCodeの機能をお使いでしょうか．私はいつも使っています． これは，Docker コンテナの中に接続してそこで開発ができるという機能です． Dockerを使えば開発環境の構築と共有が手軽にできるのですが，エディタの設定や拡張機能までは共有できません．特に拡張機能は .vscode/settings.json では仕様として共有ができませんので，私は DevContainer を使い始めました． これを使えば開発環境の配布がとても楽になります．（相変わらず構築は楽ではないです） ただ，ひとつ問題がありました．バックエン…

プライベート用のReactアプリをたまに手直しすることがあるのですが、いい加減CI/CDでデプロイを楽できるようにしとかなきゃなぁと思い、先日GitHub Actions用の設定を追加しました。

編集中のため体裁は適当です。 前提 nodejsはインストール済 バージョンは特にしていない（古すぎなければOK） ディレクトリ構成 app -frontend -backend バックエンド側構築手順 バックエンド側のディレクトリに移動する npm init -y 「backend」の中に「package.json」が作られます。 次にTypeScriptを使う準備をします。 2つのパッケージをインストールします。 npm install -D typescript @types/node 次に、以下のコマンドを実行します。 npx tsc --init すると、「backend」の中に「t…

Serverless Framework を利用するプロジェクトにアサインされました。 今まで全く触ったことがなかったのですが、いきなり「serverless.yaml 書いて」と言われたので急遽勉強するための環境を整えます。 インストール www.serverless.com node, npmバージョン確認 $ node -v v18.12.1 $ npm -v 8.19.2 インストール $ npm install -g serverless serverless バージョン確認 $ serverless -v Framework Core: 3.27.0 Plugin: 6.2.3 S…

サーバーサイドエンジニアの本間です。 1年ぶりぐらいのブログへの投稿になりますね。久々の投稿、がんばろうと思います！ さて、弊社のサーバーサイドでメインで使っているプログラミング言語はRubyになります。 先日、3.2.0がリリースされ、WASIベースのWebAssembly(WASM)がサポートされました。 また、先日弊社の別メンバーから早速リリースされたRubyのWASMを使って、node.jsからRubyを動かしてみるという意欲的なエントリが投稿されました。 tech.unifa-e.com そうした流れの中、自分も「WASMってどんなことができるのかな？」ということを試してみたくなりま…