今日から毎日ReactNativeを学ぶことにした(4日目)
プールに行きました。肩が痛いです。
前回
本日
File-based routing続き
ファイル間リンクは前回実装。普段DOMで慣れちゃってると<Text>や<Link>みたいなタグは少し違和感。アプリエンジニアも書きづらくてマルチプラットフォームならFlutterの方が描きやすいとアプリともwebとも少し違いがありそう。まあ慣れなのかな
app
├── (tabs)
│ ├── (home)
│ │ ├── _layout.tsx
│ │ ├── details.tsx
│ │ └── index.tsx
│ ├── _layout.tsx
│ └── settings.tsx
└── _layout.tsx
グループ化。()で括ったディレクトリ名をつけたことがないので少し違和感だが、そういうものなのかな。
![](https://assets.st-note.com/img/1722698341297-3Tv56dwyG4.png?width=1200)
下部のタブナビゲーションとExpo Routerが提供するコンポーネントとのこと
404
+not-found.tsxという特別なファイルで404ページをサポートしている。
return (
<>
<Stack.Screen options={{ title: "Oops! This screen doesn't exist." }} />
<View style={styles.container}>
<Link href="/">Go to home screen</Link>
</View>
</>
);
<></>からのタブ?のようなものでくくるのはHTMLではない仕様だね
![](https://assets.st-note.com/img/1722698773149-73dS4RnlKT.png?width=1200)
まとめ
少しずつDOMとの違いやwebシステムを作る中で使わない書き方が出てきてきた