進捗1/28

ディクテーション(Step.1, 2@リスニング)は、2月11日までに完了予定。
これが終わったら、TOEIC L&Rテスト 文法問題 でる1000問を3月中に終わらせる。
これと平行してスタディサプリと語彙力強化を頑張る。
4月の受験申し込んでおこうかしら。

■リスニング: 400(AsIs) => 425点(目標)
ターゲット: Part2の得点力強化
Step.1: TOEIC L&R TEST パート1・2特急II 出る問難問 200【進捗率: 95%】
⇒ ディクテーションによる耳の強化中(ドリル1~5のディクテーション完了)
Step.2: TOEIC L&R TEST パート1・2特急 難化対策ドリル【進捗率: 90%】
⇒ ディクテーションによる耳の強化中
Step.3: スタディサプリ(TOEICコース)
⇒ 粛々と消化中

■リーディング: 325(AsIs) => 350点(目標)
ターゲット: 語彙力の強化
Step.1: TOEIC L&Rテスト 文法問題 でる1000問
Step.2: TOEIC L & R TEST 出る単特急 金のフレーズ (TOEIC TEST 特急シリーズ)
⇒ 本日本を買った。

ディクテーションはじめました

今週は風邪ひいてあまり進捗は良くない。
スタディサプリやってディクテーションの重要性に気付かされた。
聞けてるつもりを解消しない限り耳が良くならない気がするので、
特急系参考書2冊のディクテーションを始めた。
一発で全問正解するまで繰り返す。
下記が終わったらもう一度力試しでTOEIC受験しようかしら。
780点は超えたいな~

ちび助がお昼寝から目覚めた。今から買い物してご飯作るべ。


■リスニング: 400(AsIs) => 425点(目標)
ターゲット: Part2の得点力強化
Step.1: TOEIC L&R TEST パート1・2特急 難化対策ドリル【進捗率: 90%】
⇒ ディクテーションによる耳の強化中
Step.2: TOEIC L&R TEST パート1・2特急II 出る問難問 200【進捗率: 90%】
⇒ ディクテーションによる耳の強化中

Step.3: スタディサプリ(TOEICコース)
⇒ 粛々と消化中

■リーディング: 325(AsIs) => 350点(目標)
ターゲット: 語彙力の強化
Step.1: TOEIC L & R TEST 出る単特急 金のフレーズ (TOEIC TEST 特急シリーズ)
⇒ 本日本を買った。

TOEIC800点へのストラテジ(スタディサプリはじめました)

スタディサプリ申し込んじゃった♪
現在の進捗↓
Part2を集中して練習してきたが、特急系参考書2冊を
取り敢えず殆ど消化し、あとは家事の間に復習して、音を覚えていく感じにする。
かなり手応えはあるが、まだまだ初聴で落とすこともありそうなので、
この2冊に関しては完璧に仕上げるべし。
座学は基本スタディサプリにシフトしていく。
Part2の特急系2冊を完璧にしてから、金のフレーズに手をつける予定。

■リスニング: 400(AsIs) => 425点(目標)
ターゲット: Part2の得点力強化
Step.1: TOEIC L&R TEST パート1・2特急 難化対策ドリル【進捗率: 90%】
Step.2: TOEIC L&R TEST パート1・2特急II 出る問難問 200【進捗率: 90%】
Step.3: イングリッシュ・ドクターのTOEIC L&R テスト最強の根本対策【進捗率: 0%】
Step.3: スタディサプリ(TOEICコース)

■リーディング: 325(AsIs) => 350点(目標)
ターゲット: 語彙力の強化
Step.1: TOEIC L & R TEST 出る単特急 金のフレーズ (TOEIC TEST 特急シリーズ)

TOEIC800点への進捗と方針転換

下記の通り進捗している。
仕事が忙しく少しサボり気味ではあるが、概ね順調。
最近、スタディサプリTOEIC対策コースが気になる。
自分の学習習慣(すき間時間勉強 & ランニング勉強)と癖(勉強に限っては紙媒体が結構嫌い)
に凄く合っているような気がして本気で申し込んでしまおうかしらと検討中。

■リスニング: 400(AsIs) => 425点(目標)
ターゲット: Part2の得点力強化
Step.1: TOEIC L&R TEST パート1・2特急 難化対策ドリル【進捗率: 90%】
Step.2: TOEIC L&R TEST パート1・2特急II 出る問難問 200【進捗率: 60%】
Step.3: イングリッシュ・ドクターのTOEIC L&R テスト最強の根本対策【進捗率: 0%】
Step.3: スタディサプリ(TOEICコース)?

■リーディング: 325(AsIs) => 350点(目標)
ターゲット: 語彙力の強化
Step.1: TOEIC L & R TEST 出る単特急 金のフレーズ (TOEIC TEST 特急シリーズ)

TOEIC800点突破へのストラテジー

地震で目が覚めたので、深夜の執筆。
覚悟決めて、これからお仕事もする。

12月に受けたTOEICの結果が返ってきた。
結果は725点で無事700点突破!!

とはいえ、この程度じゃ何の箔もつかないので、
4月の試験で750点突破を目標にストラテジーを再考してみた。
本当は、スコアの低い、文法・読解もガシガシやりたいところだが、
あくまでも、今年度の目標はリスニング力強化で、"普通に聞ける"ように
なることがターゲット。
ブレない、本質を見失わない、スコアだけを追い求めない。

■リスニング: 400(AsIs) => 425点(目標)
ターゲット: Part2の得点力強化
Step.1: TOEIC L&R TEST パート1・2特急 難化対策ドリル【進捗率: 85%】
Step.2: TOEIC L&R TEST パート1・2特急II 出る問難問 200【進捗率: 0%】
Step.3: イングリッシュ・ドクターのTOEIC L&R テスト最強の根本対策【進捗率: 0%】

■リーディング: 325(AsIs) => 350点(目標)
ターゲット: 語彙力の強化
Step.1: TOEIC L & R TEST 出る単特急 金のフレーズ (TOEIC TEST 特急シリーズ)

TOEIC点数アップのためのすとらてじー

10月、11月に受けたTOEIC、共に680点。。。
12月の結果はまだだが、700は超えていると期待したい。
ハッキリ言って初級レベルから脱せないのだが、
足を引っ張ってるのは以外にもPart 2が解けないことだと思う。
そこで、3月までにPart 2で満点を叩きだすためのストラテジーを考えた。
短い文を確実に聞けるようになるのが目標。

■Step.1: 既存の教材聞きまくり作戦
「新TOEIC TEST パート1・2 特急難化対策ドリル」のシャドウイング
TOEIC(R)テスト超速トレーニング」のシャドウイング
TOEIC(R) L & R テスト 究極のゼミ Part 2 & 1」のシャドウイング

■Step.2: 実践フェーズ
リスニング特化模試系問題集数冊

■Step.3: 語彙力向上
TOEIC L & R TEST 出る単特急 金のフレーズ」

React.js で作る"Hello React" からのToDoアプリを作成する~その2: ToDoアプリ完成~

前回の記事で取りあえずは"Hello World!!"が表示された。これをベースにToDo アプリを作っていく。hirahiro56.hatenablog.com

下記のようなアプリイメージのものを開発していく。

f:id:hirahiro56:20150516135323j:plain


【Step.1】index.htmlの作成
まずは、index.htmlを準備する。これはHello World の時と何にも変わらない。

<html>
  <head>
  </head>
  <body>
    <div id="app-container"></div>
    <script src="dist/app.js"></script>
  </body>
</html>

【Step.2】TodoListコンポーネントの作成
アプリのルートとなるTodoListコンポーネントを作成する。このコンポーネントは全てのコンポーネントの親玉となるもので、このアプリにおいて状態を監視するべきデータである「残タスク一覧」(実体はオブジェクトのコレクション)を管理する。React.js では状態を管理する必要のあるデータ、つまり、更新されると画面を再描画する必要がるものは全て親玉(ルート)のコンポーネントで管理するように設計する。このような管理するべきデータをstete と呼ぶ。
コードは下記のようになり、app.js として保存する。

var React = require('react');
var Todo = require('./todo');
var InputApp = require('./inputapp');

var generateId = (
	function(){
		var id = 10;
		return function(){
			return (id++);
		}
	}
)();

var TodoList = React.createClass({
 //todos(ToDoリスト)を初期化
  getInitialState() {
    return {
      todos: [
        {id:1, text:"Sample1"},
        {id:2, text:"Sample2"},
        {id:3, text:"Sample3"}
      ]
    };
  },
  //引数のidに一致するデータをtodosから削除
  deleteTodo(id) {
    this.setState({
      todos: this.state.todos.filter((todo) => {
        return todo.id !== id;
      })
    });
  },
  //引数のToDoをToDoリスト(todos)にアペンドする。
  updateToDoList:function(todo){
    var tmptodos = this.state.todos.concat(todo);
    this.setState({todos: tmptodos});
  },
  render() {
    //ToDoリストのデータをMarkdown形式で書き換える。
    var todos = this.state.todos.map((todo) => {
      return <li key={todo.id}><Todo onDelete={this.deleteTodo} todo={todo} /></li>;
    });
    return (
      <div>
        <InputApp onSave={this.updateToDoList} id={generateId()} />
        <ul>{todos}</ul>
      </div>
    );
  }
});

React.render(
  <TodoList />, document.getElementById('app-container')
);

上記コードから、このコンポーネントは、Todo, およびInputAppという子コンポーネントを包括していることが分かると思う。
次のステップで、これらのコンポーネントを実装していくことになる。

【Step.3】InputAppコンポーネントの実装
InputAppコンポーネントの役割は下記2つとなる。
1.フォームの表示
2.フォームの内容(INPUT)を todos に追加する(ToDoリストに追加する)

ソースファイルをinputapp.js とし、下記の通り実装する。

var React = require('react');

var InputApp = React.createClass({
  _onKeyDown:function(e){
    if(e.keyCode === 13){
      var todo = {
        id: '',
        text: ''
      };
      todo.text = e.target.value;
      todo.id = this.props.id;
      this.props.onSave(todo);
      //this.props.onSave(e.target.value);
      e.target.value="";
    }
  },
  render: function(){
      return (
        <div>
          <h2>Input your ToDo</h2>
          <input type="text" onKeyDown={this._onKeyDown} />
        </div>
      );
  }
});

module.exports = InputApp;

【Step.4】ToDoコンポーネントの実装
ToDoコンポーネントの役割としては、下記2つとなる。
1.登録されたToDoの内容を表示する
2.delete ボタン押下時にToDoリスト(todos)から要素を削除する

todo.js として下記の通り実装するが、
削除処理について、実体は親コンポーネント(ToDoList)のdeleteTodoメソッドとなる。つまり、ToDoコンポーネントではToDoリスト(todos)の内容を更新するようなことはせず、親コンポーネントに処理を委譲する(呼び出し & 引数を与える)だけである。React.jsではアプリケーションの状態、所謂state(ToDoリストのtodos[])の管理は親玉(ルート)のコンポーネントに一括で請け負ってもらい、子コンポーネントはstateを持たないように設計することが定石となる。

var React = require('react');

var Todo = React.createClass({
  propTypes: {
    todo: React.PropTypes.shape({
      id: React.PropTypes.number.isRequired,
      text: React.PropTypes.string.isRequired
    }),
    // 削除するための処理をI/Fとして定義
    onDelete: React.PropTypes.func.isRequired
  },
  // 親に処理を委譲する
  _onDelete() {
    this.props.onDelete(this.props.todo.id);
  },
  render() {
    return (
      <div>
        <span>{this.props.todo.text}</span>
        <button onClick={this._onDelete}>delete</button>
      </div>
    );
  }
});

module.exports = Todo;

【Step.5】ビルド
最後にbrowserify/reactifyでビルドを実行するが、本ソースはES6, 7のシンタックスを利用しているため、reactifyのharmony オプションをつけてビルドする。

browserify -t [reactify --harmony ]  src/app.js -o dist/app.js
npm start

上記コマンド実行したら下記URLにアクセスして、ToDoアプリの挙動を確認できる。

http://localhost:8080/