【React】PokemonAPIを使用して画像を取得する
みなさんこんにちは。
小学2年生になる息子がいるのですが、
ポケモンが大好きです。
かつ、今後のICT教育を見据え、パソコンにはどんどん触れてほしいと思い、ポケモンアプリを開発しました。アプリの詳細については過去のブログで紹介させていただいております。また、アプリの中でポケモンのBGMを流しているのですが、
そちらの再生方法、停止方法については以下で解説しております。今回はPokemon APIを使用してポケモンの画像やポケモンの名前の取得方法について解説していきたいと思います。この記事がおすすめな人
今回の記事は以下の人に特におすすめです。 ・React:初学者、初級者~中級者
・アプリを開発したい人
・手順だけを知りたい人
・コードだけを知りたい人コンポーネントを作成するテキストボックスに任意の数字を入れて、
「ポケモンを取得」ボタンをクリックするとポケモンの画像と名前を取得する仕組みを作ります。
画面構成としては以下のようなコードになります。=============================<Container maxWidth="sm">
<Box sx={{ flexGrow: 1,
bgcolor: '#f5f5f5' }}>
{/* テキスト表示領域 */}
<Grid container spacing={2}>
<Grid item xs={12} align="center">
<Typograp
0