Ruby,Golang,ES2015比較チートシート - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
MRN - Material React Native API Document
A Material Design style React Native component library. Getting Started http://mrn.js.org/manual/installation.html#getting-started You can visit http://mrn.js.org to look at the document. Platform Android :support Android 4.1+ (API 16+) iOS : Don't have a plan for now Demo MaterialReactNative Github:https://github.com/binggg/MaterialReactNative Download APK Screenshots License This project is lice
Riot はミニマルで Web Components のような UI ライブラリ - Qiita
古典的な構成のサービスを AWS Lambda + S3 で動作するサーバーレスアーキテクチャで再構築し、そのフロントエンドに Riot を採用しました。 プロジェクトは WWD JAPAN.com として公開しています。 React や Angular などに代表される JavaScript の UI ライブラリのうち、Riot はミニマルな API と HTML 標準に近い文法を採用しているのが特徴です。 Riot はコンポーネントベースの UI 開発から複雑さを取り除き、楽しさを与えます。 TL;DR Riot はこれまでの UI ライブラリと比べて以下の点で異なります。 必要最小限の API 少ないボイラープレート Web Components ( HTML Template ) に似た文法 React のコードと比較してみます。 ToDo アプリケーションを React で書くと
関数型プログラミングはまず考え方から理解しよう
※仕様の細かいツッコミはご勘弁を…。 オブジェクト指向で解く みんな大好きオブジェクト指向では、物単位で考えます。言わずもがなですね。やり方はいろいろあると思いますが、まずお弁当という単位で集めると 唐揚げお弁当クラス 状態 主食名 唐揚げ個数 値段 … 振る舞い： つまみ食い() 値段取得() 唐揚げ個数取得() … のような感じで、弁当に必要な要素と必用な処理をひとまとまりにして扱うというのがオブジェクト指向です。 お弁当スーパークラスを作って継承で唐揚げ弁当クラスを、というように拡張を考えた設計にするというのも汎用性が必要な場合は良いと思います。 では早速コードにしてみましょう。 言語はJavaScriptにしています。 (function(){ window.onload=function(){ ////////////////// // クラスの定義 // ///////////
エンジニアが海外転職する際にプラスになるコーディング面接の対策サイト - Qiita
英語を使って海外のエンジニア職に転職しようとする際に避けては通れないのが技術面談。もし海外のエンジニア職への挑戦をお考えの方でそれが初めての場合、この技術面談の対策は十分にとっておいた方がいい。 きっと思っているよりも実際にやるとその難しさを実感するパターンがこの技術面談。たまにYouTubeに技術面談をシミュレーションしている様子のビデオが上がっているが、なんか嘘くさいし、そんなビデオを横から見ても一体ナニをどうすればいいのか対策の立てようがない。 だいたいこの技術面談でその応募者の相手をするのは現役バリバリのエンジニアだ。日本のように転職面接に人事の人が出てくることはまずない。エンジニアの技術レベルを測れるのはエンジニアだけ、という当たり前な理由なんだけど。とにかく現役のエンジニアがこれでもか、というぐらいにあなたの真の実力を読み取ろうとしてくる。 技術面談で出される問題は大きく分けて
ウェブフロントエンドのパフォーマンス改善のひとつの日常 - kitak blog
ひとつの日常 この間、仕事でちょっとしたハイブリッドアプリ(ネイティブアプリのWebViewの上で動くWebアプリ、とここでは定義しておく)をリリースした。 そのアプリにはタブがあって、(当たり前だが)タブでコンテンツが切り替わる。 リリースして3日くらい経って、企画の人から「なんか、ここのタブ、反応悪くない？」という話が来た。たしかにタブに触れても、すぐには反応しなくて1~2秒経ってからタブが切り替わる。しかも、切り替えたタブのコンテンツが表示されるのにも1~2秒かかっている、うへー... 改善するぞ！ ということは、クライアントの開発をおこなっていると、ちょくちょくあるのではなかろうか。意識、あるいは無意識におこなっている改善の手順について、先の問題の改善に至るまでの具体的は話、ツールも含めながら書く。 計測する 「計測するまでは速度のための調整をしてはならない」という有名な格言がある
JavaScript(ES2015)でvarやletを使う必要はほぼ無い - id:anatooのブログ
ES2015でvarやletを使う場面はほとんど無いので、まずconstを使う。constだとダメな場合にはletを使う。 背景 ES2015では、変数を宣言するための文法としてconstとletが導入された。 const foo = 'foo'; let bar = 'bar'; constは再代入できない変数を宣言できる。letは再代入できる変数を宣言できる。 const foo = 'foo'; foo = 'hoge'; // ERROR let bar = 'bar'; bar = 'hoge'; // OK あれ、じゃあvarとletは同じなの？っていうとそうではなく、letやconstはvarとは違って、関数スコープよりも細かなブロック単位のスコープを提供する。例えばconstやletを使うと、if文やfor文などのブロック中でのみ有効な変数を宣言できる。 で、プロジェクトに
JavaScriptユーザのための関数型プログラミング(後編) | POSTD
この記事の前編はこちら： JavaScriptユーザのための関数型プログラミング(前編) 遅延評価 遅延評価 は、 サンク や ジェネレータ などのもっと具体的な概念をカバーする一般的な用語の一種です。遅延評価は、その言葉が表すとおりのことを行います。つまり、値が必要になるまで評価しません。可能な限りずるずると、先延ばしにします。例えば、洗わなければならない食器が大量に、もしかすると無限にあるとします。食器を全て流しに置いて一度に洗うのではなく、ゆっくり、一度に1つずつ取って洗うのに似ています。 遅延評価の本質を少しでも理解しやすくするために、Haskellを使って説明したいと思います。まず、 プログラムがどのように評価を行うか を理解する必要があります。皆さんが慣れているほとんど全ての言語は、 最内簡約 を用いています。最内簡約とは、次のようなものです。
あのライブラリは何故誕生したの?のまとめ - Qiita
はじめに 最近、フロントエンドのライブラリ乱立問題について盛り上がってました。 自分はnobkzさんの以下の文に全てがまとまっていると思います。 僕の最初の違和感は、「技術的な流行り」に乗ることに何の価値があるのだろうか?ということである。もちろん、最新のツールやフレームワークはより何かが良くなってるかもしれない。しかし、 それをあなたのプロジェクトで採用するには何の価値があるだろうか? 「最近のフロントエンドへの違和感 - nobkzのブログ」より 裏を返せば、新しいライブラリの内容、特に「どのような問題を解決するためにこのライブラリが生まれたのか」という思想を把握しておくことは重要だと言えます。 つまりは、 "How?(ライブラリの使い方)" よりも "Why?(なぜそのライブラリが必要なのか)" を学んでおこう ということです。この記事では どのような既存の問題・要求を どう解決して
webpackでbabel際はnode_modulesをexcludeし忘れるべからず - Qiita
コンパイル早いし複数のJSエントリーポイント設定するのも簡単だしということで1年ぐらい前からwebpack使ってます。 なのに簡単なところでつまずいてしまったので恥を忍んで一筆。 結論から述べるとタイトルが全てです。 webpackとbabel-loaderでES2015のコードを扱う場合、node_modules をexcludeしないと正常に動作するJSにコンパイルされないのでブラウザで読み込んだときにエラーが出てしまいます。 現象再現できる環境を以下のリポジトリに用意しました。 暇な人興味のある方はお試しあれ。 https://github.com/haribote/do-not-miss-excluding-node-modules 正しい設定 正常に動作するJSにコンパイルさせるための設定は以下の通りです。 何のことはなくて、JS（およびそれに準ずる）ファイルのローダー設定に e
Gentallela - プログラマでも美しく管理画面を作成できるBootstrapテーマ | ソフトアンテナ
「Gentellela」はBootstrap 3を使った無料の管理画面用テンプレートです。デフォルトスタイルのBootstrap 3をベースとして多数のパワフルなjQueryプラグインやツールを組み込んだもので、美しい管理用パネルやダッシュボードを簡単に作成することができます。 テーマにはチャートや、カレンダー、フォーム検証ライブラリ、ウィザードスタイルのインターフェイス、ナビゲーションメニュー、テキストフォーム、スライダー、プログレスバー、通知メニューなどたくさんの有用なライブラリが組み込まれています。 今回はオンライン上で確認できるデモサイトを元に、どのような画面が実現できるのかスクリーンショットとともに紹介したいと思います。 ダッシュボード ▲ダッシュボードのデモでは多様なチャートが表示できることが確認できます。テーマはレスポンシブ対応で画面サイズに応じて適切に描画されます。 フォー
タスクランナーを使わずにnpm+webpackのみでWebアプリ開発 - Qiita
はじめに タスクランナーを使わずにnpm+webpackのみでWebアプリを開発するためのシードプロジェクトを作成しました． フロントエンド開発のツールが多く煩雑なので，できるだけシンプルにしたいというのがモチベーションです． テストまわりは未対応で，順次追加していく予定です． [2015/9/7] 画像ファイル（png, jpg）をビルドできるようにしました． シードプロジェクトの内容 ソース https://github.com/nihsuy/webapp-seed-project プロジェクト構成 ├── src : ソースファイル │ ├── index.html │ ├── images │ │ └── logo.png │ ├── scripts │ │ └── app.js │ └── styles │ └── app.scss ├── packa
僕なりのフロントエンド開発環境2016年版 - Qiita
ちょっとバージョンアップ http://qiita.com/koh110/items/f6ecbdc03093675a9527 自分なりに使いやすいフロントエンドの開発環境を整えて使っていたけれど、だんだん時代の流れにそぐわない箇所が出てきたのでその部分を書き換えてアップデートしてみた。 http://qiita.com/koh110/items/9c750fb67e40481e52cd 昔のバージョンはv1.0.0というブランチに切り出し https://github.com/koh110/minjsapp やめたもの gulp-load-plugins run-sequence bower モジュールやライブラリへの依存度を下げたかった 変更したもの gulp-babel -> webpack + babel-loader requireしたかった 追加したもの sassコンパル 生c
webpack入門 - Qiita
React初学者のためのガイドで著者のPete Hunt氏がオススメしていたwebpack入門を和訳しました。 意訳が含まれるため、誤りやより良い表現などがあればご指摘頂けると助かります。 原文：https://github.com/petehunt/webpack-howto Webpack入門 このガイドの目的 これはwebpackで物事を成し遂げるためのクックブックです。インスタグラムで実際に使用されているものをほぼ網羅した実践的な内容となっています。 私からのアドバイス：まずはこれをwebpackの参考資料として手元に置いて始めてみましょう。公式ドキュメントは理解を深めるために後で参照することにしましょう。 前提条件 browserify、RequireJSまたは類似したものを知っていること 下記のいずれかに価値を見出していること バンドルの分割 非同期ローディング 画像やCSSの
webpack(v1)とbabelでES6コードをさくっと書く - getalog
最低限のコストで最近よく聞くいい感じのjsを書きたい時の構成をずらーっと書いてみる 準備するもの node/npm (最近はrbenvクローンのnodenvがいい感じ、操作は同じ) webpack babel .babelrc .babelrcを設置しとくとbabelのデフォルト設定がこいつの中身で書き換わる Reactを使わないなら、presetのreactはいらない export defaultされたパッケージをimportした時に.defaultで引くのを許せるなら、add-module-exportsはいらない(後述) Reactいる { "presets": [ "es2015", "stage-0", "react" ], "plugins": [ "add-module-exports" ] } いらない { "presets": [ "es2015", "stage-0"
ES2015(ES6)新構文：アロー関数(Arrow function)｜もっこりJavaScript｜ANALOGIC（アナロジック）
アロー関数とは 基本構文 通常の無名関数との違い thisの扱いに注意 jQueryでコールバック関数としてアロー関数を使う場合 アロー関数で即時関数 まとめ 参考リンク アロー関数とは ES2015の新構文の一つ「アロー関数」とは、無名関数の省略記法です。無名関数ではない、いわゆる「関数宣言」には使うことができません。また、後述しますが無名関数とアロー関数とは完全に等価というわけではないため、取り扱いにはいくつかの注意が必要です。 //従来の関数式 var fn = function (x) {/* 関数本体 */}; //上記の関数式の無名関数部分（右辺）をアロー関数に置き換えたものが以下です。 var fn = (x) => {/* 関数本体 */}; //次の様な「関数宣言」をアロー関数に置き換えることは出来ません。 function fn(x) {/* 関数本体 */} 基本構文
t-hiroyoshi-blog
eval: それぞれのモジュールはevalとして実行され//@ sourceURLが付けられます source-map: SourceMapを完全に別ファイルとして生成します。output.sourceMapFilenameで設定が可能です hidden-source-map: source-mapと同様SourceMapを別ファイルとして生成しますがバンドルに参照コメントを含みません inline-source-map: SourceMapはDataUrlとしてバンドルされます eval-source-map: それぞれのモジュールはevalとして実行され、SourceMapはDataUrlとしてevalに追加されます cheap-source-map: SourceMapは列を無視して生成されます。loaderで読み込まれたSourceMapは無視されます。 cheap-module-
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
PHP+JavaScriptでクロスオリジンなシングルサインオン認証 - Qiita
https://gist.github.com/Phoenixmatrix/c1f552d5ed919def5994.js
connpass - エンジニアをつなぐIT勉強会支援プラットフォーム
