production でasset:precompile前にgulpを流したい。asset:precompileはdigestとかは任せたい。 namespace :js do desc 'Run gulp tasks before assets:precompile' task :build do sh 'npm install; $(npm bin)/gulp' end end task 'assets:precompile' => ['js:build']
Electronで動作する動画ファイル及びJPG in Zip向けのファイルブラウザを作ってみました。 構成としてはElectron+React+Reduxで、gulpfile以外はbabelを使って書いてます。 そこそこ今風な感じを目指して、一部flowtypeとかも取り入れてますが、割と適当な感じで使ってます。 実は以前Node.jsで同じもの作ってたんだけど、せっかくちゃんとデスクトップアプリとして作れるようになったしReactにも慣れたのでElectronと今の技術で作り直してみたのがこれです。名前も同じだったりする。 https://github.com/joker1007/blackalbum https://github.com/joker1007/blackalbum/releases/download/v0.2.0/BlackAlbum-darwin-x64-0.2.0.
元々GitHubのAtomエディタのために開発されたデスクトップアプリ作成用フレームワーク「Electron」。HTML/CSSといったWeb系技術を使って、クロスプラットフォームのデスクトップアプリを開発可能なため、多くの開発者の注目を集めています。 本日紹介する「Photon」は、このElectron用の便利なコンポーネントを多数収録したUIツールキットです(GitHub、Hacker News)。 ツールバー、タブ、ナビゲーション、リスト、ボタン、フォーム、テーブルといった、GUIアプリ作成に必要なさまざまなコンポーネントを、アプリケーションに素早く組み込むことができます。コンポーネントの見た目もOS X風でクールです。 以下ご紹介。 バー ヘッダーとフッターを組み込むことができます。 バーとアクション バーにボタンを設置してアクションを定義することもできまうs. バーとタブ タブを
2018年4月25日をもちまして、 『CodeIQ』のプログラミング腕試しサービス、年収確約スカウトサービスは、 ITエンジニアのための年収確約スカウトサービス『moffers by CodeIQ』https://moffers.jp/ へ一本化いたしました。 これまで多くのITエンジニアの方に『CodeIQ』をご利用いただきまして、 改めて心より深く御礼申し上げます。 また、エンジニアのためのWebマガジン「CodeIQ MAGAZINE」は、 リクナビNEXTジャーナル( https://next.rikunabi.com/journal/ )に一部の記事の移行を予定しております。 今後は『moffers by CodeIQ』にて、 ITエンジニアの皆様のより良い転職をサポートするために、より一層努めてまいりますので、 引き続きご愛顧のほど何卒よろしくお願い申し上げます。 また、Cod
というテーマで東京Node学園祭2015でセッションさせて頂くことになったので、先に整理/メモ的ななにかを。 (追記)以下資料で発表しました。 大規模Node.jsを支える ロードバランスとオートスケールの独自実装 http://www.slideshare.net/kidach1/nodejs-54841327 作ったもの ・スマホゲーム(マルチプレイアクション) 【公式】メザマシフェスティバル(メザフェス) | 株式会社アカツキ https://mezamashi-festival.aktsk.jp ・2D横スクロール ・マルチプレイ ・4人同時対戦 ・座標同期型 ・全国マッチング システム概要 Client: Cocos2d-x (c++) Server: API Server:Rails Websocket Server:Node.js 詳しくは スマホアプリにおけるマルチプレイア
はじめに ES6 (EcmaScript 6)を試そうと、Babelのドキュメントを読んでいたところ、末尾呼び出し(Tail Call)の最適化をしていることにびっくり。公式リリース(2015年6月)から3ヶ月あまり経ってはいますが、ES6が末尾呼び出し最適化を仕様としてサポートしていることをようやく知りました。 現状で末尾呼び出し最適化をサポートしているブラウザはなく(ブラウザやaltJSなどのES6互換表を参照)、唯一、ES6からES5へのトランスパイラであるBabelのみが部分的(直接的な末尾再帰のみ)ではありながらサポートしているようですね。 今回の記事では、来たるES6時代(いまさらの感はありますが)に備えて、末尾再帰とその最適化について簡単に解説した上で、Babelを利用して実際にJavaScriptでの末尾再帰の最適化を実験してみたいと思います。 ざっくり概要 再帰関数 は関
Nightmare.js allows you to automate HTTP requests in Node.js, which you can use to download files from sites, check your e-mail, runt integration tests, etc. The last couple of years, more and more logic have appeared on the client-side of web sites. Thanks to Single Page Applications (SPA) instead of server-side frameworks, we are able to cache views on the client and just get the data from the b
はじめに 仕事で社内MBaaSのメンテを任されているのですが、そのインタフェースは何かというとWebAPIなわけです。そのWebAPIが糞みたいな状態だったので、絶賛リファクタ祭り中です。・・・ただ、やみくもなリファクタ祭りをするとデグレがひどいので、WebAPI外部仕様が守られていることを担保する、WebAPIテストコードを本腰入れて書くことにしました。 「WebAPI テスト」でパッと検索してみた感じ "Frisby" というやつがあったので、それをもとにテストコードを書いてみました。その備忘録です。 Jasmine/Frisbyって? Frisbyは、Jasmineを前提としたWebAPIテストフレームワークです。Jasmineを使って、Frisbyで書かれたテストコードを実行します。Jasmineというのは、BDDライクなテストコードが書けるJavaScriptテストフレームワーク
背景 Javascript で Web アプリを作ろうとすると、よくわからないことだらけで超混乱します。 npm と bower の違いは? npm はサーバーサイド用、bower はクライアントサイド用らしいよ えっ、でもなんで bower のインストールに npm が必要なの? サーバーサイドは Rails で書きたいから npm 要らないと思うんだけど・・・ ていうかサーバーサイドJSとか node.js って何? よく見る browserify って何? こういった疑問が沸き上がるのは、各ツールが生まれた文脈がよくわかっていないからです。いろいろ調べてやっとちょっとわかってきたのでメモします。間違いがあったらご指摘ください。 「CommonJS」誕生 - Javascript は汎用プログラミング言語へ その昔、Javascript 大好きおじさんは言いました。 Javascrip
僕が1日に1回ぐらいの頻度で見ているページの中の1つに GitHub の Trending repositories のページがあります.このページには言語ごとに日毎・週毎・月毎の単位で GitHub 上で人気のリポジトリがランキング形式で表示されます. 話題になっているライブラリやソフトウェアの一次ソースとして便利なのですが,微妙にアクセスが悪い位置にあり,言語ごとにしか見られません.また,ランキングには常に人気な「常連」リポジトリが多々いるので,新しく話題になっているリポジトリはその中に埋もれがちになってしまいます. そこで,今回はこれらの問題を解決すべく,GitHub のトレンドクライアント Trendy を Electron ベースでつくりました. Trendy - Menubar App to Keep You in the Trend Trendy は GitHub のトレンド
wearefractal/vinyl-fs の dest(folder, [opt]) が出力先のディレクトリが無い場合でも、そのディレクトリを作ってくれないということで、自分で「ディレクトリの有無を確認して、無い場合はディレクトリを作る」という処理を作る必要がでてきました。 そこで File System Node.js v4.1.0 Manual & Documentation を見て、ディレクトリの有無を確認するのに使えそうな fs.exists() という API を見つけたのですが、「Deprecated: Use fs.stat or fs.access instead.」ということで、他の API を使うように書かれていました。 「ファイルの有無を確認する API が deprecated になるのはなぜ?」と思い、これは何かあると思って少し調べてみたのでまとめておこうと思い
Electron で Live Dwango Reader(旧 Live Door Reader)クライアントを作ってみる、その二JavaScriptNode.jsReactElectron 思っていたよりたくさんの方たちに見ていただいたようで、とにかく圧倒的にデザインがダサくて恥ずかしかったので、ちょっとだけバージョンアップしました。あと、前回のは Electron 成分が少なめでしたので、今回はちょっぴり増量しています。レポジトリはこちら。 圧倒的にダサかったデザインをなんとかした Slack っぽくしてみました。ちょっとは今風になったかもしれないです。 そもそもデザインセンスもないですし、HTML / CSS は 3〜4 年くらいまともに触っていないので、どなたかやってやるよ!って方がいらっしゃいましたらぜひ...。限界に近いです。 認証をどうにかする アクセストークンをインスペクタ
全国5000人のエンジニアをやめて寿司職人になろうと思っているみなさんこんばんは。 前回までスライド共有用のアプリケーションを趣味(リハビリ)で作っていたのですが、折角なのでデスクトップクライアントも作ってみました。 構築にはElectronを使ったのですが、結構簡単にできたので記録としてまとめておきます。 Electronって何?GitHubが開発するクロスプラットフォームで動作するアプリケーションを開発するためのフレームワーク。コードの記述はHTML5とNode.js。その範囲であれば既存のWeb開発技術が使いまわせる。例えばjQueryとかAngularなんかを使うのも可能Chromeブラウザのオープンソース版のChroniumのエンジンを内蔵例えばAtom・Visual Studio Code・Slackクライアントや、日本だとKobitoあたりがメジャー作り方あちこちに記事があが
2015年 09月 10日 開発に便利なタスクランナー「gulp」で出来る事、導入方法などをまとめました カテゴリ: gulp タグ:gulpタスクランナー タスクランナーの一つであるgulp(ガルプ)。使い出すとすごく便利で今ちょっと手放せない開発ツールの一つなんですが、使ってない人からすると、導入コストとか学習コストが気になって、まだ手を出してないという方もいますよね。なので、今回導入用の記事を書いたので、ちょっと気になってるという方、試してみたかったという方に役立てばいいなと思います。 1.タスクランナーとは? gulpで何ができるのか? 2.gulpに必要な環境を整える – Node.jsのインストール 3.gulpに必要な環境を整える – package.jsonの作成 4.gulpに必要な環境を整える – gulpfile.jsの作成 5.gulp-ejsを使った開発環境 6.
The collaborators of the Node.js project and the members of the Node.js Foundation are proud to offer v4.0.0 for general release. This release represents countless hours of hard work encapsulated in both the Node.js project and the io.js project that are now combined in a single codebase. The Node.js project is now operated by a team of 44 collaborators, 15 of which form its Technical Steering Com
はじめに こんにちは植木和樹@上越妙高オフィスです。本日は lambda の開発環境を準備した際の作業を備忘録としてまとめました。 2014年のre:Inventで発表されたlambdaですが、年末のアドベントカレンダー等で大いに盛り上がっているのを横目に完全に取り残されておりました。しかし9月5日に開催されたJAWS re:Moteでも「lambda, lambda, lambda」と、その可能性に注目が集まっていることを感じざるを得ません。 JAWS re:Mote 2015 - Togetterまとめ ということで、node.jsはおろかJavaScriptも詳しくない私がまずは開発環境を整えるところから始めてみました。 準備したもの パッケージインストール OSXの場合、開発環境といっても大掛かりなものは必要ありません。後述するサンプルプロジェクトを実行するためのnode.jsを入
この記事はAWS Lambdaアドベントカレンダーの15日めのぶんです。エントリーした当初はRedshiftへのデータロード云々を書こうと思ってたんだけど、すっかりその熱は冷めてしまったので開発手法やパッケージングについて書くことにします。 お約束ですが、これは個人のメモ/意見であり、所属する組織を代表するものではありません。 はじめに 以前AWS Lambdaのための関数のローカル開発とテストというのを書いたのだけど、この 記事もそこベースにして続きを書き足している感じなのでだいぶかぶっている部分があるのはご容赦を。 考え方 AWSのサービスを使った開発をするときによく出てくるネタとしてあるのが「ローカルでの開発」。たとえばDynamoDBだったらDynamoDB Localというモックみたいなものが配布されていて、基本的な考え方としては本物のサービスを使わずにローカルで動く代替物を用意
大量のファイルをgzipしたものをS3に配置したいニーズがあって、非力な手元のマシンで一旦gzipしてから転送するよりはLambdaにやらせたらいいのではないか?ということでやってみました。 以下のようなLambda functionを設置 大きなファイル(数十MB以上)を扱う場合はtimeoutをデフォルトの3秒から伸ばす。メモリも128MBでは足りないことがあるので512MBなど S3の読み書き権限があるIAM Roleを設定 S3のイベント通知でLambda functionをkick aws s3 sync で大量のファイルを同期してもアップロードが終わったファイルから順番に処理が走るので、同期が終わった数秒後にはgzipされたファイルが生成されている状態になります。 var aws = require('aws-sdk'); var zlib = require('zlib');
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く