皆さんこんにちは！WESEEK ソフトウェアエンジニアの 増山 です。
今回のブログでは、WESEEK で絶賛開発中の OSS Wiki システム GROWI の開発に参加する方法を解説していきたいと思います。
参加する目的別に主に5種類の方法が存在するので、それら全てについて説明します。
【GROWI ファン向け】GROWI の開発に参加する方法
2022年 6月 の投稿一覧
Sphinxでi18nなドキュメントを作成するときのナレッジ:課題編
こんにちは、 ryosuke です。
今回は、 ドキュメント作成ツールである Sphinx を使って、多言語の文章を作成する際に、困った点とその解決手段について取り上げます。
この記事では、このうちの「困った点」の話をします。
[GCP]VM インスタンス内でDockerコンテナを起動して、ブラウザからアクセスする
こんにちは、システムエンジニアの Kota です。以前の記事で、 AWS に EC2 を構築して、Docker を install し、Hello world! と表示させました。今回は、同じことを Google Cloud Platform ( GCP ) で実践したいと思います。
- 対象の読者
- 開発環境で Docker を使っているけど、デプロイにも使いたい方
- Docker、GCP に触れてみたい方
- AWS は触ったことあるけど、GCP は触ったことがない方
- インフラに興味がある方
【webpack】GROWIにおけるwebpackの設定について
はじめに
こんにちは、インターン生の手塚です。
今回はGROWIにおけるwebpackの設定について、調べてみたので記事にします。この記事はGROWIにおけるwebpackの設定に着目しているのでwebpackの基礎知識や、使い方の詳細は説明していません。webpackについてある程度の知識がある人に、プロジェクトへの活用例として参考にしてもらえればなと思っております。
webpackは設定が複雑で、そのため「webpack職人」と呼ばれる人たちが存在します。本当は、誰もが簡単に設定できるのが理想であり、Next.jsなどでは一部を自動的にやってくれたりもしています。ですが、まだwebpackがweb開発におけるモジュールバンドラーとして多く用いられているのは事実であり、webpackの知識は持っていて損はないでしょう。ということを先輩に言われたのでそういう思いで勉強しました。
React＆SWRでレンダリング時のチラつきを撲滅する３つのテクニック
| ステータス | 有用度 | 日時 | 備考 |
|---|---|---|---|
| 公開 | ⭐⭐⭐ | 2022/06/14 | |
| 更新 | ⭐⭐⭐ | 2022/09/30 | SWR 2.0 に関する追記 |
UI flickering はイケてない
WESEEK エンジニアの武井です。
みなさん、フロントエンドプログラミングやってますか？
今回のネタは「UI flickering」。React の初回レンダリングやステートを更新した際、こんな感じの挙動してないでしょうか。
出典: https://stackoverflow.com/questions/55032136/react-ui-flickering-when-state-updated
この一瞬今描画しているアイテム消えてパッと次のアイテムが出てくるまでの一瞬の間が見える現象、こちらが「UI flickering」です。
和製英語だと「UIフリッカー」とか言われる事もありますがあまり一般的ではなく、「カクつき」「チラつき」みたいな表現の方が馴染みがあるかもしれません。
UI flickering は、普通に React で Backend/DB からデータ取ってきて更新するコンポーネントを何も考えずに書くと大体起こってしまいます。UI/UX が壊滅的に悪くなるものではないのでプロダクト・実装箇所によっては許容されるかもしれませんが、イケてるかイケてないかで言えばやっぱりあんまりイケてない部類に入ります。
今回はそれを撲滅するための3つの Tips を紹介します。
semver(Node.jsライブラリ)のチートシートと実例紹介
はじめに(執筆の動機)
GROWI.cloud は、弊社が主に開発し、 OSS として GitHub に公開されている GROWI を、 SaaS としてクラウド版提供するサービスです。
本サービスでは、サービス上で立ち上げる GROWI のバージョンを適切にコントロールするために npm で公開されている semver ライブラリを利用しています。
実装の際に調べてみたところ、https://devhints.io/semver など semver の概念のチートシートはありましたが、Node.js の semver ライブラリの日本語版で分かりやすいチートシートや参考記事が少ないなと感じたため、今後の誰かのためになるならと思い執筆しました。
ご参考になれば幸いです。
