こんにちは、弥生の日高 @hidakatsuya です。普段は クラウド見積・納品・請求書サービス「Misoca」 の開発に携わっています。 Misoca には、作成した請求書などの帳票を PDF としてダウンロードするだけでなく、PDF の内容を印刷したり、郵送したり、FAX として送信するなど、PDF が関連する機能が多くあります。そして、毎日非常に多くの PDF が Misoca 上で生成されています。 今回は、そんな Misoca の PDF をどのようにテストしているのかについてまとめたいと思います。 Misoca の PDF 本題に入る前に、Misoca で扱っている PDF についてもう少しだけ説明しておきます。 請求書・納品書・見積書・注文書・注文請書・検収書・領収書の7種類の PDF がある 請求書・納品書・見積書は複数のテンプレートを提供している 執筆時点で、請求書には

こんにちは、Misoca開発チームの黒曜(@kokuyouwind)です。 ついにECS execできるようになったことに咽び泣いていますが、今日の記事は全然関係ない話です。 社内向けに「どうすれば質の高いミーティングを作れるか」を検討した読み物記事を書いていたのですが、社外に出しても問題ない内容だったので開発者ブログに載せることになりました。 割と社内では評判が良かったので、参考になる部分があれば幸いです。 目次 目次 はじめに 要点 よいミーティングとは ミーティングとは よいミーティングの条件 目的の達成度 達成度と時間のバランス 効率の良いミーティング ミーティングの準備 ミーティングの目的とゴールを明確にする ミーティングの参加者を決める ミーティングの前提情報を洗い出す ミーティングの進行方法を決める ミーティングの実施 ファシリテーターの役割 タイムキーパーの役割 参加者の役

こんにちは、弥生のMisoca開発チームの黒曜(@kokuyouwind)です。 Kaigi on Railsの登壇が決まったのでよろしくおねがいします。弥生社員としては初登壇になります。 「おめでとうございます。 選考の結果、あなたのプロポーザルは採択されました！」 とのことなので、Kaigi on Railsお話しにいきますー— 黒曜 (@kokuyouwind) August 25, 2020 前回の記事が濃厚だったため、今回はライトなTips記事です。よろしくおねがいします。 tech.misoca.jp 👯‍♀️ VSCode LiveShareを使ったリモートペアプログラミング 皆さん、ペア作業してますか？ ペアプログラミングはドライバー・オペレータの交代など具体的なノウハウも多く、このブログでも以前に紹介記事を書きました。 tech.misoca.jp 上記の記事ではリモー

こんにちは、弥生 Misoca チームでマークアップをする方のデザイナー @kanizmb です。 今回、約1年をかけて古の Bootstrap の撤去および CSS 設計手法の導入（FLOCSS 化）をやり遂げたので、これらの変更をどのように進めていったかについてお話しします。 どういった状況だったか Misoca ローンチは 2011年、当時最新であった Bootstrap 2.3.2 を用いて構築が始まりました。(*1) 当初は請求書の郵送に特化した非常にシンプルなサービスだったため、少しの上書きでスムーズに開発が進められ、Bootstrap のメリットを存分に生かせていたのだと思います。 しかし時は流れ、取引先管理、品目管理、外部サービスとの連携など、機能が増え続けるとどんどん綻びが出始めます。 設計方針もないままに野放図に差し込まれた CSS たちは、いつしか激しい詳細度バトルを

こんにちは、Misoca の日高(@hidakatsuya)です。 Fit Boxing は何度始めても3日坊主になります。 拡張版 Thinreports の公開 Thinreports は、オープンソース のPDF 生成ツールです。Thinreports では、Editor と呼ばれる帳票デザインツールで作成したテンプレートファイルを、RubyGems である Generator を使って読み込み、値の埋め込みなどを行って PDF を作成することができます。 Misoca でも以前から一部の PDF 生成機能で利用していましたが、昨年より、本格的に利用を進めるにあたって、不足した機能の拡張という形で SectionReport フォーマットの実装を進めてきました。 Editor 及び Generator それぞれの実装は下記リポジトリの section-report ブランチで公開し、

こんにちは。@KawamataRyoです。 エンジニアになってから着々と体重が増えて、先日80kgの大台に乗りました。 大学の部活ではライト級（60kg以下）で試合に出てたのでその頃から20kgの増量。日々色々な方面で成長中です。 さて今回は、Misocaのリモートワーカーの仕事環境のお話です。 以前こちらの記事で紹介してから早2年、メンバーの入れ替わりもありリモートの環境も大分変わったと思うので、2019年度版を改めて紹介します。 @KawamataRyo リモート歴 基本勤務時間 6ヵ月 8:00〜17:00 仕事環境のこだわり モニターアームがカッコいいと思い、無駄にディスプレイを浮かせています。キーボードの押打でめっちゃディスプレイが揺れるのが悩み 椎間板ヘルニア持ちなので、デスク、椅子は良いものを使っています。昇降デスクなので時々スタンディングデスクとしても使っています 隣にベン

2エントリ連続でこんにちは、@mugi_unoです。 名古屋には台湾ラーメンイタリアンという名物があるそうです。 富山県民の私には理解が追いつきませんでした。 フロントエンドでの金額計算処理 さて、Misocaは請求書作成サービスなので、金額計算処理が欠かせません。 フロントエンドも例外ではなく、消費税額や合計額を算出するロジックが存在します。 機能変更が必要になった!! 諸事情により、そのロジックに変更を加える必要が生じました。 長くプロダクトを支えてくれていた存在ですが、内容的にはいわゆるレガシーなコードで、たびたび開発者ミーティングでも課題として挙げられることがありました。 git log で確認してみると、該当コードに対しての機能的な変更は2015年の冬から行われていません。 何が問題だったのか？ DOM操作と計算ロジックの混在 Misocaでは、新しくコードを書く際はVueやRe

初めまして、2月に入社した id:mizukmb です。 beatmania IIDX というゲームが好きなのですが、SP九段の道のりが遠くまだまだ鍛錬が必要と感じている今日この頃です。 私が Misoca に入社して驚いたことの一つに、 bot を利用した開発やコミュニケーションが活発 というのがあります 1 。時報やリマインダからリリースのオペレーションまで様々です。 今回は、 Misoca に住んでいる便利な bot をいくつか紹介したいと思います。 ちなみに、 2015年にも一度 id:mzp さんが bot を紹介した記事を公開しているので、そちらも合わせてご覧ください。 tech.misoca.jp misocat 主に開発周りをサポートする bot です。 未リリース状態の GitHub PR の一覧を表示してくれたり、リリース用の GitHub PR を作ってくれます。 m

こんにちは。tkykです。 みなさん、コードレビューしていますか？今日はMisocaのレビュープロセスで用いられている、とっても便利な「レビュー環境」について紹介します。 Misocaのレビュー体制とその課題 MisocaではPull Request（以下、PR）ベースの開発体制をとっており、必ず他のエンジニアによるPRのレビューを経てから、masterへマージすることになっています。 レビュー時に動作確認をするには、エンジニア各自がローカル環境にブランチをチェックアウトして行うのですが、時にはそれだけでは不都合なケースもあります。 非エンジニアにも動作確認をしてほしい 動作確認をするための条件を整えたい 最終的にはマージされないコードを一時的に追加したい 依存するライブラリのバージョンを変更したい RAILS_ENV=production でビルド・実行したい などなど このようなケース

こんにちは、@mugi_uno です。 RubyKaigi盛り上がりましたね〜！ そして広島は美味しいものがたくさんでした。次回の仙台も楽しみですね！ さて、みなさんはフロントエンドのフレームワークには何を利用していますか？ Misocaでは一部機能でReact/ReduxによるSPA構成を採用しています。 めろたん(@renyamizuno_)の書いた過去のエントリーにも登場していますね。 tech.misoca.jp しかし、Misocaで利用しているのはReactだけではありません。 jQuery React/ReduxはSPAなどでパワーを発揮しますが、逆に気軽に取り回しにくいため、ちょっとしたコンポーネントを作りたいケースなどでは、さくっと書けるjQueryを利用することもまだまだ多いです。 しかし、DOM操作が柔軟すぎるため影響範囲が読めなかったり、ビューと状態の管理が複雑にな

こんにちは、松江オフィスの日高（hidakatsuya）です。最近はイカの新規勢として子供達と一緒に楽しんでます。楽しい。 私が入社した2015年当時、リモートワーク勢は私含め2人でした。それが、2017年8月現在では6人まで増えとても賑やかになりました。そこで、今回はそのリモートワーク勢が「どんな仕事環境」で「どのように働いているか」について、各メンバーへのインタビュー形式でご紹介したいと思います。 では、早速紹介していきます。メンバーごとに回答をまとめています。 mugi_uno 富山県、リモートワーク歴6ヶ月 仕事環境を見せてください 机は奥行きに余裕があるものが好きで、IKEAのを使っています ケーブル類はテーブル下のケーブルボックスにまとめてスッキリ 左にある存在感のあるマイクは Yetiです。プレゼントでいただきました。YouTuber感がスゴい 椅子はオカムラのコンテッサを使

こんにちは！ Misoca開発チームのめろたん(@renyamizuno_)です！ 暖かくなってきて眠いですね。 最近は、「0.8秒と衝撃。」というバンドが活動を終了するってことを聞いて、まじかーとなってます。 はい。 今回はMisocaでReactを使い始めたことについて書きたいと思います。 React 詳しく書かないですが、ReactはFacebookで作られたユーザインタフェースを構築するためのライブラリです。 github.com 仮想DOMでJS界隈を賑わせていましたね。 class HelloMessage extends React.Component { render() { return <div>Hello {this.props.name}</div>; } } ReactDOM.render( <HelloMessage name="John" />, docume

ユーザー、プロダクト、チーム こんにちは、こくぼ @yusuke_kokubo です。 プロダクトをつくることと、つくりかたをデザインすることが好きです。 早速ですが、プロダクトをつくる流れをごくごく簡単にまとめてみました。 細かいことを言うと、他にもプロダクトのリリースに至るまでのプロジェクトについての話があったり、リリース後のユーザーサポートやメトリクスの話があったりしますが割愛します。 今日はチームづくりの話をします よいプロダクトはよいチームによってつくられます。 よいチームをつくるためにはよいマネジメントが必要です。 ボトムアップの行動と文化は勝手には育ちません。 会社としてトップダウンで環境をつくり、指針をつくることで文化が育まれる、というのがぼくの考えです。 今日はぼくがMisocaで行っているチームづくりについてお話しします。 チーム内のコミュニケーションを活性化するために

こんにちは、mzpです。 今日はMisocaのesaに書いていた「よいコミットメッセージ・よくないコミットメッセージ」という記事を紹介したいと思います。 あらすじ 開発チームでは「コミットメッセージには変更理由を書いて欲しい」「コミットメッセージはWhatよりもWhyが大事」という話を何度かしているのですが、なかなか徹底できていません。 ので、もう少し具体的に「こういうコミットメッセージはよくないですね」というまとめを作ってみることにしました。 ちなみにこの過程でみつけたコミットメッセージに、こんなものがあります。 一切情報がなくておもしろいですね。 ファイル移動を移動した事実しか書かない これは以下のようなコミットメッセージです。 ファイル名を変更 ディレクトリを移動 ファイルを移動したことはコミットメッセージを見なくてもdiffから分かりますが、なぜその移動をしたかが分かりません。 の

Misoca開発チームの黒曜(@kokuyouwind)です。 先日大須演芸場で開催された名古屋Ruby会議03ではTwitterでひたすら実況していました。大喜利が思った以上に大喜利で面白かったです。 お題「みなさんRubocopになってもらって『直しました』といってください。『何を直したんですか？』と聞くので、直したところを答えてください」 須藤さん「直しました」「何を直したんですか？」「RSpecをTestUnitにしました」 #nagoyark03— 黒曜@技術書典2 か-13 (@kokuyouwind) 2017年2月11日 流しの技術フェローに教わったペアプロのコツ 先日、弊社技術フェローのkakutaniさん(@kakutani)からペアプログラミング(以下ペアプロ)のコツを教わり、社内でのペアプロ機運が高まっています。 今回はkakutaniさんから教わった内容のまとめと

こんにちは、Kosukeです。:) IncrementsのQiitaプロダクトマネージャー及川卓也さんがMisocaへいらっしゃったので、インタビューさせて頂きました！ （左から共同創業者 松本、及川さん、代表 豊吉、Kosuke） 及川卓也氏のプロフィール 一般社団法人情報支援レスキュー隊 代表理事。東京出身。早稲田大学理工学部卒。 専門だった探査工学に必要だったことからコンピューターサイエンスを学ぶ。 卒業後は外資系コンピューター企業にて、研究開発業務に従事。米国マイクロソフトに派遣され、Windowsの開発を行う。その後もWindows関連のプロジェクトに関わっていたが、どうせWindowsの仕事をするのならと、マイクロソフト株式会社(当時)に転職。 マイクロソフトではWindowsの開発を行い、最終的には日本語版と韓国語版のWindowsの開発の統括を務める。 2006年にグーグル

こんにちは、こくぼ @yusuke_kokubo です。株式会社ファントムタイプ @PhantomType から来ました。 ちょっと前の話ですが、宮城県の松島に行ってきました。ちょうど紅葉がきれいな季節でした。 写真は朝日を浴びる福浦橋です。 今回はMisocaの受発注機能がどのようにつくられているのか、という話をしたいと思います。 Misocaの受発注機能とは 皆さんMisocaと言えば「請求書を簡単に作れて取引先に送るところまでやってくれるサービス」というイメージが強いではないでしょうか？ 受発注機能ではそれに加えて、取引先とのコミュニケーションもサポートしています。 Misocaが掲げる「仕組みで世の中をシンプルにする」「事業者間の取引を最適化する」といったビジョン・ミッションを推進するための野心的な取り組みです。 受発注機能のスクリーンショット 例えば、取引先に見積書を送ったとしま

こんにちは！ Misoca開発チームのめろたん(@renyamizuno_)です！ 最近急に寒くなってきましたが、皆さんはいかがお過ごしでしょうか？僕はすこぶる不調です。 写真は新幹線内で撮った最高に不調な僕と、すこぶる元気な植物とのツーショットです。 最近あった面白いこととしては、少し前に学生時代の後輩達とキャンプに行ったのですが、買い出しのときの出来事で 僕「マシュマロ買ったし竹串いるよね」 後輩氏「たしかに。探してきます」 僕「ういっす」 さつまいもを手にした後輩氏「串なかったですわ。」 一同「？？？？？？？」— めろたん。れんやたん。 (@renyamizuno_) October 8, 2016 これが最高にロックでパンクで面白かったです。 「えっ？なんすか？」みたいな顔でかごにそっとさつまいもを入れていたのも最高でした。 はい。 弊社は採用活動を活発に行っています。 その一環と

こんにちは。Misoca開発チームのtaiki-tです。 先日、本を訳したのでそのことについて書きたいと思います。訳した本は「オブジェクト指向設計実践ガイド　～Rubyでわかる 進化しつづける柔軟なアプリケーションの育て方」。 オブジェクト指向設計実践ガイド ~Rubyでわかる 進化しつづける柔軟なアプリケーションの育て方 作者: Sandi Metz,?山泰基出版社/メーカー: 技術評論社発売日: 2016/09/02メディア: 大型本この商品を含むブログを見る 原著は”Practical Object-Oriented Design in Ruby” です。 Practical Object-Oriented Design in Ruby: An Agile Primer (Addison-Wesley Professional Ruby) 作者: Sandi Metz出版社/メーカー