とあるStartupに勤めるエンジニアの技術ブログ

Salesforce、テスト関係の技術ブログなどを書く予定

Lightning Component もくもく会(仮) #1 でもくもくしてきたよ

概要

2015年4月21日に Salesforce DUG 主催の Lightning Component もくもく会(仮) #1 を開催しました!(ぱちぱちぱちっ)

salesforcedugjapan.doorkeeper.jp

とりあえず3本ほどLTをやったり、ケーキ食べたり、もくもくする人や雑談する人などワイワイした感じで第1回を行いました。ゆるい感じではありますが、真剣な会だったような気がします。

LT

Force.com MVPに混じって LT で発表させてもらいました。
今回の発表では、もくもくする題材としてLightning Component をやっていく上で押さえていきたいポイントを「研究ポイント」としてまとめてみました。

www.slideshare.net

Force.com MVPお二人の発表はとても愛に溢れた発表でした。DoorKeeperFacebookページの方にスライドのURLが貼り付けてあります。

個人的な感想

やはり気になる点としては、コンポーネント内にJavaScriptを閉じ込める方法がないことでしょうか?
AppExchangeコンポーネントという名前でマーケットでコンポーネントを流通させることを目指しているようですが、思いっきりグローバル変数を汚染するようなコンポーネントが本家から公開されていたり。ちゃんと対策しないとセキュリティレビューを通過しないだろうから、ゴリゴリJavaScriptやらCSSやらを自分で書いて、Bundleに閉じ込めないといけないのかな、と思ってましたが、そんなことないんですかね。

今後の展開

このもくもく会をどういった方向で進めていこうかノープランなわけですが、何かご意見、ご感想などありましたら、
Salesforce DUG Japanあたりに投稿してもらえばいいと思います。

Enjoy Lightning!

Lightning Developer Week Tokyoに参加してきました!

Lightningを全世界的に盛り上げるイベント「Lightning Developer Week」が開催されています。日本でも2015年3月20日にLightning Developer Week Tokyoを開催されましたので参加してきました!

 f:id:a-kura:20150320191902j:plain

Lightning プレゼンテーション

一応Salesforce DUGのイベントなのですが、Lightningはまだ出たばかりの技術。ということで、今回はSalesforce岡本氏によるLightningのご紹介&ワークショップをメインに。 

f:id:a-kura:20150320191912j:plain 

SlideShareに資料がアップされているので、リンクを貼っておきます。

Go Faster with Lightning : Salesforce Lightning 概要Webinar

Lightning ハンズオンワークショップ 

ワークショップは一通りの機能をざくっと体験でき、とてもよかったです。特に、プロセスビルダーはすでにGAになっている機能であり、格段に使い勝手がよくなっているので、一度触っておいて損はないと思います。

Salesforce Lightning コネクトチュートリアル

Salesforce Lightning プロセスビルダーチュートリアル

Salesforce Lightning コンポーネントチュートリアル

Salesforce Lightning アプリケーションビルダーチュートリアル

 

これらのチュートリアルGitHubチュートリアルが公開されており、誤字脱字やスクリーンショットの日本語化などPull Requestするとマージしてもらえたりします。

最後に 

引き続き、Lightning関連の情報はLightning Deep Dive Webinarsで配信されるそうです。Lightningに興味を持っている方は必見です。Webinarの予定は、こちら から! 

最後になりましたが、Tシャツとステッカーもらいました!f:id:a-kura:20150320190616j:plain 

 
Go Lightning!

Salesforceハックチャレンジ2014に挑戦しました!

Salesforceハックチャレンジ2014に挑戦しました!何度か挫けそうになりましたが、安西先生の言葉に勇気づけられながら、なんとか応募することができました。

応募作品はこちら。
Chatterメッセージを利用できるLightningアプリケーションを応募しました。

YouTubeでの紹介ムービー

GitHubリポジトリ

結果

ありがとうございます!「オープンソース賞」をいただきました。
Salesforce Developers Japan Blog

実は以前のSalesforce1 Platform Mobile Hack Challenge 2014 Japan で応募したものをLightningコンポーネントで実装したものでした。時間があればもう少し機能を追加したかったんですけど…。今回の応募作品はLightningコンポーネントで再実装したこと以外には新規性などはまったくないので受賞できるとすればこの賞でした。

ちなみに、中の人より個別に評価をいただけるようですが、まだ届いていません(2014/12/31現在)。

技術的感想

Lightningコンポーネントを利用してみました。その感想をつらつら書いてみます。

Lightningアプリケーションについては下記のエントリーと同じことを思いました。Lightning App Builderに追加できるのもLightningコンポーネントのようなのでますます…。FlexiPageとLightningアプリケーションの住み分けもよくわからないところではありますが、どうなっていくんでしょうね。

今回はAngularJSをLightningで再実装しました。大した機能は使っていませんが、基本的にはLightningコンポーネントで置き換えることができました。ただ、Lightningコンポーネントコンポーネントを分割してSingle Page Applicationとして実装する場合はどうすればよいのかよく分からなかったです。このあたりはフロントエンドに強い人の知恵でなんとかしてもらえると嬉しいです。

Salesforce Lightning Componentは今回ベータリリースされたばかりなので、なかなか情報がなかったのが辛いところでしたが、AdventCalendarがとても役に立ちました。Lightningコンポーネントに興味のある方は一読してみるとよいと思います。

最後に感じたことは、「Lightning Componentは正統なVisualforce2.0なんだろうな」ということでした。Visualforce1.0ではコントローラをApex側に実装していましたが、Visualforce2.0(Lightning Component)ではコントローラをブラウザ側のJavaScriptに移動させています。言語としてはJavaScriptを利用していますが、実はApexと同様に独自言語なんじゃないかな、と。そう考えれば外部ファイルにあるJavaScriptを読み込めないのも納得がいってしまいました。

うまく文章にできてないですが、このあたりで。
良い年を!

Salesforce World Tour TOKYO 2014に参加したよ

かなり遅くなりましたが、2014年12月4日に開催されたSalesforce World Tour TOKYOに参加してきました!

今回はSWTTは2会場に分かれており、もちろんDeveloperZoneのある虎ノ門ヒルズに。
午前中のKeynoteは聴けたのですが、午後からはMiniHackやらハックチャレンジ2014などあって、なかなかちゃんとセミナーを聴けませんでした。

Developer KeynoteからはLightning App Builderの紹介など。Spring'15では登場するみたいですね。
f:id:a-kura:20141204120920j:plain

お昼ごはん。ありがとうございます。
f:id:a-kura:20141204121608j:plain

MiniHackはH(関西弁風翻訳 on Force.com)とE(Lightning コンポーネント)をやりました。Dreamforce2014のMiniHackと似た問題が出てますが、こちらのほうが面倒くさくなってます。E(Lightningコンポーネント)では西暦と和暦の変換でLightningコンポーネントよりもJavaScriptのロジックのほうが面倒くさかったり。
f:id:a-kura:20141231165033j:plain

DeveloperZoneで書籍「実践Heroku入門」をいただいたので、来年はなにかやってみようかな(書籍は読みましたよ)。

そういえば、HerokuのTOKYOリージョン発表はなかったですね。
Herokuお使いの方はこちらで署名するといいみたいです。


DeveloperZoneだけでも十分楽しめる内容ですが、MiniHackやらハックチャレンジやら並行してやらないといけないので、なかなか忙しかったです。MiniHackないのも寂しいですが、じっくり話を聴ける機会もあまりないので、なかなか1日に詰め込むのは難しいなぁ、と思ったり。


最後に、トラのもん。軽く檻の中に入ってました。
f:id:a-kura:20141204181553j:plain

Salesforce移行ツールでLightningコンポーネントを扱う

開発者コンソールで開発するようにLightning Components Developer's Guideに書いてあります。
しかし、開発者コンソールで開発するとソースコードリポジトリ管理できなかったり他人と共有するのが難しくなってきます。
Lightningコンポーネントも他のリソースと同様にSalesforce移行ツールでデプロイ・取り出しができるようになっていますので、Salesforce移行ツールを利用することでリポジトリ管理できるようになります(もちろんSalesforce移行ツールを利用しなくてもMetadata APIを利用すれば同様のことができます)。

準備

Lightningコンポーネントソースコードなどを準備します。

ソースコードを準備する

src
 |--sampleCmp
    |--sampleCmp.cmp
    |--sampleCmp.css
    |--sampleCmpController.js
    |--sampleCmpHelper.js

package.xmlを準備する

src/package.xml

<?xml version="1.0" encoding="UTF-8"?>
<Package xmlns="http://soap.sforce.com/2006/04/metadata">
    <types>
        <members>sampleCmp</members>
        <name>AuraDefinitionBundle</name>
    </types>
    <version>32.0</version>
</Package>

Salesforce移行ツールでデプロイする

Salesforce移行ツールを使ってソースコードをデプロします。

ビルドファイルを準備する

build.xml

<project name="LightningSample" default="deploy" basedir="." xmlns:sf="antlib:com.salesforce">
  <property file="build.properties"/>
  <property environment="env"/>

  <target name="deploy">
    <sf:deploy username="(ユーザID)" password="(パスワード)" serverurl="https://login.salesforce.com" deployRoot="src"/>
  </target>
</project>

ターミナルからSalesforce移行ツールを実行する

> ant deploy

Salesforce移行ツールソースコードを取り出す

Salesforce移行ツールソースコードを取り出します。

ビルドファイルを準備する

build.xml

<project name="LightningSample" default="deploy" basedir="." xmlns:sf="antlib:com.salesforce">
  <property file="build.properties"/>
  <property environment="env"/>

  <target name="retrieve">
    <mkdir dir="code"/>
    <sf:retrieve username="(ユーザID)" password="(パスワード)" serverurl="https://login.salesforce.com" retrieveTarget="code" unpackaged="src/package.xml"/>
  </target>
</project>

ターミナルからSalesforce移行ツールを実行する

> ant retrieve

注意点

開発者コンソールを利用しないとエラーチェックが緩くなり、下記のような問題があります。開発者コンソールで開発していると遭遇しないようなエラーに遭遇することもあるので注意が必要です。

  • Developers ConsoleだとSave時にエラーになるソースコードでもデプロイできてしまう
  • ApplicationとComponentのような排他的なファイルも同じディレクトリに置けてしまう(デプロイできるのは片方のみ)

Force.com Adevent Calendar 改め Salesforce1 Advent Calendar になりました!

Salesforce1 Advent Calendar 2014 - Qiita 1日目です。

Force.com Advent Calendarを始めたのは3年前の2011年からになります。
Salesforce1、Wave、Lightningなど次々に進化していっているので、より包含した名称を使うこととして、「Salesforce1 Advent Calendar」に改名してみました。

せっかくなので、これまでのAdvent Calendarを振り返ってみようと思います。

https://atnd.org/events/22909: title

みんなで2周書いていた苦しい時代でした。
あれ?Node.js、Database.comの投稿がいくつか。。。そういえば、Database.comはどうなったんでしょうねぇ(遠い目)。

今見返すと、Node.js、.NET、CI、モバイル(Titanium)、開発環境など今でも話題になっている分野の投稿がたくさんあったりなかなか多彩です。

電子書籍化されたのもいい思い出です。
記事を投稿していただいた皆さん、履歴書に書けますよ〜(黒歴史がまた1ページ)。

https://atnd.org/events/33649: title

少し顔ぶれが増えたような感じですが、まだみんなで2周書いてたりしてますね(汗)。
CTIのネタがあったり、実践的なマニュアルの作り方があったり、RubyからSalesforceに接続したり、なかなか幅広い投稿があった感じです。皆さんなかなかネタが見つからなかったのか、Cloudforceネタが結構あったりしますね。
そういえば、VisualforceのApexタグにパススルーが出てきたのはこのくらいでしたか。

Force.com Advent Calendar 2013 : ATND

書いてくれる人も増えてきて、ようやく1週+αくらいで回せた年でした。
この年は1回目のSalesforce $1M Hackathonが開催されました。なかなかエキサイティングなイベントでしたが、リモートからの応援しかできなかったのが残念だったなぁ、という思い出です。
Salesforce1が発表されたのでSalesforce1ネタが投稿されています。Dreamforceで発表された技術を使ってネタを書いてみるにはいいくらいの時期ですね。

関西のユーザグループUmekitaforceができたのもこのあたりなんですねぇ。

Salesforce1 Advent Calendar 2014 - Qiita

そして、今年になります。
今年のDreamforceではWave、Lightningが発表されました。
Waveについてはまだまだ情報も少ないですが、Lightningについてはすでに試せるようになっているので、今年もいくつか投稿があると思います。最新の話題なだけにLightningに興味がある人は今年のAdvent Calendarは見逃せないでしょう。

以上、次の方よろしくお願いします!

AndroidStudio+SalesforceMobileSDKによるAndroid開発環境構築

MacAndroid StudioSalesforce Mobile SDKを利用したAndroidアプリ開発環境を構築するためのメモ書きです。

事前準備

Java SE Developer Kit 7をインストールする

公式サイトからJDKをダウンロードしてインストールする
http://www.oracle.com/technetwork/java/javase/downloads/index.html

Android Studioをインストールする

公式サイトからAndroid Stadioをダウンロードしてインストールする
http://developer.android.com/sdk/installing/studio.html

インストール先: /Applications/Android\ Studio.app

Android SDK ManagerでSDKをインストールする
今回インストールしたPackage

検証バージョン: 0.8.14(2014/11/22時点)

Node.jsをインストールする

公式サイトからNodeJSをダウンロードしてインストールする
http://nodejs.jp/

Gradleをインストールする

公式サイトからGradleをダウンロードしてインストールする
http://www.gradle.org/downloads

Salesforce Mobile SDK for Android

npmを利用してforcedroid(Salesforce Mobile SDK for Android)をインストールする

> sudo npm install -g forcedroid

ANDROID_HOMEを設定する

export ANDROID_HOME=(Android SDKをインストールしたディレクトリ)
...

検証バージョン: 2.3.1(2014/11/22時点)

Androidアプリを作成する

Salesforceで接続アプリケーションを作成する

  1. Developer Edition にログインする
  2. 接続アプリケーションを作成する(コンシューマ鍵、コールバックURLをあとで利用する)

forcedroidでアプリケーションを作成する

Salesforce接続処理が組み込まれたアプリケーションのサンプルプロジェクトを作成する

> forcedroid create
Enter your application type (native, hybrid_remote, or hybrid_local): native
Enter your application name: Test
Enter the target directory of your app: Test
Enter the target android api for your application (number between 8 (Froyo) and 19 (KitKat): 19
Enter the package name for your app (com.mycompany.my_app): com.example.test
Do you want to use SmartStore in your app? [yes/NO] ('No' by default) 

Android Studioにインポートする

下記の手順でサンプルプロジェクトをインポートする

  1. Android Studioを起動し、Import Project...をクリックする
  2. 上記で作成したディレクトリを選択してOKボタンをクリックする
  3. Create project from existing sourcesを選択してNextボタンをクリックする
  4. Project name、Project locationを確認してNextボタンをクリックする
  5. Source filesを確認してNextボタンをクリックする
  6. Librriesの名称を確認してNextボタンをクリックする
  7. Modulesの名称を確認してNextボタンをクリックする
  8. Project SDKを確認してNextボタンをクリックする
  9. Manifestファイルを確認してNextボタンをクリックする
  10. Open Module Settingsを開く
  11. Module「Test」のSourcesタブを開き、srcのマークをSourcesに変更する
  12. Module「Test」のDependenciesタブを開き、libs(Library)を追加する
  13. Test/res/values/bootconfig.xmlを開き、remoteAccessConsumerKey、oauthRedirectURIをSalesforce接続アプリケーションの設定値に書き換える

サンプル・アプリケーションを実行する

Android Studioからインポートしたプロジェクトを実行する

  1. サンプルプロジェクトを開き、Runボタンをクリックする

補記

Salesforce Mobile SDKのバージョンによって動作させるまでの最低限の手順が異なるので注意が必要です