RAKUS Developers Blog

株式会社ラクスのエンジニアブログ

失敗しない Laravel 導入方法

はじめに

はじめまして、ラクス新卒1年目のMasaKuと申します。

PHPの勉強を開始した当初は「とにかく動かせること」「思い通りに動くこと」だけで満足していました。
しかし、勉強を進めていくうちに「もっと綺麗にできないものか」と思うようになり、フレームワークの勉強を開始しました。

フレームワークは、使い方を覚えるまでは時間がかかるものですが、要領が分かってくると、たった数行書くだけでいろんな機能を実現してくれるため、Webアプリ開発を強力にサポートしてくれます。

LaravelではComposerというシステムを利用することで簡単に導入することができるため、これからフレームワークを勉強しようとしている方にもおすすめのフレームワークであると考えます。

本記事は、生のPHPは書いたことがあるけれど、フレームワークは使ったことがない、という方に対して、導入の一歩をお手伝いできるよおうな記事になれれば幸いです。
なお、以下はWindowsで導入する際の手順となります。
macOSをお使いの方は、同じように進められない可能性がありますのでご了承ください。

PHPフレームワークとは

フレームワークとは、「開発で多様される様々な機能や仕組みを持ったソフトウェア」です。
Webアプリ制作で最低限必要となる機能(ログイン画面など)は大抵のアプリである程度共通化しています。
そのため、そういったお決まりの機能の開発はフレームワークに任せてしまおうといった思想のもと生まれました。
PHPフレームワークで有名なものは以下の通りです。

書店に行くと上記のいずれかの参考書を目にしたことがあるのではないでしょうか。
特にCakePHPの本はどの書店に行っても置いているという印象で、日本で最も人気のPHPフレームワークなのではないでしょうか。

Laravelとは

私が大人気のCakePHPを差し置いて、Laravelの勉強をしようと思った理由は以下の通りです。

  • 低い学習コスト
  • 楽に導入できる
  • GitHubで人気急上昇中

フレームワーク導入でつまづいてしまうと、一気にやる気を失ってしまうと感じたため、スムーズに開発できる段階に移行できるものがいいなと感じました。
また、現在GitHubで注目されているというのもポイントでした。
以下はGitHub上でのスターなどの比較です。

f:id:MasaKu:20171112005637p:plain
GitHubでの注目度比較 (2017/11/11 時点)

フレームワーク開発に携わる人が多いということは、これからも進化し続ける可能性があるということです。
また、そういった風潮を受けてか、書店では出版日が比較的若い本が販売されていたことも魅力の一つだと思いました。

Laravelのインストール

さて、前置きが長くなりましたが、さっそくLaravelの導入です。
今回は、Laravelの画面が表示できるところまでを解説させていただきます。

準備するもの

Laravelを導入に必要なものは以下の通りです。

  • XAMPP
  • Composer

「あれ、Laravelの導入なのにLaravelは用意しなくてもいいの?」と感じる方もいらっしゃるかもしれません。
Laravelでは、Composerというプログラムを利用することで、Laravelを利用するために必要なライブラリなどを自動で入手することができます。
コマンド入力が必要となりますが、そこさえ間違えなければ、導入で失敗することはありません。

XAMPPのインストール

まずはXAMPPのインストールです。
XAMPPとはPHPの実行環境を簡単に構築できるApacheディストリビューションのことです。
以下のページからXAMPPをダウンロードしてください。
Composerを利用するためにXAMPPのPHPを利用したいだけなので、php.iniなどの設定ファイルは触らずに、インストールだけ完了させておいてください。

www.apachefriends.org

Composerのインストール

次はComposerのインストールです。
Composerは上述の通り、PHPフレームワークを導入する上で必要となるライブラリなどを自動で入手してくれるプログラムです。
これを利用することで、簡単にLaravelを導入ることができます。

では、Composerのインストーラーを以下のページからダウンロードしてください。
getComposer.org

インストーラーをダウンロードするリンクがわかりにくいと感じたので、画像を掲載しておきます。
よければ参考にしてください。

ダウンロード手順

f:id:MasaKu:20171112121035p:plain
Download をクリック
f:id:MasaKu:20171112121040p:plain
Composer-Setup.exe をクリック

Composerのインストーラーがダウンロードできたら、次はインストールです。

インストール手順

f:id:MasaKu:20171112121958p:plain
Nextをクリック

f:id:MasaKu:20171112122002p:plain
XAMPPフォルダ内のPHPが選択されていることを確認しNextをクリック

f:id:MasaKu:20171112122006p:plain
プロキシサーバーを設定する画面ですが、今回は何も選択せずにNextをクリック

f:id:MasaKu:20171112122011p:plain
Installをクリック

f:id:MasaKu:20171112122011p:plain
Nextをクリック

f:id:MasaKu:20171112125423p:plain
Finishをクリック

これでComposerのインストールは完了です。

Laravelのインストール

いよいよLaravelのインストールです。
Laravelのインストールでは、先ほどインストールしたComposerを利用します。
Composerを利用するには、コマンドプロンプトを利用します。

「Windodsキー」 + 「R」のショートカットで「ファイル名を指定して実行」を表示し、「cmd」と入力することでコマンドプロンプトを起動できます。

コマンドプロンプトが起動できたら、以下のコマンドを実行してLaravelのインストーラーをダウンロードします。

Composer global require "laravel/installer=~1.1"

ダウンロードには少々時間がかかりますがUpdating dependencies(including require-dev)までが表示されていれば、コマンドは成功していますので、気長に待っていてください。

しばらくすると、ダウンロードが開始してGenerating autoload filesが表示されればLaravelのダウンロードは成功です。

f:id:MasaKu:20171112153327p:plain
Laravelのダウンロードに成功した際の表示

これで一通りは完了なのですが、最後にLaravelを利用するため環境変数PATHを設定する作業があります。

コントロールパネル→システムとセキュリティ→システム→システムの詳細設定の順で開き、システムのプロパティを開きます。

f:id:MasaKu:20171112131158p:plain
システムのプロパティ画面

ウィンドウ下部に「環境変数」というボタンがありますので、クリックします。

環境変数ウィンドウ下部のシステム環境変数のリストの中に「Path」という項目があると思います。
この項目を選択して「編集」をクリックします。

f:id:MasaKu:20171112154054p:plain
システム環境変数のPathを選択して編集をクリック

環境変数名の編集が表示されたら「新規」をクリックして以下のパスを追加します。
C:\Users\ここには各ユーザの名前が入ります\AppData\Roaming\Composer\vendor\bin

f:id:MasaKu:20171112154601p:plain
新規をクリックしてパスを追加する

Pathの追加が完了したら各画面をOKで閉じていきます。
ここまでの作業が完了したらLaravelプロジェクトを作成する準備が完了です。

Laravelプロジェクトの作成

それでは、いよいよLaravelプロジェクトを作成して、画面を表示していきましょう。
Laravelプロジェクトを作成する場所はどこでも構いませんが、今回はわかりやすいようにデスクトップに作成しましょう。

それでは、コマンドプロンプト上でデスクトップに移動します。
デスクトップに移動するコマンドは以下の通りです。

cd Desktop

コマンドプロンプト上でデスクトップに移動できたら以下のコマンドを実行して、Laravelプロジェクトを作成してください。

laravel new hellolaravel

laravelコマンドにより、プロジェクトを構成する上で必要なパッケージをどんどん揃えてくれます。
ダウンロードには少々時間がかかりますので、気長に待ってください。

f:id:MasaKu:20171112140259p:plain
laravelコマンド実行後の画面

f:id:MasaKu:20171112140302p:plain
Application ready! Build something amazing.が表示されればインストール完了

もし、うまくいかない場合は、環境変数の設定が間違っている可能性がありますので、設定を見直していただくか、以下のコマンドでもLaravelプロジェクトの作成が可能です。

Composer create-project laravel/laravel hellolaravel --prefer-dist

プロジェクトの作成に成功すると、デスクトップに「hellolaravel」というディレクトリが作られているはずです。
では、プロジェクトがうまく作成できたか確認してみましょう。

以下のコマンドをコマンドプロンプトに入力してhellolaravelの場所に移動します。

cd hellolaravel

hellolaravelに移動できたら、以下のコマンドを実行してください。

php artisan serve

するとLaravel development server started: <http://127.0.0.1:8000>のような表示が現れます。
Laravel では 内部サーバを利用することができ、上記のコマンドで簡単に動作確認をすることができます。
内部サーバはPHP5.4以降に実装されたビルドインサーバー機能を利用しています。

さきほど実行した artisan というコマンドでは、ビルドインサーバを利用するだけでなく、Laravelで利用可能な様々な機能を実行することができます。
以下のコマンドで実行可能なコマンドを一覧で確認することができるので、ほかにどんなコマンドがあるか気になった方は是非調べてみてください。

php artisan list

さて、少し脱線しましたが、php artisan serveでビルドインサーバが起動できたら、ブラウザ上で動作確認をしてみましょう。
ブラウザを立ち上げてhttp://localhost:8000にアクセスしてみてください。

すると、Laravelのホーム画面が表示されているかと思います。
正しく表示されていたら、Laravelの導入が成功した証拠です。
おめでとうございます。

f:id:MasaKu:20171112155957p:plain
http://localhost:8000 にアクセスした際の表示

ちなみに、起動したビルドインサーバを停止させたい場合は、コマンドプロンプト「Ctrl」 + 「C」を入力します。

おわりに

以上が、Laravelの導入方法です。いかがでしたでしょうか。
私も初めて自分でフレームワークを導入してみましたが、特に失敗することなく導入することができました。
この手軽さが、Laravelが低コストで学習することができる所以であるかしれません。

Laravelの使い方については、参考書などで勉強することが効率的かと思いますが、いくつか紹介したい機能もありますので、またいつかの機会に紹介できたらなと思います。

以上です。長文失礼しました!

参考資料

PHPフレームワーク Laravel入門
http://www.shuwasystem.co.jp/products/7980html/5258.html

ソフトウェアフレームワーク
https://ja.wikipedia.org/wiki/%E3%82%BD%E3%83%95%E3%83%88%E3%82%A6%E3%82%A7%E3%82%A2%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0%E3%83%AF%E3%83%BC%E3%82%AF

XAMPP
https://www.apachefriends.org/jp/index.html

XAMPPのインストール方法
https://techacademy.jp/magazine/1722

Composer
https://getcomposer.org/

Composer Wiki
https://ja.wikipedia.org/wiki/Composer

Laravel 5.3 インストール
https://readouble.com/laravel/5.3/ja/installation.html

社内勉強会「もくもく勉強会」のご紹介

ラクスエンジニアのstrongWhiteです。
過去に「WIP制限の大切さ」の記事を書いているので、興味がある方はそちらも参考にしてくださいませ。
さて、今回はラクス大阪本店で開催しているもくもく勉強会のご紹介をさせていただきます。

もくもく勉強会とは

「勉強会」と付いていますが、共通のテーマをもとに議論したりはしていません。
何らかの課題や目的をもつ人々が集まって、それぞれの目的のもとにそれぞれが自由に取り組むことを目的として活動しています。
そのため勉強の内容も参加者によってさまざまで、必ずしもITや技術に関係するトピックを扱っていません。

↓↓↓勉強内容はこんな感じです↓↓↓

  • 業務と関係のない言語やフレームワークの勉強をする
  • プライベートサービスの開発をする
  • 今後業務にぶっこんでやろうと思っている何かの予習をする
  • 積ん読を消化する
  • 資格の勉強をする
  • IoT的ななにか
  • ペアプロをする etc...

月イチで発表会も開催しており、勉強会の成果や、勉強会の活動とは全く関係なく発表したいことがある人が発表を行っています。
ここまで読んでいただいて分かる通り、割とゆるやか~な雰囲気で活動しております。

10月の発表会の様子

では実際に10月の発表会の様子を一部紹介したいと思います。

f:id:strongWhite:20171107185825j:plain:w500

f:id:strongWhite:20171108191402p:plain:w200 f:id:strongWhite:20171108191722p:plain:w200

写真はオフィスのカフェスペースにぶら下がってる電球をPhilips Hue v2に差し替えて、AWS IoT ボタンを押した際に電球の色を変えてみよーという試みを行っている様子です。
カフェスペースをいつもの白色から色鮮やかで華やかでスタイリッシュに変えてみようという感じです(笑)
AWS IoT ボタンの入力をローカルサーバで受け取り、Philips Hue v2と同期することで電球の色が変わります。

f:id:strongWhite:20171108184120j:plain:w400
f:id:strongWhite:20171108192431p:plain:w150 f:id:strongWhite:20171108192620j:plain:w300

次の写真はカフェスペースでいまいろんな意味で流行りのドローンを飛ばしてみた様子です。
制御自体はRaspberry Piで行っており、離着陸、旋回以外に一回転するなどのトリッキーな動きも実現しています。
写真の真ん中で紫色の光を放っているのがドローンです。今まさに一回転してます(笑)

もくもく勉強会のよいところ

私が参加して良いなと思うところは技術的興味の窓口(キッカケ)ができるところかなと思います。
他のエンジニアの人が行っている勉強内容から興味を持ち、自分も学んでみようというキモチが生まれるイメージです。
勉強会では他のエンジニアの方と和気あいあいと話しながら楽しく学べるので、普段は話さない人ともコミュニケーションが盛んになり、 同時に技術的知識を蓄えられるので一石二鳥かなと思います。

おわりに

ラクスでのもくもく勉強会を紹介しました。

エンジニアならば自由に技術の話題を見聞きするのは楽しいと思うはずです。
弊社ではこういった技術的勉強会に対してオープンなので、エンジニアとしては嬉しい限りです。
これからも続いていけるようにしていきます。

以上strongWhiteからのもくもく勉強会の紹介でした。

参考

JavaからPHPに乗り換えて感じたこと

はじめに

はじめまして、新卒一年目のd_shrと申します。
現在、業務ではPHPを用いて開発を行っています。業務に入る前は大学在学中の研究開発や入社後の新人研修でJavaを使っていました。
在学中にPHPを学習した経験はありましたが、業務で扱うことになると入出力のチェックなど セキュリティの観点には特に注意しなければいけないため、プログラミング言語の細かい仕様まで把握する必要があると思います。
そこで変数の扱いなどにPHP独特のものを感じ、Javaとは違う仕様に戸惑うことがありました。

本記事では、JavaからPHPに転向した際に戸惑ったことを中心に、主にJava経験者から見たPHPの特徴、注意点などをまとめていこうと思います。 PHPの学習を考えている方やPHP初心者の方に少しでも参考になれば幸いです。

目次

PHPを使い始めて戸惑ったこと

業務で実装をしていて1番戸惑ったことは、変数の扱いです。
セキュリティの観点から正しい値が格納されていることをチェックする実装することがありますが、その際にPHPの変数の扱いに戸惑いました。

PHPの変数の扱い

まず、PHPは変数の型がありません。
Javaと比較すると、PHPの大きな特徴であると思います。
変数に型がないPHPでは、1つの変数に数値と文字列を格納することができます。

<?php
  $hoge = 123;
  $hoge = "hogehoge"
?>

他にも...
以下のような書き方ができることにも最初はすごく違和感を感じました。

<?php
  $hoge = 1;
  $hoge = $hoge == true ? "true" : 0;
?>

PHP側で解釈してくれるので型の宣言をする必要がなく、記述量が減るメリットはあると思います。
(可読性を考えると、このように書くことはあまりないと思いますが)
しかし、PHPが勝手に型を合わせてしまうため、Javaのような型に厳密な言語を触った後では、変数の扱いに戸惑うことがよくありました。

暗黙的な型変換

暗黙的な型変換とは、PHPが変数の型を勝手に変換してしまうことです。
例えば、以下のような変数の比較。

<?php
  $a = 0;
  $b = "hoge";
  if ($a == $b) {
    // true
  }
?>

PHPで数値と文字を比較すると、文字を数値に変換しようとします。
文字列の最初の部分により値が決まり、有効な数値がない場合は0になるため、 このような結果になります。
PHPの仕様通りに変換され意図しない結果が得られることがあるため、 PHPでの条件分岐を作る際には、変数の扱いには注意が必要です。

  • 扱いに注意が必要な例
<?php
  if ( 0 == 0 )     // true
  if ( 0 == "0" )   // true
  if ( 0 == false ) // true
  if ( 0 == null )  // ture
?>

これらは、型が正しいかどうか厳密な比較を行う演算子"==="を使うことで解決できます。
しかし、厳密な比較を行わない、switch文も注意が必要です。

<?php
switch ($hoge) {
  case 0:
    // hogeが0, "0",false, null,""などで実行される
    break;
  case "0":
    // ここは実行されない
    break;
}

// 厳密な型変換を行う場合
switch (true) {
  case $hoge === 0:
    // hogeが数値の0のときだけ
    break;
  case $hoge === "0":
    // hogeが文字列の"0"のときだけ
    break;
}
?>

型に厳密なプログラミング言語の経験がある場合は、 変数の扱いで引っかかりやすいのではないかと思いました。
PHPで正しく変数の扱うためには、変数について仕様をしっかり把握し注意しないといけません。

変数のスコープ

PHPの変数の扱いで戸惑ったことは暗黙的な型変換だけでなく、 変数のスコープでも経験があります。
変数のスコープとは、変数の有効範囲のことです。
PHPでは、関数単位のスコープしかなく、 if文やループ中のみでしか使わないような変数を定義できません。

<?php
$flag = true;

if ($flag) {
  $value = "true";
} else {
  $value = "false";
}

Javaではif文の中で定義された変数は、if文のブロックの中だけで有効です。
PHPのスコープを把握していなかったときに、以下のようなソースコードを書いたことがあります。

<?php

$flag = true;
$value = "";
if ($flag) {
  $value = "true";
} else {
  $value = "false";
}

// $valueに空を入れたくなかったときはこっちで書いた
$flag = true;
$value = "true"
if (!$flag) {
  $value = "false";
}

スコープを正しく理解していないと可読性の低いソースコードになってしまうこともあります。
スコープもプログラミング言語で特徴があるので、 各言語ごとに把握しておかないといけないことだと思います。

その他、気になったこと

上記以外で、実装中に疑問に思って調べたことや違和感を感じたことです。

配列の値渡し

Javaのデフォルトは参照渡しですが、PHPのデフォルトは値渡しです。
PHPでも参照渡しはできます。

  • 値渡しの例
<?php
$array = [1,2,3];

$copy = $array;

$copy[1] = 5;

print_r($array);
print_r($copy);

$array: Array ( [0] => 1 [1] => 2 [2] => 3 )
$copy: Array ( [0] => 1 [1] => 5 [2] => 3 )

  • 参照渡しの例
<?php
$array = [1,2,3];

$copy = $array;
$copy2 = &$array;

$copy[1] = 5;
$copy2[1] = 5;

print_r($array);
print_r($copy);
?>

$array: Array ( [0] => 1 [1] => 5 [2] => 3 )
$copy: Array ( [0] => 1 [1] => 5 [2] => 3 )

まとめ

JavaからPHPを扱うようになって戸惑ったことや違和感についてまとめてみました。
当初はこの違和感に嫌気が差していましたが、今ではPHP洗脳され慣れてしまいました。
PHPを学び始めた方や、次の新卒で入社される方に参考になればと思います。
また、同じような境遇の方に共感いただければ幸いです。

仕事を効率化!おすすめのエクセルショートカット集15選!!

はじめに

皆さんこんにちは,kuwa_38です.今年からラクスに入社した新卒です.社会人になって色々と気づいたことはありますが,その1つが「エクセルって意外と使うな」ということです.テキストファイルやwikiなどに書かれることもありますが,それらと同じかそれ以上にエクセルの資料は多いように感じます.そのため,エクセルを早く扱えて損はないと思っています.
この記事ではエクセルのショートカットや便利機能について記載します.エクセルに向かう時間を短くし,皆さんの貴重な時間を少しでも確保する手助けになれば幸いです.

誰もが使える便利機能

クイックアクセスツールバー:よく使う機能をお気に入り登録する

よく使うツールをお気に入り登録できる機能です.

f:id:kuwa_38:20171022010056p:plain:w300
クイックアクセスツールバー
登録方法:
登録したいツールの上で,右クリック>クイックアクセスツールバーに追加で登録できます.
f:id:kuwa_38:20171101113840p:plain:w300
クイックアクセスツールバーへの登録

小技

  • クイックアクセスツールバーに追加した機能は,マウスを使わずとも,Alt(F10) + 数字(左から順に自動で割り振られます)で使うことができます.自分の登録した機能の数字を覚えておくとより早く作業できます.
    f:id:kuwa_38:20171029190327p:plain:w300
    ショートカットキーでアクセスする方法
  • リボン折りたたむとツールバーが非表示になり,より広く画面を使うことができます.多くの機能を使わない,かつ,画面を広く使いたい方は,使う機能をクイックアクセスツールバーに登録してピン留めをはずすと良いでしょう.
    f:id:kuwa_38:20171029191904p:plain:w300 f:id:kuwa_38:20171029190749p:plain:w300
    リボンを折りたたむ/結果:ツールバーが非表示になる

シートの選択:シートを効率的に探す

図のようにエクセルの左下の箇所(「◁ ▷」の所)で右クリックを押すとシート名の一覧が表示されます.

f:id:kuwa_38:20171022021203p:plain:w300
シートの選択

図形の編集を効率化する

オブジェクトの選択:図形を一気に選択する

複数の図形の移動や編集に便利な機能です.
手順:
1. ホーム>「編集」のグループにある「検索と選択」>「オブジェクトの選択」
2. 選択したい範囲をドラック

f:id:kuwa_38:20171022202843p:plain:w500
オブジェクトの選択メニュー
f:id:kuwa_38:20171022202845p:plain:w300 f:id:kuwa_38:20171022202849p:plain:w300
2.選択範囲をドラック/結果:ドラックした範囲内の図形が全てアクティブになる

図形の編集:途中で図形を変更する

  1. 変更したい図形を選択
  2. 「書式」>「図形の編集」>図形を選択
    f:id:kuwa_38:20171022204100p:plain:w400f:id:kuwa_38:20171022204102p:plain:w200
    図形の変更/結果

表やグラフの作成を効率化する

選択セルの■をダブルクリック:表の一番下までオートフィルを掛ける

手順:
1. オートフィルを掛けたい列の起点となるセルにおいて,■の上にマウスカーソルを置く(「+」が表示されます.)
2. 1の状態でダブルクリック

f:id:kuwa_38:20171022185459p:plain:w300 f:id:kuwa_38:20171022185611p:plain:w300
■をダブルクリックでオートフィル/結果

フィル機能:数千行の数値を作成する

ID1~3000まで作りたいといった時,ドラックしてオートフィルを掛けると時間がかかります.しかし,前項の「表の一番下までオートフィルを掛ける」は他の列が入力済みでないと使えません.そんなときに使える機能です.
手順:
1. 起点となるセルに初期値を入力
2. ホーム>「編集」のグループにある「フィル」>連続データの作成
3. メニューに増分や停止値を設定しOK(図の場合,列(縦)方向に1から3000まで1ずつ値を入力します)

f:id:kuwa_38:20171022193542p:plain
1,2.初期値の入力と連続データの作成
f:id:kuwa_38:20171022193546p:plain f:id:kuwa_38:20171022193548p:plain
3.増分等の設定/結果

右クリックのオートフィル:書式のみコピー

手順:
1. 図のようにオートフィルを掛けたい列の起点となるセルにおいて,■の上にマウスカーソルを置く(「+」が表示されます.)
2. 右クリックを押したまま書式をコピーしたい分だけドラック
3. メニューの「書式のみのコピー(フィル)」を選択(書式がコピーされます.)

f:id:kuwa_38:20171022191520p:plain:w300 f:id:kuwa_38:20171022191524p:plain:w300
1.参考にする書式のセルを選択/2,3.ドッラック,書式のみコピー
f:id:kuwa_38:20171022191526p:plain:w300
結果

「Ctr + *」:表を選択する

Ctr + *で表を選択できます.

f:id:kuwa_38:20171029115459p:plain:w300f:id:kuwa_38:20171029115502p:plain:w300
表を選択する

「F11」:棒グラフのグラフシートを作成する

手順:
1. 表を選択
2. F11

f:id:kuwa_38:20171022200730p:plain f:id:kuwa_38:20171022200755p:plain:w500
表の選択・F11/結果

セル移動と入力を効率化する

「tab」:表の入力を効率化する

tabを押すと1つ右のセルへ移動します.また,Tabを押した後にEnterを押すと,初めにtabを押したセルの1つ下へ移動します.

f:id:kuwa_38:20171029132214p:plain:w300
Tab使用時のセルの移動

「Ctr + 矢印キー」:セル移動を効率化する

表の一番下に移動する時などに重宝するショートカットです.
アクティブセルと移動方向の1つとなりのセルの内容で挙動が変わります.

f:id:kuwa_38:20171029200827p:plain:w500
Ctr + 矢印:移動方向に値が入力済み
f:id:kuwa_38:20171029200849p:plain:w500
Ctr + 矢印:移動方向のセルが空セル

アクティブセル 移動方向の1つとなりのセル 結果
値が入力済み 空セル 値が入力済みのセルまで移動
値が入力済み 値が入力済み 値が入力済みの終端のセルへ移動
空セル 空セル 値が入力済みのセルまで移動
空セル 値が入力済み となりのセルに移動

「F2」:編集と入力を切り替える

アクティブなセルでF2を押すと「編集モード」と「入力モード」を切り替えることができます.
編集モード:
矢印キーを押すと,アクティブなセルの中で文字カーソルが移動します.図のように打ち間違いを修正したい時などに便利です. 例えば,B3セルに「rakkkus」と入力後「←」を押すと,B3セルの中でカーソルが移動します.

f:id:kuwa_38:20171029122740p:plain:w300
編集モード:「←」を押すとセル内で文字カーソルが移動
入力モード:
矢印キーを押すと,他のセルに移動します. 例えば,B3セルに「rakus」と入力後「←」を押すと,A3セルに移動します.
f:id:kuwa_38:20171029122737p:plain:w300
入力モード:「←」を押すと左のセルに移動する

「F4」:参照先の「$」を付ける/はずす

F4を押すことで「=A1」といったセルの参照を「=$A$1」,「=A$1」,「=$A1」,「=A1」と切り替えることができます.
=sum($D$3:$G$8)のようにD3にもG8にも「$」を付けたい場合:
図のように,範囲を入力した後にF4を押すことで「$」の付ける/付けないを変更できます.

f:id:kuwa_38:20171029124016p:plain:w300 f:id:kuwa_38:20171029124019p:plain:w300
全体に「$」を付ける
=sum($D$3:G8)のようにD3のみに「$」を付けたい場合:
前項のF2を利用します.
1. 範囲を入力(「=sum(D3:G8」の状態)
2. F2キーで編集モードに変更
3. D3に文字カーソルを合わせる
4. F4を押す
f:id:kuwa_38:20171029124643p:plain:w300 f:id:kuwa_38:20171029124645p:plain:w300
一部に「$」を付ける

「Ctr + :」:現在時刻を入力する

「Ctr + :」で現在時刻を入力できます.

「Ctr + ;」:現在の日付を入力する

「Ctr + ;」で現在の日付を入力できます.
表示を変更したい場合:
(図は「2017/10/29」 ではなく 「10月29日」 にする場合)
1. 表示型を変更したい範囲を選択
2. 右クリック>セルの書式設定
3. 分類>日付>「種類」を選択

f:id:kuwa_38:20171029130054p:plain:w300 f:id:kuwa_38:20171029130056p:plain:w200 f:id:kuwa_38:20171029130301p:plain:w300
表示の型を変更する

おわりに

この記事ではエクセルの便利機能やショートカットキーについて,私の主観で使いそうなものを15個紹介しました.この記事で紹介したことが,時短や作業の効率化につながれば幸いです.
また,エクセルは本当に様々なことができます. ここで紹介したこと以外にも便利な機能やショートカット(さらに言えば,関数やマクロ)が存在するので,興味を持った方は検索してみてください.

超便利!日本で使えないUberをベトナムで使ってみた!!

初めまして、ラクスエンジニアのnerobluebrosです。

今回は配車サービスの「Uber」について書きます。

ラクスは日本以外にベトナムにもオフィスを構えており、ベトナムのエンジニアチームの育成と課題改善に年に数回ベトナムに出張します。 私も2度行ったのですが、2回目に初めてUber(ウーバー)を使ったところ、とても便利だったので、そのご紹介です!

Uberってなによ?

Uberはタクシーの配車サービスで、スマホのアプリでタクシーを呼び出して利用します。実際にタクシーを利用するまでの手順は以下の通りです。

  1. スマホで行き先を指定してタクシーを呼び出す

  2. よさそうなタクシーがいたら待ち合わせ場所を指定

  3. 行き先と金額を確かめて、確定する

これだけ。

待っているときはどれくらいで到着するかアプリからわかります↓ f:id:neroblubros:20171030183948j:plain

キターーーーー↓ f:id:neroblubros:20171030184016j:plain

支払いは現金かクレジットカード。クレジットカードは情報をあらかじめアプリに登録しておきます。

残念ながら日本では規制とタクシーの二種免許が必要なため、ごく一部の地域を除いてUberは使えません。

次からは実際に使ってよかった点3つ、紹介します!

車が超快適

ベトナムのタクシーも日本のタクシー同様「いかにも!」という業務用の車ですが、Uberでは普通の乗用車がやって来ます。車に関してはハズレ無し。めっちゃ良い。実際、フォードのSUVが来たときもありました!

実際に乗ったフォードのSUVf:id:neroblubros:20171030182558j:plain

ベトナムのタクシーは匂いが嫌だったり、タクシーの床が泥や砂で汚れていたりするので、きれいな車を利用できるのはすごくいい。

クレジットカードの支払いが超便利

前述の通り、Uberは乗る前に支払い方法(現金 or クレジットカード)を選択して利用します。現金の場合は目的地に着いたら支払う。これは万国共通、普通のタクシーと一緒。

クレジットカードで支払う場合は、ここが便利なのですがUberが別処理でやってくれます。なので運転手にクレジットカードを渡す必要すらなし!目的地に着いたら「カム・オン!」(ベトナム語でありがとうの意味)と言って車から降りるだけ!!

ところで、ラクスはクラウドサービスを提供していますが、その中に経費精算のサービス「楽楽精算」があります。実はラクス社内でも楽楽精算を使っているのですが、楽楽精算の便利機能のひとつにクレカデータの連携があります。

なので、会社決済のカードを登録しておいてカードで支払えば精算の手間も省ける!クレジットカードは複数登録できるので、会社の経費で精算ができるときは会社のカード、プライベートは個人のカードで使い分けできます!

閑話休題

Uberでは乗る前にあらかじめ料金が決まるのでボッタクリに遭う心配は皆無ですし、さらにクレジットカードでの支払いにしていればキャッシュレスになるので、超便利です! しかも・・・運賃も通常のタクシーと比較して20%から30%程度安い!これは利用しない手は無いですぜ、ダンナ。

話さなくても良いのが超便利

一般的にベトナム人ベトナム語以外は通じません。それはタクシーの運転手といえども同じ。なので、行き先を伝えるのにひと苦労。ホンマに伝わっているか、行きたいこところに連れて行ってくれるか?ホンマに不安になります。

でも、Uberなら乗る前に行き先を指定しているので、運転手に行き先を伝える必要はありません!しかも、今どこを走っているかが、アプリの画面を見ればわかるので不安になることはありませんでした。

行き先に向かっているときのアプリの画面↓ f:id:neroblubros:20171030183656p:plain

この「話さなくても良い」というのはほんとにストレスを減らしてくれる。っていうかなくしてくれました。

まとめ

良いことばかり言いましたが、悪いところもあります。それはたまにハズレの運転手に当たるということ。 私は前回の出張で合計5回Uberを利用しましたが、最後の5回目でハズレを引いてしまいました。

車の運転が初心者みたいで「慣れていない」というのががんがん伝わってきて「これは事故るな」と。 幸い事故に遭うことはありませんでしたが、このときはさすがに「まじかー」って思いました。

Uberは欧米ではいろいろ防犯上の問題が発生しているみたいですが、ベトナムではそんな印象は受けませんでしたし、実際にどこかに連れていかれそうになるとかはありませんでした。前述の通り、アプリでどこを走っているか、目的地に向かっているかわかるので、一定以上の「安心感」があります。

さていかがでしたでしょうか?Uberの便利なところが伝わりましたでしょうか??日本では使えないUberですが、もし、海外で利用する機会があれば使ってみてください(あ、でも、利用される方は自己責任でお願いしますね)。

おまけ

ラクスでは中途採用を行っています。ベトナムのエンジニアと一緒に自社サービスの開発を行ったり、ベトナムに出張も場合によってはあります。 気になる方は下記をご覧になってください。

ラクス中途採用ページ

中途採用 | 株式会社ラクス

もちろん新卒採用も行っています。

ラクス新卒採用ページ

http://fresh-recruit.rakus.co.jp/

参考

以下記事に出てきた企業のサイトです。

Uber

楽楽精算

ラクスベトナム

プログラミング未経験者向けの学習方法

はじめに

皆さん、こんにちは、今年の4月に入社したプログラミング未経験者のr_yxkxrx13です。
プログラミング超初心者!!という方は、プログラミングの学習を始める前に何を準備して取り組めば分からない…ということが多いと思います。 プログラミング未経験である私が今まで取り組んだプログラミングの学習方法を紹介したいと思います。

プログラミング学習方法

私が今まで取り組んできたプログラミング学習方法は、「コンピュータ基礎/ネットワークの基礎学習サイト」、 「プログラミング学習サイト」、「書籍学習」の3つです。
学習サイトとは、ブラウザ上に無料で気軽に利用できるサイトのことで、インターネットにたくさん出ています。
まずはそのようなサイトを利用して学習を始めるのが良いと思います。 また書籍学習で基礎知識の理解を深めながら、プログラミングの練習をすると良いと思います。 私が利用した学習サイトと書籍について説明します。

コンピュータとネットワークの基礎学習サイト

プログラミング学習の初めに「コンピュータ基礎/ネットワーク」を学習しました。
プログラミングの基礎なので、基礎知識と概念を理解しておくと良いと思います。

  1. 1週間で学ぶIT基礎の基礎 - 【5分で覚えるIT基礎の基礎】コンピュータの仕組み---目次:ITpro
    「コンピュータの仕組み」をテーマに基礎知識の全体像と概要を分かりやすく解説されています。

  2. 初心者のためのネットワーク技術 - ネットワークエンジニアを目指して
    「ネットワーク技術」をテーマに基礎知識を分かりやすく解説されています。

プログラミング学習サイト

プログラミングの参考本では、決まった書き方やコードの意味がたくさんあり、全部覚えられない…。
とつまづいてしまうことはあると思います。

私の経験の1つですが、正直に言って、全てを一気に覚えることは無理があります。
逆に理解度が低くなってしまうので意味がありません。

まずプログラミングを書く練習をたくさんすると、自然に覚えられるようになってきます。
また1行ずつコードの意味をコメントアウトしてみると、理解が深まってきます。

そこで、ブラウザ上で実際にプログラミングを作る環境と似た環境で練習できるサイトを紹介します。

  1. Progate

    f:id:r_yxkxrx13:20171024084457p:plain

    (画像出典:Progate

    Progateは、ブラウザ(インターネット)上でプログラミングが学べるサービスです。

    イラストを中心に分かりやすく解説されたスライドで、自分のペースに学習や復習ができます。 また以下のようにブラウザ上でコードを書いて結果を確認することができます。 複雑な環境設定などの準備は不要なので、気軽にプログラミング学習を始めれます!

    初心者レベルから実践レベルまで対応されていて、
    さらにレッスンの種類もたくさんあり、分かりやすく楽しみながら学べるサイトです。

    f:id:r_yxkxrx13:20171023094623p:plain

  2. ドットインストール

    f:id:r_yxkxrx13:20171024085444p:plain

    (画像出典:ドットインストール

    ドットインストールは、約3分間の短いレッスン動画でプログラミングを学べるサイトです。
    動画の音声が聞き取りづらくても動画画面の下に字幕があるので、見返すことができます。 また右側に学習メモの機能があり、新しい知識や疑問をメモすることができます。 動画を見ながら、実際に作ってみることを重点において学習すると良いでしょう。

    f:id:r_yxkxrx13:20171024090834p:plain

  3. CodeResume

    f:id:r_yxkxrx13:20171024095044p:plain
    (画像出典:CodeResume

    CodeResumeは、ブラウザ上でプログラミングが学習できるプラットフォームです。
    練習問題の画面では、以下の図のように解答欄にコードを書き込んで、コンパイルと実行で結果を確認できるようになっています。 またタイマー機能も付いているので、時間を意識して考えて解く力が身についてくると思います。

    f:id:r_yxkxrx13:20171024092332p:plain

書籍学習

学習サイトだけでは学習範囲が限られていますが、書籍での学習も有効な学習方法だと思います。
私が利用した書籍の中からオススメの書籍を紹介します。

  1. スッキリわかるJava入門 第2版 (スッキリシリーズ)

    スッキリわかるJava入門 第2版 (スッキリシリーズ)

    スッキリわかるJava入門 第2版 (スッキリシリーズ)

    本書は、Javaの基本を丁寧にイラストと同時に説明されていますので、非常にわかりやすい内容になっています。 Javaの複雑な開発準備や必要なツールって分からない…。という方、安心して下さい。
    Webブラウザを持つ携帯電話やパソコンで、準備されたクラウド開発実行環境「dokojava」を使って、手軽にプログラミングの練習ができるようになっています。 また「dokojava」の他に、実際に開発現場で使われている「Ecplise」のインストール方法や使い方まで書かれています。 Javaの学習を始める時は、まずこの本を読んでおくことをオススメします!

  2. スッキリわかる Java入門 実践編 第2版 (スッキリシリーズ)

    スッキリわかる Java入門 実践編 第2版 (スッキリシリーズ)

    スッキリわかる Java入門 実践編 第2版 (スッキリシリーズ)

    本書は、Java入門の実践編で開発や設計手法、ツールの知識について、分かりやすく解説されています。
    Javaの応用技術まで紹介されているので、Javaの基本をマスターした方は、さらにステップアップで学びたい時に読むことをオススメします!

  3. Javaルールブック 〜読みやすく効率的なコードの原則

    Javaルールブック ?読みやすく効率的なコードの原則

    Javaルールブック ?読みやすく効率的なコードの原則

    コードの書き方について大変参考になる本です。
    正しい書き方と間違った書き方の例を挙げて分かりやすく解説されています。
    正しいコードの書き方を身につけると、シンプルで見やすいコードが書けるようになります。

  4. リーダブルコード

    リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (Theory in practice)

    リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (Theory in practice)

    Javaルールブックと同様にコードの書き方について、さらに具体的に丁寧に解説されています。

プログラミング学習の取り組み方

ここまでは学習サイトや書籍を紹介してきましたが、
以下については私が有効だと感じた具体的な学習方法と心構えについて説明します。

  1. 学習内容を読むだけにしない
    学習内容を読んで満足するだけでは理解が深まりません。 学習内容を読んで実際に操作して動作を確認してみる、疑問になったことを納得するまで深く掘り出すことが大切です。

  2. コードを1行1行にコメントをつける
    プログラミングの経験が長い方が書いたコードは、必要な情報だけコメントしています。
    プログラミング未経験の方は、まだコードの意味や書き方に慣れていないので、 まずコードの意味を理解することから始めると良いでしょう。
    慣れてきたら、少しずつコメントを減らして、コードを読める・書けるようにすると良いと思います。

  3. コードが完成したらデバッグをする
    プログラムを実行して結果が正しくても完成とは限らないです。 本当に問題がないかどうか、デバッグをして修正箇所がないか確認をするように心掛けましょう。 処理の流れを把握できるようになってきたら、デバッグ機能に頼らず、自分の目で確認してみましょう。

  4. エラーの原因と対策方法を見つける
    プログラムのバグ(故障・エラー)を見つける力と対策方法の知識を身につけることが大切です。
    例えば、プログラムが完成してバグに気付かないまま、共同者のプログラムを合わせると、 トラブルを起こしてしまう可能性があります。 このようなトラブルが起きた時、どこにバグがあるか、どのように対策をすれば解決できるか、 実際にプログラミングの練習でテストしてみると良いでしょう。
    またプログラムを作成する時は、バグがないプログラムを完成するように心掛けて書くようにしましょう。

  5. サンプルプログラムを鵜呑みにしない
    コードが書けない…という方は、インターネットや書籍にサンプルプログラムを参考にしていますが、 丸ごとコピーして修正するやり方は良くないことです。 サンプルプログラムを書き写して目的に合わせて修正し、動作の理解を深めることが良いでしょう。

  6. プログラミングの練習をできるだけ毎日やる
    スポーツと同じように、プログラミングを書く練習を毎日取り組むと、自然にコードの意味や書き方が分かるようになってきます。 最初は慣れなくて大変ですが、書籍や学習サイトを参考にしながら、書く練習をすると良いでしょう。

  7. プログラミングのツールを試してみる
    プログラミングのツールは、代表的なものだけではなく、あまり知られていないものや最近新しくできたツールを 試しに使ってみて比較することも大切です。 プログラミングの進化が続いているので、新たな知識をたくさん吸収すると良いでしょう。

  8. 簡単なものを開発してみる
    私の場合は、HTML/CSSの学習をしながら、自分のホームページを制作しました。 学習で学んだことを活かして、ホームページやアプリを開発してみると、楽しくやりがいがあると実感できます。

  9. プログラマーと情報交換をする
    プログラミング経験者は、技術情報やプログラミングの学習などたくさんの情報を持っています。 疑問や悩みまで相談できるので、プログラマーの仲間を作ることも大切です。

終わりに

プログラミング未経験者向けの学習方法と取り組み方を紹介しました。

紹介した学習方法の他にもたくさんありますので、
自分に合った方法を見つけて、是非プログラミングの学習を始めてみてください!

今だからこそ!マルチブラウザJavaScript再考

はじめに

皆さん初めまして、新卒一年目のFM_Harmonyと申します。

今回はマルチブラウザという観点から、最近のJavaScriptについて調べました。jQueryの登場や、主要なブラウザが標準仕様への準拠を進めたことで、エンジニアがJavaScriptの動作環境を気にすることが、以前に比べ減りました。しかし調べていくと、今後はトランスパイルAltJSによる対応が、JavaScriptにおいて必要になっていくのだということが分かりました。

このまとめが、最近Webアプリケーション開発に関わりはじめた方や、今後のJavaScriptについて興味のある方にとって、少しでも参考になれば幸いです。

目次

  • はじめに
  • 目次
  • 本題の前に
  • これまでのマルチブラウザ対策
    • JavaScriptとブラウザ
    • マルチブラウザ対策としてのjQuery
    • 各ブラウザの対応
  • これからのマルチブラウザ対策
    • ES6とIE11
    • トランスパイル
    • AltJS
  • まとめ
  • 注釈
続きを読む
Copyright © RAKUS Co., Ltd. All rights reserved.