開発者ドキュメント

UnsplashAPIを使用してReactで写真検索アプリを構築する方法

著者はCOVID-19救済基金を選択し、 Write forDOnationsプログラムの一環として寄付を受け取りました。

序章

StackOverflow 2020 Developer Survey によると、Reactは最も人気のあるJavaScriptフレームワークの1つであり、ウェブアプリのビューを効率的に変更するなど、多くの理由があります。 Virtual DOM を使用して、再利用可能、構成可能、ステートフルなコンポーネントを使用して、スケーラビリティなどを向上させます。 初心者のReact開発者は、実際のアプリケーションで使用するために知識を活用する経験を必要とすることがよくあります。 このチュートリアルでは、 Reactフックの使用方法、 useState()の使用方法、およびReactでAPI呼び出しを行う方法を紹介します。

この記事では、 UnsplashAPIを使用してReactで写真検索アプリケーションを構築する手順を説明します。 Unsplashは現在、最も使用され人気のある写真検索エンジンの1つであり、プロジェクトやアプリケーションを構築する際の優れたデータプロバイダーになる可能性があります。

このチュートリアルを終了すると、ReactHooksを使用してUnsplashAPIをクエリする実用的なアプリケーションができあがります。 このプロジェクトは、同じプログラミングロジックを再利用し、API呼び出しを含む他のプロジェクトを構築するためのベースとして使用できるため、定型文としても機能します。 写真検索アプリケーションには、次のように検索バーとレンダリングされた結果が含まれます。

完全なコードを確認したい場合は、 DigitalOceanCommunityGitHubリポジトリをご覧ください。

前提条件

このガイドに従うために:

モバイルバージョンを終了