Bolt.New AI Tutorial | AUTOMATE WEBSITE content using AI FAST!
Learn how to automate website content using AI with Bolt.New AI! This AI website builder is fast, efficient, and perfect for creating dynamic content. Watch this tutorial to see how easy it is to use AI to boost your website's performance.
In this video, I’ll show you how I created a fully automated, mobile-friendly website (https://theoracleguy.in) for my YouTube channel without writing a single line of code!
📌 Here’s what you’ll learn in this video:
0:00 - AI Built My Website FOR FREE
1:07 - The Adventure Begins
2:17 - Creating an awesome static website in 5 minutes
3:55 - Deploying the static website with 1 click
4:48 - Static website showcase
05:06 - Making the Site Dynamic with YouTube API
07:02 - Solving the API Quota Limit with AI
07:38 - Adding AI Generated Blogs
09:07 - Automating Updates on the Website
10:49 - How can your own Youtube website for free
11:07 - Fully Automated website in Action
🔥 Watch till the end to learn your own AI powered website!
💡 Tools & Links Mentioned:
https://bolt.new/
https://www.netlify.com/
https://claude.ai/
Youtube API - https://developers.google.com/youtube/v3
https://github.com
Gemini API - https://ai.google.dev/
🙌 Don’t Forget to Subscribe!
If you’re excited about using AI to automate your workflows, hit that subscribe button and turn on notifications. More game-changing AI tutorials are coming soon! 🎥
Music:
Music by Dana Music from Pixabay
Energetic |7|Instrument-Enthusiastic-Background by Furkan Lim from Pixabay
Music by Fae Spencer from Pixabay
Prompts Used:
Bolt Prompt - Static Website:
Create a professional and engaging website for 'The Oracle Guy,' a YouTube channel dedicated to tutorials on Generative AI and Oracle ERP systems. Start by generating a clean, modern landing page that features the channel's tagline 'Smart AI, Smarter ERPs' prominently at the top.
Include sections for:
Introduction: A brief overview of the channel's mission and content focus.
Video Tutorials: A dynamic grid layout showcasing popular video thumbnails with titles like 'Unlocking Generative AI,' 'Oracle ERP Best Practices,' and 'Hands-On Projects.'
Subscribe Section: An eye-catching call-to-action button labeled 'Subscribe for Weekly Insights!' to encourage viewer engagement.
Resources: A section that links to additional resources, articles, and tools related to Generative AI and Oracle ERP.
Utilize a color scheme of dark grey and white to maintain a professional yet inviting atmosphere. Ensure the design is responsive and visually appealing across devices. Incorporate SEO-friendly elements for better visibility in search engines.
Bolt - Dynamic Website Prompt:
Create a responsive dynamic website for my YouTube channel, 'The Oracle Guy', that automatically pulls data from my YouTube data API v3 for the channel handle. The website should include:
Configuration file to save channel handle and API Key
A homepage with a infinite scroll The page has a video image at the left and a list of videos beside it at the right. As you scroll through the website and click on each list item, the video image appears and the list just never stops, the scroll should be similar to scroll effect you get on iOS
The website should be based on nextjs 14
Use a light theme with a modern UI
Site should have smooth transition animations
Proper error handling and loading states
Responsive design that works well on all devices
SEO optimization and performance best practices
load animation similar to Facebook where element's shape gets prerendered
Claude Prompt - Cache Enablement:
This is file (youtube.ts) containing for fetching the YouTube videos for my channel website, can suggest additional logic in the web app so that API call is made only once a day and json is stored as backup at server level to reduce API calls to YouTube server, the web app is based on next.js 14:
(TypeScript File content)
Bolt Prompt - Adding Blog page:
can you add another page in the website for blogs, the page should be dynamic and should use the youtube videos available on the home page to use as ideas to add new blogs and also embed the youtube link in the blogs at appropriate place. The blogs to be generated using gemini pro API 1.5 and only 1 blogs needs to be generated for each video and as the new video gets added in the website app should should pick it up and create a blog on it. there should be a strict check that once the blog is generated for a video, it should not be picked again.
Claude Prompt - Automating execution of generateBlog script:
below is a script generateBlog.js which automatically generated blog data for me based on YouTube videos, currently i have to run it manually from vs code, how can it automatically run daily to check if there are any new videos and update the blog data :
(JavaScript File content)
#aiwebsitebuilder #YouTubeAutomation #claude #GenerativeAI #TheOracleGuy
