import React, { useState } from 'react'; // Sample article data const articles = [ { id: 1, title: "Getting Started with React Hooks", language: "JavaScript", framework: "React", date: "2024-06-15", content: "React Hooks are a game-changer in the world of React development...", author: { username: "Todd Roger Whisner", avatar: "/api/placeholder/30/30" }, category: "Web Development" }, { id: 2, title: "Python Data Structures Explained", language: "Python", framework: "Django", date: "2024-06-10", content: "Python offers several built-in data structures that are fundamental to writing efficient and clean code...", author: { username: "Todd Roger Whisner", avatar: "/api/placeholder/30/30" }, category: "Backend" }, { id: 3, title: "Rust for Systems Programming", language: "Rust", framework: "Actix", date: "2024-06-05", content: "Rust is a systems programming language that runs blazingly fast...", author: { username: "rustacean", avatar: "/api/placeholder/30/30" }, category: "Systems" }, { id: 4, title: "Introduction to Machine Learning with TensorFlow", language: "Python", framework: "TensorFlow", date: "2024-06-20", content: "Machine Learning is revolutionizing various industries...", author: { username: "Todd Roger Whisner", avatar: "/api/placeholder/30/30" }, category: "AI" }, { id: 5, title: "Building RESTful APIs with Express.js", language: "JavaScript", framework: "Express.js", date: "2024-06-25", content: "Express.js is a minimal and flexible Node.js web application framework...", author: { username: "Todd Roger Whisner", avatar: "/api/placeholder/30/30" }, category: "Backend" }, { id: 6, title: "Vue.js Component Architecture", language: "JavaScript", framework: "Vue.js", date: "2024-06-30", content: "Vue.js offers a component-based architecture that makes building user interfaces a breeze...", author: { username: "Todd Roger Whisner", avatar: "/api/placeholder/30/30" }, category: "Web Development" }, ]; // Sample job data const jobs = [ { id: 1, title: "Senior React Developer", company: "TechCorp", location: "Remote", salary: "$120k - $150k", description: "Looking for an experienced React developer to lead our front-end team..." }, { id: 2, title: "Python Backend Engineer", company: "DataSystems", location: "New York, NY", salary: "$100k - $130k", description: "Seeking a Python expert to work on our data processing pipelines..." }, { id: 3, title: "Full Stack JavaScript Developer", company: "WebSolutions", location: "San Francisco, CA", salary: "$110k - $140k", description: "Join our team to build modern web applications using Node.js and React..." }, ]; const NavBar = ({ onSortChange, onLanguageChange, onFrameworkChange, onCategoryChange, mode, onModeChange }) => ( ); const ArticleCard = ({ article, onReadMore }) => (
By: {article.author.username}
Category: {article.category} | Language: {article.language} | Framework: {article.framework} | Date: {article.date}
{article.content.substring(0, 150)}...
Company: {job.company}
Location: {job.location} | Salary: {job.salary}
{job.description.substring(0, 150)}...
By: {article.author.username}
Category: {article.category} | Language: {article.language} | Framework: {article.framework} | Date: {article.date}
{article.content}