38 lines
1.4 KiB
JavaScript
38 lines
1.4 KiB
JavaScript
import React from 'react';
|
|
import { posts } from '../data/sampleData';
|
|
import PostCard from '../components/PostCard';
|
|
|
|
const Home = () => {
|
|
return (
|
|
<div className="min-h-screen">
|
|
<div className="relative h-screen">
|
|
<div className="absolute inset-0">
|
|
<img
|
|
src="https://public.readdy.ai/ai/img_res/41c06ed594c02f95a02361b098edd073.jpg"
|
|
className="w-full h-full object-cover"
|
|
alt="Hero Background"
|
|
/>
|
|
</div>
|
|
<div className="absolute inset-0 bg-gradient-to-r from-black/70 to-transparent">
|
|
<div className="container mx-auto px-4 h-full flex items-center">
|
|
<div className="max-w-2xl text-white">
|
|
<h1 className="text-5xl font-bold mb-6">IT 교육의 새로운 기준</h1>
|
|
<p className="text-xl mb-8">실무 중심의 IT 교육 콘텐츠로 당신의 커리어를 성장시키세요</p>
|
|
<button className="bg-[#3B82F6] text-white px-8 py-3 rounded-lg">학습 시작하기</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="container mx-auto px-4 py-20">
|
|
<h2 className="text-3xl font-bold mb-12 text-center">최신 포스트</h2>
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
{posts.map(post => (
|
|
<PostCard key={post.id} post={post} />
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Home; |