サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
weseek.co.jp
はじめに こんにちは、システムエンジニアの kota です。 今回は、個人的にまだ触ったことのなかった GraphQL に入門してみたので、ブログとしてまとめてみました。 1. GraphQL とは? GraphQLは、APIのためのクエリ言語であり、データ駆動型のアプリケーションを構築するためのランタイムです。Facebookが開発し、2015年にオープンソースとして公開されました。 これはエンドポイントに対するクエリを行うREST APIとは異なり、クライアント側で必要なデータを具体的に指定できるため、ネットワークの使用効率を最適化し、パフォーマンスを向上させることができます。また、APIのバージョン管理の問題を解消し、APIとフロントエンドの開発をデコープル(分離)することを可能にします。 2. GraphQL が登場するまでの技術 GraphQLが登場する以前、Webアプリケーショ
はじめに こんにちは、システムエンジニアの蛸井です。 最近は React のパフォーマンスチューニングにハマっており、どのようなコードを書くのが最適なのか気になったため色々と調べてきました。 今回の記事では、パフォーマンスチューニングの中でも React Hooks の useCallback に絞って、適切な使い方・使い時について詳しく解説します。 useCallback とは React Hooks の useCallback について解説します。 公式ドキュメントには以下のように記載されています。 https://ja.reactjs.org/docs/hooks-reference.html#usecallback メモ化されたコールバックを返します。 インラインのコールバックとそれが依存している値の配列を渡してください。useCallback はそのコールバックをメモ化したものを
この記事は 2021/09/16 (木) に行われた WESEEK Tech Conference の内容をまとめたものです。 発表前半部分の 「OpenID Connect に対応した認証基盤を構築した話」 を掲載しております。 既存RailsアプリをSSO化して、本番環境で活用した話【WESEEK Tech Conf #12】 目次 インターネットマルチフィード様紹介 インターネットマルチフィード(株)とは? MF社では、JPNAP と transix というサービスを提供しております。 JPNAP は IX(Internet eXchange) のサービスで、様々な事業者様にご利用いただいております。 transix は NTT 東・西日本が提供しているフレッツ光の IPv6 IPoE 接続を事業者様向けに提供しているサービスです。 各サービスの詳細な内容については、こちらをご覧くだ
例えば3つ分の記事の id, title, author の情報のみを取得したい場合は、以下のようなコマンドを実行することで取得できます。 $ curl -X GET https://wpdemo.net/wp-json/wp/v2/posts?_fields=author,id,title\&per_page=3 (curl コマンドで複数のクエリパラメータを指定する場合は & をエスケープする必要がある) [{"id":970,"title":{"rendered":"Update: Override Demo Parameters"},"author":2},{"id":920,"title":{"rendered":"How to Create a Demo WordPress Site"},"author":2},{"id":832,"title":{"rendered":"Wh
こんにちは、エンジニアのYoheiです。 早速ですが、皆さんはテストコードを書いたことはありますか? テストを書くとなると腰が重くなってしまう方もいるかもしれませんが、実はテストを書くと良いことがたくさんあるんです。 テストについてよくわからない方、これからテストを書き始めるという方はぜひ読んでみてください! 前半は、テストの概要について説明します。 後半は、Javascriptの テスティングフレームワークである Jest を使って実際のコードを例に説明していきます。 まずはテストの概要について簡単に見ていきましょう。 テストとは ※学校でやるテストではありません。 ここでのテストとは、プログラムのテストです。 プログラムのテストとは、実装したプログラムが意図した通りに動いているかを検証するために行うものです。 テストの種類 テストには主に3つの種類が存在し、以下のように分類できます。
はじめに 今回は、ブックマークレットを使って業務効率が少し上がったことについて話してみたいと思います。 ブックマークレットとは wikipedia では以下のように説明されています。 ブックマークレット (Bookmarklet) とは、ユーザーがウェブブラウザのブックマークなどから起動し、なんらかの処理を行う簡易的なプログラムのことである[注釈 1]。携帯電話のウェブブラウザで足りない機能を補ったり、ウェブアプリケーションの処理を起動する為に使われることが多い。 wikipedia - ブックマークレット 簡単に説明すると、ブラウザで開いているページに対して、任意の Javascript を実行できる機能です。ブックマークレットと似ているものとして、ブラウザの拡張機能があります。「hogehoge してくれる拡張機能が欲しいけどストアには存在しない。でも自分で拡張機能を作成するほどのもの
この投稿は、弊社が提供するWESEEK TECH通信の一環です。 WESEEK TECH通信とは、WESEEKのエンジニアがキャッチアップした技術に関する情報を、techブログを通じて定期的に発信していくものです。 はじめに 今回の記事では React における Global state の管理法についてさまざまな方法を、それぞれのメリットデメリットとともに解説します。 React で大規模な開発を行う際に Global state の管理法が定まっていると非常に開発が楽になるため、是非ともこのいずれかの方法を理解しておきましょう。 Global stateの管理が必要な理由 React において、例えばコンポーネントの構成が5階層になっていた場合に、一番上の階層のコンポーネントで定義している state を一番下の階層のコンポーネントに渡したい場合はどうすれば良いでしょうか。 上から下ま
こんにちは。エンジニアの Ryo です。 本記事では、Docker と Visual Studio Code(以下、VSCode)の拡張機能を利用してプロジェクト内で devcontainer 環境を構築する方法をご紹介します。 突然ですが皆さん、開発環境を構築する際に特定のプログラム言語やライブラリのインストール作業、めんどうくさいと感じたことはありませんか? 特にホスト PC に直接インストールをする場合は、既に入っているものと競合しないか確認をしながら進めなければならないため、非常に手間がかかってしまいます。 今回紹介する devcontainer 環境を一度構築すれば、その後同様の開発環境を構築する際に、個別にプログラム言語やライブラリをインストールする必要がなくなるため、大幅な時間短縮を見込めます。複数人で開発する際に大きな効果を発揮します。 VSCodeで開発をしている方は大勢
この投稿は、弊社が提供するWESEEK TECH通信の一環です。 WESEEK TECH通信とは、WESEEKのエンジニアがキャッチアップした技術に関する情報を、techブログを通じて定期的に発信していくものです。 はじめに こんにちは、システムエンジニアの かおり です。この記事では、TypeScriptで用いられる Enum型 とUnion型の基本的な使い方から、Enumを避けるべきと言われている理由、Union型を用いてEnumのように書く方法などを説明しています。 Enum (列挙型) とは? そもそも Enum とは何か、なんのために使うものなのでしょうか。 ここで説明している Enum とは総称であり、列挙型とも呼ばれます。以下の例は TypeScript のコードですが、他の言語でも存在する概念・実装であり、複数の定数を一つにまとめて定義したり管理したりすることができます。
この記事は、2021/9/2 に行われた WESEEK Tech Conference の内容をまとめたものです。 目次 はじめに この記事ではフォームの基礎について扱い, その後 React でのフォームの基礎, 実装をしてみてライブラリ (react-hook-form) を導入する話, react-hook-form の基礎と導入例について扱います 対象読者とこの記事で扱う内容 React のフォームの基礎を知りたい フォームってなんだろう Controlled or Uncontrolled とその基礎 react-hook-form について知りたい 基礎 Tips, GROWI.cloud での導入事例 そもそもフォームどういうもの ? ユーザとアプリケーションでの対話を表現しているもの。いろいろ種類がある。 一番単純なフォームから考えてみる 名前を入力したら Submit を
この記事は、2021/11/25 に行った WESEEK Tech Conference #15 の内容をまとめたものです。 はじめに こういった悩みや疑問をお持ちの方はいませんか? サブスクリプション型課金のサービスを考えているが決済をどうすればいいのか分からない クレジットカードや銀行などが絡んでくると、決済の管理が大変 そもそも定期支払ってどうやって実現するの? そんな悩みを解消してくれる Stripe というサービスを、 WESEEKがサービスを提供する GROWI.cloud を実例としてご紹介します。 「Stripe」とは Stripe は、米 Stripe 社が提供するオンライン決済サービスです。 ライブラリ・API が用意されており、サブスクリプション型の決済を行うプログラムを簡単にサービスに組み込むことができます。 始めるのがとても簡単 メールアドレスさえあれば、誰でも簡
この投稿は、弊社が提供するWESEEK TECH通信の一環です。 WESEEK TECH通信とは、WESEEKのエンジニアがキャッチアップした技術に関する情報を、techブログを通じて定期的に発信していくものです。 関連記事 開発でのロックの重要性とORMのロック実現例〜楽観的ロックの利用例|フレームワーク O/R マッパー 開発でのロックの重要性とORMでのロックの実現例 |楽観的ロックの紹介 Ralisへ機能フラグ(Feature Flag)を追加し各フラグを制御する エラーの内容 Rails 6 で、任意の host 名を指定してアクセスをしようとしたとき、下記のようなエラーが表示されることがあります。 Blocked host: hogehoge-host.com To allow requests to hogehoge-host.com, add the following t
この投稿は、弊社が提供するWESEEK TECH通信の一環です。 WESEEK TECH通信とは、WESEEKのエンジニアがキャッチアップした技術に関する情報を、techブログを通じて定期的に発信していくものです。 はじめに 今回の記事では Rails の権限管理 gem である CanCanCan について、導入手順と機能の解説を行います。導入手順を飛ばして機能の解説を読みたい方はこちらを押してください。 CanCanCan とは CanCanCan とは、Ruby on Rails の権限管理 gem であり、特定のユーザーがアクセスできるリソースを制限します。 どういうことかと言うと、例えば admin, manager, read_only という3つの権限があったとして、それぞれは以下のことができるように設定を行うことができます。 admin という権限を持っているユーザーは管理
WESEEK の kouki です。GitHub 個人アカウントは kaishuu0123 で活動しています。 今回は SEROKU からの引用ではなく、オリジナル記事として「GROWI のユーザーズガイドをリニューアルした話」を書かせていただこうと思います。 ドキュメントサイトはこちらです: https://docs.growi.org リニューアルしようとしたモチベーション WESEEK では最近 GROWI.cloud をリリースいたしました。 社内wiki|ナレッジベース|情報共有ツールのGROWI.cloud GROWI.cloud リリース以前では、Geek な方たちが GROWI を触っているという状況で、Issue も上げてもらいつつ、ポジティブなご意見をいただいて、特定のクラスタで盛り上がりを見せていました。 しかし、今後 GROWI.cloud と共に GROWI のコ
「SEROKU フリーランス(以下、SEROKU)」の中の人をやっている kouki です。 今回は 社内 Kubernetes 実験環境をRancher 1.6から 2.0にアップデートして復活させた話 の中でお話しした「2.0で行ったトラブルシューティング」の「グローバル IP とプライベート IP 2つの足(NIC)を持つサーバを Kubernetes クラスタのネットワークに所属させることができない (Calico ネットワークが確立されない)」という件についてお話させていただきます。 経緯 経緯としては、 Rancher を利用した Kubernetes クラスタに対してインターネットからリーチャビリティを持たせるためにグローバル IP アドレスと社内通信用のプライベート IP 2つの足(NIC)を持つサーバをクラスタに参加させようとしました。 その際に、Kubernetes ク
SEROKU の開発を例に、弊社で使っているリモートデバッグとロガーの Tips をご紹介します。 当記事は 2018 年、と過去の記事ですが、現在でも応用可能な Tips になっています。 案件としても OSS 成果物としても、JavaScript を利用するシチュエーションは増え続けています。まだまだ枯れた言語とは言い難い状況で、使われるバージョンも ES5 から ES7 まで進化を続け、新しい文字列リテラルや async/awaitのような「イマドキの JavaScript の書き方」を紹介する記事は多い中、デバッグはこうあるべきという情報は比較的少ないように思います。 本記事では JavaScript による開発、特に node.js を使ったサーバーサイド開発環境および babel を使ったクライアントサイド開発環境で便利なロガーの Tips、そして Microsoft 提供の
こちらは 「SEROKUを支える技術〜プロジェクト管理編〜」からの転載です。 本記事では SEROKU の開発を例に WESEEK で行っているプロジェクト管理について紹介しています。 こんにちは!初めまして。WESEEKの haruhikonyan と申します。 SEROKUを支える技術と題して SEROKU で使われている技術をできる範囲で数回に分けて紹介をしていきたいと思います。 スクラムによるアジャイル開発 SEROKU開発だけではなく、WESEEKではすべてのプロジェクトをスクラムによるアジャイル開発で進めています。 アジャイルを採用している理由としては世界的に見ればデファクトスタンダードだということと、ウォーターフォールに比べるとプロジェクトの成功率が高い点にあります。 弊社ではアジャイルでの開発を5年以上も前から行ってきていて、その知見も十分に溜まっていることも理由の一つです
このページを最初にブックマークしてみませんか?
『https://weseek.co.jp/』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く