Build and Deploy your own Decentralized Github Pages with Next.js 14, Typescript, IPFS & Devv AI
https://devv.ai/
HTTP3 is a revolutionary decentralized web hosting platform that leverages blockchain technology to provide permanent, censorship-resistant website hosting. It combines the power of IPFS (InterPlanetary File System) with smart contracts to create a robust, decentralized infrastructure for the web.
🎓 What You'll Learn:
- Next.js 14 fundamentals and best practices
- Full stack development with Next.js
- Integrating AI (Google's Gemini AI) into your Next.js app
- TypeScript implementation in Next.js
- Responsive design using Tailwind CSS
- Authentication with Privy
- Database integration using Drizzle ORM
- Deployment of Next.js projects
📚 Project Highlights:
- AI-assisted waste verification
- User reward system for eco-friendly actions
- Real-time waste collection task management
- Interactive leaderboard for community engagement
👨💻 Step-by-Step Guide:
- Setting up a Next.js 14 project
- Creating a responsive layout with Tailwind CSS
- Implementing Privy authentication
- Database design and integration with Drizzle ORM
- Building interactive UI components
- Deploying your Next.js application
⭐ Key Technologies:
- Next.js 14: https://nextjs.org/
- Drizzle ORM: https://orm.drizzle.team/
- TailwindCSS: https://tailwindcss.com/
- Google Gemini AI: https://ai.google.dev/
- Web3Auth: https://web3auth.io/
- Neon Database: https://neon.tech/
- Web3Storgage: https://old.web3.storage/products/web3storage/
📚 Materials/References:
DevvAI - https://devv.ai/
Deployed Website URL: https://htt3.netlify.app/dashboard
GitHub Repo (give it a star ⭐): https://github.com/mendsalbert/http3/
README (assets & code): https://github.com/mendsalbert/http3/
GoogleAIStudio: https://aistudio.google.com/app/apikey
BTTC Testnet Tokens: https://testfaucet.bt.io/#/
Chainlist: https://chainlist.org/?search=bttc&testnets=true
Hardhat Config: https://hardhat.org/hardhat-runner/docs/getting-started
Drizzle ORM: https://orm.drizzle.team/docs/get-started-postgresql
PrivyAuthentication:https://docs.privy.io/guide/react/quickstart
Web3Storage: https://web3.storage/docs/how-to/create-account/
Drawio Diagram Documents:https://app.eraser.io/workspace/egQE46Xp7NiSIvkWoUpW?origin=share
Metamask Chrome Extension: https://chromewebstore.google.com/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn?hl=en&pli=1
👋 Social Media:
https://twitter.com/mendsalbert
https://www.instagram.com/mendsalbert_
https://linkedin.com/in/mends-albert
https://t.me/albertmends
Subscribe or I turn your vs code into light mode
╔═╦╗╔╦╗╔═╦═╦╦╦╦╗╔═╗
║╚╣║║║╚╣╚╣╔╣╔╣║╚╣═╣
╠╗║╚╝║║╠╗║╚╣║║║║║═╣
╚═╩══╩═╩═╩═╩╝╚╩═╩═╝
Timestamps
00:00:00 - Intro
00:00:47 - demo
00:03:59 - Devv.ai
00:05:00 - IPFS & static webhosting architecture
00:11:50 - setup & home page
00:30:47 - navbar + clerk authentication
00:42:13 - database setup
00:47:33 - navbar cont'd
01:16:25 - smart contract
01:43:18 - dashboard
02:52:16 - hosting website + conclusion
💼 Business Inquiries: mendsalbert@gmail.com
👨🏽💻 Tools and Tech Stack
React JS, Next.js, TailwindCSS, Typescript, Preline, OpenAI API, Tabler Icon, JavaScript, Gemini AI, Drizzle ORM, Shadcn, Neon Console, Nextjs14, hardhat, web3, blockchain
Whether you're new to React.js , NextJs or looking to enhance your skills, this tutorial covers everything from basic setup to advanced features. Learn how to leverage the power of React.js for building scalable, performant web applications.
Subscribe for more React.js tutorials, web development tips, and full stack development guidance!
#ReactJS #WebDevelopment #AIinHealthcare #FullStackDevelopment #TypeScript #TailwindCSS #JavaScript #CodingTutorial #nextjs #gemini #openai #ai
社交媒体聆听
الذكاء الاصطناعي في أسبوع 🔥 | الحلقة 8 | Copilot + pc ونماذج ذكاء اصطناعي تهدد عرش openai
انفجار تكنولوجي يهز عالم الحوسبة! 🤯 Microsoft تُطلق أجهزة Copilot + PC، أول حواسيب شخصية مدعومة بالذكاء الاصطناعي لتغير مفهوم الحوسبة للأبد! 🚀 في حلقة هذا الأسبوع، نغوص معًا في أعماق عالم الذكاء الاصطناعي المثير، ونكشف عن أحدث الابتكارات والاتجاهات التي تشكل مستقبل التكنولوجيا. ويأتي في مقدمة أخبارنا إطلاق شركة مايكروسوفت لما قد يكون أول حاسوب شخصي مدعوم بالذكاء الاصطناعي في العالم، والذي يمثل ثورة في مجال الحوسبة الشخصية. حيث صممت مايكروسوفت، بالتعاون مع شركاء مثل إيه إم دي وإنتل وكوالكوم، جهازًا قادرًا على تشغيل نماذج الذكاء الاصطناعي التوليدي المعقدة محليًا، دون الحاجة إلى اتصال بالإنترنت. ويعد هذا الجهاز، المسمى Copilot + PC، طفرة في مجال الحوسبة، حيث يعتمد بشكل أساسي على الذكاء الاصطناعي في نظامه وعتاده. ولكن هذا ليس كل شيء، فالمنافسة محتدمة في مجال الذكاء الاصطناعي، حيث نستكشف في هذه الحلقة أقوى نماذج الذكاء الاصطناعي في العالم ونرى كيف تتطور باستمرار. ويحتل نموذج GPT-4o المرتبة الأولى حاليًا، حيث يُعتبر أفضل نموذج للذكاء الاصطناعي العام تم تطويره حتى الآن. ولكن المنافسة شديدة، مع ظهور نماذج جديدة مثل Gemini 1.5 و Claude Opus و Yi-Large. ويأتي نموذج Yi-Large كمفاجأة هذا الأسبوع، حيث يُتوقع أن يتفوق على نماذج مايكروسوفت وميتا، ويقترب أداؤه من أداء أقوى ثلاثة نماذج في السوق. وفي أخبار أخرى، نناقش التحديثات المثيرة القادمة لنظام ويندوز، بما في ذلك ميزة Live Captions التي ستقوم بترجمة الفيديوهات في الوقت الفعلي، مما يجعل فهم المحتوى الأجنبي أسهل من أي وقت مضى. كما نلقي الضوء على مخاوف البروفيسور جيفري هينتون، رائد الشبكات العصبية، بشأن تأثير الذكاء الاصطناعي على الوظائف، واقتراحه لحل الدخل الأساسي الشامل. بالإضافة إلى ذلك، نستكشف ميزة Recall في أجهزة Copilot + PC، والتي تسمح للمستخدمين بالرجوع في الزمن والعثور على أي شيء تفاعلوا معه في الماضي، سواء على الويب أو في الكتب أو حتى في رسائل البريد الإلكتروني. كما نناقش في هذه الحلقة شراكة OpenAI مع Reddit، والتي ستسمح لـ ChatGPT بتضمين المناقشات من الموقع، مما يعزز قدراته في إجراء المحادثات الطبيعية. ونلقي نظرة أيضًا على أدوات الذكاء الاصطناعي المساعدة للمطورين، مثل محرك البحث Devv AI، ونشارك معكم بعض النصائح حول اختيار النموذج المناسب عند استخدام واجهات برمجة التطبيقات (APIs) لتوفير التكاليف. وأخيرًا، نكشف عن مبادرة رائدة من شركة Hugging Face، والتي ستتبرع بما قيمته 10 ملايين دولار من وحدات معالجة الرسومات (GPUs) لمطوري الذكاء الاصطناعي، لإزالة الحواجز أمام المطورين الطموحين. ونختم حلقتنا بالإعلان عن هدية قيمة لمتابعينا، وهي ملف أسود يحتوي على مجموعة من موارد الأمن السيبراني وأدوات الاختراق الأخلاقي مفتوحة المصدر. انضموا إلينا في هذه الرحلة المثيرة، واغتنموا الفرصة لاكتشاف أحدث التطورات في عالم الذكاء الاصطناعي والتقنيات المبتكرة. لا تنسوا الاشتراك في قناتنا ومشاركة الفيديو مع أصدقائكم المهتمين بمجال التكنولوجيا والذكاء الاصطناعي! الكلمات المفتاحية: الذكاء الاصطناعي، مايكروسوفت، Copilot + PC، نماذج الذكاء الاصطناعي، GPT-4o، Yi-Large، تحديثات ويندوز، Live Captions، جيفري هينتون، وظائف الذكاء الاصطناعي، ميزة Recall، OpenAI، ChatGPT، Devv AI، واجهات برمجة التطبيقات، Hugging Face، الأمن السيبراني، الاختراق الأخلاقي. المصادر والروابط: - أول حاسوب شخصي يعمل بالذكاء الاصطناعي من مايكروسوفت: https://www.microsoft.com/en/ai/ai-for-developers - أقوى نماذج الذكاء الاصطناعي في العالم: https://chat.lmsys.org/?leaderboard و https://platform.01.ai/ - نموذج Yi-Large الصيني: https://platform.01.ai/ - تحديثات ويندوز الرائعة: https://www.microsoft.com/en-us/windows/ - مخاوف البروفيسور جيفري هينتون بشأن وظائف الذكاء الاصطناعي: https://www.youtube.com/watch?v=em5sglAMpeo - تحقيق الحكومة الأمريكية في سيارات Waymo ذاتية القيادة: https://safety21.cmu.edu/news/2023/08/09/nhtsa-is-investigating-22-incidents-with-waymo-self-driving-cars/ - تحديث برنامج Paint بخيارات الذكاء التوليدي: https://www.microsoft.com/en-us/painer/ - شراكة OpenAI مع Reddit: https://www.redditinc.com/blog/reddit-and-oai-partner - الذكاء الاصطناعي الخاص بإيلون ماسك: X.com - BloombergGPT ونماذج الشؤون المالية: https://www.linkedin.com/posts/emollick_remember-bloomberggpt-which-was-a-specially-activity-7150359287024795648-65rD/ - قميص مارك زوكربيرغ المثير للجدل: X - محرك البحث Devv AI للمطورين: https://devv.ai/ - تجربة نماذج GPT المختلفة: نحن - مبادرة Hugging Face لدعم مطوري الذكاء الاصطناعي: https://huggingface.co/zero-gpu-explorers - تعليق OpenAI لاستخدام صوت Sky: https://www.comicsands.com/scarlett-johansson-openai-chatgpt-voice-2668332815.html - روبوت الدعم الجراحي من Sony: https://www.sony.com/ja/SonyInfo/research/projects/microsurgery_assistance_robot/#features01 - ميزة Recall في أجهزة Copilot + PC: https://www.microsoft.com/en-us/surface/ - تقنية مايكروسوفت لرفع دقة الرسومات: https://www.microsoft.com/en-us/gaming/games - هدية متابعينا - ملف موارد الأمن السيبراني: الرابط في الوصف يرجى ملاحظة أن بعض المصادر تم تصنيفها على أنها X أو X.com، والتي قد تكون روابط لم تعد نشطة أو مصادر غير محددة. https://1drv.ms/w/s!Am_S-svXHbmf8WUSk8dUqOazKHVy?e=fwIQy2
Build and Deploy your own Decentralized Github Pages with Next.js 14, Typescript, IPFS & Devv AI
https://devv.ai/ HTTP3 is a revolutionary decentralized web hosting platform that leverages blockchain technology to provide permanent, censorship-resistant website hosting. It combines the power of IPFS (InterPlanetary File System) with smart contracts to create a robust, decentralized infrastructure for the web. 🎓 What You'll Learn: - Next.js 14 fundamentals and best practices - Full stack development with Next.js - Integrating AI (Google's Gemini AI) into your Next.js app - TypeScript implementation in Next.js - Responsive design using Tailwind CSS - Authentication with Privy - Database integration using Drizzle ORM - Deployment of Next.js projects 📚 Project Highlights: - AI-assisted waste verification - User reward system for eco-friendly actions - Real-time waste collection task management - Interactive leaderboard for community engagement 👨💻 Step-by-Step Guide: - Setting up a Next.js 14 project - Creating a responsive layout with Tailwind CSS - Implementing Privy authentication - Database design and integration with Drizzle ORM - Building interactive UI components - Deploying your Next.js application ⭐ Key Technologies: - Next.js 14: https://nextjs.org/ - Drizzle ORM: https://orm.drizzle.team/ - TailwindCSS: https://tailwindcss.com/ - Google Gemini AI: https://ai.google.dev/ - Web3Auth: https://web3auth.io/ - Neon Database: https://neon.tech/ - Web3Storgage: https://old.web3.storage/products/web3storage/ 📚 Materials/References: DevvAI - https://devv.ai/ Deployed Website URL: https://htt3.netlify.app/dashboard GitHub Repo (give it a star ⭐): https://github.com/mendsalbert/http3/ README (assets & code): https://github.com/mendsalbert/http3/ GoogleAIStudio: https://aistudio.google.com/app/apikey BTTC Testnet Tokens: https://testfaucet.bt.io/#/ Chainlist: https://chainlist.org/?search=bttc&testnets=true Hardhat Config: https://hardhat.org/hardhat-runner/docs/getting-started Drizzle ORM: https://orm.drizzle.team/docs/get-started-postgresql PrivyAuthentication:https://docs.privy.io/guide/react/quickstart Web3Storage: https://web3.storage/docs/how-to/create-account/ Drawio Diagram Documents:https://app.eraser.io/workspace/egQE46Xp7NiSIvkWoUpW?origin=share Metamask Chrome Extension: https://chromewebstore.google.com/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn?hl=en&pli=1 👋 Social Media: https://twitter.com/mendsalbert https://www.instagram.com/mendsalbert_ https://linkedin.com/in/mends-albert https://t.me/albertmends Subscribe or I turn your vs code into light mode ╔═╦╗╔╦╗╔═╦═╦╦╦╦╗╔═╗ ║╚╣║║║╚╣╚╣╔╣╔╣║╚╣═╣ ╠╗║╚╝║║╠╗║╚╣║║║║║═╣ ╚═╩══╩═╩═╩═╩╝╚╩═╩═╝ Timestamps 00:00:00 - Intro 00:00:47 - demo 00:03:59 - Devv.ai 00:05:00 - IPFS & static webhosting architecture 00:11:50 - setup & home page 00:30:47 - navbar + clerk authentication 00:42:13 - database setup 00:47:33 - navbar cont'd 01:16:25 - smart contract 01:43:18 - dashboard 02:52:16 - hosting website + conclusion 💼 Business Inquiries: mendsalbert@gmail.com 👨🏽💻 Tools and Tech Stack React JS, Next.js, TailwindCSS, Typescript, Preline, OpenAI API, Tabler Icon, JavaScript, Gemini AI, Drizzle ORM, Shadcn, Neon Console, Nextjs14, hardhat, web3, blockchain Whether you're new to React.js , NextJs or looking to enhance your skills, this tutorial covers everything from basic setup to advanced features. Learn how to leverage the power of React.js for building scalable, performant web applications. Subscribe for more React.js tutorials, web development tips, and full stack development guidance! #ReactJS #WebDevelopment #AIinHealthcare #FullStackDevelopment #TypeScript #TailwindCSS #JavaScript #CodingTutorial #nextjs #gemini #openai #ai
Devv Agent Mode, best AI search engine for developers. Better than ChatGPT & Perplexity & Phind
website: devv.ai Devv is an AI search engine for developers, you can search any questions related to programming. It's not a GPT-wrapper or Phind clone. Instead, it really provides better search results in coding area than any other AI coding products. Devv Agent Mode is an advanced search mode. Devv agent will analysis the user's query and do differnet actions in seconds. It can also run code itself to provide the final result. You should really try it if you are using ChatGPT, Perplexity or Phind to writing codes right now.
总共有 9 条社交媒体数据需要解锁才能查看