تنزيل nextjs notion blog starter - nextjs notion blog starter CODE Download

nextjs notion blog starter

كود الذكاء الاصطناعي

1.0.0

تنزيل

NextJS Prowing Blog Starter

العرض التوضيحي الافتراضي - تم نشره من الفرع main
إعداد المدونة - كتبت مقالًا عن كيفية استخدام هذا المبدع لبدء مدونتك

سمات

✅ يستغرق الإعداد بضع دقائق فقط (تكوين ملف واحد)؟
✅ اشتراك النشرة الإخبارية عبر API ConvertKit
✅ تحليلات بسيطة مع أومامي
✅ الصور الاجتماعية التلقائية OG مع قالب Tailwind
✅ عناوين URL الأوتوماتيكية الجميلة
✅ سرعة الصفحة ممتازة
✅ محسّن لـ Next.js و Vercel

؟ بناء مع

الإطار : next.js ، typeScript
التصميم : CSS Tailwind
المحتوى : مفهوم API
النشرة الإخبارية : ConvertKit
النشر : Vercel

نظرة عامة على المشروع

layouts/* - المخططات المختلفة المستخدمة في كل صفحة.
components/* - المكونات المستخدمة في جميع أنحاء الموقع.
components/blocks/* - كتل مخصصة مصنوعة لتقديم فكرة.
utils/* - قصير لـ "المرافق" ، مجموعة من الأدوات المساعدة المفيدة أو رمز للخدمات الخارجية.
pages/api/* -طرق API Powering /og-image Dynamic OG Image و /subscribe-convertkit .
pages/blog/* - صفحات المدونة الثابتة مسبقًا التي تجلب معلومات من واجهة برمجة تطبيقات الفكرة.
pages/* - جميع الصفحات الثابتة الأخرى.
public/* - الأصول الثابتة بما في ذلك الصور والخطوط ومقاطع الفيديو.
styles/* - أنماط عالمية وذرة.
siteData.ts - ملف بسيط يحتوي على بيانات عالمية حول الموقع.

؟ ‍ تشغيل محليا

git clone https://github.com/tuanphungcz/nextjs-notion-blog-starter
cd nextjs-notion-blog-starter
pnpm install
pnpm run dev

إنشاء ملف .env مشابه لـ .env.example وتضمين المفاتيح المناسبة.

نشر إلى Vercel

 NOTION_SECRET=
BLOG_DATABASE_ID=

# ConvertKit is optional
NEXT_PUBLIC_CONVERTKIT_FORM_ID=
NEXT_PUBLIC_CONVERTKIT_API_KEY=

# Umami is optional
NEXT_PUBLIC_UMAMI_ID=
NEXT_PUBLIC_UMAMI_URL=