Spaces:
Running
Running
Build a secure full-stack website for ZimProjects.co.zw using Next.js (frontend) and Node/Express with MongoDB (backend). Model it visually and structurally on https://www.constructionenquirer.com/ , including ad slots, article management, and project listings. Include JWT authentication, admin dashboard, and responsive ad placements. Use Tailwind CSS, optimize for SEO, and prepare for deployment on Vercel and AWS. Provide complete code architecture with modular file structure and setup instructions. This should easily be uploaded to the Cpanel.
9fc92d7 verified | import { useEffect, useState } from 'react' | |
| import Head from 'next/head' | |
| import AdBanner from '../components/AdBanner' | |
| import NewsSection from '../components/NewsSection' | |
| import TendersSection from '../components/TendersSection' | |
| import ProjectsSection from '../components/ProjectsSection' | |
| import Sidebar from '../components/Sidebar' | |
| import { fetchHomeData } from '../lib/api' | |
| export default function Home() { | |
| const [data, setData] = useState(null) | |
| const [loading, setLoading] = useState(true) | |
| useEffect(() => { | |
| const loadData = async () => { | |
| const result = await fetchHomeData() | |
| setData(result) | |
| setLoading(false) | |
| } | |
| loadData() | |
| }, []) | |
| if (loading) return <div className="text-center py-20">Loading...</div> | |
| return ( | |
| <div className="container mx-auto px-4"> | |
| <AdBanner slot="top_leaderboard" /> | |
| <div className="flex flex-col lg:flex-row gap-8"> | |
| <main className="lg:w-2/3"> | |
| <NewsSection articles={data.news} /> | |
| <AdBanner slot="middle_rectangle" /> | |
| <ProjectsSection projects={data.projects} /> | |
| </main> | |
| <aside className="lg:w-1/3"> | |
| <Sidebar /> | |
| <TendersSection tenders={data.tenders} /> | |
| <AdBanner slot="sidebar" /> | |
| </aside> | |
| </div> | |
| </div> | |
| ) | |
| } |