JavaScript勉強会

JavaScriptの学習日記

Vue.jsでGet/Setの作成 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-3-2 Get/Setの作成 HTML CSS JavaScript 実行結果 Computedプロパティとメソッドの違い まとめ 4-3-2 Get/Setの作成 前回、Computedプロパテ…

Vue.jsのComputedプロパティ 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-3-1 Computedプロパティ Computedプロパティとは? SwiftのComputedプロパティ HTML CSS JavaScript 実行結果 まとめ 4-3-1 Computedプロパテ…

Vue.jsのフィルターを使う 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-2-8 フィルターを使う Vue.js バージョン1のフィルター HTML CSS JavaScript 実行結果 Vue.js バージョン2のフィルター HTML CSS JavaScript …

Vue.jsでJavaScript式を使う 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-2-7 JavaScript式を使う HTML CSS JavaScript 実行結果 createdフック まとめ 4-2-7 JavaScript式を使う (p.129) Mustacheタグには、dataの値…

Vue.jsでHTMLの表示 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-2-6 HTMLの表示 HTML CSS JavaScript 実行結果 まとめ 4-2-6 HTMLの表示 (p.127) ここまでは単純なテキストを表示していましたが、HTMLのコー…

Vue.jsでイべントとメソッドの利用 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-2-5 イべントとメソッドの利用 HTML CSS JavaScript 実行結果 v-on属性 まとめ 4-2-5 イべントとメソッドの利用 (p.125) テキストを入力など…

HTML側からVueに値を設定する 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-2-4 HTML側からVueに値を設定する HTML CSS JavaScript 実行結果 v-model属性 v-bind属性 ディレクティブとは? まとめ 4-2-4 HTML側からVue…

Vueオブジェクト 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-2-1 HTMLファイルを用意する HTMLファイル スタイルシート Mustacheタグ 4-2-2 スクリプトを作成する JavaScript 4-2-3 Vueオブジェクト まと…

技術評論社の連載記事「Vue.js入門 ― 最速で作るシンプルなWebアプリケーション」が分かりやすい!

Vue.jsの学習メモ。 分かりやすい解説記事がありました! gihyo.jp 入門書 「JavaScript フレームワーク入門」の第4章「Vue.js」を読み終えました。 この本の説明とサンプルコードは、Vue.jsのバージョン1だったので、最新のバージョン2で動かすとたまにエラ…

JavaScriptにおけるMVC(MVVM) 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-1-1 JavaScriptにおけるMVC(MVVM) MVCパターン MVVMパターン MVCとMVVMの違い データバインディングとは? まとめ 4-1-1 JavaScriptにおけ…

Vue.jsの基本 【JavaScript フレームワーク入門】

Vue.jsの学習メモ。 今日は「JavaScript フレームワーク入門」の第4章を読んでみます。 jsstudy.hatenablog.com 4-1 Vue.jsの基本 公式サイト 日本語ドキュメント 参考資料 Googleトレンド まとめ 4-1 Vue.jsの基本 (p.113) Vue.jsは、MVVM(Model-View-View…

ホストオブジェクト 【開眼!JavaScript】

JavaScriptの学習メモ。 今日は「開眼!JavaScript」の第2章を読んでみます。 jsstudy.hatenablog.com 2.9 ホストオブジェクト ネイティブオブジェクト ホストオブジェクト グローバルオブジェクト windowオブジェクトのプロパティを列挙 window.documentオ…

マンガでJavaScriptがわかると思っているのかお前は

JavaScriptをネタにした面白いマンガがありました。 www.comico.jp 結構話題になっていたみたいですねw nlab.itmedia.co.jp 作者の村田川さん 村田川 (@muratagawa) | Twitter mrtgw.me 村田川さんの作品 omocoro.jp www.comico.jp 「ドンジニア」(ドジな…

オブジェクトの生成 【開眼!JavaScript】

JavaScriptの学習メモ。 今日は「開眼!JavaScript」の第1章を読んでみます。 jsstudy.hatenablog.com 1.1 オブジェクトの生成 オブジェクトとは何か? オブジェクトの初期化方法 オブジェクトにプロパティを追加 オブジェクトにメソッドを追加 Stringオブジ…

毎日30分のプログラミング習慣

プログラマーのスキル向上について、「SOFT SKILLS」という興味深い本がありました。 SOFT SKILLS ソフトウェア開発者の人生マニュアル 作者: ジョン・ソンメズ 出版社/メーカー: 日経BP社 発売日: 2016/06/02 メディア: Kindle版 この商品を含むブログを見…

JavaScript関数型プログラミング 複雑性を抑える発想と実践法を学ぶ 【目次】

JavaScriptで学ぶ「関数型プログラミング」の本がありました。 「JavaScript関数型プログラミング」という本です。 本屋で立ち読みしたら、面白そうだったので買っちゃいましたw JavaScript関数型プログラミング 複雑性を抑える発想と実践法を学ぶ (impress…

「開眼! JavaScript」の学習ポイント

JavaScriptの学習で、「開眼! JavaScript」という本を読んでみます。 jsstudy.hatenablog.com 学習のポイント 学習のポイント この本は、わりと薄くてページ数が少ないので、読むだけなら2~3日で読めます。 この本の内容は、「付録A レビュー」にまとめ…

5.2 プルダウンメニューで指定ページへ 《URLの操作、ブール属性の設定》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第5章を読んでみます。 jsstudy.hatenablog.com 5.2 プルダウンメニューで指定ページへ サンプルコード 実行結果 querySelectorメソッド 書式:CSSセレクタで要素を取得する que…

RxJS メモ

「RxJS」(Reactive Extensions for JavaScript)に関するメモ。(随時更新予定) RxJSは、JavaScriptで「関数型リアクティブプログラミング」(FRP, functional reactive programming)を行うためのライブラリーです。 情報源 検索 公式サイト ネットの記事…

CSSセレクターとは?

JavaScript学習で、「CSSセレクター」という用語がたまに出てきます。 CSSセレクターについてまとめておきます。(メモ) CSS セレクターとは? CSSセレクター CSSセレクターの分類 要素セレクター(タイプセレクター) HTMLタグとHTML要素の違い CSSで要素…

DOM(Document Object Model)とは?

JavaScript学習で、「DOM」という用語がよく出てきます。 DOMについてまとめておきます。(メモ) DOMとは? APIとは? DOMツリーとは? DOMツリーのノード DOMの操作 DOMを操作するためのライブラリー JavaScriptでDOM操作 jQueryでDOM操作 MVCフレームワー…

API(Application Programming Interface)とは?

JavaScript学習で、「API」という用語がたまに出てきます。 APIについてまとめておきます。(メモ) APIとは? インターフェースとは? 人間向けと機械向けのインターフェース GUI CUI Web API JavaScript用のAPI まとめ APIとは? e-words.jp 読み方:アピ …

5.1 カウントダウンタイマー 《時間の計算とタイマー》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第5章を読んでみます。 jsstudy.hatenablog.com 5.1 時間の計算とタイマー Dateオブジェクトの日時を設定する方法 サンプルコード 実行結果 Dateオブジェクトに現在の日時を設定…

プログラマーは残業をやめよう!

「システム開発を行うIT企業が、残業をやめたら売上がアップした」というお話がありました。 nzmoyasystem.hatenablog.com プログラマーの皆さん、そして経営者の皆さん、もう残業はやめましょう! 長時間労働に苦しむ経営者&社畜必読の一冊! 残業をゼロに…

1.3 ラムダ式とは? 【関数型プログラミングの基礎】

JavaScriptの学習メモ。 今日は「関数型プログラミングの基礎 JavaScriptを使って学ぶ」の第1章を読んでみます。 jsstudy.hatenablog.com 「ラムダ式」という記法(書き方)の発明 数学者、アロンゾ・チャーチ Alonzo Church ラムダ式 無名関数 関数宣言の…

4.4 小数点第◯位で切り捨てる 《Mathオブジェクト》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第4章を読んでみます。 jsstudy.hatenablog.com 4.4 端数処理 サンプルコード 実行結果 Mathオブジェクト Mathオブジェクトは初期化しないで使う Mathオブジェクトの主なプロパ…

4.3 「0」をつけて桁数を合わせる 《数字を文字列に変換》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第4章を読んでみます。 jsstudy.hatenablog.com 4.3 型変換(キャスト) サンプルコード 実行結果 型変換(キャスト) まとめ 4.3 型変換(キャスト) (p.169) 表示させるデータ…

Webサーバーを用意する方法

JavaScriptを学習してWebサイトを作れるようになったら、公開用のWebサーバーが欲しくなります。 Webサーバーは、どうやって用意したら良いでしょうか? テストサーバー 仮想環境 レンタルサーバー 「マネージド」と「アンマネージド」の違い 無料サーバー X…

4.2 わかりやすく日時を表示する 《Dateオブジェクト》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第4章を読んでみます。 jsstudy.hatenablog.com 4.2 Dateオブジェクト サンプルコード その1 実行結果 その1 サンプルコード その2 実行結果 その2 Dateオブジェクト Dateオ…

4.1 フォームの入力内容を取得する 《入力内容の取得とイベント》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第4章を読んでみます。 jsstudy.hatenablog.com 4.1 フォームの入力内容を取得する サンプルコード 実行結果 イベントとは? 書式:要素にイベントを設定する イベントが発生す…

JavaScript学習のカリキュラム その2

以前、JavaScript学習のカリキュラムを考えてみましたが、導入部分を改善できるかも?と思いました。 当初のカリキュラム案 改善点 Visual Studio Code + Node.js 基本事項 プログラミング・パラダイムの説明 プログラムの構成要素 データ構造 制御構造 関…

WindowsでIoの実行環境を用意する方法

Io

JavaScript学習の一環として、「Io」というプログラミング言語を学んでいます。 WindowsでIoの実行環境を用意してみました。(メモ) ダウンロード インストール ホームディレクトリとは? バッチファイルの作成 libgcc_s_dw2-1.dll のコピー 動作確認 ダウ…

3.1 Ioとは 【7つの言語 7つの世界】

JavaScriptの学習で、「7つの言語 7つの世界」という本を参考にしてみます。 プロトタイプベースのプログラミング言語「Io」について学んでみます。 jsstudy.hatenablog.com 3.1 Ioとは Luaもプロトタイプ言語 Ioはコンパクト 3.1 Ioとは Ioは2002年にSteve …

Visual Studio CodeでJavaScriptをステップ実行する方法

JavaScriptを練習するときブラウザーで実行していました。 JavaScript(JS)のコードは、Visual Studio Code(VSCode)で書いています。 VSCode上でJSを実行して、動作確認する方法がありました。(メモ) 前提(準備) Windowsパソコンの用意 Node.jsの用意…

ITのビジネスモデル

プログラマーが新しいアプリやサービスを販売するとき、どんなふうにして収益化すれば良いでしょうか? キャッシュポイント(収入源)の設定 広告 他社の広告 自社の広告 物販 他社のショッピングサービス 自社のショッピングサービス 商品の形 ●電子書籍の…

アイデアの出し方

プログラマーが新しいアプリやサービスを作るとき、どんなふうにしてアイデアを出せば良いでしょうか? アイデアの源 快楽原則 自分が欲しいもの 他人が欲しいもの タイムマシン商法 未来から引き出す 未来を先取りする想像力 未来は予想するものではなく創…

事業の3要素=企画+技術+営業

プログラマーはパソコン1台あれば、アプリやサービスを開発することができます。 商品を開発して事業を運営するとき、どんなことをやれば良いのでしょうか? 事業の3要素 企画 アイデアの保護 技術 営業 プログラマー VS ラーメン屋 まとめ 事業の3要素 …

商売の3要素=商品+客+支払方法

親が商売人ではなかったので、商売を学ぶのはスタートが遅かったです。 商売の基本は、小中学校で教えたほうがいいと思います!(・∀・) 商売の3要素 スマホアプリの場合 商品は何でもアリ!? レモネードスタンドの話 商売の3要素 商売を行うには、 商品…

プログラマーの事業形態

プログラマーが商売をおこなうとき、どんなふうに仕事をすれば良いでしょうか? 事業の形態 受託開発 請負と委任の違い 納品のない受託開発 共同開発 自社開発 まとめ 事業の形態 プログラマーはスキルの向上に伴って、取り組める事業の幅も広がっていきます…

スキルアップにつながる仕事を選ぶ

プログラマーが仕事をやるとき、どんなふうに仕事を選べば良いでしょうか? 嫌いなことよりも好きなことを選ぶ、苦手なことよりも得意なことを選ぶ、とか? スキルアップにつながる仕事を選ぶ 犬の道 イシューとは? イシュー度 課題に取り組む前に、課題の…

プログラミングの目的と手段

プログラミングをやるとき、たまにブレーキがかかって、作業が停滞するときがあります。 ブレーキの原因と解決策を検討してみました。 目的と手段を混同しない やる気を生み出す目的 タスクのブレークダウン アクセルとブレーキ 目的と手段を混同しない もく…

商売の心構え~ハッカーとクラッカーの違い

プログラミングを学ぶと、できることの幅が広がっていきます。 プログラマーは、どんなふうに仕事や商売をやれば良いでしょうか? 商売とは? お金=感謝の対価 ハッカーとクラッカーの違い 商売とは? しょうばい【商売】の意味 - goo国語辞書 [名]1 利…

3.11 アイテムの価格と在庫を表示する 《オブジェクト》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。 jsstudy.hatenablog.com 3.11 オブジェクト サンプルコード 実行結果 オブジェクト 連想配列とは? JavaScriptのオブジェクトは連想配列? ドット演算子…

3.10 項目をリスト表示する 《配列》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。 jsstudy.hatenablog.com 3.10 配列 サンプルコード 実行結果 配列 JavaScriptの配列 配列の作り方 配列からデータを読み取る 配列のメソッド DOM操作 DOM…

3.9 FizzBuzz 《算術演算子》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。 jsstudy.hatenablog.com 3.9 算術演算子 FizzBuzzとは? サンプルコード 実行結果 算術演算子 剰余演算子 % 冪乗演算子 ** まとめ 3.9 算術演算子 (p.119…

3.8 税込価格を計算する 《ファンクション、関数リテラル》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。 jsstudy.hatenablog.com 3.8 ファンクション functionの意味 構文 関数の宣言 関数式 ファーストクラスファンクション リテラル JavaScriptの関数リテラ…

3.7 コンソールでモンスターを倒せ! 《繰り返し(while)、代入演算子》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。 jsstudy.hatenablog.com 3.7 繰り返し while whileの意味 構文 サンプルコード 実行結果 for文とwhile文の違い while文のカウンター 無限ループに気をつ…

作って覚えるVisual C# 2015 デスクトップアプリ入門 【目次】

JavaScript学習のついでにTypeScriptも見ていたら、ついついC#に脱線してしまいました!!! → 思わず、C#の本を衝動買いw(^^; C#は後々どこかで役に立ちそうな気もします。(Xamarin、Unityとかで使うかも?) 作って覚えるVisual C# 2015 デスクトップア…

TypeScriptの総称型(Generic Type)

JavaScript学習のついでに、TypeScriptも学んでみます。 今日は、TypeScriptの「総称型」という機能について調べてみました。 オンラインのTypeScript実行環境 総称型とは? 総称型の仕組み 型引数とは? 型の情報(種類)を入れておく変数 用語 総称型と多…

3.6 1枚、2枚、3枚…と出力する 《繰り返し(for)、インクリメント演算子、文字列連結》 【JavaScript超入門】

JavaScriptの学習メモ。 今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。 jsstudy.hatenablog.com 3.6 繰り返し for サンプルコード 実行結果 繰り返しのfor文 インクリメント(増加)とデクリメント(減少)の演算子 インクリメ…