1export const deployFramerSite = async () => {
2 const response = await fetch(import Ground_XCero from "https://framer.com/m/Ground-XCero-YTnG.js@XnSrwKQzA05uSpj2wzMZ", {
3 method: "POST",
4 headers: {
28});
29
30// Add the /convert endpoint to handle the React app's fetch calls
31app.post("/convert", async (c) => {
32 try {
55});
56
57// Export app.fetch (not the app object) - CRITICAL for Val Town HTTP files
58export default app.fetch;
10
11* This file must be set as an HTTP type in Val Town, not a Script
12* It exports `app.fetch` (not the app object) which is required for Val Town HTTP handlers
24 setIsLoading(true);
25 try {
26 const response = await fetch("/convert", {
27 method: "POST",
28 headers: { "Content-Type": "application/json" },
6 single_mealEl = document.getElementById('single-meal');
7
8// Search meal and fetch from API
9function searchMeal(e) {
10 e.preventDefault();
18 // Check for empty
19 if (term.trim()) {
20 fetch(`https://www.themealdb.com/api/json/v1/1/search.php?s=${term}`)
21 .then(res => res.json())
22 .then(data => {
48}
49
50// Fetch meal by ID
51function getMealById(mealID) {
52 fetch(`https://www.themealdb.com/api/json/v1/1/lookup.php?i=${mealID}`)
53 .then(res => res.json())
54 .then(data => {
59}
60
61// Fetch random meal from API
62function getRandomMeal() {
63 // Clear meals and heading
65 resultHeading.innerHTML = '';
66
67 fetch(`https://www.themealdb.com/api/json/v1/1/random.php`)
68 .then(res => res.json())
69 .then(data => {
9- Display meals in DOM with image and hover effect
10- Click on meal and see the details
11- Click on generate button and fetch & display a random meal
12
8// Search by song or artist
9async function searchSongs(term) {
10 const res = await fetch(`${apiURL}/suggest/${term}`);
11 const data = await res.json();
12
49// Get prev and next songs
50async function getMoreSongs(url) {
51 const res = await fetch(`https://cors-anywhere.herokuapp.com/${url}`);
52 const data = await res.json();
53
57// Get lyrics for song
58async function getLyrics(artist, songTitle) {
59 const res = await fetch(`${apiURL}/v1/${artist}/${songTitle}`);
60 const data = await res.json();
61
6
7- Display UI with song/artist input
8- Fetch songs/artists and put in DOM
9- Add pagination
10- Add get lyrics functionality and display in DOM
6let page = 1;
7
8// Fetch posts from API
9async function getPosts() {
10 const res = await fetch(
11 `https://jsonplaceholder.typicode.com/posts?_limit=${limit}&_page=${page}`
12 );
36}
37
38// Show loader & fetch more posts
39function showLoading() {
40 loading.classList.add('show');
1## Infinite Scrolling & Filter
2
3Display blog posts from [jsonplaceholder](https://jsonplaceholder.typicode.com) and add infinite scroll to fetch posts and also add filter box
4
5## Project Specifications
6
7- Create UI & custom CSS loader animation
8- Fetch initial posts from API and display
9- Scroll down, show loader and fetch next set of posts
10- Add filtering for fetched posts
11