How to host next js app on GitHub pages using GitHub Actions | CI/CD

🌟 Exclusive Hosting Deal from Hostinger 🌟
Ready to launch your own website? Use my affiliate link to get an exclusive discount on Hostinger's reliable and high-performance hosting plans: https://www.hostg.xyz/SHEyO

Hostinger offers:
- Easy-to-use control panel
- 24/7 customer support
- 30-day money-back guarantee
- And more!

Don't miss out on this amazing offer. Click the link above to get started today! 🚀

---

In this video, I show how I successfully deploy a Next.js project on GitHub Pages using GitHub Actions, providing a simple and automated method for deployment.

=====================
Chapters:
=====================
00:00:02 - Introduction and overview of deploying a Next.js project on GitHub Pages using GitHub Actions
00:01:21 - Installing the project and creating a new GitHub repository
00:03:51 - Adding necessary configurations and making changes to the project
00:05:00 - Committing changes and setting up GitHub Actions for deployment
00:07:03 - Monitoring the build process and deployment on GitHub Pages
00:09:22 - Final check and viewing the deployed Next.js application on GitHub Pages

#NextJS #GitHubPages #GitHubActions

=====================
Related Videos:
=====================
🚀 How to deploy Next.js app to Firebase?:    • How to deploy Next js app to Firebase?  
💻 How to use SWR in Next.js 14 APP directory?:    • How to use SWR in Next js 14 APP dire...  
🎨 How to use react-bootstrap in Next.js 14?:    • How to use react-bootstrap in Next js...  
🔧 How to use FontAwesome in Next.js 14 with app directory?:    • How to use FontAwesome in Next js 14 ...  
📸 Introduction to Next.js Image Component:    • Introduction to Next js Image Component  
🔒 Integrating Zod into Your Next.js 14 App for Client-Side and Server-Side Validation:    • Integrating Zod into Your Next.js 14 ...  
📦 How to fetch data from API in Next.js 14 +?:    • How to fetch data from API in Next js...  
🔗 How to change font in Next.js 14 + ?:    • How to change font in Next js 14 + ?  
⚙️ How to create backend in Next.js 14 +?:    • How to create backend in Next js 14 +?  
🛠 How to use Mongoose with Next.js 14 +?:    • How to use Mongoose with Next js 14 +?  
🌐 How to deploy react app on GitHub pages in 5 minutes:    • How to deploy react app on GitHub pag...  
🚀 Just Made Youtube Transcripts Downloader of all videos for a channel with Next.js | DEMO:    • Just Made Youtube Transcripts Downloa...  
🎬 Step-by-Step Guide to Upload Your Website to GitHub Pages for Free:    • Step-by-Step Guide to Upload Your Web...  
📂 How to upload Next.js on GitHub and Vercel?:    • How to upload Next js on GitHub and V...  
🔗 Playlist: Next.js 14+:    • Next.js 14+  
🔐 How to Add a Stylish Progress Bar to Your Next.js Website?:    • How to Add a Stylish Progress Bar to ...  
🔷 How to install and use tailwind css in Next.js App?:    • How to install and use tailwind css i...  
🔔 How to connect domain with hosting in digitalocean:    • How to connect domain with hosting in...  
🎥 Playlist: Hosting:    • Hosting  
🖼 How to use icons in Next.js 14?:    • How to use icons in Next js 14?  
🧱 How to create Modal in Next.js?:    • How to create Modal in Next js?  

=====================

To read written versions of AyyazTech tutorials, please visit https://AyyazTech.com