Created
April 28, 2021 23:05
-
-
Save onedebos/7bc74a99c4a7554d7a1907b78bc27300 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import Head from 'next/head'; | |
| import Post from '../components/Post'; | |
| import Footer from '../components/Footer'; | |
| import { useState, useEffect } from 'react'; | |
| import { getAllPostsFromServer } from '../lib/utils'; | |
| export default function Home() { | |
| const [posts, setPosts] = useState([]); | |
| useEffect(async () => { | |
| let mounted = true; | |
| if (mounted) { | |
| const postsFromServer = await getAllPostsFromServer(); | |
| setPosts(postsFromServer); | |
| } | |
| return () => (mounted = false); | |
| }, []); | |
| return ( | |
| <div className="flex flex-col items-center justify-center min-h-screen"> | |
| <Head> | |
| <title>Aeeiee WordPress React Demo</title> | |
| <link rel="icon" href="/favicon.ico" /> | |
| </Head> | |
| <main className="flex flex-col items-center flex-1 px-20 py-10"> | |
| <h1 className="text-6xl font-bold mt-5 mb-5">Blog</h1> | |
| <p className="text-xl mb-5">WordPress as a Headless CMS with React</p> | |
| {posts && ( | |
| <div className="grid grid-cols-2 gap-5"> | |
| {posts.map((post, id) => { | |
| return ( | |
| <div key={id}> | |
| <Post post={post} /> | |
| </div> | |
| ); | |
| })} | |
| </div> | |
| )} | |
| </main> | |
| <Footer /> | |
| </div> | |
| ); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment