Error with Mage
I just discovered wasp and Mage I just created a dummy example to try it because I find it very usefull. I installed all dependencidies and when I run wasp start the localhost:3000 is a blank pare. This is my Home.jsx:
import React from 'react';
import { useQuery } from 'wasp/client/operations';
import { getRestaurants } from 'wasp/client/operations';
import { Link } from 'wasp/client/router';
const HomePage = () => {
const { data: restaurants, isLoading, error } = useQuery(getRestaurants);
if (isLoading) return 'Loading...';
if (error) return 'Error: ' + error;
return (
<div className='p-4'>
<h1 className='text-2xl font-bold mb-4'>Restaurants</h1>
<div className='grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4'>
{restaurants.map((restaurant) => (
<div key={restaurant.id} className='bg-white p-4 rounded-lg shadow-md hover:shadow-lg'>
<h2 className='text-xl font-semibold'>{restaurant.name}</h2>
<p className='text-gray-700'>{restaurant.address}</p>
<Link to={
View Profile
</Link>
</div>
))}
</div>
</div>
);
}
export default HomePage;
import React from 'react';
import { useQuery } from 'wasp/client/operations';
import { getRestaurants } from 'wasp/client/operations';
import { Link } from 'wasp/client/router';
const HomePage = () => {
const { data: restaurants, isLoading, error } = useQuery(getRestaurants);
if (isLoading) return 'Loading...';
if (error) return 'Error: ' + error;
return (
<div className='p-4'>
<h1 className='text-2xl font-bold mb-4'>Restaurants</h1>
<div className='grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4'>
{restaurants.map((restaurant) => (
<div key={restaurant.id} className='bg-white p-4 rounded-lg shadow-md hover:shadow-lg'>
<h2 className='text-xl font-semibold'>{restaurant.name}</h2>
<p className='text-gray-700'>{restaurant.address}</p>
<Link to={
/restaurant/${restaurant.id}} className='text-blue-500 hover:underline mt-2 inline-block'>View Profile
</Link>
</div>
))}
</div>
</div>
);
}
export default HomePage;
