import React from 'react';
import Hello from '../components/hello';
import '../style.css';

// import JSON
import jsonOsmQuery from '../osm-query.json';

const Home = () => {

    const rryOsmQuery = jsonOsmQuery.queries;

    return (
	<>
	    <h2>Home</h2>
	    <h3>(React.js Lambda Function Component)</h3>
	    <Hello msg="Hello World!" />
      <div className='container'>
        <p>Blog RryOsmQuery</p>
        <div className='rryOsmQuery'>
          {rryOsmQuery.map((query) => (
            <div className='query' key={query.id}>
              <p className='title'>{query.title}</p>
              <p className='content'>{query.query}</p>
            </div>
          ))}
        </div>
      </div>
	</>
    );
}

export default Home
