Primeiro:プリメイロ

誰でも最初は素人だ!初めてのことをやりこむブログ。

はてなブログテーマ「Primeiro」公開!

左サイドバーのシンプルなはてなブログテーマです。 様々なカスタマイズを公開していますので導入直後からおしゃれなブログを作ることができます。

はてなブログテーマ「Primeiro」公開!

初めてのReactNativeメモ③ TODOリストを作ってみる

f:id:yumedasuke:20190308092628p:plain

今回は、プログラミングチュートリアルでよく出題されるTODOアプリを色々な記事を参考に作ってみようと思います。

todoとは

英語で“to do”
為すべきことの意を持ちます。簡単に言うと『やること』

todoアプリは『やる事リスト』の様なモノです。

iosではリマインダーというアプリがデフォルトで採用されていたりします。

突然、ビッグデータについて言い出す。

デフォルトのメモ帳アプリや有名なtodoアプリはビッグデータ収集の為に書いたデータを収集してそうで僕は使う気になりません。

ラインやツイッター、フェイスブック、最たる例はGoogleなどもパーソナルデータを収集し日夜、日々、毎秒ビッグデータを成長させています。

生きているだけで誰かの利益になるのが現代です。

そしてそのビッグデータがAIを成長させます。

現代に生きる身としては受け入れなければいけませんが僕はその事について啓蒙していきたい。(全身義体の英雄風)

急に語ってみましたが、本題に戻りましょう。

TODOアプリ作ってみる

デザインを考える。

モックアップと呼ぶらしい。

モックアップとは?

 モックアップとは、ウェブサイトやアプリのデザインで使われる方法のことです。何を制作するのかにもよりますが、デザイン業務では画面の要素や機能を固めていくプロセスが共通してあります。このときに使われるのがモックアップで、完成イメージを視覚的に表示して確認していくために使われます。
モックアップとは?基礎知識とデザインフローにおける位置づけ | CodeCampus

モックアップ作成ツール


webサービス

  • draw

www.draw.io


アプリ

  • prott

prottapp.com

今回はリハビリも兼ねてwebで作ってみました。


参考にする記事

コンポーメントを作成しそれを読み込ませる。

src > compoments > TodoInput

TodoInputをインポート

import TodoInput from './src/components/TodoInput';

TodoInputを使用する。

<TodoInput />

TodoInputの内容を表示できた!

Reactの大原則

React にはpropsというシステムがあります。当然ながらReact NativeもReactなのでpropsというシステムがあります。
このpropsというシステムでは親子関係に当たるコンポーネントにおいて親から子に値を渡すことができます。

そして、子から親へ値を渡すことはできないというルールがあります。
【React Native入門】Java Scriptでアプリ作ろう【Reactやったことない人向け】2 - Qiita

分かりやすくて助かります!

Copyright 2019 Primeiro:プリメイロ All rights reserved.