fringe81インターン選考課題〜3日目〜
この記事はfringe81インターン選考課題〜1日目〜の続きの記事です．
shiningcureseven.hatenablog.com
2日目は何もしなかった．
3日目は
- 環境構築の続き
- Homeページの作成
- 画面遷移
を行なった．
環境構築
これの続きを行うことからだったのでやっていった．
Xcodeでやりたくないな〜〜と思っていたらやらなくてすんだ．よかった．
atomで開発進めていけます．
シミュレーションは実機では行わずiPhone6のシミュレーターで行なった．
実機で検証するとなると，デベロッパーアカウント登録しなければならない？みたいで面倒臭い．Xcodeの勝手がわからなかったのでアカウントがどうみたいなところで苦戦していた．App.jsを編集してくださいとあるのにXcodeのファイル一覧のところにそれがなかったのでおこ．finderで見たらあったのでそれをatomで開いて開発できるようになった．
シミュレーターを立ち上げる時だけXcodeを出してこないといけない．⌘Rで差分のみ更新できるので時間かからなくてハッピー．
ハローワールド
Learn the Basics - React Native
Homeページの作成
HomeページにはログインIDとパスワードを入力するためのTextboxとログインするButtonをおいた．
スタイルシートは別の関数に書いて呼び出すことをした．
htmlタグっぽいものを返せるのがReact.jsみたいで，最初にタグをimportしてくる．
Textbox
TextboxはTextInputタグで実装できる．
Textboxの背景文字はplaceholderを指定したらできた．
下線はborderBottomWidthを指定したらできた．
今こんな感じ．
画面遷移
画面遷移はReact Navigationを使ったらできた．ページを重ねていくもの．
1ページのみの実装とは書き方がだいぶ違ったのでごそっと書き直した．
React Navigationを実装する時，package.jsonに
"react-navigation": "latest"
を記述し，$ npm installをする．latestは最新バージョン
明日以降のやっていき
- 他の画面の実装
- AsyncStorageの実装
これ参考にしたい
