元保育士アラサー女のぐんぐんストーリー🐻‍❄️ITエンジニアになるまでの道のり😤

IT知識ゼロ、パソコン苦手な元保育士が、独学でエンジニアになるまでの日々を投稿します😊

JavaScript学習🌸〜APIとfetchAPI編〜PostmanでAPIのテスト

 

一昨日と昨日でAPIを中心に勉強をしました😌

 

 

私なりに簡単にまとめてみます✨

 

 

API  

クライアントとサーバーの仲介役。

ソフトウェア同士がやり取りするための、プログラミングで使うルールやコマンドの集まり。

APIを使うことで、ソフトウェアを組み合わせて新しい機能を実現することができる。

 

用途:

データを取得・送信したり、他のプログラムと連携するために使われる。

 

例:

お店のWebサイトでは、天気予報を表示する機能を実現したい時に、

天気予報を提供するAPIを利用することで、天気予報のデータを取得し、Webサイトに表示することができる。

APIを利用することで、お店のWebサイトに天気予報の機能を追加することができる。

 

 

fetchAPI

JavaScriptでHTTPリクエストを送信するためのAPI

WebブラウザがWebサーバーにデータを送信するための方法。

 

使い方:

“fetch()"・メソッドを使ってウェブの情報を取ってくる。

 

特徴:

データが取れるまで待ってくれる優れもの。

例:JavaScriptを使ってWebブラウザからデータを取ってくるための機能

 

 

APIのGetとPostの違い

get :

情報を取得するときに使う

使い方 :

データはURLに入力をする

例 :

ウェブページや写真を見る時、お店の商品を見る時にGETを使う

 

Post :

新しいデータの作成や更新 (何かを追加したり変更したりする)

使い方 : 

フォームに名前やメッセージなどのデータを書いて送る

例 : 

オンラインでゲームのハイスコアを送ったり、コメントを書いたりする時にPOSTを使う

 

 

YouTubeやUdemyの講座でAPIの概念を理解したところで、実際にPostmanを使ってAPIでテストをします‼︎

 

 

できれば講座通りにスムーズにいきたいところでしたが、そんな簡単にうまくはいかず...

 

 

Postmanの使い方を習得するのに3時間程かかってしまいました😅

 

 

時間かかり過ぎた...

 

 

ターミナルを使い、Javascriptでコードを打ち、Postmanでテストをするとここでエラー💦

 

 

レスポンスデータが返ってこず、講師のコードを確認しましたがJavaScriptのコードを見ても打ち間違いはなく、Chat GPTに聞いても確認した箇所は問題がなかったため原因が分からず全く進められませんでした😭

 

 

パスタさんに連絡を取り私のパソコンを遠隔操作をして頂いたところ、すぐに解決😶

 

 

原因は、サーバーが起動していなかったというだけでした😅

 

 

JavaScriptで機能を追加・修正をしたら node app.js  を打たないと追加したコードが反映されないため毎回サーバーを再起動しないといけなかったようです😅

 

 

 

 

これを解決するのにまた3時間かかってしまいました😱

 

 

ですがこれも勉強です💡笑

 

 

同じことを繰り返さないよう今回のエラーはしっかりログを記録します😉

 

 

約2日かかってしまいましたが、APIのテストをできました😆

 

 

 

 

今日もAPIを中心に勉強✨

 

 

Node.jsでAPIを使って天気予報アプリを作ります!!