Simple Footer
ชื่อ ปีปัจจุบัน และลิงก์โซเชียล
วิธีใช้
สร้างไฟล์แล้ววางโค้ด
ใน Portfolio Starter สร้างไฟล์
components/SimpleFooter.tsxกด Copy code ด้านบน แล้ววางทั้งหมดImport มาใช้
เปิด
app/page.tsxเพิ่มบรรทัด import ไว้บนสุด แล้ววาง component ในreturnimport SimpleFooter from "@/components/SimpleFooter"; export default function Home() { return ( <main> <SimpleFooter /> </main> ); }ใส่ข้อมูลของคุณผ่าน props
ไม่ใส่ props ก็แสดงข้อมูลตัวอย่างได้ พอพร้อมแล้วส่งข้อมูลของคุณเข้าไปแบบนี้
<SimpleFooter name="Mint" links={[{ label: "GitHub", href: "https://github.com/your-username" }]} />
Props
| Prop | Type | ใช้ทำอะไร |
|---|---|---|
name | string | ชื่อหลัง © |
links | { label: string; href: string }[] | ลิงก์โซเชียล |
ทุก prop ไม่บังคับ (มี ? ในโค้ด) ถ้าไม่ใส่จะใช้ค่าตัวอย่างในวงเล็บ = … ของ function
Dependencies
ไม่ต้องติดตั้งอะไรเพิ่ม ใช้ได้กับ Portfolio Starter ทันที (Next.js + React + Tailwind CSS)