Upload pages/knowledge.js with huggingface_hub

pages/knowledge.js

@@ -0,0 +1,103 @@
+import Layout from '../components/Layout';
+import KnowledgeArticle from '../components/KnowledgeArticle';
+
+const articles = [
+  {
+    id: 1,
+    title: 'Introduction to Large Language Models',
+    category: 'AI/ML',
+    excerpt: 'A comprehensive guide to understanding LLMs, their architecture, transformers, attention mechanisms, and practical applications in modern software development.',
+    readTime: '15 min',
+    date: 'Dec 10, 2024',
+    tags: ['LLM', 'AI', 'NLP', 'Transformers'],
+    featured: true,
+  },
+  {
+    id: 2,
+    title: 'Building RAG Applications from Scratch',
+    category: 'Engineering',
+    excerpt: 'Learn how to build production-ready Retrieval Augmented Generation systems with modern tools like LangChain, Vector DBs, and embeddings.',
+    readTime: '20 min',
+    date: 'Dec 8, 2024',
+    tags: ['RAG', 'Vector DB', 'LangChain'],
+  },
+  {
+    id: 3,
+    title: 'Fine-tuning LLaMA 3 for Custom Tasks',
+    category: 'AI/ML',
+    excerpt: 'A deep dive into fine-tuning Meta LLaMA 3 on custom datasets using QLoRA and PEFT techniques for efficient model adaptation.',
+    readTime: '25 min',
+    date: 'Dec 5, 2024',
+    tags: ['LLaMA', 'Fine-tuning', 'PEFT'],
+    featured: false,
+  },
+  {
+    id: 4,
+    title: 'Vector Databases: A Practical Comparison',
+    category: 'Database',
+    excerpt: 'Compare Pinecone, Weaviate, Milvus, Chroma and other vector databases for your AI applications with performance benchmarks.',
+    readTime: '18 min',
+    date: 'Dec 3, 2024',
+    tags: ['Vector DB', 'Pinecone', 'Weaviate'],
+  },
+  {
+    id: 5,
+    title: 'Building AI Agents with AutoGen',
+    category: 'Agents',
+    excerpt: 'Create autonomous AI agents using Microsoft AutoGen framework for complex multi-agent workflows and task automation.',
+    readTime: '22 min',
+    date: 'Nov 28, 2024',
+    tags: ['Agents', 'AutoGen', 'Automation'],
+  },
+  {
+    id: 6,
+    title: 'Prompt Engineering Best Practices',
+    category: 'Prompt Engineering',
+    excerpt: 'Master the art of crafting effective prompts for LLMs including chain-of-thought, few-shot learning, and role-playing techniques.',
+    readTime: '12 min',
+    date: 'Nov 25, 2024',
+    tags: ['Prompts', 'Best Practices', 'LLM'],
+  },
+];
+
+const categories = ['All', 'AI/ML', 'Engineering', 'Database', 'Agents', 'Prompt Engineering'];
+
+export default function Knowledge() {
+  return (
+    <Layout title="Knowledge Base" subtitle="Articles & Tutorials">
+      {/* Categories */}
+      <div className="mb-8 flex flex-wrap gap-2">
+        {categories.map((category) => (
+          <button
+            key={category}
+            className={`
+              font-mono text-sm px-4 py-2 border-2 transition-all
+              ${category === 'All' 
+                ? 'bg-brutal-black text-brutal-white border-brutal-black' 
+                : 'border-brutal-black hover:bg-brutal-black hover:text-brutal-white'
+              }
+            `}
+          >
+            {category}
+          </button>
+        ))}
+      </div>
+
+      {/* Articles Grid */}
+      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+        {articles.map((article) => (
+          <KnowledgeArticle key={article.id} article={article} />
+        ))}
+      </div>
+
+      {/* Pagination */}
+      <div className="mt-12 flex justify-center gap-2">
+        <button className="brutal-btn">Previous</button>
+        <button className="brutal-btn bg-brutal-black text-brutal-white">1</button>
+        <button className="brutal-btn">2</button>
+        <button className="brutal-btn">3</button>
+        <button className="brutal-btn">Next</button>
+      </div>
+    </Layout>
+  );
+}