今回は前回までと少し趣向を変えて「一般向けサイト」のサンプルを作成してみました。今までに紹介したコンポーネントを多数使っているほか,新たなコンポーネントも使用しています。この作成したサンプルサイトを題材にして複数回にわたって,アーキテクチャやコンポーネント,Tipsなどの紹介をしていきます。 サンプルを見ていただく前にひとつ断っておかないといけないのがサンプルのデザインです。残念ながら著者はデザインに関しては素人でありセンスもありません。かなりチープなサイトになってしまっていますが,これはFlexだからではなく,著者にデザインのセンスが無いだけです。 では,実際にサンプルを見てみましょう(図1)。 図1:サンプル1(クリックすると別ウィンドウで表示します。ソースはこちら) 実はこのサンプルは,ブラウザ内全体がFlexのコンテンツというわけではありません。図2の赤枠で囲まれた領域がFlexの
![第21回 Flexでちょっと実用的なサンプル・サイトを作ってみる](https://cdn-ak-scissors.b.st-hatena.com/image/square/bed39b5962a5d552c95b6d796db8f55e72d32943/height=288;version=1;width=512/https%3A%2F%2Fxtech.nikkei.com%2Fimages%2Fn%2Fxtech%2F2020%2Fogp_nikkeixtech_hexagon.jpg%3F20220512)