hiro さん プロフィール

  •  
hiroさん: Beautiful Ajax
ハンドル名hiro さん
ブログタイトルBeautiful Ajax
ブログURLhttp://beautifulajax.dip.jp
サイト紹介文OSSをフルに活かしたrアプリケーションの作成、サーバー構築についてなど
自由文jQuery/jqGrid/jQueryMobile/Sencha Touch/Backbone.js/Angular.jsなど、リッチでインタラクティブなクライアントWebアプリを構築する手法について。
また、RedHat系、Ubuntu系のサーバー構築ノウハウ等
参加カテゴリー
更新頻度(1年)情報提供10回 / 365日(平均0.2回/週) - 参加 2014/01/19 08:57

hiro さんのブログ記事

  • Vue.jsとVuexを使って、TODOアプリを作ってみよう。
  • 前回のカウンターアプリに引き続き、今回はTODOアプリを作ってみようと思います。 基本は、前回お話ししたので、今回は、前回説明してこなかった部分に注力を置いて説明します。 まだVue.jsの初心者をちょっと超えたぐらいですが・・・ まずVue.jsとVuexでアプリを組むには、アプリの全体像をイメージし、 どんな画面で、どんなイベントがあって、どんな値を保持しなければならないかをしっかりと把握する。 画面の絵なんか描くと [続きを読む]
  • Vue.jsとVuexを使って、カウンターアプリを作ってみよう。
  • Vue.js始めました。さっぱりわからなかったのですが、ようやく「いろは」は 掴めてきたので、vuexを使ってカウンターアプリを作ってみました。 storeをmoduleで分割して、中規模くらいのアプリなら対応できるような感じに仕上げてみました。 とにかく Vuexがややこしいというか、どういう構造で、どう利用するのかが難しい。 これに慣れるのが一番のキモです。 出来上がりのイメージ メチャメチャシンプルですが、こんな感じ。 + [続きを読む]
  • Ubuntu 18.04 に nginx mysql php phpmyadmin環境を整える
  • Ubuntu 18.04にnginx mysql php phpmyadminの環境を整えます。 mysqlのパスワード設定に若干苦労しましたのでその時のメモです。 nginx、mysqlインストール [crayon-5b019d1eb5b3d816422941/] nginxの起動確認 [crayon-5b019d1eb5b4c231928049/] ブラウザーで http://localhost としてnginxのトップページが表示されることを確認してください。 php、php-fpmなどなどをインストール [crayon-5b019d1eb5b53939876980/] このタイミ [続きを読む]
  • Ubuntu 18.04に Rails開発環境(mysql+git)を構築する
  • Ubuntu 18.04に Rails 5.xの開発環境を構築してみます。同時に必要となるであろう、mysql+gitもインストールしていきます。何箇所か躓きそうな場所があるので、そのあたり参照ください。 前準備 あれこれ必要そうなパッケージをインストール。結構ダウンロードされると思いますが、気にせずに・・・ [crayon-5b019d1eb6bfb526194972/] RVMインストール 従来通りのrvm のインストールでは 「この鍵は信用できる署名で証明されていま [続きを読む]
  • Webpack4 で React環境を整える
  • Webpack3で、開発するのに慣れていたんだが、知らぬ間にVer4のwebpackが出ている。 webpack4からは、コンフィグレスを目指しているみたいだけど、コンフィグも多少いるし、Ver3とは書き方がずいぶん替わっているので、軽くまとめておく。 開発フォルダ作成 [crayon-5ab7d150504a6008248910/] 開発用パッケージの導入 [crayon-5ab7d150504b2314013829/] 必要パッケージの導入 [crayon-5ab7d150504b8096995506/] package.jsonの調整 [続きを読む]
  • WindowsとUbuntu(Linux)の共存 ブートローダーが壊れた時に
  • WindowsとUbuntuを共存させていて・・・ Windowsがぶっ壊れた時、Windowsを再インストールしますよね。 WindowsはLinuxの存在無視しまくって、BootローダーをWindows専用にします。 これだと、今まで使っていたUbuntuが起動しなくて困ります。 (こんな使い方してる人は稀なのかもですが・・・) で、どうするか。 UbuntuのBootableUSBメモリを作成 別PCで、Ubuntuのインストール用のISOをダウンロードしてきて、 unetbootin/extli [続きを読む]
  • Ubuntu 16.04 Mint 18で DVDをmp4化する
  • Ubuntu16.04でLive DVDをリッピングして、タブレットで観たくなったので 調べてみました。 handbrakeというのを使えば簡単にできることがわかりましたので、 手順を書いておきます。 必要ファイル群インストール sudo apt-get install libdvdcss2 dvdbackup handbrakeインストール sudo add-apt-repository ppa:stebbins/handbrake-releases sudo apt-get update sudo apt-get install handbrake-gtk handbrake-cli 起動... [続きを読む]
  • AMD Ryzen で Genymotionを使ったReact Nativeのデバッグ環境作成
  • こんにちは。いやいや、まるまる一日使ってしまいましたよ。 React Nativeの開発を行いたくって、GenymotionでAndroidのエミュレーターを動かして デバッグする環境を作るのに四苦八苦してなんとか解決した顛末をざっくり書いておきます。 GenymotionもRyzen CPUを動かすにはLinuxしかダメみたいな 記述があったので、開発はUbuntuでしましょうね。 Ryzenがあまりに暴れ馬で、もうCore i5 Skylakeを泣く泣く使おうかと思いましたよ [続きを読む]
  • Ubuntu 16.04 で WN-AC433UM/GWー450S を認識させる
  • はじめに I-O Dataの 433Mbps 対応のUSB無線LAN WN-AC433UM(W) を購入した。 Ubuntu(Linux Mint)で使うつもりである。もちろんデフォルトでは無線LANを認識しないことは 承知の上での購入。 Ubuntu16.04 系でこの無線LANを433Mbpsの無線LANとして認識させちゃいましょうの巻。 PlanexのGW-450Sも同じ realtek 8821au or 8812auらしいので、同じ手順で行けると思います。 Ubuntu14.04系でも認識成功してますので、同じ手順でOKで [続きを読む]
  • Linux Mint(Ubuntu) で イマドキの開発しよう! 2017年夏版
  • フロントReactJS、バックエンドRailsという構成でサービス立ち上げに関わってた。 思うんだけど、Macを開発に使うのはわかるんだけど、なぜWindows使う人がいるんだろ? どうせリリースするのLinuxベースのOSなんだし、フロントはiPhoneのSafariか AndroidのChrome、まぁあとはWindowsのChrome,Firefox,IE,Edge Macはほとんど使わないんでわからないんだけど、Windowsはほんともっさり動作だよね。 これだけマシンのスペックがどん [続きを読む]
  • dockerを使って RailsとReact(node)の開発環境を構築する
  • はじめに dockerを使って、Rails(サーバーサイド)の環境を1つ、React(node)(クライアントサイド)の環境を1つ作る。 両環境ではChromeとAtomが動かせて、開発できるようになるところまでが目標です。 docker 自体触るのが初めてだったので、基本的なことから記載しておきます。 加えて初心者なので、間違えがあったらごめんなさい。 docker自体のインストールはあちこちに記載されているので、そちらを参照ください。 docker [続きを読む]
  • Webpackを使って、Sassをコンパイルする方法 2017年4月版
  • はじめに Webpackを使って、Sassをコンパイルする方法です。 Webにそれなりにやり方が載ってますが、2017年4月末現在では、動く例が少なかったので、 実際に動いた例を示しておきます。 末尾にReactなんかの開発で ES6をノーマルなJavascriptに変換するときとの合わせ技の方法も記載しておきます。 コンパイル環境構築 [crayon-5902f4ade88e3298734234/] こんな感じのフォルダツリーにsassがあると仮定します。 webpack.configの調 [続きを読む]
  • ReactでSPAを作り、Twitter認証(OAuth)でログインする。バックエンドはRails
  • はじめに ReactでSPAを作ることになって、ログイン認証にメール&パスワードの認証に加えて、 GoogleやTwitter認証も加えたくなった時、どうすればよいかわからなかった。 バックエンドはRailsだが、あくまでAPIサーバー的な立場なので メジャーなomniauth なんかは使えそうにない。。。 前回のGoogle編に続き、今回はTwitter編。 あれこれ悩みながらなんとか動くところまでたどり着いたので、やり方を公開。 React+Reduxの環境な [続きを読む]
  • ReactでSPAを作り、Google認証(OAuth)でログインする。バックエンドはRails
  • はじめに ReactでSPAを作ることになって、ログイン認証にメール&パスワードの認証に加えて、 GoogleやTwitter認証も加えたくなった時、どうすればよいかわからなかった。 バックエンドはRailsだが、あくまでAPIサーバー的な立場なので メジャーなomniauth なんかは使えそうにない。。。 あれこれ悩みながらなんとか動くところまでたどり着いたので、やり方を公開。 React+Reduxの環境なんですが、そこまで立ち入ると話がややこし [続きを読む]
  • React-Router(react-router-dom)とReduxとRailsを組み合わせる
  • はじめに React+Redux+RailsでSPAアプリを作ることになったので、あれこれ調べたのでメモです。 SPAというと、当然ですが、1つのページであれこれできちゃうものを作らなきゃいけないわけで・・・ そうなるとコンテンツ制御の仕組みが必要です。そこで登場するのがReact-Router-Dom。 で、これ単体では使い方簡単なんですが、RailsとReduxを絡めて動作させる方法が分からなかったので あれこれ調べて、なんとか動くところまでたど [続きを読む]
  • React-RouterとReduxとRailsを組み合わせる
  • はじめに React+Redux+RailsでSPAアプリを作ることになったので、あれこれ調べたのでメモです。 SPAというと、当然ですが、1つのページであれこれできちゃうものを作らなきゃいけないわけで・・・ そうなるとコンテンツ制御の仕組みが必要です。そこで登場するのがReact-Router。 で、これ単体では使い方簡単なんですが、RailsとReduxを絡めて動作させる方法が分からなかったので あれこれ調べて、なんとか動くところまでたどり着 [続きを読む]
  • React、Redux入門 公式サイトとはちょっと違う角度から
  • はじめに ここ3週間ほど死ぬほどReactとReduxやって、あれこれ分かるようになったので、これからReact+Reduxで開発を始めたい人向けに記事を書いてみます。 公式サイトの英語記事や、それを翻訳してくれているようなサイトを見てもそれなりに分かるのですが・・・ なんだかんだ言って難しい。 Reactの理解はなんとか出来ても、Reduxが特に難しい。 欲張りなんですが、とにかく両方をサーッと理解して、さっさとアプリ組みたいよと [続きを読む]
  • React、Redux入門 公式サイトとはちょっと違う角度から
  • はじめに ここ3週間ほど死ぬほどReactとReduxやって、あれこれ分かるようになったので、これからReact+Reduxで開発を始めたい人向けに記事を書いてみます。 公式サイトの英語記事や、それを翻訳してくれているようなサイトを見てもそれなりに分かるのですが・・・ なんだかんだ言って難しい。 Reactの理解はなんとか出来ても、Reduxが特に難しい。 欲張りなんですが、とにかく両方をサーッと理解して、さっさとアプリ組みたいよと [続きを読む]
  • React Native、Redux、Railsを使って、掲示板アプリを作ってみよう
  • はじめに 前回、React NativeをAndroid Studioと組み合わせてインストールし、HelloWorldを出せるところまで たどり着きました。 今回は一足飛びで、React NativeとReduxをフロントエンドに使い、バックエンドにRailsを用いた 掲示板アプリを作ってみましょう。 前提として、Railsはそれなりにわかっている。Reactもよく分かっている。Reduxも知っている。 ぐらいのレベルを前提にしています。 出来上がったアプリは、デザイン的に [続きを読む]
  • React Native、Redux、Railsを使って、掲示板アプリを作ってみよう
  • はじめに 前回、React NativeをAndroid Studioと組み合わせてインストールし、HelloWorldを出せるところまで たどり着きました。 今回は一足飛びで、React NativeとReduxをフロントエンドに使い、バックエンドにRailsを用いた 掲示板アプリを作ってみましょう。 前提として、Railsはそれなりにわかっている。Reactもよく分かっている。Reduxも知っている。 ぐらいのレベルを前提にしています。 出来上がったアプリは、デザイン的に [続きを読む]