آموزش Next JS & WordPress: ساخت سایت های NextJS سریع با Next & WP

به‌روزرسانی مارس 2023 - این دوره اکنون به نسخه بعدی JS V13 به‌روزرسانی شده است!

آیا می خواهید مهارت های React JS خود را بهبود ببخشید و ارزش خود را به عنوان یک توسعه دهنده فرانت اند افزایش دهید؟

با یادگیری Next.js با پشتیبان وردپرس Headless، مجموعه مهارت های React خود را ارتقا دهید! سایتی که در Next JS خواهیم ساخت از React JS و GraphQL برای تولید و ساخت صفحات ثابت از یک مجموعه داده معین استفاده می کند. این دوره به راه‌اندازی وردپرس به‌عنوان یک CMS بدون هد در حین استفاده از NextJS برای ایجاد یک وب‌سایت React پرسرعت ارائه‌شده توسط سرور از داده‌های وردپرس، مانند انواع پست‌های سفارشی، صفحات، منوها، رسانه‌ها، فیلدهای سفارشی پیشرفته (و موارد دیگر) می‌پردازد. ) از GraphQL برای پرس و جو از آن داده استفاده می کند.

درست است، ما در واقع می توانیم داده های وردپرس را با استفاده از GraphQL پرس و جو کنیم!

در این دوره یک وب‌سایت دارایی نماینده املاک ایجاد می‌کنیم، به راه‌اندازی اولیه و توسعه Next JS و WordPress به صورت محلی نگاه می‌کنیم، بلوک‌های گوتنبرگ را به مؤلفه‌های React نگاشت می‌کنیم، بلوک‌های گوتنبرگ سفارشی خود را ایجاد می‌کنیم، و این مؤلفه‌ها را با Tailwind CSS طراحی می‌کنیم. و جستجوی داده های وردپرس و گوتنبرگ با GraphQL برای تولید خودکار صفحات استاتیک ما.

ما به نحوه پرس و جوی داده های وردپرس با GraphQL با استفاده از ابزار مرورگر GraphiQL نگاه خواهیم کرد. ما کمی از کدهای وردپرس نیز استفاده خواهیم کرد، اما نه بیش از حد - تمرکز اصلی در اینجا Next JS است. هنگامی که ما با NextJS و Wordpress آشنا و راحت شدیم، به سمت راه‌اندازی و استقرار یک وب‌سایت زنده با استفاده از Vercel پیش می‌رویم که هر بار که محتوا را در بک‌اند وردپرس خود با استفاده از webhooks به‌روزرسانی می‌کنیم، صفحات وب ثابت ما را بازسازی می‌کند.

توصیه می‌شود که دانش اولیه React را داشته باشید. همه چیزهای دیگر از Next.js، WordPress، GraphQL، و Tailwind CSS را پوشش خواهیم داد!

سرعت از رقابت گذشته است!

Next.js سریع ترین وب سایت ممکن را می سازد. به جای منتظر ماندن برای تولید صفحات در صورت درخواست، از تابع تولید ایستا در Next JS برای پیش ساخت صفحات و انتقال آنها به ابر جهانی از سرورها استفاده خواهیم کرد (برای این کار از Vercel استفاده خواهیم کرد) - آماده تحویل فوراً به کاربران خود در هر کجا که هستند.

• منتظر پاسخ های API نیست

• بدون انتظار برای ارائه مؤلفه‌ها بر اساس داده‌های درخواستی

• بدون بارگیری اسپینر!

• بدون انتظار برای یک سرور برای کامپایل یک صفحه برای ارائه به مرورگر - این صفحات از قبل از قبل کامپایل شده اند و آماده ارائه فوری به کاربران شما هستند!