Astro Public My Restaurant Script Link Review

Once your page is built, you need to make it public (accessible via URL). Here is how you get that “public my restaurant” link.

If you want a custom script that fetches your restaurant’s data from a CMS (like Sanity or Contentful) and displays it publicly, here is a minimal example:

Step 1 – Create an API endpoint in Astro: src/pages/api/menu.json.js astro public my restaurant script link

export async function GET() 
  const menu = 
    items: [
       name: "Pizza", price: 12 ,
       name: "Salad", price: 8 
    ]
  ;
  return new Response(JSON.stringify(menu), 
    headers:  "Content-Type": "application/json" 
  );

Step 2 – Create a public script link that consumes this API: Save this as public/restaurant-widget.js

(function() 
  fetch('/api/menu.json')
    .then(res => res.json())
    .then(data => 
      const container = document.getElementById('restaurant-menu');
      if(container) 
        container.innerHTML = data.items.map(item => `<li>$item.name - $$item.price</li>`).join('');
);
)();

Step 3 – Embed your script link anywhere: Copy and paste this into any website to display your public restaurant menu: Once your page is built, you need to

<div id="restaurant-menu">Loading menu...</div>
<script src="https://your-public-domain.com/restaurant-widget.js"></script>

That, right there, is your “astro public my restaurant script link” – a self-contained JavaScript snippet that you built with Astro and can embed on any site.

---

---
import Layout from '../layouts/Layout.astro';
---
<Layout title="Home">
<section class="hero">
<h1>Welcome to Astro Public</h1>
<p>Modern Italian cuisine with a view of the stars</p>
<a href="/reservations" class="btn">Book a Table</a>
</section> Step 2 – Create a public script link
<section class="featured">
<h2>Today's Specials</h2>
<div class="specials-grid">
<div>🍝 Truffle Pasta</div>
<div>🥩 Ribeye Steak</div>
<div>🍰 Tiramisu</div>
</div>
</section>
</Layout>
<style>
.hero 
text-align: center;
padding: 4rem 2rem;
background: linear-gradient(135deg, #2c3e50, #000);
color: white;
.btn 
display: inline-block;
margin-top: 1rem;
padding: 0.75rem 1.5rem;
background: #e67e22;
color: white;
border-radius: 8px;
text-decoration: none;
.featured 
padding: 2rem;
text-align: center;
.specials-grid 
display: flex;
justify-content: center;
gap: 2rem;
</style>

---