Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

Go のシンタックスだけで HTML とスタイルと JS を構築する「Vecty」というフロントエンド開発キットの紹介 先日 Umeda.go#3 にて登壇して Vecty を紹介しました。資料はこちらです。 Vecty とは? リポジトリ: https://github.com/gopherjs/vecty GopherJSむけの React-like な frontend development kit です。 GopherJS について 前に書いた紹介記事を参照 Vecty の主な機能は GopherJS の Go 記述を JS へのトランスパイル機能を利用します Go のシンタックスのみで HTML とスタイルとイベントハンドリングを記述 HTML 記述ツリーをコンポーネントとして定義する支援機能 コンポーネントツリーを初期レンダリングする機能 仮想 DOM のようにコンポーネント
こんにちは、エンジニアの@sota1235です。 タイトルの通り、今回は愚直に改善をした話をします。 メルカリのJavaScript メルカリにおけるJavaScriptの活用場面は以下のようなものがあります。 メルカリWeb アプリ内Webview 社内ツール React Native Node.js製のbotやGoogle App Scripts etc… いずれもサービスにとって重要なものであり、サーバサイドエンジニアであってもJavaScriptに触る機会は少なくありません。 かくいう私も普段はサーバサイドエンジニアですが、JavaScriptコードを書いたりレビューする場面が多くあります。 そんな中でWebチームにおいて、JavaScript開発でいくつか問題がありました。 課題その1: JavaScriptのレビューコスト問題 1つ目の課題としてJavaScriptのコードをレ
どうも、まさとらん(@0310lan)です! 今回は、人工知能を活用した高度な画像解析を、簡単なJavaScriptコードで実現できるWebサービスをご紹介します! 画像に写っている「顔」を認識させて、その人物の「感情」を読み取ったり、顔の座標データを取得するようなことが簡単にできるのでオススメです。 【 Kairos 】 ■「Kairos」の使い方! それでは、実際に「Kairos」を使いながら、どのような画像解析ができるのかを見ていきましょう! まず最初に、以下のリンクからユーザー登録を済ませておきます。 【 ユーザー登録ページ|Kairos 】 メルアドやパスワードなどを登録するだけで、誰でも利用可能です。(登録したメルアドにリンクが送られてくるので、それをクリックしてログインします) ログインしたら、自分専用の「ダッシュボード」が表示されます。 画面下に、「App ID」と「Key
さいです。 JavaScript と Electron でPC向けの弾幕シューティングゲームを作っています。 C++ と違って JavaScript はGarbage Collection (以降GCと呼称)がある言語なので、 ゲームプレイ中に不定期にGCが発生して、ゲームのパフォーマンスが悪化することがあります。 Object pooling を使って、GCの回数は減らす努力はしているのですが、 それでも(恐らく)GCの発生によって、古いPC等では露骨に画面が止まることが あるので、Electron上で GCのタイミングを調整したいなぁと思いました。 Electron は Chromium ベースのプラットフォームであり、 Chromium は v8 エンジンを使用しています。 v8 エンジンのGCは Mark-Sweep 方式でのGCです。 v8 エンジンが自分で判断して行うGCを止め
こんにちは。マーケティングプロダクト開発部の長田です。 この記事では、私が現在進めているプロジェクトで、Webpackerを使ったJavaScriptのモジュール管理を導入したので、それについて紹介したいと思います。 Webpackerとは Webpackerとは、Webpackを用いてRails上でJavaScript開発をするために必要な一連の流れを提供してくれる、Rails organizationで開発されているgemです。 これまで、Rails上でJavaScriptのパッケージをどのように管理するか、また、モジュール依存をどのように解決するかについて、多くの選択肢があり、それらをどう組み合わせて使うのかについて悩まされてきました。 このブログでも過去に何度か記事が投稿されており、その中でも複数の選択肢が上げられています。 webpackを使った Rails上でのReact開発
今日、Twitterで@netwillnetさんと@chiastoliteさんのツイートをみてやってみた @netwillnet time_ago_in_wordsすかね— Hiroyuki Morita (@chiastolite) 2014, 11月 17 Railsではtime_ago_in_wordsヘルパーが用意されています でも、この子はリアルタイムで更新されない(当たり前 クライアントサイドで、リアルタイムに経過時間をとってきたいですよね? jQueryプラグインにtimeagoってのがあります これを使ってみましょう jsファイルを... ダウンロードせずにgemを探します rails-timeago - GitHubを使ってみましょう 使い方はとっても簡単♪ # Gemfile gem 'rails-timeago', '~> 2.0' # app/assets/java
「Angularの資料で何か良いものは?」と聞かれることが多くなってきましたので、そしてAngular資料探しの手間を省くためにも、いつも使っているサイトリンクをまとめます。良い資料があったらこのブログを更新します。読む目安が欲しいというお話がありましたので「★」を付けます。「★」の付いてないものは必要に応じて目を通すと良いのではと思います(あくまでも目安です)。 ★ : まず読みましょう ★★ : 少し慣れたら読もう ★★★ :仕事で使うよ 学習順は YEOMANでAngularをインストールし触りながら Angular本家を見つつ Angular Style GuideやNinjaで理解を深める でしょうか(学び方は人それぞれですので)。何れにしても手を動かすのが最良です。 Angular 2 Angular is a development platform for building
JSファイルの結合と圧縮を自動化したくて色々調べていたのですが、やはりGruntが一番便利だということで導入してみたました。 結論からいうと、もっと早く導入すればよかった。 Gruntの導入 導入部分は下記を参考に。 Windowsの場合 http://webdrawer.net/javascript/firstgrunt.html Macの場合 http://catcher-in-the-tech.net/461/ Gruntfile.js を記述 module.exports = function(grunt) { grunt.initConfig({ //Sassをビルド sass: { options: { style: 'compressed',//CSSのスタイル sourcemap: true,//ソースマップを書き出す noCache: true//キャッシュファイルを生成
ちょっとnode.jsでAPIサーバ作ろうとして express4に上げたらいろいろと使い方が変わっていたので 備忘録的に書いておきます。 expressでのプロジェクトの作り方 ここを見ながらやるのが確実。 https://www.npmjs.org/package/express express3の場合 express3までは $ npm install -g express # グローバルにexpressコマンド入れて $ express appName # expressコマンドでひな形作成 .. $ node app.js # アプリケーション起動 こんな感じでexpressプロジェクトを作れましたが、 express4から結構変更されています。 express4の場合 express4ではひな形を作るコマンドが本体から分離されました。 またアプリケーションの起動方法も変更されて
あまりにも世情にうといので作った。 NHKのRSSを定期的にチェックして、新着ニュースの動画を連続自動再生する。 とてもテレビっぽい。おかげで4日後にオリンピックが開催されるという事を知れた。 ソースコード https://github.com/shokai/nhk-news-app zipでダウンロード https://github.com/shokai/nhk-news-app/releases node-webkitはネイティブアプリ作成のためにwebkitが改造されたwebブラウザで、HTML/JavaScript/CSSが実行できるだけでなくnode.jsのAPIもそのまま呼び出せる。 つまりjQueryでDOM操作すると同時にnodeのライブラリを使うような処理が、同じプログラムファイルにまとめて書ける。変にブリッジを書く事なくいつものnodeのように require(‘モジュ
Refactoring your JavaScript code with Grasp | Grasp - JavaScript structural search, replace, and refactor という記事では、Grasp を使ったJavaScriptコードのリファクタリングについて書かれています。 この記事は Refactoring your JavaScript code with Grasp | Grasp - JavaScript structural search, replace, and refactor の簡単な紹介です Grasp は JavaScript ASTを元にgrepのような検索、sedのような置換などを行えるコマンドラインツールです。 GraspはNodeで(実際にはLiveScriptで)書かれているツールで npm 経由でインストールできま
複数人で AngularJS を利用した Web アプリケーションを構築するときに必要なルールをまとめてみました。 ( あくまで策定中のルールであり、今後も改変する可能性があります。また、ベストプラクティスを謳うものではありません ) 使用 AngularJS のバージョン angular.js 1.2.5 angular-route.js 1.2.5 参考サイト Dan Wahlin's Blog | Structuring AngularJS Code http://weblogs.asp.net/dwahlin/archive/2013/12/01/structuring-angularjs-code.aspx GitHub | mgechev / angularjs-style-guide / README-ja-jp.md https://github.com/mgechev/a
どれも使ったことがない なんかいろいろなところでもう使うのが当たり前的な雰囲気なんですけど まだ、JQueryでよいかな~って思っていたのでそのままにしていたけどそろそろ重い腰を上げてみる いろいろ考えてみて とりあえず以下の機能を調査することにする JQueryとの連携 Ajaxのリクエスト DOM制御 複数のDOMを同時に使用可能? フォームをまたがってSubmit可能? 要はJQueryでいままでやっていたことをどこまでできるか? JQueryはマニュアルが豊富なのですぐに検索ででてくるけどangularjsはマニュアルが英語しかないのでちょっと調査に手間取りそう ちょっと簡単に調査したもの 基本 <!DOCType html> <html lang="ja"> <head> <meta charset="utf-8" /> <title>AngularJS Sample01</ti
Web Application の validation はどのレイヤーでかけるべきか 数年前にも同じことかいた気がするけど、最近の状況にあわせてかいてみる。 途中で面倒になってきて説明が雑になっている点をご容赦ください。 言いたいことは「結局、昔はサーバサイドで懇切丁寧なエラーメッセージを出すためにModelではなくControllerでバリデーションに関する知識が必要だったけど 今はJavaScriptでやるから不要だよね111」ってことです。 この表題は、よく話題にあがるところなのだが、理想論としては Model, Controller, Client side のいずれにおいてもきっちりと validation を行うことがのぞましい。 しかし、実際にはなかなか面倒である。ということで、どこをはぶくかというと Controller における Validation であろう。 ユーザ
FriesはHTML/JavaScriptを使ってAndroidモックアップアプリを開発できるソフトウェアです。 Androidの普及はiOSを抜き去り、アプリもどんどん増えています。そんな中にあって必要になるのが素早くAndroidアプリを作る技術です。今回はWebブラウザを使ってモックアプリを作っていけるFriesを紹介します。 デモです。左側にAndroid端末のモックが出ています。 シンプルなタイトルを表示した例。 メニューを追加した例。 メニューアイコンをタップするとメニューが表示されます。 タブ。 ボタン。 リスト。 複数行のリスト。 iScrollにも対応しています。 Friesを使って作法に則って進めるとAndroid 4.0系のUI風モックアップアプリが簡単に作成できます。簡易的に作成できるなら、どんどん試して色々な機能を試すことができます。さらにPhoneGapなどでラ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く