JavaScript

続きを読む

ReactにおけるGlobal stateの管理法4選

この投稿は、弊社が提供するWESEEK TECH通信の一環です。
WESEEK TECH通信とは、WESEEKのエンジニアがキャッチアップした技術に関する情報を、techブログを通じて定期的に発信していくものです。

はじめに

今回の記事では React における Global state の管理法についてさまざまな方法を、それぞれのメリットデメリットとともに解説します。

React で大規模な開発を行う際に Global state の管理法が定まっていると非常に開発が楽になるため、是非ともこのいずれかの方法を理解しておきましょう。

続きを読む

Jestでテストを書いてみよう(実践編)

こんにちは、エンジニアのYoheiです。

早速ですが、皆さんはテストコードを書いたことはありますか?

テストを書くとなると腰が重くなってしまう方もいるかもしれませんが、実はテストを書くと良いことがたくさんあるんです。

テストについてよくわからない方、これからテストを書き始めるという方はぜひ読んでみてください!

前半は、テストの概要について説明します。

後半は、Javascriptの テスティングフレームワークである Jest を使って実際のコードを例に説明していきます。

まずはテストの概要について簡単に見ていきましょう。

続きを読む

Node.js|EventEmitterの使い方解説

この投稿は、弊社が提供するWESEEK TECH通信の一環です。
WESEEK TECH通信とは、WESEEKのエンジニアがキャッチアップした技術に関する情報を、techブログを通じて定期的に発信していくものです。

はじめに

こんにちは、システムエンジニアのかおりです。本記事では、Node.jsのEventEmitterについてお話します。この記事で取り上げる内容は以下になります。

続きを読む

CSSをJavaScript に記載する-Next.jsでCSS-in-JS を使う方法

この投稿は、弊社が提供するWESEEK TECH通信の一環です。
WESEEK TECH通信とは、WESEEKのエンジニアがキャッチアップした技術に関する情報を、techブログを通じて定期的に発信していくものです。

前回までのおさらい

煩わしい設定は一切なし!Next.jsでCSS を使う方法では Next.js のセットアップと Build-in でサポートされている CSS の方法を紹介しました。

Next.js はセットアップすると煩わしい設定をすることなく CSS を書けます。
また、スコープを狭めた CSS Modules の記載方法もご説明しました。

今回の記事では前回の記事で実現する環境と同じ状況で CSS-in-JS の説明をします。

続きを読む

JavaScript/Node.jsでMongoDB+Mongooseのデータマイグレーション

こちらは 「JavaScript/node.jsエンジニア必見!MongoDB+Mongoose利用時のデータマイグレーション」からの転載です。


古くは「LAMP」に代表されるような技術スタック、JavaScript 界隈では「MEAN」スタックという用語もあるくらい、JavaScript(Node.js) との組み合わせでは MongoDB がよく使われるようです。

NoSQL ではスキーマレスのためデータマイグレーションを気にせず開発することも多いわけですが、例えば一度バージョン1をリリースして既にユーザーがついているシステムを更改するような場合、後方互換を保つためにもデータマイグレーション機構は重要です。

本記事では、Node.js 環境で MongoDB および Mongoose を利用しているようなシステムにデータマイグレーション機構を導入する Tips を紹介します。

続きを読む

Dev in Container on WSL2でボリュームのパフォーマンスを比べる

こんにちは。武井です。

2020年5月末に待望の Windows 10 May 2020 Update が公開され、WESEEK, Inc. で開発中の GROWI でも WSL2 と Docker Desktop を利用して Dev in Container を実現した新しい開発スタートアップ を採用しました。

本日のエントリーでは、その開発時に利用するストレージ(Docker volume)の種類によってパフォーマンスがどれくらい変わるのかを実験した際の結果を紹介します。

取り立てて高速化のための新しい手法を試しているというわけではありませんが、昨今の node プロジェクト開発における node_modules、rails プロジェクト開発における vendor/bundle 等、依存関係ディレクトリの取り扱いの参考になれば幸いです。

目次

続きを読む

イマドキの JavaScript 開発で使える、リモートデバッグとロガーの Tips (2018年版-後編)

こちらは 「イマドキの JavaScript 開発で使える、リモートデバッグとロガーの Tips (2018年版-後編)」からの転載です。

SEROKU の開発を例に、弊社で使っているリモートデバッグとロガーの Tips をご紹介します。
当記事は 2018 年、と過去の記事ですが、現在でも応用可能な Tips になっています。


案件としても OSS 成果物としても、JavaScript を利用するシチュエーションは増え続けています。まだまだ枯れた言語とは言い難い状況で、使われるバージョンも ES5 から ES7 まで進化を続け、新しい文字列リテラルや async/await のような「イマドキの JavaScript の書き方」を紹介する記事は多い中、デバッグはこうあるべきという情報は比較的少ないように思います。

本記事の前編、中編では、システム開発に於けるデバッガ、ロガーの大切さと、他の言語・フレームワークと比べた際の JavaScript 開発環境に於けるビハインドについて説明し、実際に理想的なロガーを利用する為の設定方法を紹介してきました。

本記事では JavaScript 開発時のデバッガー利用のための具体的な設定方法を紹介します。

続きを読む

Angular開発現場のTips-その3

こちらは 「SEROKUを支える技術 Angular Tips編 その3」からの転載です。

記事の最後に関連記事を掲載しています。よろしければご参考にどうぞ。


さて、今回は前回予告したとおり ng-content を使った、テンプレートに対して外部から子要素を突っ込むような処理を書いてみようかと思います。

Angular に置いてあまりサンプル記事がない印象ですが、使い方さえ覚えておけばきっと役に立つはずです!

続きを読む