import { useState, useRef, useEffect } from 'react'; import { useSearchParams, Link } from 'react-router-dom'; import { motion } from 'framer-motion'; import { Search, Download, BookOpen, ChevronRight, ArrowLeft, ExternalLink, Code, Globe, GitBranch, Cloud, Palette, Shield, DollarSign, BarChart3, Users, Megaphone, TrendingUp, UserCheck, ClipboardList, ShoppingCart, Cpu, Activity, LayoutGrid, Layers, Zap, Settings, Gauge, Radio, Wifi, Bot, Sun, Wrench, Binary, BatteryCharging, CircuitBoard, ShieldCheck, BrainCircuit, FlaskConical, Lock, Terminal, Dna, Microscope, Sparkles, Smartphone, Monitor, Server, CheckCircle2, Database, Briefcase, AlertTriangle, RefreshCw } from 'lucide-react'; import SectionTitle from '@/components/SectionTitle/SectionTitle'; import { StaggerContainer, StaggerItem } from '@/components/AnimatedContainer/AnimatedContainer'; import { TOOLKIT_ITEMS } from '@/constants'; const TOOLKIT_ICONS: Record; bg: string; color: string }> = { 'CS tools': { icon: Code, bg: '#EFF6FF', color: '#3B82F6' }, 'Business tools': { icon: Briefcase, bg: '#ECFDF5', color: '#10B981' }, 'Cybersecurity tools': { icon: ShieldCheck, bg: '#F5F3FF', color: '#8B5CF6' }, 'AI tools': { icon: BrainCircuit, bg: '#FDF2F8', color: '#EC4899' }, 'Electrical and Electronic tools': { icon: Zap, bg: '#FEF3C7', color: '#D97706' }, 'Biotech tools': { icon: Dna, bg: '#ECFEFF', color: '#06B6D4' }, }; const PROGRAMMING_LANGUAGES_GUIDES = [ { name: 'Python', tagline: 'Simple, Readable & Beginner-Friendly', color: '#3776AB', bg: '#EFF6FF', whatItIs: 'Python is known for its clean, English-like syntax. It lets you write code quickly without worrying about complex computer memory setups, making it the top choice for beginners.', keyConcepts: [ 'Writing your first line of code using print("Hello World!")', 'Storing numbers, text, and lists in smart variables', 'Making decisions in code using simple if and else conditions', 'Automating repetitive tasks effortlessly using loops', 'Reusing code blocks with custom functions (def)', 'Using pre-built libraries to build web apps, AI bots, or scrape web data' ], useCases: ['Web Development (Django, FastAPI)', 'Data Science & Analytics', 'Artificial Intelligence & Machine Learning', 'Automation & Web Scraping'], links: [ { label: 'Official Python Documentation', url: 'https://docs.python.org/3/' }, { label: 'Python for Beginners Guide', url: 'https://www.python.org/about/gettingstarted/' }, { label: 'FreeCodeCamp Python Course', url: 'https://www.freecodecamp.org/news/learn-python-free-python-courses-for-beginners/' } ] }, { name: 'Java', tagline: 'Build Once, Run Anywhere', color: '#007396', bg: '#E0F2FE', whatItIs: 'Java powers enterprise apps, banking systems, and Android smartphones. Code written in Java can run on any operating system without modification!', keyConcepts: [ 'Understanding Classes & Objects — modeling real-world items in code', 'Learning how the main() method serves as the starting trigger', 'Organizing data cleanly using static types like int, String, and boolean', 'Reusing existing code seamlessly with Inheritance & Interfaces', 'Handling errors gracefully so applications never crash unexpectedly', 'Building robust backend services with Spring Boot' ], useCases: ['Enterprise Backend Systems', 'Android Application Development', 'Financial & Banking Systems', 'Large-Scale Web Services'], links: [ { label: 'Official Oracle Java Docs', url: 'https://docs.oracle.com/en/java/' }, { label: 'W3Schools Java Tutorial', url: 'https://www.w3schools.com/java/' }, { label: 'Spring Boot Getting Started', url: 'https://spring.io/guides' } ] }, { name: 'C++', tagline: 'Blazing Speed & Hardware Control', color: '#00599C', bg: '#EFF6FF', whatItIs: 'C++ provides ultimate control over memory and hardware. It is the core language powering high-end video games, operating systems, and flight controllers.', keyConcepts: [ 'Compiling human-readable code into ultra-fast machine instructions', 'Exploring Pointers (*) & Memory Addresses (&) for direct hardware control', 'Using the Standard Template Library (STL) for instant stacks, queues, and vectors', 'Structuring programs cleanly with Classes, Structs, and Objects', 'Solving complex algorithmic puzzles in competitive programming', 'Building 3D game engines like Unreal Engine' ], useCases: ['Game Engines (Unreal Engine)', 'Operating Systems & Browsers', 'Competitive Programming & DSA', 'Embedded Systems & Robotics'], links: [ { label: 'cppreference.com Reference', url: 'https://en.cppreference.com/' }, { label: 'LearnCpp Free Tutorials', url: 'https://www.learncpp.com/' }, { label: 'GeeksforGeeks C++ Programming', url: 'https://www.geeksforgeeks.org/c-plus-plus/' } ] }, { name: 'JavaScript', tagline: 'The Heartbeat of the Web', color: '#D97706', bg: '#FEFCE8', whatItIs: 'JavaScript brings websites to life! Every button click, popup animation, dynamic page update, and live chat on the web is powered by JavaScript.', keyConcepts: [ 'Making web pages interactive by responding to user clicks and keypresses', 'Changing text, colors, and layouts dynamically on the screen (DOM)', 'Fetching live data from servers without refreshing the browser (fetch API)', 'Writing clean code using modern Arrow Functions (() => {})', 'Handling background actions smoothly using async / await', 'Building backend web servers using Node.js' ], useCases: ['Interactive Web Interfaces (React, Vue)', 'Backend Web Servers (Node.js)', 'Full-Stack Web Applications', 'Mobile Apps (React Native)'], links: [ { label: 'MDN JavaScript Documentation', url: 'https://developer.mozilla.org/en-US/docs/Web/JavaScript' }, { label: 'JavaScript.info Modern Tutorial', url: 'https://javascript.info/' }, { label: 'W3Schools JavaScript Guide', url: 'https://www.w3schools.com/js/' } ] }, { name: 'TypeScript', tagline: 'JavaScript with Smart Safety Nets', color: '#3178C6', bg: '#EFF6FF', whatItIs: 'TypeScript is JavaScript with built-in type checking! It acts like an intelligent spell-checker for code, preventing bugs and typos before your app even launches.', keyConcepts: [ 'Adding clear types (string, number) to catch bugs as you type', 'Creating Interfaces to define exact data structures for your app', 'Enjoying supercharged code suggestions & autocomplete in VS Code', 'Building scalable React and Next.js web applications', 'Catching errors during development instead of in production' ], useCases: ['Enterprise Web Applications', 'Modern React & Next.js Apps', 'Scalable Microservices', 'Large-Scale Team Projects'], links: [ { label: 'Official TypeScript Handbook', url: 'https://www.typescriptlang.org/docs/handbook/intro.html' }, { label: 'TypeScript in 5 Minutes', url: 'https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html' } ] }, { name: 'Go (Golang)', tagline: 'Built by Google for Cloud Speed', color: '#00ADD8', bg: '#ECFEFF', whatItIs: 'Created at Google for simplicity and lightning speed. Go is famous for powering modern cloud infrastructure like Docker and Kubernetes.', keyConcepts: [ 'Writing simple, ultra-clean code without unnecessary syntax clutter', 'Running thousands of background tasks at once using Goroutines', 'Passing data safely between parallel tasks using Channels', 'Building super-fast Web APIs in just a few lines of code', 'Compiling your entire project into a single fast binary executable' ], useCases: ['Cloud Platforms (Docker, Kubernetes)', 'High-Speed Microservices', 'DevOps Tools', 'Network Infrastructure'], links: [ { label: 'A Tour of Go (Interactive)', url: 'https://go.dev/tour/' }, { label: 'Official Go Documentation', url: 'https://go.dev/doc/' } ] }, { name: 'Rust', tagline: 'Maximum Speed Without System Crashes', color: '#CE412B', bg: '#FFF7ED', whatItIs: 'Rust gives you the speed of C++ with memory safety. It guarantees that software will not crash due to memory leaks or unexpected buffer glitches.', keyConcepts: [ 'Understanding Ownership — how Rust automatically manages memory', 'Sharing data safely across code using Borrowing (&)', 'Handling all possible conditions cleanly with pattern matching (match)', 'Managing packages, builds, and tests using the Cargo tool', 'Building high-security web servers, crypto engines, and WebAssembly apps' ], useCases: ['Systems & Kernel Development', 'WebAssembly (Wasm) Applications', 'High-Performance Networking', 'Blockchain & Security Engines'], links: [ { label: 'The Rust Programming Language Book', url: 'https://doc.rust-lang.org/book/' }, { label: 'Rust by Example', url: 'https://doc.rust-lang.org/rust-by-example/' } ] }, { name: 'C# (.NET)', tagline: 'Modern, Versatile & Game-Ready', color: '#239120', bg: '#ECFDF5', whatItIs: 'Created by Microsoft, C# is an elegant language widely used for building 3D/2D games in Unity, Windows desktop applications, and web services.', keyConcepts: [ 'Writing clean Object-Oriented code with concise Properties', 'Filtering, searching, and sorting data in 1 line using LINQ', 'Building immersive video games with the Unity Game Engine', 'Creating high-speed web APIs using ASP.NET Core', 'Building cross-platform desktop & mobile apps with .NET MAUI' ], useCases: ['Unity 3D/2D Game Development', 'Enterprise Web Backends (ASP.NET Core)', 'Windows Desktop Applications', 'Cross-Platform Apps (.NET MAUI)'], links: [ { label: 'Official Microsoft C# Documentation', url: 'https://learn.microsoft.com/en-us/dotnet/csharp/' }, { label: 'W3Schools C# Guide', url: 'https://www.w3schools.com/cs/' } ] } ]; const CS_TOOLS_CATEGORIES = [ { title: 'Programming Languages', icon: Code, color: '#3B82F6', bg: '#EFF6FF', tools: [ { name: 'Python', desc: 'High-level, beginner-friendly language for AI, Web, & Scripts.', url: '#' }, { name: 'Java', desc: 'Object-oriented enterprise language running on the JVM.', url: '#' }, { name: 'C++', desc: 'High-performance systems programming and game development.', url: '#' }, { name: 'JavaScript', desc: 'Core language of the web for frontend and backend.', url: '#' }, { name: 'TypeScript', desc: 'Strongly typed superset of JavaScript at scale.', url: '#' }, { name: 'Go (Golang)', desc: 'Fast, concurrent language for cloud & microservices.', url: '#' }, { name: 'Rust', desc: 'Ultra-fast memory-safe systems programming language.', url: '#' }, { name: 'C# (.NET)', desc: 'Versatile OOP language for games, desktop, & web backends.', url: '#' } ] }, { title: 'Version Control', icon: GitBranch, color: '#F97316', bg: '#FFF7ED', tools: [ { name: 'Source Code Management', desc: 'Git CLI distributed version control system.', url: 'https://git-scm.com/' }, { name: 'Repository Hosting', desc: 'GitHub, GitLab, Bitbucket, and Gitea platforms.', url: 'https://github.com/' }, { name: 'Git Clients', desc: 'GitHub Desktop, GitKraken, Sourcetree, and Lazygit.', url: 'https://desktop.github.com/' }, { name: 'Code Review', desc: 'GitHub Pull Requests, Crucible, and Gerrit review workflows.', url: 'https://github.com/features/code-review' } ] }, { title: 'Web Development', icon: Globe, color: '#10B981', bg: '#ECFDF5', tools: [ { name: 'Frontend Development', desc: 'React, Vue.js, Angular, Svelte, Tailwind CSS, HTML5/CSS3.', url: 'https://react.dev/' }, { name: 'Backend Development', desc: 'Spring Boot, Express.js, Django, FastAPI, NestJS.', url: 'https://spring.io/projects/spring-boot' }, { name: 'Full-Stack Development', desc: 'Next.js, Remix, Nuxt.js, and Astro full-stack frameworks.', url: 'https://nextjs.org/' }, { name: 'Static Site Generators', desc: 'Gatsby, Hugo, Jekyll, and Eleventy.', url: 'https://www.gatsbyjs.com/' }, { name: 'CMS', desc: 'WordPress, Strapi, Sanity, and Ghost Content Management Systems.', url: 'https://strapi.io/' }, { name: 'Web Performance', desc: 'Lighthouse, PageSpeed Insights, and Web Vitals analytics.', url: 'https://pagespeed.web.dev/' } ] }, { title: 'Mobile Development', icon: Smartphone, color: '#8B5CF6', bg: '#F5F3FF', tools: [ { name: 'Android Development', desc: 'Android Studio, Kotlin, Jetpack Compose, and Java.', url: 'https://developer.android.com/studio' }, { name: 'iOS Development', desc: 'Xcode, Swift, SwiftUI, and CocoaPods.', url: 'https://developer.apple.com/xcode/' }, { name: 'Cross-Platform Development', desc: 'Flutter, React Native, and Expo framework.', url: 'https://flutter.dev/' }, { name: 'Mobile Testing', desc: 'Appium, Espresso, and XCUITest automation.', url: 'https://appium.io/' }, { name: 'App Deployment', desc: 'Google Play Console, Apple App Store Connect, Fastlane.', url: 'https://play.google.com/console' } ] }, { title: 'Databases', icon: Database, color: '#06B6D4', bg: '#ECFEFF', tools: [ { name: 'Relational Databases (SQL)', desc: 'PostgreSQL, MySQL, SQLite, and Microsoft SQL Server.', url: 'https://www.postgresql.org/' }, { name: 'NoSQL Databases', desc: 'MongoDB, Cassandra, CouchDB, and DynamoDB.', url: 'https://www.mongodb.com/' }, { name: 'Graph Databases', desc: 'Neo4j, Amazon Neptune, and ArangoDB.', url: 'https://neo4j.com/' }, { name: 'Time-Series Databases', desc: 'InfluxDB, TimescaleDB, and Prometheus.', url: 'https://www.influxdata.com/' }, { name: 'In-Memory Databases', desc: 'Redis, Memcached, and Dragonfly.', url: 'https://redis.io/' }, { name: 'Database Administration', desc: 'pgAdmin, DBeaver, DataGrip, and phpMyAdmin.', url: 'https://www.dbeaver.io/' }, { name: 'Database Modeling', desc: 'dbdiagram.io, Erwin, and MySQL Workbench.', url: 'https://dbdiagram.io/' } ] }, { title: 'UI / UX Design', icon: Palette, color: '#EC4899', bg: '#FDF2F8', tools: [ { name: 'Wireframing', desc: 'Balsamiq, Figma, and Whimsical wireframing.', url: 'https://balsamiq.com/' }, { name: 'Prototyping', desc: 'Figma, Adobe XD, Proto.io, and Framer.', url: 'https://www.figma.com/' }, { name: 'Design Systems', desc: 'Storybook, Material Design, and Tailwind UI.', url: 'https://storybook.js.org/' }, { name: 'User Research', desc: 'Maze, UserTesting, and Hotjar analytics.', url: 'https://maze.co/' }, { name: 'Accessibility Testing', desc: 'axe DevTools, WAVE, and Lighthouse A11y audit.', url: 'https://www.deque.com/axe/' } ] }, { title: 'Collaboration', icon: Users, color: '#EAB308', bg: '#FEFCE8', tools: [ { name: 'Documentation', desc: 'Confluence, Notion, MkDocs, and Docusaurus.', url: 'https://docusaurus.io/' }, { name: 'Team Communication', desc: 'Slack, Microsoft Teams, Discord, and Mattermost.', url: 'https://slack.com/' }, { name: 'Project Management', desc: 'Jira, Trello, Asana, and Linear ticket tracking.', url: 'https://linear.app/' }, { name: 'Whiteboarding', desc: 'Miro, FigJam, Excalidraw, and Lucidchart.', url: 'https://excalidraw.com/' }, { name: 'Knowledge Management', desc: 'Obsidian, Notion, and Slite workspace wiki.', url: 'https://obsidian.md/' } ] }, { title: 'Software Engineering', icon: Layers, color: '#D97706', bg: '#FEF3C7', tools: [ { name: 'UML & System Design', desc: 'Draw.io, PlantUML, Mermaid.js, and StarUML.', url: 'https://mermaid.js.org/' }, { name: 'Architecture Design', desc: 'C4 Model, ArchiMate, and System Architecture patterns.', url: 'https://c4model.com/' }, { name: 'Design Patterns', desc: 'Gang of Four (GoF) Creational, Structural, Behavioral patterns.', url: 'https://refactoring.guru/design-patterns' }, { name: 'Code Analysis', desc: 'SonarQube, ESLint, Pylint, and SpotBugs linters.', url: 'https://eslint.org/' }, { name: 'Debugging', desc: 'GDB, Chrome DevTools, Visual Studio Debugger, and Charles Proxy.', url: 'https://developer.chrome.com/docs/devtools/' }, { name: 'Performance Profiling', desc: 'Perf, JProfiler, Py-Spy, and Chrome Memory Profiler.', url: 'https://github.com/benfred/py-spy' } ] }, { title: 'Networking', icon: Wifi, color: '#2563EB', bg: '#EFF6FF', tools: [ { name: 'Network Analysis', desc: 'Wireshark packet capture and traffic protocol analyzer.', url: 'https://www.wireshark.org/' }, { name: 'Packet Simulation', desc: 'Cisco Packet Tracer and GNS3 network topology simulation.', url: 'https://www.netacad.com/courses/packet-tracer' }, { name: 'Port Scanning & Recon', desc: 'Nmap and Masscan network discovery tools.', url: 'https://nmap.org/' }, { name: 'API & HTTP Debugging', desc: 'Postman, Fiddler, and Charles Proxy HTTP inspection.', url: 'https://www.postman.com/' }, { name: 'Remote Terminal & SSH', desc: 'PuTTY, OpenSSH, and Termius terminal clients.', url: 'https://www.putty.org/' } ] } ]; const BUSINESS_TOOLS_CATEGORIES = [ { title: 'Accounting & Finance', icon: DollarSign, color: '#10B981', bg: '#ECFDF5', tools: [ { name: 'QuickBooks', desc: 'Cloud accounting software for small and mid-sized businesses.', url: 'https://quickbooks.intuit.com/' }, { name: 'Tally Prime', desc: 'India\'s leading accounting and inventory management solution.', url: 'https://tallysolutions.com/' }, { name: 'Zoho Books', desc: 'Online accounting software for growing businesses.', url: 'https://www.zoho.com/books/' } ] }, { title: 'Business Intelligence', icon: BarChart3, color: '#3B82F6', bg: '#EFF6FF', tools: [ { name: 'Power BI', desc: 'Microsoft\'s interactive data visualization and BI tool.', url: 'https://powerbi.microsoft.com/' }, { name: 'Tableau', desc: 'Visual analytics platform for data-driven decisions.', url: 'https://www.tableau.com/' }, { name: 'Google Looker', desc: 'Business intelligence and data analytics by Google Cloud.', url: 'https://cloud.google.com/looker' } ] }, { title: 'CRM', icon: Users, color: '#8B5CF6', bg: '#F5F3FF', tools: [ { name: 'Salesforce', desc: 'World\'s leading CRM platform for sales and support.', url: 'https://www.salesforce.com/' }, { name: 'HubSpot CRM', desc: 'Free CRM with marketing, sales, and service tools.', url: 'https://www.hubspot.com/products/crm' }, { name: 'Zoho CRM', desc: 'AI-powered CRM for customer lifecycle management.', url: 'https://www.zoho.com/crm/' } ] }, { title: 'Marketing', icon: Megaphone, color: '#EC4899', bg: '#FDF2F8', tools: [ { name: 'Google Ads', desc: 'Online advertising platform for paid search and display.', url: 'https://ads.google.com/' }, { name: 'Mailchimp', desc: 'Email marketing and automation platform.', url: 'https://mailchimp.com/' }, { name: 'Canva', desc: 'Design tool for social media graphics and presentations.', url: 'https://www.canva.com/' } ] }, { title: 'Sales', icon: TrendingUp, color: '#F97316', bg: '#FFF7ED', tools: [ { name: 'LinkedIn Sales Navigator', desc: 'Advanced lead generation and prospecting tool.', url: 'https://business.linkedin.com/sales-solutions' }, { name: 'Pipedrive', desc: 'Sales CRM and pipeline management tool.', url: 'https://www.pipedrive.com/' }, { name: 'Freshsales', desc: 'AI-powered sales CRM for high-velocity teams.', url: 'https://www.freshworks.com/crm/sales/' } ] }, { title: 'Human Resources (HR)', icon: UserCheck, color: '#06B6D4', bg: '#ECFEFF', tools: [ { name: 'BambooHR', desc: 'HR software for employee records, onboarding, and PTO.', url: 'https://www.bamboohr.com/' }, { name: 'Workday', desc: 'Enterprise cloud platform for finance, HR, and planning.', url: 'https://www.workday.com/' }, { name: 'Zoho People', desc: 'Cloud HRMS software for managing employee operations.', url: 'https://www.zoho.com/people/' } ] }, { title: 'Project & Operations', icon: ClipboardList, color: '#D97706', bg: '#FEF3C7', tools: [ { name: 'Asana', desc: 'Work management platform to organize team projects.', url: 'https://asana.com/' }, { name: 'Trello', desc: 'Kanban-style project management and list tool.', url: 'https://trello.com/' }, { name: 'Smartsheet', desc: 'Enterprise platform for dynamic work and project management.', url: 'https://www.smartsheet.com/' } ] }, { title: 'E-Commerce', icon: ShoppingCart, color: '#6366F1', bg: '#EEF2FF', tools: [ { name: 'Shopify', desc: 'E-commerce platform for online stores and retail POS.', url: 'https://www.shopify.com/' }, { name: 'WooCommerce', desc: 'Open-source e-commerce plugin for WordPress.', url: 'https://woocommerce.com/' }, { name: 'Magento (Adobe Commerce)', desc: 'Flexible enterprise e-commerce platform.', url: 'https://business.adobe.com/products/magento/magento-commerce.html' } ] } ]; const EE_TOOLS_CATEGORIES = [ { title: 'Circuit Simulation & CAD', icon: Cpu, color: '#D97706', bg: '#FEF3C7', tools: [ { name: 'LTspice', desc: 'High-performance SPICE simulation software for analog circuits.', url: 'https://www.analog.com/en/design-center/design-tools-and-calculators/ltspice-simulator.html' }, { name: 'Proteus Design Suite', desc: 'Circuit simulation, schematic capture, and PCB layout.', url: 'https://www.labcenter.com/' }, { name: 'Multisim (NI)', desc: 'SPICE simulation and circuit design environment.', url: 'https://www.ni.com/en-in/shop/electronic-test-instrumentation/application-software-for-electronic-test-and-instrumentation-category/what-is-multisim.html' } ] }, { title: 'Computation & Analysis', icon: Activity, color: '#0284C7', bg: '#E0F2FE', tools: [ { name: 'MATLAB', desc: 'Numerical computing environment for algorithms and data analysis.', url: 'https://www.mathworks.com/products/matlab.html' }, { name: 'Simulink', desc: 'Block diagram environment for multi-domain simulation.', url: 'https://www.mathworks.com/products/simulink.html' }, { name: 'LabVIEW', desc: 'System design software for test, measurement, and control.', url: 'https://www.ni.com/en-in/shop/labview.html' } ] }, { title: 'PCB Design', icon: LayoutGrid, color: '#16A34A', bg: '#DCFCE7', tools: [ { name: 'KiCad EDA', desc: 'Open-source electronics design automation suite.', url: 'https://www.kicad.org/' }, { name: 'Altium Designer', desc: 'PCB design and electronics development software.', url: 'https://www.altium.com/' }, { name: 'Eagle (Autodesk)', desc: 'PCB layout and schematic editing software.', url: 'https://www.autodesk.com/products/eagle/overview' } ] }, { title: 'Embedded Systems', icon: Layers, color: '#7C3AED', bg: '#F3E8FF', tools: [ { name: 'STM32CubeIDE', desc: 'C/C++ development platform for STM32 microcontrollers.', url: 'https://www.st.com/en/development-tools/stm32cubeide.html' }, { name: 'Keil uVision', desc: 'IDE for ARM cortex microcontroller programming.', url: 'https://www.keil.com/' }, { name: 'Arduino IDE', desc: 'Open-source software for microcontroller board programming.', url: 'https://www.arduino.cc/en/software' } ] }, { title: 'Power Systems', icon: Zap, color: '#EA580C', bg: '#FFEDD5', tools: [ { name: 'ETAP', desc: 'Electrical power system analysis and operation software.', url: 'https://etap.com/' }, { name: 'PSCAD', desc: 'Power system transient simulation environment.', url: 'https://www.pscad.com/' }, { name: 'PowerWorld Simulator', desc: 'Power system visual analysis and power flow tool.', url: 'https://www.powerworld.com/' } ] }, { title: 'Control Systems', icon: Settings, color: '#059669', bg: '#D1FAE5', tools: [ { name: 'Control System Toolbox (MATLAB)', desc: 'Tools for analyzing and designing control systems.', url: 'https://www.mathworks.com/products/control.html' }, { name: 'Scilab Xcos', desc: 'Open-source graphical editor for dynamic systems simulation.', url: 'https://www.scilab.org/' } ] }, { title: 'Instrumentation', icon: Gauge, color: '#4F46E5', bg: '#EEF2FF', tools: [ { name: 'NI MAX (Measurement & Automation Explorer)', desc: 'Configuration tool for NI hardware devices.', url: 'https://www.ni.com/' }, { name: 'Keysight PathWave', desc: 'Test and measurement software suite.', url: 'https://www.keysight.com/' } ] }, { title: 'Signal Processing', icon: Radio, color: '#DB2777', bg: '#FCE7F3', tools: [ { name: 'GNU Radio', desc: 'Software development toolkit for signal processing & SDR.', url: 'https://www.gnuradio.org/' }, { name: 'DSP System Toolbox (MATLAB)', desc: 'Design and simulate signal processing systems.', url: 'https://www.mathworks.com/products/dsp-system.html' } ] } ]; const CYBERSECURITY_TOOLS_CATEGORIES = [ { title: 'Network Scanner', icon: Wifi, color: '#3B82F6', bg: '#EFF6FF', tools: [ { name: 'Nmap', desc: 'Network discovery and vulnerability scanning security auditor.', url: 'https://nmap.org/' }, { name: 'Masscan', desc: 'Ultra-fast IP port scanner capable of scanning the whole internet.', url: 'https://github.com/robertdavidgraham/masscan' }, { name: 'Angry IP Scanner', desc: 'Fast and friendly network scanner for desktop platforms.', url: 'https://angryip.org/' } ] }, { title: 'Penetration Testing', icon: ShieldCheck, color: '#8B5CF6', bg: '#F5F3FF', tools: [ { name: 'Metasploit Framework', desc: 'World\'s most used penetration testing framework.', url: 'https://www.metasploit.com/' }, { name: 'Burp Suite', desc: 'Leading web security testing and vulnerability scanner.', url: 'https://portswigger.net/burp' }, { name: 'OWASP ZAP', desc: 'Open-source web application security scanner.', url: 'https://www.zaproxy.org/' } ] }, { title: 'Forensics', icon: Terminal, color: '#06B6D4', bg: '#ECFEFF', tools: [ { name: 'Autopsy', desc: 'Digital forensics platform and GUI for The Sleuth Kit.', url: 'https://www.autopsy.com/' }, { name: 'Volatility', desc: 'Advanced memory forensics framework for incident response.', url: 'https://www.volatilityfoundation.org/' }, { name: 'FTK Imager', desc: 'Data preview and forensic imaging tool.', url: 'https://www.exterro.com/ftk-imager' } ] }, { title: 'Cryptography', icon: Lock, color: '#EC4899', bg: '#FDF2F8', tools: [ { name: 'OpenSSL', desc: 'Robust commercial-grade cryptography toolkit and SSL/TLS CLI.', url: 'https://www.openssl.org/' }, { name: 'CyberChef', desc: 'The Cyber Swiss Army Knife for encryption, encoding, and data analysis.', url: 'https://gchq.github.io/CyberChef/' }, { name: 'VeraCrypt', desc: 'Free open-source disk encryption software based on TrueCrypt.', url: 'https://www.veracrypt.fr/' } ] }, { title: 'Malware Analysis', icon: Bot, color: '#EF4444', bg: '#FEF2F2', tools: [ { name: 'Ghidra', desc: 'NSA reverse engineering framework for software analysis.', url: 'https://ghidra-sre.org/' }, { name: 'IDA Free', desc: 'Interactive disassembler for binary malware analysis.', url: 'https://hex-rays.com/ida-free/' }, { name: 'Cuckoo Sandbox', desc: 'Automated malware analysis system.', url: 'https://cuckoosandbox.org/' } ] }, { title: 'Identity Management', icon: UserCheck, color: '#10B981', bg: '#ECFDF5', tools: [ { name: 'HashiCorp Vault', desc: 'Manage secrets, keys, and credentials securely.', url: 'https://www.vaultproject.io/' }, { name: 'Keycloak', desc: 'Open-source identity and access management for modern apps.', url: 'https://www.keycloak.org/' }, { name: 'Okta', desc: 'Enterprise identity cloud platform for workforce authentication.', url: 'https://www.okta.com/' } ] } ]; const AI_TOOLS_CATEGORIES = [ { title: 'Machine Learning Frameworks', icon: BrainCircuit, color: '#EC4899', bg: '#FDF2F8', tools: [ { name: 'PyTorch', desc: 'Leading open-source deep learning framework by Meta.', url: 'https://pytorch.org/' }, { name: 'TensorFlow', desc: 'End-to-end open-source machine learning platform by Google.', url: 'https://www.tensorflow.org/' }, { name: 'Scikit-Learn', desc: 'Simple and efficient tools for predictive data analysis in Python.', url: 'https://scikit-learn.org/' } ] }, { title: 'LLM & Generative AI', icon: Bot, color: '#8B5CF6', bg: '#F5F3FF', tools: [ { name: 'Hugging Face Transformers', desc: 'Thousands of pretrained models for NLP, Vision, & Audio.', url: 'https://huggingface.co/' }, { name: 'LangChain', desc: 'Framework for developing applications powered by language models.', url: 'https://www.langchain.com/' }, { name: 'Ollama', desc: 'Run large language models locally on your machine.', url: 'https://ollama.com/' } ] }, { title: 'Computer Vision', icon: Microscope, color: '#3B82F6', bg: '#EFF6FF', tools: [ { name: 'OpenCV', desc: 'Open-source computer vision and machine learning software library.', url: 'https://opencv.org/' }, { name: 'YOLOv8 (Ultralytics)', desc: 'Real-time object detection and image segmentation.', url: 'https://www.ultralytics.com/' }, { name: 'MediaPipe', desc: 'Cross-platform ML solutions for live and streaming media.', url: 'https://developers.google.com/mediapipe' } ] }, { title: 'Natural Language Processing (NLP)', icon: Sparkles, color: '#10B981', bg: '#ECFDF5', tools: [ { name: 'spaCy', desc: 'Industrial-strength Natural Language Processing in Python.', url: 'https://spacy.io/' }, { name: 'NLTK', desc: 'Natural Language Toolkit for symbolic and statistical NLP.', url: 'https://www.nltk.org/' }, { name: 'Gensim', desc: 'Topic modeling and document similarity analysis for human language.', url: 'https://radimrehurek.com/gensim/' } ] }, { title: 'Data Annotation & MLOps', icon: Database, color: '#F97316', bg: '#FFF7ED', tools: [ { name: 'MLflow', desc: 'Open-source platform to manage the ML lifecycle.', url: 'https://mlflow.org/' }, { name: 'Label Studio', desc: 'Multi-type data labeling and annotation tool.', url: 'https://labelstud.io/' }, { name: 'Weights & Biases (W&B)', desc: 'Developer platform for machine learning experiment tracking.', url: 'https://wandb.ai/' } ] } ]; const BIOTECH_TOOLS_CATEGORIES = [ { title: 'Bioinformatics & Sequence Analysis', icon: Dna, color: '#06B6D4', bg: '#ECFEFF', tools: [ { name: 'NCBI BLAST', desc: 'Basic Local Alignment Search Tool for nucleotide & protein sequences.', url: 'https://blast.ncbi.nlm.nih.gov/Blast.cgi' }, { name: 'Biopython', desc: 'Freely available Python tools for computational molecular biology.', url: 'https://biopython.org/' }, { name: 'Clustal Omega', desc: 'Multiple sequence alignment program for DNA/RNA/protein.', url: 'https://www.ebi.ac.uk/Tools/msa/clustalo/' } ] }, { title: 'Molecular Modeling & Visualization', icon: FlaskConical, color: '#10B981', bg: '#ECFDF5', tools: [ { name: 'PyMOL', desc: 'Molecular visualization system on an open-source foundation.', url: 'https://pymol.org/' }, { name: 'UCSF ChimeraX', desc: 'Next-generation interactive molecular visualization and analysis.', url: 'https://www.rbvi.ucsf.edu/chimerax/' }, { name: 'AutoDock Vina', desc: 'Molecular docking program for drug discovery and structural biology.', url: 'https://vina.scripps.edu/' } ] }, { title: 'Genomics & Next-Gen Sequencing', icon: Microscope, color: '#8B5CF6', bg: '#F5F3FF', tools: [ { name: 'SAMtools', desc: 'Utilities for interacting with high-throughput sequencing data.', url: 'http://www.htslib.org/' }, { name: 'FASTQC', desc: 'Quality control tool for high-throughput sequence data.', url: 'https://www.bioinformatics.babraham.ac.uk/projects/fastqc/' }, { name: 'IGV (Integrative Genomics Viewer)', desc: 'High-performance interactive visualization tool for genomic data.', url: 'https://igv.org/' } ] } ]; export default function Toolkit() { const [searchParams, setSearchParams] = useSearchParams(); const selectedToolkit = searchParams.get('toolkit'); const [selectedCategory, setSelectedCategory] = useState(null); const [selectedLanguage, setSelectedLanguage] = useState(null); const [selectedTool, setSelectedTool] = useState<{ name: string; desc: string; url: string; category: string; bg: string; color: string } | null>(null); const setSelectedToolkit = (value: string | null) => { if (value) { setSearchParams({ toolkit: value }); setSelectedCategory(null); setSelectedLanguage(null); setSelectedTool(null); } else { setSearchParams({}); setSelectedCategory(null); setSelectedLanguage(null); setSelectedTool(null); } }; const toolkitRef = useRef(null); return (
{/* Header */} {!selectedToolkit && (
Home Student Toolkit

Student{' '} Toolkit

Access specialized development environments, IDE configurations, compiler guides, and department toolkits.

)}
{selectedToolkit ? ( (() => { const TOOLKIT_MAP: Record = { cs: { categories: CS_TOOLS_CATEGORIES, label: 'Computer Science' }, business: { categories: BUSINESS_TOOLS_CATEGORIES, label: 'Business' }, electrical: { categories: EE_TOOLS_CATEGORIES, label: 'Electrical & Electronics' }, cybersecurity: { categories: CYBERSECURITY_TOOLS_CATEGORIES, label: 'Cybersecurity' }, ai: { categories: AI_TOOLS_CATEGORIES, label: 'Artificial Intelligence' }, biotech: { categories: BIOTECH_TOOLS_CATEGORIES, label: 'Biotechnology' }, }; const current = TOOLKIT_MAP[selectedToolkit]; if (!current) return null; const { categories, label } = current; return (
{/* Back Button and Title */}

{label} Toolkit

{selectedLanguage !== null ? `Complete beginner guide, core concepts, use cases, and resources for ${PROGRAMMING_LANGUAGES_GUIDES[selectedLanguage].name}.` : selectedCategory !== null ? `Browse essential ${categories[selectedCategory].title} software, guides, and developer resources.` : `Explore all categories and tools curated for ${label} students.`}

{/* Main Content Area */} {selectedLanguage !== null ? ( /* ── Detailed Programming Language Guide View ── */ (() => { const guide = PROGRAMMING_LANGUAGES_GUIDES[selectedLanguage]; return (

{guide.name}

{guide.tagline}

{guide.whatItIs}

Key Concepts to Learn

    {guide.keyConcepts.map((concept, idx) => (
  • • {concept}
    • ))}

Real-World Use Cases

{guide.useCases.map((useCase, idx) => ( {useCase} ))}

Official Documentation & Courses

{guide.links.map((link, idx) => ( {link.label} ))}
); })() ) : selectedCategory !== null ? ( /* ── Tools inside selected Category ── */ (() => { const cat = categories[selectedCategory]; const IconComp = cat.icon; return (

{cat.title}

{cat.tools.length} software tools & resources available

{cat.tools.map((tool, idx) => ( { if (selectedToolkit === 'cs' && selectedCategory === 0) { setSelectedLanguage(idx); } else { setSelectedTool({ ...tool, category: cat.title, bg: cat.bg, color: cat.color }); } }} className="p-6 bg-white hover:bg-[#FFF7ED] rounded-2xl border border-[#E5E7EB] hover:border-[#FED7AA] cursor-pointer group transition-all flex flex-col justify-between" >

{tool.name}

{tool.desc}

{selectedToolkit === 'cs' && selectedCategory === 0 ? 'View Beginner Guide & Concepts' : 'Explore Tool & Resources'} ))}
); })() ) : ( /* ── Category Cards Grid ── */
{categories.map((cat, idx) => { const IconComp = cat.icon; return ( setSelectedCategory(idx)} className="p-7 bg-white hover:bg-[#FFF7ED] rounded-[22px] border border-[#E5E7EB] hover:border-[#FED7AA] cursor-pointer group transition-all shadow-xs flex flex-col justify-between" >

{cat.title}

{cat.tools.length} curated tools and guides available.

Browse Tools
); })}
)}
); })() ) : (
{/* Toolkit Section Main */}
{TOOLKIT_ITEMS.map((item) => { const iconConfig = TOOLKIT_ICONS[item.title] || { icon: Code, bg: '#FFF7ED', color: '#F97316' }; const IconComponent = iconConfig.icon; return ( { if (item.title === 'CS tools') { setSelectedToolkit('cs'); } else if (item.title === 'Business tools') { setSelectedToolkit('business'); } else if (item.title === 'Electrical and Electronic tools') { setSelectedToolkit('electrical'); } else if (item.title === 'Cybersecurity tools') { setSelectedToolkit('cybersecurity'); } else if (item.title === 'AI tools') { setSelectedToolkit('ai'); } else if (item.title === 'Biotech tools') { setSelectedToolkit('biotech'); } else if (item.url && item.url !== '#') { window.open(item.url, '_blank'); } }} whileHover={{ y: -4, boxShadow: '0 12px 30px -10px rgba(249,115,22,0.15)' }} className="flex items-start gap-5 p-7 bg-white hover:bg-[#FFF7ED] rounded-[22px] border border-[#E5E7EB] hover:border-[#FED7AA] cursor-pointer group w-full transition-all shadow-xs hover:shadow-md" >
{item.title}
{item.description}
); })}
)}
{/* Tool Modal */} {selectedTool && (

{selectedTool.name}

{selectedTool.category}

{selectedTool.desc}

{selectedTool.url && selectedTool.url !== '#' && ( Visit Official Website )}
)}
); }