Thanks to visit codestin.com
Credit goes to github.com

Skip to content

MAX-786/mkhismkh

Repository files navigation

MAX-786's Personal Website

Prompy Logo

This is the source code for my personal website, built using Astro. Visit the live site at mkhismkh.com.

Features

  • Portfolio Showcase - Display projects, skills, and experience in a clean, modern interface
  • Digital Garden - A knowledge management system for sharing ideas, solutions, and learnings
    • Tree/Leaf structure for organizing content
    • Growth stages to indicate content maturity
  • Authentication - Secure admin access for content management using Clerk
  • Database Integration - Content stored in Supabase
  • Responsive Design - Works seamlessly on all devices
  • Dark/Light Mode - Automatic theme switching based on user preference
  • Interactive UI - Animations and particle effects

Stack

This project uses the following technologies:

  • Astro - The web framework for content-driven websites
  • React - For interactive UI components
  • Tailwind CSS - Utility-first CSS framework
  • TypeScript - Type-safe JavaScript
  • Supabase - Open source Firebase alternative
  • Clerk - Authentication and user management

Developer Setup

Prerequisites

Getting Started

  1. Clone the repository:

    git clone https://github.com/MAX-786/mkhismkh.git
    cd mkhismkh
  2. Install dependencies:

    pnpm install
  3. Set up environment variables: Create a .env file in the root directory with the following variables:

    # Supabase
    SUPABASE_URL=your_supabase_url
    SUPABASE_KEY=your_supabase_anon_key
    
    # Clerk
    PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
    CLERK_SECRET_KEY=your_clerk_secret_key
    ADMIN_USER_IDS=comma_separated_admin_user_ids
    
  4. Start the development server:

    pnpm dev

Supabase Setup

  1. Create a new Supabase project at supabase.com
  2. Set up the following tables:
    • trees - For garden tree structure
    • leaves - For garden leaf content
    • leaf_references - For references between leaves
    • growth_stages - For metadata about content maturity
  3. Copy your project URL and anon key to the .env file

Clerk Setup

  1. Create a new Clerk application at clerk.com
  2. Configure authentication methods (email, social logins, etc.)
  3. Copy your publishable key and secret key to the .env file
  4. Add admin user IDs to the ADMIN_USER_IDS environment variable

Deployment

This project is configured for deployment on Vercel:

  1. Push your code to GitHub
  2. Connect your repository to Vercel
  3. Configure environment variables in the Vercel dashboard
  4. Deploy!

🧞 Commands

All commands are run from the root of the project, from a terminal:

Command Action
pnpm install Installs dependencies
pnpm dev Starts local dev server at localhost:4321
pnpm build Build your production site to ./dist/
pnpm preview Preview your build locally, before deploying
pnpm astro ... Run CLI commands like astro add, astro check
pnpm astro -- --help Get help using the Astro CLI
pnpm format Format code with Prettier

Update CHANGELOG

Types of changes

  • Added for new features.
  • Changed for changes in existing functionality.
  • Deprecated for soon-to-be removed features.
  • Removed for now removed features.
  • Fixed for any bug fixes.
  • Security in case of vulnerabilities.

License

MIT License - Feel free to use this code as inspiration for your own projects!

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •