読者です 読者をやめる 読者になる 読者になる

はじめてのAurelia

http://aurelia.io Aureliaとは次世代UIフレームワーク。AngularJS、Reactに比べて影が薄い。どうなっていくんだろうか?チュートリアルをやってみた感想としては、HTTPリクエストとルーティング周りがクリーンで素敵。 以下、チュートリアルの適当な和訳。 …

JavaScript初学者が1時間でNode.jsのReactLINEボタンモジュールつくった

uraway.hatenablog.com 前回と同じ要領で今度はLINEボタンのモジュールを作ってみました。 uraway/react-line-button: Simple React comp... - GitHub モジュールをまとめました。 こちらを使用してください。 uraway/react-social-sharebuttons: Simple Re... …

Isomorphic JavaScript

2013年11月の記事ですが、JavaScriptを学習し始めて数ヶ月の自分には(英語のイディオム的にも)得るものが多かったので訳しておきます。 Isomorphic JavaScript: The Future of Web Apps - Airbnb Engineering Author Spike Brehm @spikebrehm JavaScript Gro…

フロントエンド開発入門編(JavaScriptのインタラクティビティの追加)

Adding interactivity with JavaScript | Web Fundamentals - Google Developers こちらを訳しています。 JavaScriptのインタラクティビティの追加 JavaScriptを使うことでコンテンツ、スタイリング、ユーザーの操作に対する挙動といった、ページのほとんど…

快適な開発環境を目指して(4)

fluxでの開発を見据えて、gulpを使った開発環境を作ってみた。 (Gulp + Browserify + ES6 + Babelify + Watchify + Brower-sync) 前提知識 gulp ES6(ES2015) 材料 gulp...自動タスク管理ツール Browsersync...ブラウザの自動リロード browserify...依存物を…

Atomのパッケージを作る(4) spec編

参考:http://jasmine.github.io/1.3/introduction.html specs AtomではJasmiseをspecフレームワークとして使っています。必須ではありませんが、新機能にはspecをつけるべきでしょう。Atomのテストに関するフライトマニュアルを訳しながら、実際にspecを書…

CoffeeScriptを学んでみる

www.youtube.com CoffeeScriptの特徴 シンプルな記述 読みやすく理解しやすい 保守が簡単 JavaScriptにコンパイルが必要 PythonやRubyを意識した文体。インデントに注意 以下省略。 CoffeeScriptについて、まとめたものはこちらにあります。 Learnings/Coffe…

React.jsとES6でTodoListアプリを作ってみる v2.0.0

uraway.hatenablog.com前に作ったTodoListをアップデートしてみました。 主な変更はチェック機能と削除機能の追加です。入力されたvalueをTodoListのデータの一つであるtextで取得できず苦労しました。 最初からデータのtextも、valueと名付けていればこんな…

ES6版ReactでTodo Listを作ってみる

これが、See the Pen Todolist by uraway (@uraway) on CodePen.ES6版だとこうなるSee the Pen TodoApp(ES6) by uraway (@uraway) on CodePen.でも、これだと不便なので、手を加えてみよう。 次回へ続く…

Stack Overflow で英語で質問してみる

Stack Overflow とは: Stack Overflow is a question and answer site for professional and enthusiast programmers. It's built and run by you as part of the Stack Exchange network of Q&A sites. With your help, we're working together to build a…

ES6版React.jsでBMI calc を作ってみる

BMIカテゴライズ 参考: Calculate Your BMI - Metric BMI Calculator See the Pen BMI calc by uraway (@uraway) on CodePen.bmiCalc関数によって、BMI数値を計算し、stateを更新して、BMI数値をカテゴライズする。トリガーを書き忘れてて数十分詰まった。 …

ES6版React.jsでCowntdown Timerを作ってみる

See the Pen countdown timer by uraway (@uraway) on CodePen. 参考: reactjs - React.jsでFormを扱う - Qiita Forms | React タイトル通り。 class CountdownTimer extends React.Component { constructor() { super(); this.tick = this.tick.bind(this)…

ES6版React.jsでClick counterを作ってみる

tutorialが難しいので、それより簡単なClick counterをES6で作ってみた。 気をつける点は、初期値はconstructorで定めることと、コールバック関数でオブジェクトが変なところを参照している時にはbindをしてあげること See the Pen Hello World by uraway (@…

React.jsで機能付きタイマーを作ってみる

uraway.hatenablog.com 前記事でサンプルコードを見ながらタイマーを作りました。さすがに寂しいので、start,stop,reset機能のボタン(button)を自分なりに作ってみました。 ボタン参考: React Componentでthisがundefinedになる問題の解決策初心者すぎてこ…

React.jsでタイマーを作ってみる

React.jsを使って、タイマーを作ってみます。 A JavaScript library for building user interfaces | React参考: Top-Level API | React ReactのAPIを眺めてみた - Umi Uyuraのブログ reactjs - React.jsのState - Qiita JavaScript - React.jsのチュートリ…

React.jsでHello world!

そういえばやってなかったので、Hello worldしてみます。 Getting Started | React

node.jsでwebサーバーを立てるまでを理解する

node.jsを使って、webサーバーを立てるまで方法をメモしておきます。 参考: MEANスタックで始めるWebアプリ開発入門(2):いまさら聞けないNode.jsの基礎知識とnpm、Gulpのインストール (1/2) - @IT Node.js入門 (全16回) - プログラミングならドットイン…

node.jsで足りないmoduleをインストールするコマンドをインストールしてみる

参考:【Node.js】足りないモジュールをたったの一行でインストールするコマンド - QiitaReactのtutorialをやっていて、server.jsを実行しようとしたら・・・

ECMAScript6を目標を理解する

ECMAScript Language Specification ECMA-262 6th Edition – DRAFTのIntroductionには、次のようにECMAScript6の機能追加の目標が定められています。 Goals for the sixth edition include providing better support for large applications, library creati…

ECMAScript 2015を理解する-クラス定義

参考: いまからはじめるECMAScript 6 どうやってECMAScript 6を学び始めるか ES6(ECMAScript6)でのJavaScriptの書き方 | 姫路のホームページ製作屋WILDWEST-SERVICE ECMAScript 6 compatibility table Rubyist Magazine - 2015 年の JavaScript と babel の…

JavaScriptのインスタンスを理解する

参考、引用: JavaScriptでnewしてインスタンス生成 - Qiita クラスのインスタンス。 [いまさら聞けないJavaScript用語] : ずっと工事中 オブジェクト指向 JavaScript 入門 - JavaScript | MDN Google流 JavaScript におけるクラス定義の実現方法 インスタン…

Tutorial|Reactでリアルタイムコメントボックスをつくる

Tutorial | Reactを参考にして、リアルタイムコメント機能をつくってみます。翻訳しながら少しずつ進めていきます。

Node.jsを理解する

参考、引用: いまアツいJavaScript!ゼロから始めるNode.js入門〜5分で環境構築編〜 第1回 Node.jsとは:基礎から学ぶNode.js|gihyo.jp … 技術評論社 .bash_profileと.bashrcの違いは 今さら聞けない高性能エディタVim入門 | Code部 さらに詳しく: Node.j…