Blog - LINE ENGINEERING

LINE Engineering

LINE Engineering Blog official account

新時代に備える！AngularJSにリマーケティングタグを実装する方法
LINE Engineering2014-08-03
LINE Engineering Blog official account
皆様お久しぶりです。LINEの天然男子。UITチームのキョウです。最近、AngularJSで構築したコンテンツに様々なトラッキングコードを入れて計測を強化する対応を行ったのでご紹介します。はじめに現在、様々なJSフレームワークがでていますが「やはりJavaScriptはSEOに弱い」と言う風潮の影響で、実業務で積極的に使えないのが現状でした。しかし、2014年5月にGoogleからJavaScriptのインデックスを強化していると言う話が出ています。少しずつですが、SEOにとらわれずAngularJSやBackbone.jsを使ってサイト構築ができる未来が近づいています。今回の話は、そんなJS新時代が到来した時の為に知っておきたいトラッキングコードの導入方法について説明いたします。目次 1. 要件 2. 対応方法 3. AngularJSにトラッキングコードは設置できないの？ 4. Adwordsのリマーケティングタグが実はやっかい! 5. AngularJSとGoogleタグマネージャを連携する方法 6. 最後に 1. 要件 AngularJSを使い実装されたコン
- frontend
- AngularJS
LINEの暗号化について
LINE Engineering2014-06-25
LINE Engineering Blog official account
LINEセキュリティチームです。今回はLINEで利用されている暗号化技術について紹介します。 LINE 3G通信での暗号化有無の確認 LINEについて一般的に誤解されている情報の中には、暗号化方式が弱いため外部に情報が流出する可能性が存在するという点と、wi-fi通信の中ではデータが暗号化されているがモバイルネットワーク（3G、LTE）を使用する場合は暗号化されていない、という点があります。まず、暗号化が実際に実行されているかどうかについては、これを言葉で説明するのは意味がないので、現在アプリケーションが安全な状態であることを直接目で確認するほうが確実です。暗号化の有無を確認するにあたって最も一般的に使用されるのは、特定の端末から送信されるネットワークデータをキャプチャーしてこれを観察する方法です。モバイルの場合、インターネット接続時にネットワークデータをキャプチャーするためのPCをVPNのようなサービスを利用して経由させ、データを観察します。Androidの場合は、Shark for root のようなアプリを使用すればパケットをキャプチャーできます。実際にメッセージを
- Security
FireFoxOS版のLINE
LINE Engineering2014-05-19
LINE Engineering Blog official account
FirefoxOS版LINEは2013年下半期に開発を開始し、2014年2月にリリースされました。FirefoxOS LINEは現在世界19カ国で使用されており、Firefox Marketplaceでのダウンロード数が多いアプリの1つです。また、多くのユーザーが好意的なレビューを書いており、人気アプリTOP 7の中で唯一星4つの評価を維持しています。このようにユーザーから好評を得ているFirefoxOS LINEは、決して簡単に作られたものではありません。FirefoxOS LINEがどのようにスタートし、またどのように開発されたのか、性能向上のためにどんなことをしてきたのか、開発に携わる中で経験したことをどうやって共有しているのかについて紹介します。 WebOSのスタート 2013年、MWC 2013で注目されたのはWebOSの登場でした。FirefoxOS(以下FXOS)、Tizen、Ubuntu、Sailfish OSが発表され、MozillaはKeon、 PeakというFXOSデバイスを発表しました。もちろんアプリ開発者向け(Developer Preview)デバイスでは
- FireFoxOS
急増するLINEインフラの課題と対応
LINE Engineering2014-05-07
LINE Engineering Blog official account
急増するLINEインフラの課題と対応こんにちは。今回はITサービスセンターより、インフラ運営の観点から急増するLINEインフラの課題と対応について記させていただきます。はじめに先日開催したLINE Developer Conference（インフラ編）には大勢の方にいらしていただきました。カンファレンスでは、LINEサービスが始まってから約2年の間に我々はどういった方法でインフラ運営を行い、またどんなことに悩んできたのかを、システム、データベース、ネットワークの観点からそれぞれ発表させていただきました。カンファレンスはLINE株式会社が様々な技術をどのように使い、どのように運用を行っているのか。現在どのような技術的なことに取り組んでいるのか日本のエンジニアの皆さんに知っていただくために開催されました。結果としてインフラ編では150名の定員に対して430名のご応募をいただいたとのことでLINEサービスに対する関心の高さを感じ、当日発表させていただいた3名は身が締まる思いがしました。各セッションの後、懇親会が行われ、大勢のエンジニアの方々からLINEインフラ運営について様々なご質
- Infrastructure
LINE iOSアプリ開発についてのご紹介
LINE Engineering2014-04-20
LINE Engineering Blog official account
はじめまして、LINE技術戦略室のhayaishiです。趣味は自転車と言っていますが最近は全く乗っていません。この記事では、LINEのiOSアプリ開発に関することをいくつかご紹介させていただこうと思います。 LINEのiOSアプリ開発環境ソースコード管理ソースコードはgitで管理しています。gitのリポジトリブラウザとしてGithub Enterpriseを利用しており、Githubでお馴染みのPull Requestなどを活用して開発を進めています。また、LINEのiOSアプリのタスクについてはGithub Enterpriseとは別のチケット管理システムを利用しておりそちらのステータスと連携して開発者、QA、プランナー間の開発状況の共有を行っています。 Gitでの開発フローについて LINEのiOSアプリはgithub-flowの様に一つの常にdeploy可能なmasterを持つというよりは常にdeploy可能なバージョン毎のmasterを持っているという形で運用しています。それぞれがリリース可能なブランチで、開発状況によっては下位のバージョンのコミットが上位のバージョンの
- iOS
- Client
LINE遠征隊
LINE Engineering2014-04-16
LINE Engineering Blog official account
こんにちは今回は、LINEが全世界にサービスを拡大する過程において、ユーザーの立場から品質を測定し、改善している取り組みについてご紹介します。しかし、ここに書いた取り組みはごく一部であり、実際にはすべての開発者、企画者、さらには事業担当者もユーザーの立場から、各自努力をしていると思います。LINEの競合に影響のない小さな範囲で書いてみます。 LINE遠征隊 LINEは2011年6月、日本でサービスを開始して以来、現在では4億人のユーザーが使用するメッセンジャーとなっています。他のどのサービスよりも急速に成長しているだけに、LINEも数多くのユーザーの品質問題を経験してきました。人間が自分の生まれたところ以外で生きるためには、考えや話す方法を変えなければならないように、LINEも生まれた日本を脱し、他の国でもうまく動作するために、多くの部分を改善しました。その取り組みについてのお話です。 2012年12月、スペインの多くのユーザーがWhatsAppの有料化の動きに反発して LINEを選択しました。本当に瞬く間にスペインユーザーが爆発的に増えました。しかし、その時のLINEは時々メッセー
Angular JSを使おう3 Directiveを作ろう
LINE Engineering2013-02-27
LINE Engineering Blog official account
こんにちは、こんばんわ、お久しぶりです。NHN Japan ウェブサービス本部開発1室UITチーム吉田徹生(@teyosh)と申します。 3ヶ月ぶりの登場です。AngularJSって何？という方は第一回目の記事[Angular JSを使おう]を御覧ください。さて、3ヶ月の間にstableは1.0.5と順調にアップデートしております。ちゃんとアップデートがされると使っていても安心できます。今回はAngularJSを利用していると気になるng-clickやng-repaeatなどAttributeに設定されているものについてです。これはdirectiveの拡張でAngularが機能を設定してくれます。 Hello, World 以下のようなコードがあるとします。 <div ng-app='hello'> <div ng-controller='helloCtrl'> <button ng-click='hello("world")'>hello</button> </div> </div> ang
- frontend
NAVERまとめに見る遅延ロードのすすめ
LINE Engineering2013-01-15
LINE Engineering Blog official account
あけましておめでとうございます。NAVERまとめのフロントエンドを担当している縣です。初詣で引いた大吉のおみくじを握りしめながら今年も張り切っていこうと思います。今回はJavaScriptの遅延ロードの仕組みをNAVERまとめに導入した際のお話を紹介します。遅延ロードの検討昨年NAVERまとめのまとめ閲覧ページや、まとめ編集ページでのJavaScriptファイルの読み込みを遅延ロード化する作業をしました。元々はページ読み込み時に全て読み込ませていましたが、JavaScriptファイルが巨大になってきてパース・実行に時間がかかるようになったことから遅延ロードを検討することになりました。遅延ロードの利点というとJavaScriptファイルの読み込み・実行によるブラウザのレンダリング停止を防ぐのはもちろんですが、どのファイルがいつどこで必要になるかを明確にすることもでき、依存関係を動的に解決できます。規模が大きなプロジェクトほど読み込むファイルも増えるでしょうから、スクリプト側で読み込むファイルを把握できたほうが都合がいい場合が多いです。ファイルの分割・再構成閲覧ページでは元々閲
Angular JSを使おう2 Testaularの使い方
LINE Engineering2012-11-26
LINE Engineering Blog official account
こんにちは、こんばんわNHN Japan ウェブサービス本部開発1室UITチーム吉田徹生(@teyosh)と申します。前回の続きでAngularJSについて紹介していきたいと思います。AngularJSって何？という方は前回の記事[Angular JSを使おう]を御覧ください。ここ数年でJavaScriptのコードは膨大に増えてきていると感じています。出来うる限りバグを少なくしよう、保守をしやすくしようと様々なライブラリーやデザインパターンが導入されてきています。それに伴い、JavaScript界隈にもテストを重視する様になってきて、クオリティも上がってきていると思います。さて、JavasScriptのテストといえばQunit、Jasmine、Mocha、seleniumなどを挙げられると思います。今回はそれらとは少し違うAngular JSのために作られたTestacularを紹介したいと思います。まずは、Testacularについて Vojta Jina created Testacular (GitHub: vojtajina / testacular, License
- frontend
AngularJSを使ってみよう
LINE Engineering2012-10-29
LINE Engineering Blog official account
こんにちは、こんばんわNHN Japan ウェブサービス本部開発1室UITチーム吉田徹生(@teyosh)と申します。最近ではJavaScriptのMVCフレームワークが雨後のタケノコのようにたくさん出てきています。先日Quirks ModeがJavaScript Libraryの利用状況をアンケートが公開していました。backbone.jsやknockout.jsなど、MVCライブラリもランクインしてきました。その中で今回はAngularJSを紹介しようと思います。まずは、Angular JSについて AngularJS（アンギュラージェイエス）は、Googleとコミュニティによって開発されているオープンソースのJavaScriptフレームワークである。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としている。MIT Licenseでライセンスされたフリーソフトウェアである。初版は、Miško HeveryとAdam Abronsによって2009年に発表され、2012年6月にバージョン1.0.0がリリースされた[1]
- frontend