Microblog ai nextjs

<p align="center"> <img src="https://img.shields.io/badge/Next.js-000?style=for-the-badge&logo=next.js&logoColor=white" /> <img src="https://img.shields.io/badge/TypeScript-3178c6?style=for-the-badge&logo=typescript&logoColor=white" /> <img src="https://img.shields.io/badge/Tailwind%20CSS-38b2ac?style=for-the-badge&logo=tailwind-css&logoColor=white" /> <img src="https://img.shields.io/badge/Azure-0078D4?style=for-the-badge&logo=azure-devops&logoColor=white" /> <img src="https://img.shields.io/badge/OpenAI-412991?style=for-the-badge&logo=openai&logoColor=white" /> <img src="https://img.shields.io/badge/LangChain.js-fff?style=for-the-badge&logo=langchain&logoColor=black" /> </p> <h1 align="center">🚀 Microblog AI with Next.js & AI Technologies</h1> <p align="center"> <strong>Complete Workshop: Learn how to build an intelligent microblog with Next.js and AI technologies, from scratch to ready to production applicatoin!</strong> </p>

This repository contains the code and materials for a <strong>hands-on workshop</strong> about building a microblog application with Next.js, integrating advanced AI features and exploring modern architectures. The goal is to provide a practical journey from initial to ready to production application, using best practices and current tools.

---

🚀 Try Instantly with GitHub Codespaces

Want to test or explore the application quickly? Click the button below to open this project directly in a GitHub Codespace — no setup required!

<p align="center"> <a href="https://codespaces.new/glaucia86/microblog-ai-nextjs"> <img src="https://github.com/codespaces/badge.svg" alt="Open in GitHub Codespaces" /> </a> </p>

🎯 About the Workshop

• From scratch to ready to production: Learn how to set up, develop and let ready to deploy.
• Modern technologies: Next.js, Tailwind CSS, TypeScript, Azure, OpenAI, LangChain.js, and more.
• Evolving roadmap: The project is constantly evolving with new versions that expand features and AI integrations.

This workshop is available in multiple languages:

• 🇧🇷 Portuguese: @glaucia86/microblog-ai-nextjs/files/workshop/pt-br/v1/00-initial.md
• 🇺🇸 English: @glaucia86/microblog-ai-nextjs/files/workshop/en-us/v1/00-initial.md

🖥️ How to Run Locally

You can run the application locally using GitHub Models. Follow these steps:

1. 📦 Install dependencies:

   bashCopy
   npm install

2. 🏗️ Build the application:

   bashCopy
   npm run build

3. ⚙️ Create a .env file at the root of the project:

   envCopy
   NEXT_PUBLIC_GITHUB_MODELS_TOKEN=
   NEXT_PUBLIC_GITHUB_MODELS_ENDPOINT=

   Fill in the values with your own GitHub Models environment credentials.

4. ▶️ Start the application:

   bashCopy
   npm run start

✨ See the application running:

🗺️ Roadmap: Next Steps

The project evolves through versions, each bringing new advancements:

🔹 v2 – LangChain.js

• 📌 Implementation of LangChain.js – the leading web framework for AI, providing advanced tools for building intelligent applications.

🔹 v3 – RAG Architecture (Retrieval-Augmented Generation)

• 🧩 Implementation of the RAG architecture (Retrieval-Augmented Generation), making it possible to combine database search with AI-generated responses, allowing the model to access external information and respond in a contextualized and up-to-date manner.
• 🔍 Contextual queries and optimized responses make the microblog smarter, capable of answering based on real and dynamic content.

🔹 v4 – Integration with Intelligent Agents

• 🕹️ Integration of intelligent agents that automate tasks, perform advanced interactions, and can act autonomously within the application, using the context provided by the RAG architecture.
• 🤖 Agents will further enhance the user experience, making the microblog interactive and adaptive to different needs.

🔹 v5 – Model Context Protocol (MCP) with Agents

• 🧠 MCP protocol to manage context and interaction between agents and AI models, ensuring efficient communication and advanced contextualization.

🔹 v6 – Deploy with Terraform, Cloud Provider (GCP, AWS, Vercel or Azure)/Toolhouse and LLM Providers (OpenAI, Ollama, Gemini...)

• 🚢 Automate deployment with Terraform and IaC (Infrastructure as Code).
• ☁️ Orchestrate containers with a Cloud Provider (GCP, AWS, Vercel, or Azure) and Toolhouse for AI agents.
• 🤖 Integrate additional intelligent features to expand the possibilities of the microblog.

💡 Why Give a Star and Fork?

If you enjoyed the project or want to follow its evolution:

<p align="center"> <a href="https://github.com/glaucia86/microblog-ai-nextjs/stargazers"> <img src="https://img.shields.io/github/stars/glaucia86/microblog-ai-nextjs?style=social" alt="Star this repo" /> </a> &nbsp; <a href="https://github.com/glaucia86/microblog-ai-nextjs/fork"> <img src="https://img.shields.io/github/forks/glaucia86/microblog-ai-nextjs?style=social" alt="Fork this repo" /> </a> </p>

• ⭐ <strong>Star the repo</strong> to support and get notified of new updates!
• 🍴 <strong>Fork the repo</strong> to test, modify, or learn from the code.
• 💬 Share with anyone interested in learning about applied AI in web!

🤝 How to Contribute

1. 🍴 Fork the repository
2. 🌱 Create a new branch: git checkout -b my-feature
3. ✏️ Commit: git commit -m 'feat: my new feature'
4. 🚀 Push: git push origin my-feature
5. 🔄 Open a Pull Request

📬 Contact

Open issues for questions, suggestions, or bug reports!

<p align="center"><strong>✨ Follow the roadmap and contribute to the evolution of this project! 🚀</strong></p>