はてなブックマーク

巷でFirebaseが流行ってるようなのでReactアプリFirebaseを使う方法をまとめました。15分もあればFirestoreを使うReactアプリをFirebase Hostingをデプロイできるでしょう。 Firebaseにはたくさんの機能がありますが、次の二つを使います。 Firebase Hosting: SPAなど静的ファイルをデプロイできるサービス Reactアプリをデプロイする先です。 Firebase Cloud Firestore: ドキュメントDBのサービス Reactアプリから呼び出します。 Firebaseのプロジェクト作成 まずは、FirebaseのWebサイトでプロジェクトを作ります。 Firebaseにサインアップします。Googleアカウントがあればすぐ登録できます。 プロジェクトを新規作成します。 Firebase CLIのセットアップ SPAをFi

4/30 公開 5/1 増補改訂: 大幅加筆しました。 この記事では、2018年以降に実現可能になったモダンなPythonプロジェクトのはじめかたを整理して紹介します。 PythonにもPipenvという公式推奨の高機能なパッケージマネージャーが登場し、さらに2018年に入ってからの機能向上で、npmやyarnのような開発体験が得られるようになってきました。 私はここしばらくはフロントエンドやNode.jsに携わっていて、npmやyarnに慣れきっていたせいか、pipenv導入以前はvirtualenvやpipを組み合わせた開発が面倒で仕方なかったですが、Pipenv導入によって一変しました。 これからはPythonのプロジェクトがよりクリーンかつ簡単にはじめられるようになり、開発体験も向上するでしょう。 それでは、まずはPythonのインストールからです。 Pythonのインストール P

Pete Huntとテンプレートエンジン Pete's Tech Blog (by archive.org) Pete Huntはblogを持っていました。その名も「Pete's tech blog」。直球です。Pete Huntがblogに初投稿したのはPythonエンジニアだった2010年3月23日。今から7年以上も前のことです。次のようなタイトルでした。 "なぜ私はほとんどのテンプレートエンジンを好きではないか" Why I don’t like most templating engines, 2010年3月23日 初投稿から攻めたタイトルです。大まかな主張は次のようなものです。 Pete Huntの主張 モダンなフレームワークはテンプレートエンジンがベース テンプレートエンジンはMVCのひとつの実装例で、MVCは関心の分離のひとつの実装例 しかしVにCが入るテンプレートエンジンは

実装 以下のようなフロントエンドアプリを実装してみます。エラー処理や詳細は割愛します。また、Hello World的なものはCloudia.jsのTutorialをみた方が手っ取り早いです。 フロントエンドアプリがSNSの認証認可APIからOAuthのアクセストークンを取得する。(略) フロントエンドアプリがアクセストークンを付与してAWS API Gatewayにリクエストを投げる。(略) AWS API GatewayがSNSの認証認可APIを用いてアクセストークンを検証する。 AWS API GatewayがFaaSの関数を呼び出す。 AWS Lambdaの関数がAWS DynamoDBのテーブルからデータを取得してフロントに返す。 1. カスタム認証の作成 1. カスタム認証用のLambda関数を作成します。 authorizer.jsを作成します。Access Token検証AP

この記事ではReactとFluxのアーキテクチャの概要と、実際にReactとFluxを使ってアプリを開発する方法を簡単に説明します。特にFluxにフォーカスしています。 併せて、ReactとFluxを使ったアプリを簡単に作れるようにするstarter-react-fluxというツールもnpmに公開しました。使い方はこちらです。これを使えば、React + Flux + Babel + Webpack + ESlint + Prettier + Jest他ポピュラーなライブラリで構成されるPWAをすぐに生成できます。また、JavaScriptだけでなくTypeScriptにも対応しています。この記事は入門編なのでJavaScriptで説明しています。 Fluxとは Facebookが提唱したUIを持ったアプリを作るためのアーキテクチャです。アーキテクチャを実現するための同名のライブラリもあり

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

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

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

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

はじめに UITableViewなどにネットワーク上の画像を表示する場合には、ユーザの操作をブロックしないように画像を非同期で読み込むのが普通だと思います。 筆者はSwiftではhttp系のライブラリとしてAlamofireを使っていますが、同じ作者がObjective-Cで書いたAFNetworkingとは異なり画像の非同期読み込みをまだサポートしていません。参考 Swiftで書く場合はライブラリもSwift製にしたいと思いますので、ここではiOS標準のNSURLConnectionを使って画像の非同期読み込みを記述してみます。 画像の非同期読み込み let url = NSURL(string:"http://画像のURL") let req = NSURLRequest(URL:url!) NSURLConnection.sendAsynchronousRequest(req, qu

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

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

iOS8から、WKWebViewというWebKitをベースとしたWebビューを使うことができるようになりました。ここではSwiftでWKWebViewと新たに増えた監視可能(KVO compliant)なプロパティを使ってみます。 WKWebViewの用意 WKWebViewは現時点ではコードを使って実装します。UIWebViewとは異なりXcodeのInterface Builderから配置することは今の所できません。 var webView:WKWebView? override func loadView() { self.webView = WKWebView() self.view = self.webView! } override func viewDidLoad() { super.viewDidLoad() let requestURL = NSURL(string: "

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

この記事は、Node.js Advent Calendar 2014 - Qiitaの19日目です。 はじめに 最近はWebAudio APIによってJavaScriptで簡単にオーディオアプリが作れるようになりましたが、最終的なアプリ配布を考えるといろいろと面倒です。 複数ブラウザやブラウザバージョンの差異吸収が面倒(開発者サイド) 一時期のdeprecatedなAPI大量発生前後のような現象 prefix付きのAudioContext()に対応しないといけない場合がある 同じAudioContextでもブラウザによって挙動が異なる アプリの実行が面倒(利用者サイド) このような場合に、node.jsとChromiumベースのデスクトップアプリ用フレームワークAtom-Shellを使うと、以下なようなメリットがあって楽でした。 環境が固定できて複数ブラウザに対応しなくていいので楽 Aud