What's New Qiita

20200911のNode.jsに関する記事は9件です。

  • 投稿日：2020-09-11T22:26:39+09:00

Electronをバージョンアップしたらjsのネイティブモジュールが読み込めなくなった話

Electron9にバージョンアップしたところ、
途中でアプリの画面が動かなくなってしまう(windowになにも表示がされない)障害が発生しました。

原因

  • Electron9から、appallowrendererprocessreuseのパラメーターがデフォルトで true になってた
  • これによって２回目に読み込まれた時に、jsのネイティブモジュールが読み込めなくなっていた

appallowrendererprocessreuse とは

(公式サイトより) Boolean値。trueのときは、レンダラープロセスが確実に再起動されるように、Electronが設定しているオーバーライドを無効にする。このプロパティは、レンダラープロセスで使用できるネイティブモジュールに影響する
とのこと。名前からして再利用しようとしてうまくモジュールを読み込めてない、というような状況。

対策（暫定対応）

  • ページの初期化処理とかをしている部分で
    • app.allowRendererProcessReuse = false;
  • これまでと変わらないように動かせた

今後

  • issue によると

    • Electron 6 で app.allowRendererProcessReuse オプションを追加
    • コンテキスト非対応のネイティブモジュールについて、Electron 7で最初の非推奨警告ランドを用意する
    • Electron 9 でapp.allowRendererProcessReuseのデフォルト値がtrueに
    • Electron 10でapp.allowRendererProcessReuseを変更する機能を廃止予定
    • Electron 11でapp.allowRendererProcessReuseを変更する機能を削除

  • 今後Electron11では完全にfalseに変更できなくなるので、別の対応が必要

    • 現在調査中
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T22:18:41+09:00

create-react-appを使用したReactの環境構築(TypeScriptも)

はじめに

久々、環境構築をしたのでまとめました。
今回はcreate-react-appを使用してreactの環境構築をしていきます
どなたかの参考になれば。

環境

まずは作業を始める段階でのバージョンです。
homebrewは入っている前提で作業を進めていきます。

名前 version 補足
MacOS 10.15 Catalina
homebrew 2.5
node.js 12.9
yarn 1.22 stable
create-react-app 3.4

以下、今回インストールする物のバージョンです。

名前 version 補足
nodebrew 1.0
node.js 14.10 stable 更新します
yarn 1.22 stable
create-react-app 3.4

nodebrewのインストール

まずhomebrewを使用して、nodebrewをインストールしていきます。
既にnode.jsが入っているので必要ないといえばないのですが、後々のことを考えてnodebrewを使用することにしました。
まずはインストール。

$ brew install nodebrew

私の場合、エラーが出ました。出なかった人はスルーしてください。
gccをインストールしないとビルド出来ないよとの事なのでインストールします。
終わったら再度nodebrewをインストールします。

Error: An exception occurred within a child process:
  CompilerSelectionError: nodebrew cannot be built with any available compilers.
Install GNU's GCC:
  brew install gcc

インストールが終了したら確認
バージョンが表示されたら成功です。

$ nodebrew --version

nodebrewがインストールされたらpathを通します。
私はCatalinaなのでzshですがbashの人は.bashrcで入力してください。
もちろんvimで直接入力しても問題ありません。

$ nodebrew setup

export...とパスが表示されるのでそれをコピーして↓のコマンドを入力
$ echo '{コピペしたやつ}' >> ~/.zshrc

次にnode.jsの安定版をインストールします。
バージョンを指定したい場合はstableの部分を指定のバージョンを書き入れましょう。
迷ったらとりあえず安定版。

$ nodebrew install-binary stable

インストールされていたら確認と指定をしていきます。

インストール出来ているか確認します
$ nodebrew list

今回はv14.10.1がインストールされていたのでこちらを使用します。
$ nodebrew use 14.10.1

nodeのバージョンを確認。14.10.1になっていればOKです
$ node -v

以上で、nodebrewとnode.jsのインストールは終了です。

react.jsの環境構築

yarnのインストール

node.jsのパッケージマネージャーであるyarnをインストールします。
こちらもhomebrewから。

$ brew install yarn

終わったら確認

$ yarn --version

react-create-app

reactはreact-create-appを使用するのが一番楽なのでyarnからこちらをインストールします。

$ yarn global add create-react-app

インストールされたら使用可能です！

$ create-react-app {名前}

まとめ

最近、自分のPCで開発をしていなかったので、なかなか長い道のりになりました。
作業を進めながら書いたので抜けはないかと思いますが、何かありましたらコメントお願いいたします！
近々react+typescriptの環境構築もするので、そちらもまとめますー！

追記

TypeScriptの設定を調べたのですが、どうやらcreate-react-appで簡単に設定出来るようです...!

$ create-react-app {アプリ名} --typescript

オプションを指定するだけで行けるらしいです...!簡単！！

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T22:18:41+09:00

create-react-appを使用したReactの環境構築

はじめに

久々、環境構築をしたのでまとめました。
今回はcreate-react-appを使用してreactの環境構築をしていきます
どなたかの参考になれば。

環境

まずは作業を始める段階でのバージョンです。
homebrewは入っている前提で作業を進めていきます。

名前 version 補足
MacOS 10.15 Catalina
homebrew 2.5
node.js 12.9
yarn 1.22 stable
create-react-app 3.4

以下、今回インストールする物のバージョンです。

名前 version 補足
nodebrew 1.0
node.js 14.10 stable 更新します
yarn 1.22 stable
create-react-app 3.4

nodebrewのインストール

まずhomebrewを使用して、nodebrewをインストールしていきます。
既にnode.jsが入っているので必要ないといえばないのですが、後々のことを考えてnodebrewを使用することにしました。
まずはインストール。

$ brew install nodebrew

私の場合、エラーが出ました。出なかった人はスルーしてください。
gccをインストールしないとビルド出来ないよとの事なのでインストールします。
終わったら再度nodebrewをインストールします。

Error: An exception occurred within a child process:
  CompilerSelectionError: nodebrew cannot be built with any available compilers.
Install GNU's GCC:
  brew install gcc

インストールが終了したら確認
バージョンが表示されたら成功です。

$ nodebrew --version

nodebrewがインストールされたらpathを通します。
私はCatalinaなのでzshですがbashの人は.bashrcで入力してください。
もちろんvimで直接入力しても問題ありません。

$ nodebrew setup

export...とパスが表示されるのでそれをコピーして↓のコマンドを入力
$ echo '{コピペしたやつ}' >> ~/.zshrc

次にnode.jsの安定版をインストールします。
バージョンを指定したい場合はstableの部分を指定のバージョンを書き入れましょう。
迷ったらとりあえず安定版。

$ nodebrew install-binary stable

インストールされていたら確認と指定をしていきます。

インストール出来ているか確認します
$ nodebrew list

今回はv14.10.1がインストールされていたのでこちらを使用します。
$ nodebrew use 14.10.1

nodeのバージョンを確認。14.10.1になっていればOKです
$ node -v

以上で、nodebrewとnode.jsのインストールは終了です。

react.jsの環境構築

yarnのインストール

node.jsのパッケージマネージャーであるyarnをインストールします。
こちらもhomebrewから。

$ brew install yarn

終わったら確認

$ yarn --version

react-create-app

reactはreact-create-appを使用するのが一番楽なのでyarnからこちらをインストールします。

$ yarn global add create-react-app

インストールされたら使用可能です！

$ create-react-app {名前}

まとめ

最近、自分のPCで開発をしていなかったので、なかなか長い道のりになりました。
作業を進めながら書いたので抜けはないかと思いますが、何かありましたらコメントお願いいたします！
近々react+typescriptの環境構築もするので、そちらもまとめますー！

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T17:39:50+09:00

【Node.js】dotenvを使用して環境変数を設定する方法&設定した環境変数をHerokuにも適用する方法

node.jsで環境変数を設定する場合、
「dotenv」を使用すれば楽に設定することができる
色々と遠回りというか勘違いをして時間がかかってしまったのでメモ

手順

  1. ルートディレクトリに「.env」という名前のファイルを作成
  2. ターミナルにて$npm install dotenv --saveを実行
  3. 1で作成した.envに環境変数として使用したいkey&valueを以下のように記載
.env
NODE_USER_ID=12345678
NODE_PASSWORD=abcdefgh

4.環境変数を使用したい箇所に以下のように記載

app.js
require('dotenv').config();
let userId = process.env.NODE_USER_ID;
// 12345678
console.log(userId);

以上の手順で環境変数を設定できます。
※.gitignoreに .envを追記するのを忘れないようにしてください。
記載済みであれば大丈夫です。

あくまでもローカル上での設定となりますので、
Herokuにデプロイしているアプリに対して環境変数を適用する方法を以下に記載しました。

Herokuにデプロイする場合

便利ですよね、heroku。
Githubとherokuを連携している場合、.envファイルをプッシュしていないのでどうしたものかと・・・。

Config Varsを設定する

1.heroku上部メニューより、Settingsへ遷移
heroku_menu.png

2.「Reveal Config Vars」ボタンをクリック
reveal_config.png

3.お誂え向きなKEYとVALUEを入力できるフォームが出てくるので、
.envに記載している内容と同等のものを記載し、ADDをクリック
key_value.png

以上で、.envをgitに上げなくてもHerokuにデプロイしたアプリから、
環境変数を呼び出すことが可能となります。

備考

アプリ公開しました！よろしければインストールお願いします。
とらんぽ

Twitter始めました！よろしければフォローお願いします。
@yajima_tohshu

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T17:39:50+09:00

【Node.js】dotenvを使用して環境変数を設定&設定した環境変数をHerokuにも適用する方法

node.jsで環境変数を設定する場合、
「dotenv」を使用すれば楽に設定することができる
色々と遠回りというか勘違いをして時間がかかってしまったのでメモ

手順

  1. ルートディレクトリに「.env」という名前のファイルを作成
  2. ターミナルにて$npm install dotenv --saveを実行
  3. 1で作成した.envに環境変数として使用したいkey&valueを以下のように記載
.env
NODE_USER_ID=12345678
NODE_PASSWORD=abcdefgh

4.環境変数を使用したい箇所に以下のように記載

app.js
require('dotenv').config();
let userId = process.env.NODE_USER_ID;
// 12345678
console.log(userId);

以上の手順で環境変数を設定できます。
※.gitignoreに .envを追記するのを忘れないようにしてください。
記載済みであれば大丈夫です。

あくまでもローカル上での設定となりますので、
Herokuにデプロイしているアプリに対して環境変数を適用する方法を以下に記載しました。

Herokuにデプロイする場合

便利ですよね、heroku。
Githubとherokuを連携している場合、.envファイルをプッシュしていないのでどうしたものかと・・・。

Config Varsを設定する

1.heroku上部メニューより、Settingsへ遷移
heroku_menu.png

2.「Reveal Config Vars」ボタンをクリック
reveal_config.png

3.お誂え向きなKEYとVALUEを入力できるフォームが出てくるので、
.envに記載している内容と同等のものを記載し、ADDをクリック
key_value.png

以上で、.envをgitに上げなくてもHerokuにデプロイしたアプリから、
環境変数を呼び出すことが可能となります。

備考

アプリ公開しました！よろしければインストールお願いします。
とらんぽ

Twitter始めました！よろしければフォローお願いします。
@yajima_tohshu

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T14:51:22+09:00

YouTubeから動画をダウンロード（youtube-dl）

この方法はかなり安定して動画のダウンロードができます。動画ダウンロードサービスで四苦八苦するよりこちらがおすすめです。

コマンドラインで動作するためプログラムの機能として組み込むのも比較的容易です。

youtube-dlとは

youtube-dl は、YouTube.com やその他のサイトから動画をダウンロードするためのコマンドラインプログラムです。

Pythonインタプリタ、バージョン 2.6、 2.7、 3.2+ が必要で、プラットフォームに依存しません。UnixでもWindowsでもmacOSでも動作します。パブリックドメインに置かれているので、変更したり、再配布したり、好きなように使うことができます。

youtube-dlの使い方

コマンドラインで使います。

書式
youtube-dl [OPTIONS] YouTube動画のURL [URL...]
使用例
$ youtube-dl https://www.youtube.com/watch?v=7wfUUZvybPY
[youtube] 7wfUUZvybPY: Downloading webpage
[download] Destination: How to Install YouTube-DL (Windows 10)-7wfUUZvybPY.mp4
[download] 100% of 14.28MiB in 00:09

主なオプション

オプション 説明
-u, --username USERNAME YouTubeのアカウント
-p, --password PASSWORD アカウントのパスワード。省略すると対話的に入力
-o, --output TEMPLATE 出力ファイル名のテンプレート
-s, --simulate シミュレートするだけで実際にはダウンロードをしない
-t, --title 出力ファイル名を動画タイトルにする
-g, --get-url ダウンロードURLを表示する

アップデート

YouTubeに変更があるとyoutube-dlは使えなくなることがあります。その場合、アップデートする仕組みが用意されています。

youtube-dlの機能
sudo youtube-dl -U

上記でうまくいかない場合は、Windowsであればダウンロード、インストールのやり直し、Homebrew、pipは以下の方法でアップデートできます。

Homebrewの場合
brew update
brew upgrade youtube-dl
pipの場合
sudo pip install youtube_dl -U

インストール

Windows

Windowsユーザは、.exeファイルをダウンロードし、PATHを通して使ってください。

Mac

Homebrewでインストールすることができます。

brew install youtube-dl

もしくは、MacPortsでインストールすることができます。

sudo port install youtube-dl

pip

pipを使うこともできます。
https://pypi.org/project/youtube_dl/

sudo -H pip install --upgrade youtube_dl

Linux, MacOS, UNIX

curlを使う場合

sudo curl -L https://yt-dl.org/downloads/latest/youtube-dl -o /usr/local/bin/youtube-dl
sudo chmod a+rx /usr/local/bin/youtube-dl

wgetを使う場合

sudo wget https://yt-dl.org/downloads/latest/youtube-dl -O /usr/local/bin/youtube-dl
sudo chmod a+rx /usr/local/bin/youtube-dl

以上

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T13:20:38+09:00

【Node.js】JSON文字列をCSVファイルとして吐き出す

要件

・DBに格納されているデータをCSVでダウンロードできるようにする
・データはユーザーが回答したアンケートの結果

使用したモジュール

・json2csv
https://www.npmjs.com/package/json2csv

開発

1. データの成形

今回は、ユーザーが回答したアンケート結果をCSVとして出力したいと思いますので、表示する項目をユーザー名、メールアドレス、アンケート設問、回答結果とします。

データを成形する
    // DBから出力したいデータを取得する
    const data = await getData.getUserData(user_id);

    // データをJSON型に整える 
    const groupData = data.reduce((result, current) => {
      // user_idごとにデータをまとめる
      const element = result.find((p) => {
        return p.id === current.user_id;
      });
      // user_idが既にあればquestionとanswerのみを追加する
      if (element) {
        element.data.push({
          question: current.question,
          answer: current.answer
        });
      } else { // user_idが切り替わった時に新規の要素としてgroupDataに追加する
        result.push({
          id: current.user_id,
          name: current.user_name,
          email: current.user_email,
          data: [{
            question: current.question,
            answer: current.answer,
          }],
        });
      }
      return result;
    }, []);

DBから取得したデータをJSONに成形しました。reduce関数を使っているのは1クエリで適切な形でデータを取得できなかったためなので、必須ではありません。for文やmap関数を使ってきれいにしてください。
reduce関数でのデータをグループ化は以下を参考にさせて頂きました。

参考サイト
JavaScript オブジェクト配列をsqlのgroup byのように集計する

成形したデータは以下のようになりました。dataの個数は同じでなくても大丈夫です。

groupDataの中身
[
  {
    id: 267,
    name: "taro",
    email: "taro@example.com",
    data:[
      {
        question: "好きなプログラミング言語は？",
        answer: ["HTML", "CSS", "JavaScript"]
      },
      {
        question: "得意なプログラミング言語は？",
        answer: ["HTML", "CSS"]
      },
      {
        question: "苦手なプログラミング言語は？",
        answer: ["JavaScript"]
      }
    ]
  },
  {
    id: 269,
    name: "jiro",
    email: "jiro@example.com",
    data:[
      {
        question: "好きなプログラミング言語は？",
        answer: ["Go", "JavaScript"]
      },
      {
        question: "得意なプログラミング言語は？",
        answer: ["PHP", "Ruby"]
      },
      {
        question: "苦手なプログラミング言語は？",
        answer: ["Java"]
      }
    ]
  },
]

2. JSONをCSVに変換

続いてJSONに成形したデータをCSVに変換していきます。今回はjson2csvというモジュールを使用しました。他にもCSV系のモジュールはたくさんありましたので、自分にとって使いやすいものや仕様に沿っているものを選択すると良いかと思います。

get_csv.js
const {Parser, transforms: {unwind}} = require('json2csv');

function getCsv(data, fields, pathes, res) {
  const transforms = [unwind({
    paths: pathes,
    blankOut: true,
  })];
  const json2csvParser = new Parser({fields, transforms});
  const csv = data.length ? json2csvParser.parse(data) : '';
  res.setHeader('Content-disposition', 'attachment; filename=data.csv');
  res.setHeader('Content-Type', 'text/csv; charset=UTF-8');
  return res.send(csv);
}

module.exports = getCsv;

引数のdataは先程成形したデータが渡ってきます。fieldsにはdataの中の表示させたい項目を配列で渡します。今回の例ですと、以下のようになります。

fieldsの中身
const fields = ['name', 'email', 'data.question', 'data.answer'];

questionとanswerはdataの入れ子になっているのでドット繋ぎにします。

最後のpathesはdataの中でネストされている項目を配列で渡します。今回の例では以下のようになります。

pathesの中身
const pathes = ['data']

ここで、pathesの中にdata.answerを入れると、answerに格納されている配列が展開されて表示されるようになります。今回は、一つの設問に対して複数の回答を1行で表示させたかったのでdataのみにしました。
他にも色々オプションがありますので、詳しくは公式ドキュメントを参照してください。

3. CSVの出力

後は、CSVに変換したデータをPOSTなどのルーティングでres.sendしてあげることで、ブラウザからファイルをダウンロードすることができます。

CSV出力
const csv = getCsv(groupData, fields, pathes, res);
res.send(csv);

出力結果

以上です。

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T11:44:51+09:00

Node.jsで扱うよく扱うデータ形式の基礎知識

JSON

ご存知、JSON(JavaScript Object Notation)形式。
JSONオブジェクトは、標準ビルトインオブジェクトなので特別な準備なしで手軽に扱うことができる。

サンプル

JSONの例
{
  "browsers": {
    "firefox": {
      "name": "Firefox",
      "pref_url": "about:config",
      "releases": {
        "1": {
          "release_date": "2004-11-09",
          "status": "retired",
          "engine": "Gecko",
          "engine_version": "1.7"
        }
      }
    }
  }
}

使用方法

モジュールのインストールなどは不要。

// 文字列textをJSONとして解析し、JSオブジェクトに変換
const obj = JSON.pares(text)

// JSオブジェクトをJSON文字列に変換
const text = JSON.stringify(obj)

JSON5

JSON5は、JSONのスーパーセット。JSONの制限の一部を緩和する。

JSON5の拡張
* 末尾にコンマがあってもエラーにならない
* 文字列を一重引用符で囲むことができる
* 複数行の文字列を扱える（改行文字をエスケープする）
* 単一行および複数行のコメントが使える
* 空白文字を使用できる
など

サンプル

JSON5の例
{
  // comments
  unquoted: 'and you can quote me on that',
  singleQuotes: 'I can use "double quotes" here',
  lineBreaks: "Look, Mom! \
No \\n's!",
  hexadecimal: 0xdecaf,
  leadingDecimalPoint: .8675309, andTrailing: 8675309.,
  positiveSign: +1,
  trailingComma: 'in objects', andIn: ['arrays',],
  "backwardsCompatible": "with JSON",
}

インストール

Node.jsの場合
npm install json5
ブラウザの場合
<script src="https://unpkg.com/json5@^2.0.0/dist/index.min.js"></script>

使用方法

const JSON5 = requrie('json5')

// 文字列textをJSON5として解析し、JSオブジェクトに変換
const obj = JSON5.pares(text)

// JSオブジェクトをJSON5文字列に変換
const text = JSON5.stringify(obj)

CSON

CSON(CoffeeScript-Object-Notation)は、CoffeeScript記法を基にしたデータ形式。

サンプル

CSONの例
{
  "greatDocumentaries": [
    "earthlings.com",
    "forksoverknives.com",
    "cowspiracy.com"
  ],
  "importantFacts": {
    "emissions": "Livestock and their byproducts account for at least 32,000 million tons of carbon dioxide (CO2) per year, or 51% of all worldwide greenhouse gas emissions.\nGoodland, R Anhang, J. “Livestock and Climate Change: What if the key actors in climate change were pigs, chickens and cows?”\nWorldWatch, November/December 2009. Worldwatch Institute, Washington, DC, USA. Pp. 10–19.\nhttp://www.worldwatch.org/node/6294",
    "landuse": "Livestock covers 45% of the earth’s total land.\nThornton, Phillip, Mario Herrero, and Polly Ericksen. “Livestock and Climate Change.” Livestock Exchange, no. 3 (2011).\nhttps://cgspace.cgiar.org/bitstream/handle/10568/10601/IssueBrief3.pdf",
    "burger": "One hamburger requires 660 gallons of water to produce – the equivalent of 2 months’ worth of showers.\nCatanese, Christina. “Virtual Water, Real Impacts.” Greenversations: Official Blog of the U.S. EPA. 2012.\nhttp://blog.epa.gov/healthywaters/2012/03/virtual-water-real-impacts-world-water-day-2012/\n“50 Ways to Save Your River.” Friends of the River.\nhttp://www.friendsoftheriver.org/site/PageServer?pagename=50ways",
    "milk": "1,000 gallons of water are required to produce 1 gallon of milk.\n“Water trivia facts.” United States Environmental Protection Agency.\nhttp://water.epa.gov/learn/kids/drinkingwater/water_trivia_facts.cfm#_edn11",
    "more": "http://cowspiracy.com/facts"
  }
}

インストール

npm install cson

使用方法

const CSON = require('cson')

// 文字列textをCSONとして解析し、JSオブジェクトに変換
const obj = CSON.pares(text)

// JSオブジェクトをCSON文字列に変換
const text = CSON.stringify(obj)

HTML/XML/RSS

cheerioは、コアjQueryのサブセット。

インストール

npm install cheerio

使用方法

const cheerio = require('cheerio')
const $ = cheerio.load('<h2 class="title">Hello world</h2>')

$('h2.title').text('Hello there!')
$('h2').addClass('welcome')

$.html()
//=> <html><head></head><body><h2 class="title welcome">Hello there!</h2></body></html>

YAML

YAML（ヤムル、YAML Ain't a Markup Language）は、JSONのスーパーセットです。
設定ファイルによく使われています。

サンプル

リスト
--- # お好みの映画、ブロック形式
- Casablanca
- Spellbound
- Notorious
--- # 買い物リスト、インライン形式、またはフロー形式
[milk, bread, eggs]
連想配列
 --- # ブロック
 name: John Smith
 age: 33
 --- # インライン
 {name: John Smith, age: 33}

インストール

js-yamlのインストール
npm install js-yaml

使用方法

YAMLの使用方法
const yaml = require('js-yaml')

const obj = yaml.safeLoad(txt)
for (var i in obj.items) {
  const it = obj.items[i]
  console.log(it.name, it.price)
}

INI

INI（イニ）ファイルは、昔から設定ファイルによく使われています。

サンプル

INIファイル
[section1]
name1=value1
name2=value2

[section2]
name3=value3

インストール

iniのインストール
npm install ini

使用方法

iniの使用方法
const ini = require('ini')

const obj = ini.parse(txt)

for (const name in obj) {
  const it = obj[name]
  console.log(name, it.price, it.color)
}

CSV

RFC4180準拠のcomma-separated-valuesを使う。

サンプル

"aaa","bbb","ccc"
zzz,yyy,xxx

インストール

node.jsの場合
npm install comma-separated-values
ブラウザの場合
<script src="csv.min.js"></script>

使用方法

const CSV = require('comma-separeted-values')

const csv = new CSV(txt, {header:fales)}
const records = csv.parse()

Word/Excel/Powerpoint

officegenは、Microsoft Office 2007以降用のOffice Open XMLファイル（Word、Excel、Powerpoint）を、外部ツールなしで純粋なJavaScriptで作成します。

インストール

npm install officegen

使用方法

const officegen = require('officegen')
const fs = require('fs')

// Create an empty Excel object:
let xlsx = officegen('xlsx')

// Officegen calling this function after finishing to generate the xlsx document:
xlsx.on('finalize', function(written) {
  console.log(
    'Finish to create a Microsoft Excel document.'
  )
})

// Officegen calling this function to report errors:
xlsx.on('error', function(err) {
  console.log(err)
})

let sheet = xlsx.makeNewSheet()
sheet.name = 'Officegen Excel'

// Add data using setCell:

sheet.setCell('E7', 42)
sheet.setCell('I1', -3)
sheet.setCell('I2', 3.141592653589)
sheet.setCell('G102', 'Hello World!')

// The direct option - two-dimensional array:

sheet.data[0] = []
sheet.data[0][0] = 1
sheet.data[1] = []
sheet.data[1][3] = 'some'
sheet.data[1][4] = 'data'
sheet.data[1][5] = 'goes'
sheet.data[1][6] = 'here'
sheet.data[2] = []
sheet.data[2][5] = 'more text'
sheet.data[2][6] = 900
sheet.data[6] = []
sheet.data[6][2] = 1972

// Let's generate the Excel document into a file:

let out = fs.createWriteStream('example.xlsx')

out.on('error', function(err) {
  console.log(err)
})

// Async call to generate the output file:
xlsx.generate(out)

PDF

html-pdfは、開発終了のPhantomJSを使っているので使用は避けたいけれども。

インストール

html-pdfのインストール
npm install html-pdf

使用方法

html-pdf使用方法
ar fs = require('fs');
var pdf = require('html-pdf');
var html = fs.readFileSync('./test/businesscard.html', 'utf8');
var options = { format: 'Letter' };

pdf.create(html, options).toFile('./businesscard.pdf', function(err, res) {
  if (err) return console.log(err);
  console.log(res); // { filename: '/app/businesscard.pdf' }
});
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む
  • 投稿日：2020-09-11T11:06:01+09:00

Macのターミナルからhttp-serverコマンドを使って Webサイトを検証できるようにした

Macが突然壊れたので新しいMacを購入した。
現在、Webサイトを運営中でそれの更新作業を新しいMacでしようとした時に、ローカル環境で検証できないようになっていた。

具体的には、ターミナルでhttp-serverコマンドを打ってもエラーが出てくる。
新しいMacを購入してから環境構築をして無いねんから、そりゃ当然ですね。

とうことで、環境構築をすることにしましたが、ちょこちょこ詰まったので、ここに残しておきます。

主にこちらの記事を参考にさせていただきました。
https://qiita.com/standard-software/items/1afe7b64c4c644fdd9e4

とりあえずhttp-server コマンドのインストール

とにもかくにも、まずインストールを試みる

% npm install http-server -g

しかし、下記応答が。。。

zsh: command not found: npm

command not found: npmと出た時の対処

npmコマンドが使えないよ。とのことなので、以下の記事を参考にして進める。
https://qiita.com/sinmetal/items/154e81823f386279b33c

基本的には上記のリンク先通りにすればオッケー
ここでは、その過程で詰まったところを記載します。

source ~/.bash_profileコマンドで大量のエラー

.bash_profile が見当たらなかったので、下のサイトを見ながら、ホームに.bash_profile を作成。
http://banker0507.blogspot.com/2012/11/macbashprofile.html

https://qiita.com/sinmetal/items/154e81823f386279b33c
上記リンクに沿って下記コマンドを実行

% source ~/.bash_profile

すると下記のエラーが

command not found: rtf1ansiansicpg932cocoartf2513
command not found: cocoatextscaling0cocoaplatform0{fonttblf0fmodernfcharset0
command not found: colortbl
command not found: red255green255blue255
command not found: red255green255blue255
command not found: red83green83blue83
parse error near `;;'

なんだこれは？とりあえず.bash_profileの中身を見てみる

% cat .bash_profile

{\rtf1\ansi\ansicpg932\cocoartf2513
\cocoatextscaling0\cocoaplatform0{\fonttbl\f0\fmodern\fcharset0 Courier;}
{\colortbl;\red255\green255\blue255;\red255\green255\blue255;\red83\green83\blue83;}
{\*\expandedcolortbl;;\cssrgb\c100000\c100000\c100000;\cssrgb\c40000\c40000\c40000;}
\paperw11900\paperh16840\margl1440\margr1440\vieww10800\viewh8400\viewkind0
\deftab720
\pard\pardeftab720\sl380\partightenfactor0

\f0\fs26 \cf2 \cb3 \expnd0\expndtw0\kerning0

\outl0\strokewidth0 \strokec2 export PATH="/usr/local/bin:$PATH:/usr/local/sbin"\
export PATH=$HOME/.nodebrew/current/bin:$PATH
}

なぜかよくわからない文がたくさん、、、
viで中身を編集し、下記の状態にする。

% cat .bash_profile

export PATH="/usr/local/bin:$PATH:/usr/local/sbin"
export PATH=$HOME/.nodebrew/current/bin:$PATH

もう一度

% source ~/.bash_profile

無事エラーなしで解決

http-server実行でローカル環境での検証環境構築成功

その後もせこせこと参考ページを見ながらインストール等を実施し、最後に

% http-server

Starting up http-server, serving ./
Available on:
  http://127.0.0.1:8080
  http://192.168.10.7:8080
Hit CTRL-C to stop the server

http://localhost:8080/
にアクセスすると、、、、

無事、ローカルでの検証環境を構築することができました！

上記のサーバを停止したいときはcontrolキーとCを同時に押してください。

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

日付別

タグ一覧