NAVERでのSassの使い方 « NAVER Engineers' Blog
NAVER UITのSass Mixins職人（他称）の上村です。 今日はLess & Sass Advent calendar 2011の21日目です。 3日目に書かれている通り、NAVERでは半年ほど前から実務でSassを使っています。 今回は弊社で使用しているSassのディレクトリ/ファイル構成やMixinsについて解説します。 基本ディレクトリ/ファイル構成 今のところcss/sassディレクトリは下記のような構成を基本としています。 project |~css/ | |-category-A_TRUNK.css | `-category-B_TRUNK.css |~sass/ |~core/ | |-_setting.scss | |-_style-mixin-base.scss | |-_style-mixin-layout.scss | |-_style-mixin-mod
sassの抑えておきたいfunctionの使い方 « NAVER Engineers' Blog
こんにちは。 年末の予定はぶっ通しでスカイリムにつぎ込むことが決定したUIT富田です。 今回は、Less & Sass Advent calendar 2011の6日目として、 sassのfunctionについて解説します。 すっぽりハマった四則演算の落とし穴 sassは値の四則演算をサポートしており、10進数だけでなく、16進数の値であってもよしなに計算してくれます。 color: #a3a4a5 + #111111; ↓ color: #b4b5b6; 16進数と10進数でもエラーにならず計算してくれます。（普通あまりやらないとは思いますが） color1: #000000 + 1; color2: #000000 + 15; ↓ color1: #010101; color2: #0f0f0f; この16進数の計算は、結果が#fffffを上回った場合、上回った分は切り捨てて、す
Angular JSを使おう3 Directiveを作ろう « NAVER Engineers' Blog
こんにちは、こんばんわ、お久しぶりです。 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'> <
AngularJSを使ってみよう « NAVER Engineers' Blog
こんにちは、こんばんわ NHN Japan ウェブサービス本部開発1室UITチーム 吉田徹生(@teyosh)と申します。 最近ではJavaScriptのMVCフレームワークが雨後のタケノコのようにたくさん出てきています。 先日Quirks ModeがJavaScript Libraryの利用状況をアンケートが公開していました。 backbone.jsやknockout.jsなど、MVCライブラリもランクインしてきました。 その中で今回はAngularJSを紹介しようと思います。 まずは、Angular JSについて AngularJS（アンギュラージェイエス）は、Googleとコミュニティによって開発されているオープンソースのJavaScriptフレームワークである。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としている。MIT L
Backbone.js 1.0に向けての変更点 « NAVER Engineers' Blog
UITチーム 清水大輔 (@tori3_jp)です。 2012年も残り僅かとなりましたが、年の瀬をいかがお過ごしでしょうか。 Backbone.js Advent Calendar 2012の10日目のエントリーとなります。 先月、DailyJSというJavaScript関連のトピックを配信しているサイトに Backbone.jsの次期リリースに関する記事が投稿されていました。 今回はこの中からBackbone.jsの次期リリースで予定されている変更点について紹介したいと思います。 Backbone.$ Backboneで扱うjQuery互換ライブラリへのエイリアスが変更されます。 ローカル変数$を参照していたものがBackbone.$に変更されます。 - var $ = root.jQuery || root.Zepto || root.ender; + Backbone.$ =
「カジュアル」な規模のデータクラスター上でのデータ解析処理 « NAVER Engineers' Blog
今年はさだまさしさんのデビュー40周年ということで、記念コンサート「さだまつり」も絶賛開催中の折も折、残暑も厳しい中皆様いかがお過ごしでしょうか。大平です。 さだまさし氏は経験の豊富な方ですので彼の歌や発言から学ぶことは大変多いのですが、個人的に非常に感銘を受けているのは「歌はコンサートで成長する」という言葉です。歌い手として、「歌」という作品を作って公開・販売するだけが仕事ではなく、実際にコンサートなどでお客さんに届け、お客さんの反応を参考にしたり日々の演奏活動の中で試行錯誤を繰り返して、内容をブラッシュアップし洗練させていく過程を指して先の言葉があるのだと思います。実際にさだまさし氏の曲はCDに収録されているものと実際にライブで演奏されるものとでアレンジが大きく異なり、かつ作品としても質が向上しているものが少なからず存在します。 …あまりさだまさしの話を続けると本当に上長に叱られますの
“Backbone.js gives structure to web app” « NAVER Engineers' Blog
こんにちは、開発１室UITチーム 清水@tori3_jpです。 さて、今回はLINEのスマートタブレット向けブラウザ版でも採用したJavaScriptのMVC FrameworkであるBackbone.jsについて紹介したいと思います。 この数年でブラウザの高速化やHTML5の機能の実装が進むにつれHTML/CSS/JavaScriptでよりネイティブアプリケーションに近い表現がブラウザ上で可能になりつつあり、それにともない開発はより複雑になってきています。 jQuery pluginなど使えば短いコードで様々な機能を手軽に実装できますが、規模が大きくなるにつれcallbackが増え、徐々に見通しの悪いコードになりがちです。また、DOMとデータの分離が難しくなることも問題となってきます。 そこで、Javaなどで広く使われているデザインパターンの１つであるMVCパターンで構造化された設計
nginxの優雅な再起動 « NAVER Engineers' Blog
こんにちは開発チームの崔珉秀と申します。 今回はnginxというウェブサーバーについて話をさせて頂きます。 nginxは最近数年の間けっこう人気が高くなっています。特によく使われているApacheやLighttpdなどのウェブサーバーと性能の面で比較することがよくありまして、優れた性能で単純なstaticファイルを転送するウェブサーバーからCGIサーバー、reverse proxyサーバーなどの様々なウェブリクエスト処理に関わる分野で導入されています。 今日はnginxの性能の比較よりもサーバーの開発者(nginx module)もしくはサーバーの運営者としてのnginxにある仕組の中で一つを紹介したいと存じます。 サーバーの開発や運営をする場合ロジックや設定などの変更により配布の後、サーバーを再起動することがあります。 その再起動の時にウェブサービスとしてリクエストの処理を続けなが
慎ましい構成で使うSolr « NAVER Engineers' Blog
お世話になっております、開発チームの池上です。 最近ちょっとした検索機能にSolrを導入しました。Solrは検索エンジンのミドルウェアでご存知の方も多いと思います。大規模な構成による導入実績が豊富でWeb上にもたくさんの事例がありますが、今回は慎ましい構成の事例を紹介させて頂こうと思います。 使用しているSolrのバージョンは2012年1月時点で最新の3.5.0です。 なお、検索エンジンやSolrに関する基礎的な情報につきましては、有用な解説がすでに多数存在していますので割愛させて頂きます。 今回はつぎの前提条件と要件を意識して構築しました。 前提条件 サーバは極力少なめで ミッションクリティカルな機能ではない データ量はそれほど多くない 要件 更新はある程度頻繁 遅くとも数分以内にはインデックスに更新を反映させたい 一般的なWeb検索のように「いい感じに見つける」よりは「（入力されたキ
Introduction of ‘fluentd’ « NAVER Engineers' Blog
今年はさだまさしさんのデビュー40周年という記念の年ですね。大平です。 さだまさしさんの歌は、時に切り口鋭く、時に叙情的に情景を描写する技術もさることながら、落研出身ゆえの話術の巧みさ、流暢さも魅力の一つです。 あまりさだまさしの話を続けると上長に叱られますので、、この記事では「流暢な」という意味の名前を持つOSSのミドルウェアについて、ご紹介をしたいと思います。 fluentdについて fluentdは、Treasure Data Inc.の古橋貞之さんが公開しているOSSです。 古橋さんはMessagePackの作者としても有名ですね。 fluentdは、古橋さんのブログ記事から説明を引用すると以下のようなツールです。 fluent は syslogd のようなツールで、イベントログの転送や集約をするためのコンパクトなツールです。 ただ syslogd とは異なり、ログメッセージに
iPhone版LINEのデータ構造 : Core data in LINE « NAVER Engineers' Blog
こんにちは。検索サービス開発４チームでメッセージアプリのLINEのiPhoneアプリ開発を 担当している金泰敬(キム テギョン)です。 今回説明させて頂きたい主題はLINEのモデル側を支えているCore Dataです。 Core Dataは、MacOS XのベースFrameworkであるCocoaのMVC構造のうち、 Model側を担当しているFrameworkです。 Core Dataを利用するとデータモデルの設計、オブジェクトのデータの読み取り、書き込み、管理などを簡単に行うことができます。 現在、LINEではCore Dataを利用してメッセージ、トーク、グループ、ユーザーなどを管理しています。 例えば、相手のメッセージが到着するとまずコアのデータからSqliteDBに格納します。 そして保存されたメッセージに関連しているトークでも更新が行われます。 もしそのメッセージが
Androidで使えるOR Mapper: ORMLite « NAVER Engineers' Blog
こんにちは。開発チームの駒津です。 ここ半年ほど、弊社アプリLINEのAndroid版を開発しています。関係者一同の頑張りもあってAndroidユーザー 100万人達成という非常にうれしい状況なのですが、かなりのハイスピードで開発が進みましたのであまり冒険せずに、力技で少し泥臭く実装している箇所もあります。 データベース周りも普通にSQLiteDatabase経由でSQL文を書いているのですが、できればOR Mapperを使いたかった… という反省点があり、現在開発状況が少し落ち着いた (のか…? 本当に…?) 今のうちにそっち方面を調べておこうかと思います。 Androidではそのスペックの都合上, 軽く動作するOR Mapperが向いていそうです。そういう視点で色々探して見たところORMLiteが良さそうな気がしました。正式にAndroidに対応していると謳っているのも嬉しいところ。
ReFlowの原因とマークアップの最適化 « NAVER Engineers' Blog
自己紹介 ネイバージャパンのUIT(User Interface Technology)チームの裵完理(ベワニ)です。 概要 CSSやJavaScriptを使って複雑なデザインや動的なページを実装しているサービスが増えてきていますが、速度低下などの問題が発生しやすくなっています。これを100%直すことは難しいですが、改善するにはブラウザレンダリングプロセスを理解する必要がありますので、理解した上で改善方法を探してみましょう。 ブラウザレンダリングプロセスの理解 ブラウザの基本構造 User Interface – アドレスバー、戻る・進むボタン、ブックマークメニューなど、メインウィンドウに表示(document)されるページ以外の部分 Browser Engine – UIとレンダリングエンジン間のアクションを制御するもの Rendering Engine – リクエストしたコンテンツを表
NAVER Engineer's Blog
はじめまして！ NAVER Japan検索サービス開発室の福島です。 NAVERサービス開始から2年経ち、もうそろそろやっといてもいいんじゃね？的な雰囲気になったので、この度、NAVERのエンジニアによるブログを開始することになりました！ 検索サービス開発室には、フロントエンド、バックエンド、アプリ開発やQAなど様々な業務に携わるエンジニア達が所属しています。 そんなエンジニアたちによるNAVERサービスの裏側や興味がある技術、実験的な試みやノウハウ、失敗談、そしてお知らせなど多岐にわたる内容をお伝えしていく予定です。 どんな展開になるか未知数なところもありますが、あまり気負わずに続けていきたいと思っていますので、今後ともよろしくお願いいたします！
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
