<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: APIHiver</title>
    <description>The latest articles on DEV Community by APIHiver (@api_hiver).</description>
    <link>https://dev.to/api_hiver</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4177880%2F5ee5bf4f-93ad-482a-bb8b-9794fa6b8994.png</url>
      <title>DEV Community: APIHiver</title>
      <link>https://dev.to/api_hiver</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/api_hiver"/>
    <language>en</language>
    <item>
      <title>REST APIs explained with a restaurant (and one real request you can run)</title>
      <dc:creator>APIHiver</dc:creator>
      <pubDate>Sun, 11 Oct 2026 22:13:41 +0000</pubDate>
      <link>https://dev.to/api_hiver/rest-apis-explained-with-a-restaurant-and-one-real-request-you-can-run-cme</link>
      <guid>https://dev.to/api_hiver/rest-apis-explained-with-a-restaurant-and-one-real-request-you-can-run-cme</guid>
      <description>&lt;p&gt;If you have ever been told "just call the API" and nodded without knowing what that meant, this post is for you. No jargon, one analogy, and one real request at the end.&lt;/p&gt;

&lt;h2&gt;
  
  
  The restaurant analogy
&lt;/h2&gt;

&lt;p&gt;Think of a restaurant.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;You&lt;/strong&gt; are the app that wants something.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;The kitchen&lt;/strong&gt; is the server that has the data.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;The waiter&lt;/strong&gt; is the API.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You do not walk into the kitchen. You tell the waiter what you want, in a format the waiter understands, and the waiter brings back the dish. An API is that waiter: a fixed way for one program to ask another program for something.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;REST&lt;/strong&gt; is a popular set of rules for how that waiter behaves. REST APIs talk over the web (HTTP), so the "order" is just a web request and the "dish" is usually JSON.&lt;/p&gt;

&lt;h2&gt;
  
  
  What a request is made of
&lt;/h2&gt;

&lt;p&gt;Every request has four parts:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;A URL&lt;/strong&gt; says what you are asking for, like &lt;code&gt;https://api.example.com/users/42&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;A method&lt;/strong&gt; says what you want to do. The four you will meet most: &lt;code&gt;GET&lt;/code&gt; (read), &lt;code&gt;POST&lt;/code&gt; (create), &lt;code&gt;PUT&lt;/code&gt; or &lt;code&gt;PATCH&lt;/code&gt; (update), &lt;code&gt;DELETE&lt;/code&gt; (remove).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Headers&lt;/strong&gt; carry extra info, like your API key, which proves who you are.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;A body&lt;/strong&gt; (only for POST, PUT and PATCH) carries the data you are sending.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The reply has a &lt;strong&gt;status code&lt;/strong&gt; (&lt;code&gt;200&lt;/code&gt; means fine, &lt;code&gt;404&lt;/code&gt; means not found, &lt;code&gt;401&lt;/code&gt; means your key is missing or wrong, &lt;code&gt;429&lt;/code&gt; means you asked too often) and a &lt;strong&gt;body&lt;/strong&gt;, usually JSON.&lt;/p&gt;

&lt;h2&gt;
  
  
  What JSON looks like
&lt;/h2&gt;

&lt;p&gt;JSON is just labelled values:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"amount"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;100&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"from"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"USD"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"to"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"INR"&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Curly braces hold a thing, each label sits in quotes, and a colon connects it to its value. If you can read a form, you can read JSON.&lt;/p&gt;

&lt;h2&gt;
  
  
  Send a real request
&lt;/h2&gt;

&lt;p&gt;Here is a currency conversion call. You need a free API key from the &lt;a href="https://apihiver.com/apis/currency-exchange-rates/overview" rel="noopener noreferrer"&gt;Currency Exchange Rates API on APIHiver&lt;/a&gt;, which is a marketplace where you can try APIs in the browser first.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;curl &lt;span class="s2"&gt;"https://currency-exchange-rates.p.apihiver.com/v1/convert?amount=100&amp;amp;from=USD&amp;amp;to=INR"&lt;/span&gt; &lt;span class="se"&gt;\&lt;/span&gt;
  &lt;span class="nt"&gt;-H&lt;/span&gt; &lt;span class="s2"&gt;"X-API-Key: YOUR_API_KEY"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Reading it piece by piece:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;curl&lt;/code&gt; sends the request from your terminal.&lt;/li&gt;
&lt;li&gt;The URL says &lt;em&gt;convert&lt;/em&gt; and passes three options after the &lt;code&gt;?&lt;/code&gt;: how much, from which currency, to which currency.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;-H "X-API-Key: ..."&lt;/code&gt; is the header with your key.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The reply is JSON with the converted amount. That is a complete REST API call: URL, method (GET is the default), header, JSON back.&lt;/p&gt;

&lt;h2&gt;
  
  
  The same call in JavaScript
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nf"&gt;fetch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;https://currency-exchange-rates.p.apihiver.com/v1/convert?amount=100&amp;amp;from=USD&amp;amp;to=INR&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;headers&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;X-API-Key&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;process&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;env&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;API_KEY&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;data&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;data&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Note the key comes from an environment variable. &lt;strong&gt;Never paste a key into front-end code or a public repo.&lt;/strong&gt; Anyone can read it there and run up your bill.&lt;/p&gt;

&lt;h2&gt;
  
  
  Three mistakes beginners make
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Hard-coding keys.&lt;/strong&gt; Use environment variables and keep them server-side.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Ignoring the status code.&lt;/strong&gt; Check &lt;code&gt;res.ok&lt;/code&gt; before you trust the body.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Calling the API on every page view.&lt;/strong&gt; Cache results that rarely change. It is faster and saves your quota.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Where to go next
&lt;/h2&gt;

&lt;p&gt;I wrote a longer version of this guide with REST vs SOAP vs GraphQL, a status code table and a short quiz: &lt;a href="https://apihiver.com/blog/what-is-a-rest-api" rel="noopener noreferrer"&gt;What Is a REST API? A Beginner's Guide&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;If you have a question about a part that still feels fuzzy, ask in the comments and I will answer it.&lt;/p&gt;

</description>
      <category>api</category>
      <category>beginners</category>
      <category>webdev</category>
      <category>tutorial</category>
    </item>
  </channel>
</rss>
