在了解 React 的原理後,要開始設計網站結構。
從我們的 mockup 來看,主要有二個頁面,一個是相簿,一個是照片瀏覽。於是我們將結構設計成下面這樣:
<App>
<AppBar/>
<Breadcrumb/>
<Title/>
<Actions>
<Share/>
<Download/>
</Actions>
<Content>
<Albums>
<Subtitle/>
<ItemList>
<Item/>
</ItemList>
</Albums>
<Photos>
<Subtitle/>
<ItemList>
<Item/>
</ItemList>
</Photos>
</Content>
<Footer/>
<Share/>
<Download/>
<Lightbox>
<Toolbar/>
<Slides>
<Slide>
</Slides>
</Lightbox>
</App>