クラウドワークス エンジニアブログ

日本最大級のクラウドソーシング「クラウドワークス」の開発の裏側をお届けするエンジニアブログ

フロントエンド開発チュートリアルを作成し開発ハードルを下げた話

こんにちは、crowdworks.jpの開発エンジニアをしている得能です。

クラウドワークスへの入社以来バックエンド開発のみ行ってきましたが、今年に入りフロントエンド開発の機会をいただけることになり、Vue.jsを使い新規画面実装などを行いました。 その際に、今後新しくcrowdworks.jpのフロントエンド開発を行う方々がスムーズに開発業務に入れるようにフロントエンド開発チュートリアルを作成しました。今回はその取組みについてお話したいと思います。

背景

crowdworks.jpはバックエンドはRuby on Rails、フロントエンドはERB、Vue.jsで開発されており、少しずつVue.jsで開発した画面への置き換えを進めています。

Ruby on Rails × Vue.jsの実装といえば、Vue.jsで画面実装、Ruby on RailsAPIサーバーにする、がよくある構成かと思いますが、crowdworks.jpでは過去の実装を残しつつVue.jsに移行を進めているなどの理由もあり弊社特有の実装方法を確立しています。そのため、crowdworks.jpのフロントエンド開発を初めて行う方はまずそのような実装ルールを知る必要がありました。

実装方法は現在の実装コードを眺めればある程度理解できます。また、フロントエンド開発に必要な知識は社内のQiita Teamにまとめていただいており、誰もが閲覧できる状況にはなっていました。 しかし、私がいざ開発を始めてみるとコードを読み込むだけでは

  • コード上では必須ファイルの名称などが明記されておらず見逃してしまう
  • 実は共通コンポーネント、関数が定義されているが、読んだ実装コードではたまたま定義されていなかった

ということがありました。

また、Qiita Teamの資料については実装したあとから「資料あったのか〜」と感じることがいくつかありました。その資料に到達するまでの検索ワード、問いが実装の過程では思いつかなかったためと分析しています。

私の情報探索力が足りないというのも理由ではあると思いますが、一方で、これだけ見ておけば全体像を理解できると感じられるガイドブックのようなものがあれば、誰でも迷わずcrowdworks.jpのフロントエンド開発に必要な知見をスムーズに習得することができるのでは?とも感じました。

どんな形式のガイドブックが良いだろう…と考えた結果、チュートリアルの形式が良いのではないかと思い作成してみました。

続きを読む

Elasticsearch RailsからSearchkickへの移行で気づいたSearchkickの注意点

こんにちは、クラウドソーシングサービス「クラウドワークス」でエンジニアをしている神山です。クライアントとワーカーのマッチングに関わる機能の運用・改善を行うデリバードチームに所属しています。

本サービスではRails環境での検索エンジン運用に Elasticsearch Rails を使用してますが、この度 Searchkick への移行を決定し、現在移行作業中です。この移行作業を通じて、Elasticsearch RailsとSearchkickの間にはいくつか顕著な違いがあり、特にElasticsearch Railsからの移行に際して注意が必要な点がいくつか存在しました。今回はその点を中心に書きました。

続きを読む

パフォーマンス改善:効率的なCSVインポートでSQL発行回数を大幅削減

はじめに

はじめまして、クラウドログのバックエンド開発を担当している崎岡と申します。

[クラウドログ]は、プロジェクト管理や工数管理を効率化するためのSaaS、作業時間の入力や進捗の可視化を簡単に行える機能が特徴です。そのプロダクトの機能改善について今回はお話ししようと思います。

続きを読む

サービスのヘッダーリプレイスがたいへんだった話

こんにちは、 @t0yohei です。

先日、crowdworks.jpで使用されているヘッダーのリプレイスを行いました。

ヘッダーのデザインを改善し、より使いやすくなりました! – クラウドワークス お知らせブログ

このリプレイスでは、ユーザビリティアクセシビリティの向上を目指すと同時に、技術的負債の解消や新しい画面レイアウトの下準備といった意図もありました。

このブログでは、今回のヘッダーリプレイスで直面した課題やポイントを共有したいと思います。 ヘッダーの改修や多くの画面に適用されているUIパーツのリプレイスに取り組む方にとって参考になれば嬉しいです。

続きを読む

© 2016 CrowdWorks, Inc., All rights reserved.