サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
ノーベル賞
jsstudy.hatenablog.com
Vue.jsの学習メモ。 分かりやすい解説記事がありました! gihyo.jp 入門書 「JavaScript フレームワーク入門」の第4章「Vue.js」を読み終えました。 この本の説明とサンプルコードは、Vue.jsのバージョン1だったので、最新のバージョン2で動かすとたまにエラーが出ます。 バージョン2で動くようにコードを修正してみましたが、ブログにまとめるのは時間がかかり面倒なので、とりあえず次へ進みたいと思います。 公式サイト Vue.jsの公式ガイドを読み終えました。 過不足なく説明されているかんじですが、実際の使い方について、いまいち分かりづらかった?です。 まとめ 入門書と公式サイトの隙間を埋める情報として、サンプルコードがたくさんある説明記事があったので助かりました。 「Vue.js入門 ―最速で作るシンプルなWebアプリケーション」を読んで、Vue.jsの使い方について
Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-1-1 JavaScriptにおけるMVC(MVVM) MVCパターン MVVMパターン MVCとMVVMの違い データバインディングとは? まとめ 4-1-1 JavaScriptにおけるMVC(MVVM) JavaScriptフレームワークの「Vue.js」は、MVCパターンの派生であるMVVMパターンで設計されています。 まず最初に、 MVCパターン MVVMパターン という用語の意味を確認しましょう。 MVCパターン (p.114) 昨今、大規模なアプリケーション開発で多用されるようになっているのが「MVCフレームワーク」と呼ばれるものです。 これはアプリケーションのプログラムを 「Model(モデル)」 「View(ビュー)」 「
JavaScriptの学習メモ。 今日は「開眼!JavaScript」の第2章を読んでみます。 jsstudy.hatenablog.com 2.9 ホストオブジェクト ネイティブオブジェクト ホストオブジェクト グローバルオブジェクト windowオブジェクトのプロパティを列挙 window.documentオブジェクトのプロパティを列挙 Node.jsのホストオブジェクト JavaScriptのグローバルオブジェクトを調べる方法 ホスト環境とは? 「ホスト」の意味 ホストオブジェクトは外部ライブラリー? いろいろなホストオブジェクト まとめ 2.9 ホストオブジェクト JavaScriptのオブジェクトについて、 ネイティブオブジェクト ホストオブジェクト グローバルオブジェクト という用語が出てきます。 (p.47) WebブラウザなどのJavaScript実行環境は「ホストオブジェ
JavaScriptの学習メモ。 今日は「開眼!JavaScript」の第1章を読んでみます。 jsstudy.hatenablog.com 1.1 オブジェクトの生成 オブジェクトとは何か? オブジェクトの初期化方法 オブジェクトにプロパティを追加 オブジェクトにメソッドを追加 Stringオブジェクトの生成 コンストラクタ関数とは? コンストラクタ関数の作り方 自作コンストラクタ関数の使いどころ JavaScriptの特徴 まとめ 1.1 オブジェクトの生成 (p.1) JavaScriptの世界では、オブジェクトが王様です。 この世界では、ほぼすべてがオブジェクトそのものか、もしくはオブジェクトのようにふるまいます。 オブジェクトを理解すると、きっとJavaScriptを理解できることでしょう。 まずはJavaScriptのオブジェクト生成方法を調べてみましょう。 オブジェクトは、名
プログラマーのスキル向上について、「SOFT SKILLS」という興味深い本がありました。 SOFT SKILLS ソフトウェア開発者の人生マニュアル 作者: ジョン・ソンメズ 出版社/メーカー: 日経BP社 発売日: 2016/06/02 メディア: Kindle版 この商品を含むブログを見る ec.nikkeibp.co.jp 本書の中で、jQuery作者のジョン・レシグ氏のエピソードが紹介されていました。 (p.248) 第45章 習慣を作る:コードを磨こう 私たちは繰り返し行っていることによって表現される。だから、優秀だというのは、行動ではなく習慣である。 ―アリストテレス (p.252) 新しい習慣を生み出す 古い習慣を変えることに加えて、自分がやりたいことのために新たな習慣を生み出すこともしたい。前章では、ルーチンを持つことの重要性について話したが、ルーチンをやり続けるように仕
JavaScriptの学習で、「開眼! JavaScript」という本を読んでみます。 jsstudy.hatenablog.com 学習のポイント 学習のポイント この本は、わりと薄くてページ数が少ないので、読むだけなら2~3日で読めます。 この本の内容は、「付録A レビュー」にまとめられています。 なので、先にこの部分を見て、何が学習のポイントか?押さえておきたいです。 (p.163) 付録A レビュー 本書を読んだ結果、あなたが学んでいるはずのポイントを次に列挙しています。 それぞれのポイントを読んで、わからないポイントがあれば、解説しているそれぞれのトピックに戻ってください。 (1) オブジェクトは、名前を与えられたプロパティとその値によって構成される。 (2) JavaScriptでは、ほぼすべてがオブジェクトのようにふるまう。 オブジェクトはもちろん、プリミティブ値もオブジェク
JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第5章を読んでみます。 jsstudy.hatenablog.com 5.2 プルダウンメニューで指定ページへ サンプルコード 実行結果 querySelectorメソッド 書式:CSSセレクタで要素を取得する querySelectorメソッドの使用例 CSSセレクターとは? DOMとは? HTMLタグのブール属性の変更 ブール属性とは? プルダウンメニューでonchangeイベントが発生するタイミング 別ページのジャンプ 書式:URLを書き換える(新しいURLを指定する) まとめ 5.2 プルダウンメニューで指定ページへ (p.200) 別のページに移動するためにURLを書き換えること。 HTMLの操作で、フォーム関連のタグでよく使われるブール属性の設定や、id属性のないHTML要素を取得する
「RxJS」(Reactive Extensions for JavaScript)に関するメモ。(随時更新予定) RxJSは、JavaScriptで「関数型リアクティブプログラミング」(FRP, functional reactive programming)を行うためのライブラリーです。 情報源 検索 公式サイト ネットの記事 2017年 2016年 2015年 2014年 2010年 書籍 考察 情報源 「RxJS」に関するGoogle検索、公式サイト、ネットの記事、書籍などのまとめ。 検索 RxJS - Google 検索 公式サイト ReactiveX RxJS API Document GitHub - Reactive-Extensions/RxJS: The Reactive Extensions for JavaScript ネットの記事 2017年 (2017/02/1
JavaScript学習で、「DOM」という用語がよく出てきます。 DOMについてまとめておきます。(メモ) DOMとは? APIとは? DOMツリーとは? DOMツリーのノード DOMの操作 DOMを操作するためのライブラリー JavaScriptでDOM操作 jQueryでDOM操作 MVCフレームワークでDOM操作 Virtual DOM(仮想DOM)の登場 DOMリファレンス まとめ DOMとは? DOM - Google 検索 DOM(ドム)は、「Document Object Model」の略です。 JavaScriptを使って、ブラウザーのDOMを操作すると、HTMLを書き換えることができます。 ↑こっちのドムではありませんw Document Object Model - Wikipedia Document Object Model (DOM) は、HTML文書やXML文
「システム開発を行うIT企業が、残業をやめたら売上がアップした」というお話がありました。 nzmoyasystem.hatenablog.com プログラマーの皆さん、そして経営者の皆さん、もう残業はやめましょう! 長時間労働に苦しむ経営者&社畜必読の一冊! 残業をゼロにしたら、売上が増えた 残業をゼロにしたら、優秀な人材が集まってくる もはや残業をゼロにしない理由がない 成果 = 時間 × 密度 スピードは最強の武器 バックキャスティング 重要性の高い仕事を先にやる プログラマーは残業よりも副業をすべき!? 副業禁止の規定をクリアする方法 オープンソースに貢献 プロボノで社会貢献 やりがい搾取に注意!? まとめ 長時間労働に苦しむ経営者&社畜必読の一冊! 完全残業ゼロのIT企業になったら何が起きたか 作者: 米村歩,上原梓 出版社/メーカー: プチ・レトル 発売日: 2017/04/25
JavaScriptの学習メモ。 今日は「関数型プログラミングの基礎 JavaScriptを使って学ぶ」の第1章を読んでみます。 jsstudy.hatenablog.com 「ラムダ式」という記法(書き方)の発明 数学者、アロンゾ・チャーチ Alonzo Church ラムダ式 無名関数 関数宣言の問題点 関数定義と関数適用を分ける書き方 まとめ 「ラムダ式」という記法(書き方)の発明 (p.15) 数学者、アロンゾ・チャーチ Alonzo Church チューリング機械が発表されたほぼ同時期に、アメリカの数学者であるアロンゾ・チャーチは、全く別のアプローチで「計算」を定義しました。 それは「λ(ラムダ)計算」と呼ばれる数学の理論です。 アロンゾ・チャーチ - Wikipedia アロンゾ・チャーチ(Alonzo Church, 1903年6月14日 - 1995年8月11日)はアメリカ
JavaScriptを学習してWebサイトを作れるようになったら、公開用のWebサーバーが欲しくなります。 Webサーバーは、どうやって用意したら良いでしょうか? テストサーバー 仮想環境 レンタルサーバー 「マネージド」と「アンマネージド」の違い 無料サーバー XREA Heroku Google App Engine 無料サーバーまとめ 有料サーバー サーバー管理者権限の有無を確認 VALUE-DOMAIN さくらインターネット Amazon Web Services AWSの対抗馬 ベンダーロックイン対策 オンプレミスサーバー サーバーの用意 回線の用意 固定IPアドレスの用意 変動IPアドレスの場合 ダイナミックDNS VPN ルーターの用意 YAMAHA CISCO SSL証明書 無料のSSL 有料のSSL 独自のSSL CDN 無料のCDN 有料のCDN Webサーバー構築例
JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第4章を読んでみます。 jsstudy.hatenablog.com 4.2 Dateオブジェクト サンプルコード その1 実行結果 その1 サンプルコード その2 実行結果 その2 Dateオブジェクト Dateオブジェクトは初期化する必要がある 初期化とは? new演算子とは? コンストラクタ関数とは? Dateオブジェクトの使い方 オブジェクトには初期化するものとしないものがある まとめ 4.2 Dateオブジェクト (p.160) この実習ではDateオブジェクトという、日時の取得・設定・計算をするオブジェクトを使用します。 今回は取得した日時を加工して、見慣れている12時間表記にしましょう。 Dateオブジェクトの利用方法と、取得したデータの加工がポイントです。 サンプルコード その1
JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第4章を読んでみます。 jsstudy.hatenablog.com 4.1 フォームの入力内容を取得する サンプルコード 実行結果 イベントとは? 書式:要素にイベントを設定する イベントが発生する場所 イベントハンドラーとは? 基本動作のキャンセル フォームの入力内容を読み取る 書式:入力内容を読み取る まとめ 4.1 フォームの入力内容を取得する (p.150) 入力内容の取得とイベント これまでの実習では、HTMLページが読み込まれた瞬間に、自動的に処理が開始されるプログラムを書いてきました。 今回のサンプルでは、「イベント」を利用してプログラムが動作するタイミングを制御します。 [検索]と書かれたボタンがクリックされたら、テキストフィールドに入力されている内容を読み取って、それをHTML
JavaScriptを練習するときブラウザーで実行していました。 JavaScript(JS)のコードは、Visual Studio Code(VSCode)で書いています。 VSCode上でJSを実行して、動作確認する方法がありました。(メモ) 前提(準備) Windowsパソコンの用意 Node.jsの用意 Visual Studio Codeの用意 Visual Studio Codeのデバッガー Node.jsの設定 ステップ実行 用語 まとめ 前提(準備) 今作業している環境は以下のとおりです。 Windows7(32ビット版) Node.js (バージョン 0.12.0) Visual Studio Code (バージョン 1.11.2) を使っています。 Windowsパソコンの用意 予算あり(多) → ThinkPad X1 Carbon 16GBモデルがイイかな? 予算あ
プログラマーが新しいアプリやサービスを販売するとき、どんなふうにして収益化すれば良いでしょうか? キャッシュポイント(収入源)の設定 広告 他社の広告 自社の広告 物販 他社のショッピングサービス 自社のショッピングサービス 商品の形 ●電子書籍の販売(マンガ、小説など) ●写真の販売(フォトストックサービス) ●音楽の販売 ●オーディオブックの販売(音声データ) ●動画の販売 ●教材の販売 課金 その他 マイクロペイメント ストックビジネス ビジネスモデル・キャンバス ステップアップの順番 経営学 まとめ 以前、事業の3要素(企画、技術、営業)について検討してみました。 jsstudy.hatenablog.com 今回は、この中の「営業」の部分について、収益化の仕組みを掘り下げてみます。 キャッシュポイント(収入源)の設定 商品やサービスを利用するお客さんは、いつお金を支払うでしょうか
プログラマーが新しいアプリやサービスを作るとき、どんなふうにしてアイデアを出せば良いでしょうか? アイデアの源 快楽原則 自分が欲しいもの 他人が欲しいもの タイムマシン商法 未来から引き出す 未来を先取りする想像力 未来は予想するものではなく創造するもの アイデアを形にする 実現可能性 feasibility デザインスプリント アイデア発想方法のカタログ まとめ 前回は、事業の3要素(企画、技術、営業)について検討してみました。 jsstudy.hatenablog.com 今回は、この中の「企画」の部分について、掘り下げてみます。 アイデアの源 「必要は発明の母」(Necessity is the mother of invention.)ということわざがあります。 「何が必要か?」という問いかけから、アイデアを得る旅が始まります。 → 答はいつどこで見つかるか分からないので、忘れな
JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。 jsstudy.hatenablog.com 3.9 算術演算子 FizzBuzzとは? サンプルコード 実行結果 算術演算子 剰余演算子 % 冪乗演算子 ** まとめ 3.9 算術演算子 (p.119) FizzBuzzというゲームをプログラムで実現してみましょう。 これまでも +、-、*と、計算のための記号をあまり詳しく説明せずに使ってきましたが、この実習でも新たに割り算の余りを算出する%記号を使います。 FizzBuzzとは? FizzBuzzとは、何人か組になって、「1」「2」と順番に数字を言っていき、3で割り切れる数字のときは「Fizz!」、5で割り切れるときは「Buzz!」、3でも5でも割り切れるときは「FizzBuzz!」と叫ぶゲームです。 Fizz Buzz
JavaScript学習のついでに、TypeScriptも学んでみます。 今日は、TypeScriptの「総称型」という機能について調べてみました。 オンラインのTypeScript実行環境 総称型とは? 総称型の仕組み 型引数とは? 型の情報(種類)を入れておく変数 用語 総称型と多重定義の違い (1)似た機能の関数がバラバラに用意されている状態 (2)引数を使って似た機能をまとめた関数 (3)引数のデータ型が違うけど、機能が似ている関数 (4)「Any型」で全部の型を引き受けられる関数 (5)オーバーロードで型チェックを実現した関数 オーバーロード(多重定義)とは? シグネチャーとは? (6)オーバーロードした関数を総称型で1つにまとめる 総称型の使いどころ 総称型(ジェネリック)の特徴 リファクタリングとは? まとめ オマケ オンラインのTypeScript実行環境 ブラウザー上で、
JavaScriptの学習メモ。 今日は「関数型プログラミングの基礎 JavaScriptを使って学ぶ」の第9章を読んでみます。 jsstudy.hatenablog.com Mochaテストフレームワークを使う Mochaとは? Node.jsの設定 フォルダの移動 Mochaのインストール gulpのインストール Mochaの動作確認 Mochaのパス設定(batファイルで代用) Gulpの動作確認 Gulpのパス設定(batファイルで代用) npmはWindowsのパスを書き換えない? npmとは? gulpとは? Mochaテストフレームワークを使う (p.320) 本書はMochaというテストフレームワークを使用しています。 Mochaは振舞い駆動型のテストフレームワークであり、Node.jsでの単体テストを自動化します。 Mochaとは? 「Mocha 使い方」で検索すると、い
WindowsにNode.jsをインストールするとき、Node.jsのバージョン管理ツールとして「nodist」を使ってみました。 「nvm」(Node Version Manager)というツールもあるので、nvmの使い方も調べてみました。 nodistの使い方 nvmとは? nvmw nvm-windows nvm-windowsのインストール nvm-windowsインストーラーのダウンロード nvm-windowsのインストール nvm-windowsの動作確認 再インストール nvmでNode.jsをインストール nvmのコマンド Node.js 32ビット版を指定する方法 まとめ nodistの使い方 nodistによるNode.jsのバージョン管理は、こちらを参照してください。 jsstudy.hatenablog.com nvmとは? Windows ではじめてみる Nod
JavaScriptの学習メモ。 今日は「関数型プログラミングの基礎 JavaScriptを使って学ぶ」の第9章を読んでみます。 jsstudy.hatenablog.com Git for Windowsをインストールする Git for Windowsのダウンロード Git for Windowsのインストール Git for Winowsを起動する GitHubリポジトリのクローン カレントディレクトリを「functionaljs」に移動する Gitとは? GitHubとは? Git for Windowsをインストールする 本書で紹介されているサンプルコードがGitHubで配布されているので、まずはGitを操作するツールを用意します。 (p.319) Windowsの場合には、Git for WindowsというGitリポジトリを操作するプログラムをインストールしておきます。 Gi
プログラミング学習をやっていると、英語は避けて通れない道ですね? プログラミング言語は、ほとんどアルファベット(英語)でコードを記述 プログラミングの用語は、ほとんど英語由来の単語 参考資料の原典は、ほとんど英語(コンピューターは欧米が発祥のため?) プログラミングの世界に一歩足を踏み込むと英語の嵐なので、英語の理解はプログラミング学習の一助となります。 プログラミングで困らない程度に英語をマスターする方法を検討してみました。 日本人プログラマーの英語は下手でもOK ブロークン・イングリッシュから始めよう! 読む→書く→聞く→話す、の順番で攻略 英語学習情報 英語教材 英文法 英単語 英会話 スラッシュリーディングとは? スラッシュリーディング教材の自作 ENGLISH JOURNAL SIMスーパースピーキング SIM式の紹介書籍 オンライン英語講座 Skype 英語の思考法 言語学の知
勉強で使う本(教科書、参考書、専門書)を検討するときに、目次情報の提供は役に立たないという意見がありました。 皆さんは勉強で本を読むとき、どんな選び方をしていますか? 本の目次情報の価値 目次は判断材料 索引は利便性に直結 最初は薄い本、次に厚い本 解釈学的循環の解消 何度も使う辞書類は手元に置く パラシュート学習法 同じ項目を比較する 正誤表(誤植)を確認する 著者のSNS 翻訳本は原書も読んでみる 目次の確認が不要な本 本を読んだ後のフォロー 著作権法とフェアユース(公正利用) ブログのバイラルマーケティング 本の目次情報の価値 関数型プログラミングの基礎 JavaScriptを使って学ぶ 【目次】 - JavaScript勉強会 こういう本の目次を丸写しして、それ以外に大した感想とか書かない奴は、絶滅してほしいのだ、はいいすぎか。でも著作権とか気にしてほしいものだ 2017/04/1
JavaScriptの学習メモ。 今日は「関数型プログラミングの基礎 JavaScriptを使って学ぶ」の第9章を読んでみます。 jsstudy.hatenablog.com WindowsにNode.jsをインストールする Windows用Node.jsバージョン管理ツール「nodist」 nodistのダウンロード 手動でnodistコマンドのパスを設定 Node.jsのインストール Windowsでnvmを使う方法 WindowsにNode.jsをインストールする Windows7でNode.jsを使うので、Windowsの場合の説明を参考にしてみます。 (p.316) WindowsにNode.jsをインストールするには、公式サイトの https://nodejs.org/en/download/releases/ から該当するバージョンのインストーラをダウンロードします。 本書で
JavaScriptの学習で面白そうな本がありました! 「関数型プログラミングの基礎 JavaScriptを使って学ぶ」という本です。 この本を参考にして関数型プログラミングのやり方に親しんでみたいと思います。 関数型プログラミングの基礎 JavaScriptを使って学ぶ 作者: 立川察理,長瀬嘉秀 出版社/メーカー: リックテレコム 発売日: 2016/10/29 メディア: 単行本(ソフトカバー) この商品を含むブログを見る 目次 第Ⅰ部 関数型プログラミングの基礎 第1章 「計算」とは 第2章 なぜ関数型プログラミングが重要か 第Ⅱ部 JavaScriptによる関数型プログラミングの実践 第3章 心の準備 第4章 データの種類と特徴 第5章 プログラムをコントロールする仕組み 第6章 関数を利用する 第7章 高階関数を活用する 第8章 関数型言語を作る 第Ⅲ部 付録 第9章 Java
JavaScript学習に役立つお話がありました。 「プロトタイピング」でプログラムを試作する練習について紹介されています。 www.webprofessional.jp (前回に引き続き、今回もこのお話から学んでみたいと思います。) jsstudy.hatenablog.com アプリ作成の進め方として、以下の手順が紹介されています。 最初に基本を身に着けよう 計画を立てる コード無しで書いていく 小さな部分に分けて製作する 各パーツを結合する 実験とテスト 外部の助けを求める コードのリファクタリング(再構築) 試行錯誤の重要性 現実には、プロジェクトは完璧なコードをガンガン書くことではなく、たくさんの試行錯誤とリファレンスを幾度も参照して少しずつできあがるものなのです。 実験とテスト この段階ですでに、たくさんの実験とテストを繰り返して動作確認をしてきました。 きちんと動作するならば
JavaScript学習に役立つお話がありました。 「リファクタリング」でプログラムを改善する練習について紹介されています。 www.webprofessional.jp (前回に引き続き、今回もこのお話から学んでみたいと思います。) jsstudy.hatenablog.com アプリ作成の進め方として、以下の手順が紹介されています。 最初に基本を身に着けよう 計画を立てる コード無しで書いていく 小さな部分に分けて製作する 各パーツを結合する 実験とテスト 外部の助けを求める コードのリファクタリング(再構築) リファクタリングとは? reの意味 - 英和辞典 Weblio辞書 re‐ 【接頭辞】 「相互,反,後,退,秘; 離,去,下,再,否,不」などの意. 接頭辞の「re」は、再びという意味 factorの意味 - 英和辞典 Weblio辞書 factorとは (ある現象・結果を生ず
JavaScript学習に役立つお話がありました。 「擬似コード」でロジックを書き出す練習について紹介されています。 www.webprofessional.jp JavaScriptに限らず、プログラミングの基本を学んだら何か動くモノ(プライベートプロジェクト)を作ってみたくなります。でも実際にどうやって進めたらいいのでしょうか? 現実には、プロジェクトは完璧なコードをガンガン書くことではなく、たくさんの試行錯誤とリファレンスを幾度も参照して少しずつできあがるものなのです。 アプリ作成の進め方として、以下の手順が紹介されています。 最初に基本を身に着けよう 計画を立てる コード無しで書いていく 小さな部分に分けて製作する 各パーツを結合する 実験とテスト 外部の助けを求める コードのリファクタリング(再構築) あ 擬似コードの活用 「コード無しで書いていく」って、どういうことでしょうか?
次のページ
このページを最初にブックマークしてみませんか?
『JavaScript勉強会』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く