diff --git a/blog/agentic-coding-guidelines.md b/blog/agentic-coding-guidelines.md index da00ee7..b29672e 100644 --- a/blog/agentic-coding-guidelines.md +++ b/blog/agentic-coding-guidelines.md @@ -1,6 +1,6 @@ --- title: Best Practices for Efficient Agentic Coding -subTitle: Agentic Coding Best Practices +shortTitle: Agentic Coding Best Practices date: 2025-03-06 authors: [ben] tags: [ai, coding] diff --git a/blog/authors.yml b/blog/authors.yml index e028949..ba19118 100644 --- a/blog/authors.yml +++ b/blog/authors.yml @@ -5,10 +5,15 @@ ben: image_url: https://github.com/bhouston.png socials: github: bhouston - twitter: BenHouston3D + x: BenHouston3D # Updated from twitter + bluesky: benhouston.bsky.social + mastodon: '@benhouston@fosstodon.org' mycoder_team: name: MyCoder Team title: MyCoder Development Team url: https://github.com/drivecore image_url: https://github.com/drivecore.png + socials: + github: drivecore + x: mycoderAI diff --git a/docs/getting-started/linux.md b/docs/getting-started/linux.md index 831a548..abe4779 100644 --- a/docs/getting-started/linux.md +++ b/docs/getting-started/linux.md @@ -9,17 +9,43 @@ This guide will help you set up MyCoder on Linux. ## Prerequisites 1. **Node.js**: Install Node.js version 20.0.0 or higher - - Using package manager (Ubuntu/Debian): - ```bash - curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash - - sudo apt-get install -y nodejs - ``` - - Using package manager (Fedora/RHEL): - ```bash - curl -fsSL https://rpm.nodesource.com/setup_20.x | sudo bash - - sudo yum install -y nodejs - ``` - - Verify installation with `node --version` + + > **⚠️ Important:** MyCoder requires Node.js runtime to function properly. + + **Recommended: Using NVM (Node Version Manager)** + + NVM is the preferred way to install Node.js as it allows for easy version management and avoids permission issues: + + ```bash + # Install NVM + curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash + + # Reload shell configuration + source ~/.bashrc # or source ~/.zshrc + + # Install latest LTS version of Node.js + nvm install --lts + + # Set it as default + nvm use --lts + + # Verify installation + node --version + ``` + + **Alternative: Using package manager (Ubuntu/Debian):** + ```bash + curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash - + sudo apt-get install -y nodejs + ``` + + **Alternative: Using package manager (Fedora/RHEL):** + ```bash + curl -fsSL https://rpm.nodesource.com/setup_20.x | sudo bash - + sudo yum install -y nodejs + ``` + + Verify installation with `node --version` 2. **Git**: Install Git if not already available - Ubuntu/Debian: `sudo apt-get install git` diff --git a/docs/getting-started/macos.md b/docs/getting-started/macos.md index d19ac4d..47cbfc9 100644 --- a/docs/getting-started/macos.md +++ b/docs/getting-started/macos.md @@ -9,9 +9,39 @@ This guide will help you set up MyCoder on macOS. ## Prerequisites 1. **Node.js**: Install Node.js version 20.0.0 or higher - - Using Homebrew: `brew install node` - - Or download from [nodejs.org](https://nodejs.org/) - - Verify installation with `node --version` + + > **⚠️ Important:** MyCoder requires Node.js runtime to function properly. + + **Recommended: Using NVM (Node Version Manager)** + + NVM is the preferred way to install Node.js as it allows for easy version management and avoids permission issues: + + ```bash + # Install NVM + curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash + + # Reload shell configuration + source ~/.zshrc # or source ~/.bash_profile for older macOS versions + + # Install latest LTS version of Node.js + nvm install --lts + + # Set it as default + nvm use --lts + + # Verify installation + node --version + ``` + + **Alternative: Using Homebrew:** + ```bash + brew install node + ``` + + **Alternative: Direct download** + Download from [nodejs.org](https://nodejs.org/) + + Verify installation with `node --version` 2. **Git**: macOS typically comes with Git pre-installed - Verify with `git --version` diff --git a/docs/getting-started/windows.md b/docs/getting-started/windows.md index 37d44b1..080776e 100644 --- a/docs/getting-started/windows.md +++ b/docs/getting-started/windows.md @@ -9,7 +9,31 @@ This guide will help you set up MyCoder on Windows. ## Prerequisites 1. **Node.js**: Install Node.js version 20.0.0 or higher + + > **⚠️ Important:** MyCoder requires Node.js runtime to function properly. + + **Recommended: Using NVM for Windows (Node Version Manager)** + + NVM for Windows is the preferred way to install Node.js as it allows for easy version management: + + ``` + # Download and install NVM for Windows + # Visit: https://github.com/coreybutler/nvm-windows/releases + # Download the nvm-setup.exe file from the latest release + + # After installation, open a new Command Prompt and install Node.js + nvm install lts + + # Set it as default + nvm use lts + + # Verify installation + node --version + ``` + + **Alternative: Direct download** - Download from [nodejs.org](https://nodejs.org/) + - Run the installer and follow the prompts - Verify installation with `node --version` 2. **Git**: Install Git for Windows diff --git a/docusaurus.config.ts b/docusaurus.config.ts index d010cea..4fab246 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -56,6 +56,21 @@ const config: Config = { onInlineTags: 'warn', onInlineAuthors: 'warn', onUntruncatedBlogPosts: 'warn', + // Use short titles in blog sidebar + blogSidebarTitle: 'Recent Posts', + blogSidebarCount: 10, + blogTitle: 'MyCoder Blog', + postsPerPage: 5, + blogListComponent: '@theme/BlogListPage', + blogPostComponent: '@theme/BlogPostPage', + blogTagsListComponent: '@theme/BlogTagsListPage', + blogTagsPostsComponent: '@theme/BlogTagsPostsPage', + rehypePlugins: [], + beforeDefaultRemarkPlugins: [], + beforeDefaultRehypePlugins: [], + truncateMarker: //, + // Add custom transform function to use shortTitle if available + blogSidebarItemComponent: require.resolve('./src/components/BlogSidebarItem'), }, theme: { customCss: './src/css/custom.css', @@ -122,7 +137,7 @@ const config: Config = { href: 'https://discord.gg/5K6TYrHGHt', }, { - label: 'Twitter', + label: 'X (Twitter)', href: 'https://twitter.com/mycoderAI', }, ], @@ -145,7 +160,7 @@ const config: Config = { ], }, ], - copyright: `Copyright © ${new Date().getFullYear()} DriveCore, Inc. Built with Docusaurus.`, + copyright: `Copyright © ${new Date().getFullYear()} DriveCore, Inc. Built with Docusaurus.`, }, prism: { theme: prismThemes.github, diff --git a/src/components/BlogSidebarItem/index.js b/src/components/BlogSidebarItem/index.js new file mode 100644 index 0000000..6e7c3d3 --- /dev/null +++ b/src/components/BlogSidebarItem/index.js @@ -0,0 +1,14 @@ +import React from 'react'; +import Link from '@docusaurus/Link'; +import styles from './styles.module.css'; + +export default function BlogSidebarItem({permalink, title, shortTitle}) { + // Use shortTitle if available, otherwise use title + const displayTitle = shortTitle || title; + + return ( + + {displayTitle} + + ); +} \ No newline at end of file diff --git a/src/components/BlogSidebarItem/styles.module.css b/src/components/BlogSidebarItem/styles.module.css new file mode 100644 index 0000000..a87a81e --- /dev/null +++ b/src/components/BlogSidebarItem/styles.module.css @@ -0,0 +1,10 @@ +.sidebarItemLink { + display: block; + margin-bottom: 0.8rem; + color: var(--ifm-color-primary); + text-decoration: none; +} + +.sidebarItemLink:hover { + text-decoration: underline; +} \ No newline at end of file diff --git a/src/components/HomepageFeatures/index.tsx b/src/components/HomepageFeatures/index.tsx index c2551fb..6aa3207 100644 --- a/src/components/HomepageFeatures/index.tsx +++ b/src/components/HomepageFeatures/index.tsx @@ -11,32 +11,32 @@ type FeatureItem = { const FeatureList: FeatureItem[] = [ { - title: 'Easy to Use', + title: 'AI-Powered Coding Assistant', Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default, description: ( <> - Docusaurus was designed from the ground up to be easily installed and - used to get your website up and running quickly. + MyCoder leverages advanced AI models to understand your requirements + and generate high-quality code solutions in multiple programming languages. ), }, { - title: 'Focus on What Matters', + title: 'Context-Aware Responses', Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default, description: ( <> - Docusaurus lets you focus on your docs, and we'll do the chores. Go - ahead and move your docs into the docs directory. + MyCoder understands your project structure and existing code, providing + solutions that integrate seamlessly with your codebase. ), }, { - title: 'Powered by React', + title: 'Built for Developers', Svg: require('@site/static/img/undraw_docusaurus_react.svg').default, description: ( <> - Extend or customize your website layout by reusing React. Docusaurus can - be extended while reusing the same header and footer. + Designed with developer workflows in mind, MyCoder integrates with your + terminal, code editor, and development environment. ), }, diff --git a/src/pages/index.module.css b/src/pages/index.module.css index 9f71a5d..5578c10 100644 --- a/src/pages/index.module.css +++ b/src/pages/index.module.css @@ -21,3 +21,34 @@ align-items: center; justify-content: center; } + +.quickStart { + padding: 3rem 0; + background-color: var(--ifm-color-emphasis-100); +} + +.codeBlock { + background-color: var(--ifm-color-emphasis-200); + border-radius: 8px; + padding: 1rem; + overflow: auto; +} + +.docsLinks { + list-style-type: none; + padding-left: 0; +} + +.docsLinks li { + margin-bottom: 1rem; + font-size: 1.1rem; +} + +.docsLinks a { + color: var(--ifm-color-primary); + text-decoration: none; +} + +.docsLinks a:hover { + text-decoration: underline; +} diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 2e006d1..4d2d824 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -21,7 +21,7 @@ function HomepageHeader() { - Docusaurus Tutorial - 5min ⏱️ + Get Started with MyCoder @@ -29,15 +29,52 @@ function HomepageHeader() { ); } +function HomepageQuickStart() { + return ( +
+
+
+
+ Quick Start +

+ Get up and running with MyCoder in minutes. MyCoder is an AI-powered coding assistant + that helps you write better code faster. +

+
+              
+                # Install MyCoder globally
+ npm install -g mycoder

+ # Use MyCoder with a prompt
+ mycoder "Create a React component that displays a counter" +
+
+
+
+ Popular Documentation +
    +
  • Windows Setup
  • +
  • macOS Setup
  • +
  • Linux Setup
  • +
  • Usage Guide
  • +
  • Latest Updates
  • +
+
+
+
+
+ ); +} + export default function Home(): ReactNode { const {siteConfig} = useDocusaurusContext(); return ( + title={`${siteConfig.title} - AI-Powered Coding Assistant`} + description="MyCoder is an AI-powered coding assistant that helps developers write better code faster with context-aware code generation.">
+
);