This repository contains a minimalist and modern Next.js website built with a dark/light mode toggle, sleek navbar, and tab-based navigation. It serves as a demo on how to use ChatGPT to develop a web app and deploy it anywhere—even on Vercel—as well as how to develop it on an Android device, Windows PC, or Linux SBCs (like Raspberry Pi or Orange Pi). 💻📱🖥️
The complete video tutorial on how to develop and deploy this Next.js project is now available:
Watch it here!
- Modern Next.js Setup: Built with the latest Next.js App Router.
- Dark/Light Mode Toggle: Easily switch between themes.
- Sleek Navbar & Footer: Responsive UI with cool hover effects.
- Tab-based Navigation: Simple pages for demonstration (e.g., subscribe, latest videos, join community).
- Deploy Anywhere: Learn how to deploy on Vercel or run locally on various devices.
- Tutorial Video: Follow along with a video on using ChatGPT for web development.
This repository is hosted at: https://github.com/LinuxDroidMaster/nextjs-sample-web
📁 It contains the following structure:
my-nextjs-site
LICENSE
README.md
Note: The website content is located inside the my-nextjs-site folder.
- Node.js (includes npm)
- A code editor (e.g., VS Code)
- Basic knowledge of React and Next.js
-
Clone the Repository:
git clone https://github.com/LinuxDroidMaster/nextjs-sample-web.git
-
Navigate into the Website Folder:
cd nextjs-sample-web/my-nextjs-site -
Install Dependencies:
npm install
-
Run the Development Server:
npm run dev
Open http://localhost:3000 in your browser to see the app in action.
This project can be deployed anywhere:
-
Vercel:
Deploy directly with Vercel for a seamless Next.js experience. -
Other Platforms:
Check out the video tutorial to learn how to develop and run this project on Android devices, Windows PCs, or Linux SBCs (e.g., Raspberry Pi or Orange Pi). 📱🖥️💡
Contributions are welcome! Feel free to fork this repository, make improvements, and open pull requests.
Enjoy building with ChatGPT and happy coding! 😎💻