PokePoke

使用言語：HTML， CSS， JavaScript，JQuery 作成人数：１人

ーポケモンカードー 　JSでAPIを取得して、画像、番号、名前、タイプをカードに入れ込み、裏側のポケモンカード画像とくっつけました。このカードは、CSSのhoverを使い、押したらひっくり返るというものです。backgroundカラーは、オブジェクトを使用して、タイプ別に色分けしました。ちなみに、初代の151匹でカードを作ったのですが、これは151匹分入っているAPIを使用したのではなく、JSで回数を宣言して、その分をループ文で回しているという作っているという感じです。

　ポケモンカードを触ると裏のポケモンカード情報が出てきます。カード情報はJSで取得したので、カード作成もJSでやった方が、スムーズだと思い、今回HTMLは、CSS, JS、JQueryの取り込みをメインに使用しました。 また、本当に少しだけですが、ゲーム要素もいれたかったので、デフォルトが同じポケモンカードであるということと、タイプ別に色が別れているという特徴を使って、「裏のポケモンは何か」というクイズを入れてみました。

ーポケモン図鑑ー こちらもカードと同じく初代の151匹で作りました。 カード同様に、タイプ別で色分けし、一覧で並べました。こちらは、ドットで書かれているイラストです。 　こちらのポケモンをタップすると、ポケモンの属性、タイプ、特徴が出てくるようになっています。こちらもJSでポケモンの情報を取ってきたり、要素を作って表示させているという感じです。