RAKUS Developers Blog | ラクス エンジニアブログ

株式会社ラクスのITエンジニアによる技術ブログです。

エレベータープログラミングしてみた

こんにちは、fuj_takです。

エレベーターがなかなか来なくてもやもやすることありませんか?
かく言う私もエレベーター待ちになると、いつ来るんだろうと悩まされます。

自分にエレベーターの制御をやらせれば、もっといい感じにできる
皆さんも一度は考えた事があるのではないでしょうか!

そんなあなたにこちらをご紹介します。

Elevator Saga Elevator Saga - the elevator programming game

GitHubにも公開されています。 GitHub - magwo/elevatorsaga: The elevator programming game!

※私の環境だとIEでうまく画面表示できなかったので、Chromeなどのブラウザでお試しください

プログラミング内容

ブラウザ上でJavaScriptのコードを記述し、エレベーターの操作を行います。
エレベーターに乗った乗客の行先ボタンに応じた制御、
各階での上下ボタンが押された場合のエレベータの制御、
などを行い、時間内に多数の乗客を輸送できるかどうかにチャレンジするという内容。

ブラウザさえあれば誰でもお手軽に試せるので、チーム内ワークショップとかでも使えると思います。
2015年頃に公開されているようなので、一度は触ってみたことがある方もいそうですね。
APIも公開されています。

Elevator Saga - help and API documentation

やってみた

エレベーターの数や各階の数が異なる設定で全18ステージあります。

https://play.elevatorsaga.com/#challenge=1
https://play.elevatorsaga.com/#challenge=2
 ~
https://play.elevatorsaga.com/#challenge=18

頑張ってみたのですが、5ステージを超える事ができませんでした。。。。

色々と無駄な動きが多いですね。
エレベーターの制御プログラムを作っている方々、えらそうなことを言ってすみませんでした m(_ _)m

我こそはという方は是非チャレンジしてみてください!!

参考に

APIを頼りに作ったコードです。
いけてない点があるのは承知していますが、笑って許してください。

{
    init: function(elevators, floors) {
        var waitFloor = [];

        var queuePush = function(floorNum){
            if (waitFloor.indexOf(floorNum) < 0) {
                waitFloor.push(floorNum);
                waitFloor.sort(function(a,b){
                    if( a < b ) return -1;
                    if( a > b ) return 1;
                    return 0;
                });
            }
        }

        // 動作対象のエレベーター取得
        var getTargetElevetor = function(updown, floorNum){
            var target = null;
            elevators.forEach(function(e) {
                // エレベータ内の混在率を考慮
                if(e.loadFactor() < 1) {
                    if (updown == "up") {
                        if (e.destinationDirection == "up") {
                            if (e.currentFloor < floorNum) {
                                target = e;
                            }
                        } else {
                            target = e;
                        }
                    } else if (updown == "down") {
                        if (e.destinationDirection == "down") {
                            if (e.currentFloor > floorNum) {
                                target = e;
                            }
                        } else {
                            target = e;
                        }
                    } 
                }
            });

            return target;
        };

        // エレベーターの上昇/下降に合わせて停止階を決める
        var setStopFloor = function(e, floorNum){
            // 上昇中は上階のみ止まる
            if (e.destinationDirection == "up") {
                if (e.currentFloor < floorNum) {
                    e.goToFloor(floorNum);
                }

                // 下降中は上階のみ止まる
            } else if (e.destinationDirection == "down") {
                if (e.currentFloor > floorNum) {
                    e.goToFloor(floorNum);
                }

                // 停止中は指定階に向かう
            } else {
                e.goToFloor(floorNum);
            }

        };

        elevators.forEach(function(e) {
            // 待機中
            e.on("idle", function() {
                // 1階で待機
                e.goToFloor(0);
            });
            // 行先ボタンプッシュ
            e.on("floor_button_pressed", function(floorNum) {

                // 上昇中
                if(e.goingUpIndicator()) {
                    if(e.currentFloor() < floorNum) {
                        e.goToFloor(floorNum);
                    }
                    // 下降中
                } else if(e.goingDownIndicator()) {
                    if(e.currentFloor() > floorNum) {
                        e.goToFloor(floorNum);
                    }
                } else {
                    e.goToFloor(floorNum);
                }
                // 行先を制御
                setStopFloor(e, floorNum);
            })
            // 移動中
            e.on("passing_floor", function(floorNum) {

            });
            // 到着
            e.on("stopped_at_floor", function(floorNum) {
                // エレベーター待ちをクリアする
                waitFloor = waitFloor.slice(waitFloor.indexOf(floorNum), 1);
            });
        });

        // 各階で上下ボタンがプッシュされた
        floors.forEach(function(f) {
            f.on("up_button_pressed", function() {

                queuePush(f.floorNum());
                var e = getTargetElevetor("up", f.floorNum());
                if(e != null) {
                    // 行先を制御
                    e.goToFloor(f.floorNum());
                }

            });
            f.on("down_button_pressed", function() {

                queuePush(f.floorNum());
                var e = getTargetElevetor("down", f.floorNum());
                if(e != null) {
                    // 行先を制御
                    e.goToFloor(f.floorNum());
                }
            });
        });
    },

        update: function(dt, elevators, floors) {
            // We normally don't need to do anything here
        }
}

◆TECH PLAY
techplay.jp

◆connpass
rakus.connpass.com

大阪開発ビアバッシュレポート ~他部署のお仕事紹介~

f:id:Y-Kanoh:20190220204939p:plain

こんにちは。実はラクス大阪ビアバッシュ実行委員の、Y-Kanohです。

先日、毎月恒例のビアバッシュ@大阪を行いました。

今回のテーマは、「他部署のお仕事紹介」。 いつもは技術系の発表ばかりのビアバッシュに、他部署の方をお招きし、それぞれのお仕事内容を発表していただく、毎年恒例の人気企画です。

今回も内容をダイジェストでご紹介いたします。

営業のお仕事

f:id:Y-Kanoh:20190220193641p:plain:w500

まず、配配メールの営業担当に発表頂きました! ネット申し込みなどが普及し、システムを売るために、人手が必ずしも必要でない中における、営業の存在意義を教えていただきました。 お客様の困っていることを解決するためにも、 人それぞれに違うシステムに対する価値観を、いかに高めて紹介するかが腕の見せ所だそうです。 また、営業担当としてプレゼン時に心がけているテクニックも教えていただきました。

ネットワーク純情派

f:id:Y-Kanoh:20190220193645p:plain:w500

つぎに、365日インフラを守っているインフラ部隊、「ネットワークチーム」からの発表です。 ログ調査から障害対応まで、幅広い業務内容についての話から、 日々取り組んでいる、サービス品質向上のために行っているプロジェクト活動についての話などを伺いました。

(表紙のデザインがシブいですね。)

情シスの業務紹介

f:id:Y-Kanoh:20190220193631p:plain:w500

多数の業務内容を抱えている情報システム部からも発表頂きました。 業務内容は多岐にわたり、比較的馴染みのあるPC管理や、問い合わせ対応から、 あまり表に見えない、社内システムの基盤整理、セキュリティ対策、新しいITサービスの導入などについてお話しいただきました。 また、実際に最近社内へ導入された、業務効率化のためのBotシステムの紹介もしていただきました。 これからも、ラクスグループで働く人(:ラクト)のために、より良いIT環境をサポートして下さるそうです。

サポートお仕事紹介

f:id:Y-Kanoh:20190220193637p:plain:w500

楽楽精算の顧客サポートを行っている、大阪サポート課からの発表です。 顧客サポートの中でも、導入支援を専門に行っているチームです。 せっかく導入したシステムを最大限利用してもらうため、2か月間の専属サポートを行い、 できるだけ長く使っていただけるよう工夫しているそうです。

技術発表

いつも通りの技術系発表も行いました。

  • OSSの開発にJOINした話

    OSSの開発にJOINした経験から、仕事や開発における積極的な行動の意義を教えていただきました。

  • フェリーハッカソン参加報告

    先日、こちらの記事で紹介された、フェリーハッカソンのレポートです。 記事には載らなかった内容まで、写真を交えて発表していただきました。

また、最後にはLTでの発表も行いました。


いつもはエンジニアばかりのビアバッシュですが、今回はエンジニア以外の方も巻き込んで、いつもとは違うビアバッシュを行うことができました。 毎年行っている企画ですが、毎回新しい発見や知らなかった情報が出てくるため、ぜひ今後も続けたいです。

以上、大阪開発ビアバッシュレポートでした。

Laravel JP Conference で登壇した話

いろいろなところでネタになっている開発エンジニアの坂田です。

以前の投稿で周知されました通り、先日開催されたLaravel JP Conference 2019に登壇してまいりました。これも以前の投稿で触れていましたが、株式会社ラクスは BRONZE スポンサーとしてイベントに協賛しました。

イベント概要

conference2019.laravel.jp

登壇

チャットディーラーの高速開発を支える Laravel(30分セッション)

speakerdeck.com

昨年の PHP カンファレンス関西 2018 で発表した内容から資料を修正して再演しました。

感想

個人的にはあまり満足のいく発表が出来なかったなというのが正直な感想です。

  • マイクを持ってしゃべればよかった
  • 発表中、聞いてくれている人たちをあまり見れていなかった(話に興味を持ってくれているか不安になった)
  • 時間を余らせてしまった
  • 登壇力が足りない

ただ良かったこともありました。

  • 「Mustache Injectionという言葉を流行らせたいので覚えて帰ってください」がちょっとうけてた
  • Mustache Injectionについてつぶやいてくれている人がいた

やはり脆弱性に関する話題は関心をひきやすいのだなという印象です。

Mustache Injectionに関して参考

Mustache Injectionに興味を持ってくださった方向けに参考情報を載せておきます。

Laravel JP Conference のライトニングトークで発表してきました

f:id:Y-Kanoh:20190219095140p:plain

Y-Kanohです。 先日、弊社がスポンサーとなっている、Laravel JP Conference 2019 のライトニングトークに登壇してきました。

f:id:Y-Kanoh:20190219095418j:plain:w300

イベント概要

こちらの記事で紹介いただいたイベントです。

tech-blog.rakus.co.jp

Laravel JP Conference は、今回が初めての開催です。 (このような登壇イベントでの発表は初めてでしたが、まさかのトリの発表でした...)

発表資料

発表時の資料はこちらです。

speakerdeck.com

資料作成前は、基本機能の紹介等をクイズ形式で面白おかしくできたらと思いましたが、 実際はもろもろの事情により GitHub のコードから非常にコアな問題を出題することにしました。

感想

思ったより受け入れられて、とても楽しかったです。少しネタ寄りの発表でしたが、 コードを読まないとわからない内容だったため、聞き手の方もクイズを楽しんでいただけたようで、 発表後の懇親会では「Laravel クイズの発表者です」というと、「1問しか正解できませんでした」とか、「Laravel の内部って面白いですね」など、様々な反響をいただけました。

ちょうど、他のセッションで「何らかの形で少しでもアウトプットを行うことが成長への近道」といった話がありました。 私も、今回の登壇を機に、ブログや登壇といったアウトプットの機会を増やせればと思います。

Monaca使ってアプリ開発してみた

初めまして、新卒エンジニアのEngawaです。
今回はiphoneアプリ作成で使っているMonacaについてかなり簡単に紹介させていただきます。

Monacaとは

アシアル株式会社様が提供しているハイブリッドアプリ作成の開発プラットフォームです。
統合開発環境(IDE)とデバッガーなどの機能を提供しています。

統合開発環境(IDE)

MonacaではクラウドIDEというIDEが用意されています。 名前の通りクラウド上のあるためローカルで面倒な環境設定を行わなくても、会員登録さえすればどの端末でもブラウザ経由ですぐに開発ができます。
実際の編集画面はこんな感じです。
f:id:Engawa:20190217211850p:plain

普段からeclipseを使っており、Monacaの開発画面の見た目はほとんど同じだったので大まかな扱い方はすぐに理解できました。
実行結果も上図の右側の部分にあるのですぐに確認できます。
また、Monacaが提供しているデバッガーを使用すればスマートフォンでも実行結果を確認することもできます。

デバッガー

上にも記載したのですが、動作確認する時はMonacaデバッガーというデバッグ用のツールを使えばスマートフォンで動作の確認をすることができます。
アプリ自体は普通にApp StoreGoogle playで無料でインストールできます。 f:id:Engawa:20190217213451j:plain
アプリのインストールが完了したら、アプリを立ち上げてログインし、作成したプロジェクトを選択するだけで簡単に確認することができます。
デバッガーの画面はこんな感じです。(作成したプロジェクト一覧(左)と実行結果(右)をくっつけてます) f:id:Engawa:20190217211911p:plain

おわりに

今回は、Monacaについてかなり簡単に紹介させていただきました。
面倒な環境設定をしなくて済む上、様々なテンプレートが用意されているので手軽にアプリ開発を行いたい方にはオススメします。
Monacaに関しての詳しい記事はこちらにもあります。

参考サイト:
https://www.asial.co.jp/business/mobile/
https://ja.monaca.io/features/

ラクスも協賛!フェリーハッカソン2019にスタッフで行ってきた!!

メールディーラー開発エンジニアの@neroblubrosです。「フェリーハッカソンに行ってくる」というブログを前回書きましたが、実際に行ってきたことを書きます。

前回書いたブログの記事 tech-blog.rakus.co.jp

若手社員と一緒に参加しました

前回のフェリーハッカソンには私ひとりで参加しましたが、今回はなんと若手社員のふたりも参加することになり、ラクスからは合計3名でフェリーに乗り込みました! 若手社員が書いた参加レポートはこちら

MasaKu tech-blog.rakus.co.jp

Y-Kanoh tech-blog.rakus.co.jp

フェリーハッカソンに限らず、私はいままでいくつかのハッカソンに参加してきましたが、今回のフェリーハッカソンはプレイヤーではなく、スタッフとして参加しました。 スタッフの中でもプレイヤーのみなさんをサポートする「メンター」です。

どこまでサポートするか?で迷いました

メンターのお仕事は前述のとおりプレーヤーのサポートです。具体的には下記のとおりです。

  1. 各チームのアイデアをどうやって実現すればいいか?の提案
  2. APIの使い方などのサポート
  3. 時間が足りない!ときの助っ人

実際のところ、1と2はあまりありませんでしたが、2日目に進捗が遅れているチームが発生したので、そのチームに助っ人に入ってサポートをしました。 チームの助っ人を始めると「どこまで手伝うか?口出しをするか」ということに苦慮しました。

チームそれぞれの思いや考えがあるため、コンセプトといった成果の根幹に関わる部分に口出しはできません。そういう意味でメンターは受け身です。 その反面、チームメンバーは猫の手も借りたい状態なので「もっと手伝ってほしい」「いろいろ意見を言ってほしい」とメンターに求める気持ちも理解できます。

また、私自身「こうしたらいいのに」「こっちのほうが絶対いい!」という意見もあり、それをチームに伝えるか伝えないかで迷いましたし、「メンターが言うのだから」とある意味チームメンバーの方が気を使うことも恐れました。 この点がメンターをするにあたり難しいと感じたことです。

他のメンターと相談しながらサポートし、結果的にお願いされたこと以上のことはしない、聞かれたこと以外のことは答えないことにしました。 ですので、恐らくサポートしたチームメンバーの方々は物足りなく感じたと思います。

ハッカソンは自分ができることと足りないことを教えてくれる

最後に、私がハッカソンに参加する目的について書いてこの記事を終わりにします。

私がハッカソンに参加するのは「自分ができることと足りないこと」がわかるからです。 技術的な知識やスキルももちろん大切なのですが、ハッカソンはごくわずかな時間の中で成果を出す必要があるので

  • チームのタスクを効率よく処理するにはどうすればいいか
  • 突発的に発生した問題にどう対処すればいいか
  • 成果を審査員に理解してもらうにはどういう発表をすればいいか

と言ったモノの考え方やチームの進め方がより大事だと私は考えています。

そして「自分のやり方は正しかったか?」「考え方は間違っていなかったか?」ということをハッカソン終了後に自問自答することで、自分が通用したところ、しなかったところ再確認できる。 だから私はハッカソンに参加しています。

こういったことは一方通行のセミナーでは体験することができません(セミナーがダメだと言っているのではありません)。

今回は迷うところがありましたが、フェリーハッカソンにメンターとして参加したことはとても勉強になりました。 みなさんもハッカソンに参加しませんか? f:id:neroblubros:20190213205830j:plain #そうだハッカソンに行こう!

GoogleアナリティクスでUTMパラメータを用いたアクセス計測をしてみた

はじめまして、新卒1年目のエンジニアのid:aa_cryingです。 今回はブログ運営でも使っているGoogleアナリティクスと、 UTMパラメータについて調べてみましたので、紹介させていただきます。

Googleアナリティクスとは

Googleアナリティクスとは、Googleアカウントの作成後、「Googleアナリティクスに申し込み」を行うだけで利用できるフリーのアクセス解析ツールです。 申し込みをすると「新しいアカウント」作成画面に遷移するので、必要項目の入力後、トラッキングIDを取得できます。 このトラッキングIDをサイトに埋め込むことで、Googleアナリティクスでサイトのアクセス計測が可能になります。

UTMパラメータとは

UTMパラメータとは、プロモーション広告やバナー広告、メルマガなどの効果を計測するために設定するパラメータのことです。
Googleアナリティクスではカスタムキャンペーンと呼ばれています。
UTMパラメータには、以下のような種類があります。

パラメータ 説明
utm_source プロパティにトラフィックを誘導した広告主、サイト、出版物、その他を識別します
utm_medium 広告メディアやマーケティングメディアを識別します
utm_campaign 商品のキャンペーン名、テーマ、プロモーションコードなどを指定します
utm_term 有料検索向けキーワードを特定します
utm_content 似通ったコンテンツや同じ広告内のリンクを区別するために使用します*1

よく使われるのはutm_source, utm_mediumです。 utm_sourceの部分をサイト名にすることで、どこのサイトから流入したかを簡単に区別することができます。

実際にパラメータ付きURLを作成する

パラメータ付きURLは以下のサイトで簡単に作成ができます。
https://ga-dev-tools.appspot.com/campaign-url-builder/

今回は、 utm_source=mattermost, utm_medium=socialでURLを作成します。
計測対象のURLと、それらの情報を入力すると、下のShare the generated campaign URLの欄にURLが作成されます。

f:id:aa_crying:20190206153818p:plain
UTMパラメータの作成

アクセスして、結果を確認する

実際に作成したURLからアクセスしてみます。
https://aa-crying.hatenablog.com/entry/20190206/tameshi1?utm_source=mattermost&utm_medium=social

その結果をGoogleアナリティクスから確認します。
結果は、リアルタイム > トラフィックから確認することができます。

f:id:aa_crying:20190206153710p:plain
Googleアナリティクスでの確認結果

先ほど設定した utm_sourceの内容がソースに、 utm_mediumの内容がメディアに表示されていれば正しく計測が出来ています。

まとめ

今回は、Googleアナリティクスの初歩である、UTMパラメータ(カスタムキャンペーン)の扱いについてご紹介しました。
今回お見せした部分はGoogleアナリティクスの機能のほんの一部であり、他にも様々な機能があります。
誰でも気軽に、簡単にアクセス計測が出来ますので、興味のある方はぜひ活用してみてください。

参考サイト
https://support.google.com/analytics/answer/1033863#parameters
https://seolaboratory.jp/59695/#p01c


  • エンジニア中途採用サイト
    ラクスでは、エンジニア・デザイナーの中途採用を積極的に行っております!
    ご興味ありましたら是非ご確認をお願いします。
    20210916153018
    https://career-recruit.rakus.co.jp/career_engineer/

  • カジュアル面談お申込みフォーム
    どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。
    以下フォームよりお申込みください。
    forms.gle

  • イベント情報
    会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください! rakus.connpass.com

*1:たとえば、メールのメッセージに行動を促すフレーズのリンクが 2 つある場合は、utm_content を使用して別々の値を設定し、どちらが効果的か判断できます。

Copyright © RAKUS Co., Ltd. All rights reserved.