Chatwork Creator's Note

ビジネスチャット「Chatwork」のエンジニアとデザイナーのブログです。

ビジネスチャット「Chatwork」のエンジニアとデザイナーのブログです。

読者になる

【ノーコード】通知用ルームに自分へのメンションをまとめてChatworkを使いこなそう!【Integromat】

みなさん、こんにちは!

2020年8月1日よりChatwork社にJoinさせていただきました、 サーバーサイド開発部(PHP)のやまごしと申します!

今回はIntegromatというノーコードで様々なサービスを連携させることができるサービスを使い、Chatworkをより便利に利用していただける方法をお伝えしたいと思います。

この記事を参考にしたらできること

この記事を参考にすすめると、以下の画像のように自分で作成しておいたルームに自分宛てのメンションメッセージをまとめて受け取り、見ることができるようになります

f:id:ymgn:20201008164534p:plain
最終形サンプル

続きを読む

コロナ禍で道民がリモート入社した話

f:id:tensler:20201002184247p:plain

まえがき

こんにちは!サーバーサイド開発部(PHP)の中田です。

今回は北海道在住の私がコロナ禍真っ只中でChatworkに入社するまでの思い出と、 3ヶ月の試用期間を終えた今も1度も社員と直接あったことのないレベル(笑)の純フルリモート業務を体験した感想をつらつらと書いていきます。

この記事でコロナ禍の就職&転職活動をしている皆さんになにかお伝えできれば幸いです。

f:id:tensler:20201005190312j:plain
去年10月末に化粧直ししたニッカおじさん

続きを読む

モバイルアプリチームのリリースフロー改善

みなさん、こんにちは〜😃

モバイルアプリケーション開発部のAndroidエンジニア、ジェロームです。 この記事では、モバイルアプリチームのリリースフロー改善について紹介します。

先日#ChatworkTechTalkで発表させていただいた内容をより多くの方に知ってもらいたいため、ブログにまとめました😄

続きを読む

祝 🎉 アクセシビリティ改善チームができました!

こんにちは、守谷(@emim)です。

今までWebアクセシビリティについて、デザイン部*1内で勉強会を実施したり、クリエイティブ職以外への啓蒙活動などを社内でちょこちょこ開催してきました。

実施内容すべて漏れなくは報告できていませんが、このCreator's Noteでも私以外の複数のメンバーもブログ記事にまとめてくれています(Accessibilityあるいはa11yというタグで、閲覧いただけます)。

そんな中しばらく私を悩ませていたのは、いくら自分自身(デザイナー)が知識を貯めて啓蒙を進めたところで、実際プロダクトの設計フローに「アクセシビリティ施策実施」という要件が乗らない限り、永遠に改善を深部まで進められない……という現実とのジレンマでした。

そんな中!

今夏やっと、プロダクトに改善施策を反映していくためのチームを立ち上げることができました!!!👏🏻

名付けて……と思ってはいたのですが、色々あってまだ仮称「アクセシビリティやってくぞい!」チームとなっています。

せっかくなので、今回はその経緯やプロセスをご紹介していこうと思います。

*1:デザイン部:現在のChatworkには「デザイン部」ではなく「プロダクトデザイン部」と「ブランドデザイン室」というものが存在していますが、過去記事の状況や両方を合わせた部署を表すラベルとして、デザイン部と表現しています。

続きを読む

jQuery時代のアーキテクチャをReact化するために大切なACL層のお話

こんにちは! フロントエンド開発部の澁谷(shibe23) です。Creator's Noteには初投稿となります。

「レガシーフロントエンド脱却への挑戦」というテーマで各メンバーが投稿してきましたが、今回の投稿で一区切りとなります。

各メンバーの投稿はこちらです。

最後のテーマは、jQuery -> Reactへの移行にあたって特に重要な役割を果たしている、ACL(腐敗防止)層です。

「jQueryからReactへの移行ってどうやってるの?」という質問をいただく機会も多いので、今回の記事が参考になれば幸いです。

Chatworkのアーキテクチャの変遷は 自前アーキテクチャなコードを Redux 構成に書き換えているお話 に詳しく書かれているので、あわせてご覧ください。

続きを読む

ウェブフロントエンドの設計力を高めるためにアプリケーションの構造を捉えてみる話

こんにちはー。

フロントエンド開発部の火村(ひむら/id:eiel)です。前回までは id:cw-himura で記事を書いていましたが、個人アカウントに切り替わりました。 よろしくおねがいします。

以前はサーバーサイド開発部に所属していましたが、2019年6月ぐらいからフロントエンドチームにヘルプとして無期限レンタル移籍中です。 主な担当している業務は「難しいバグ対応」と「これからChatworkのウェブフロントエンドをどうするかを考える」です。

昨日は期待の新人であるレオくんの入社して3ヶ月の熱烈な想いでした。アツいです。 さて、今回のお題は「レガシーフロントエンド脱却への挑戦」と雑に上から投げられたのですが、未来のことを考える作業をしているので書きやすいネタがありません。 あってもオチがつきません。

ということで、設計に役立つかもしれない話をラフに書くことにしました。

  • アプリケーションの構造を表す型
  • Updater - 状態を遷移させて、副作用を起こす
  • Selector - 状態から必要な値を求める
  • 具体例 Reducerをアプリケーションの構造でとらえよう
  • 具体例 クラスをアプリケーションの構造でとらえよう
  • 具体例 React Componentをアプリケーションの構造でとらえよう
    • StateやEffectを持つコンポーネント
  • モデルを組みあわせて全体を考える
  • まとめ
  • もっと詳しく…書きたいが紙面が足りないので雑談
    • Redux Store
    • アプリケーションの構造とAction
    • StateでActionの代用
    • ReactによるDOMの反映とState
    • アプリケーションの構造の合成
  • あとがき
  • 幕切れ
続きを読む

【Chatworkフロントエンドを大解剖!!】フロントエンド開発部に入社して3ヶ月が経ちました

8月よりChatworkのフロントエンド開発部にジョインさせて頂いた、石山(@NaReto1125_)です!

皆さんはChatworkやChatworkフロントエンドにどんなイメージをお持ちですか?

入社前、僕がChatworkフロントエンドに持っていたイメージはこれらのようなものでした。

  • なんかReact使ってる
  • Scalaのイメージが強くて、フロントエンドはあまりイメージがない
  • そもそもどんな人がフロントエンドにいるのかわからない

ざっくり「React使ってるな〜」ぐらいでした。

いざ入社してみると、以前持っていた僕のイメージと現場とでは良い意味で全く違ったものでした。

そのため、この記事でChatworkフロントエンドのやっていることや雰囲気を少しでも多くの人に知っていただけたらと思います!

続きを読む