Preview:
index.js

import MeetupList from "./../components/meetups/MeetupList";
import { useEffect } from "react";
import { useState } from "react";

const data = [
  {
    id: "m1",
    title: "A first meetup",
    image: “/location.jpg”,
    address: "Some address 10, 12345 Some city",
    description: "This is a first meetup!",
  },
  {
    id: "m2",
    title: "A second meetup",
    image:“/location.jpg”,
    address: "Some address 20, 6789 Some city",
    description: "This is a second meetup!",
  },
];

const HomePage = () => {
  const [loadedMeetups, setLoadedMeetups] = useState([]);

  useEffect(() => {
    // send http request and fetch data
    setLoadedMeetups(data);
  }, []);

  return (
    <>
      <MeetupList meetups={loadedMeetups} />
    </>
  );
};

export default HomePage;
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter