Skip to content

README.md

Latest commit

 

History

History
122 lines (85 loc) · 3.35 KB

README.md

File metadata and controls

122 lines (85 loc) · 3.35 KB

Algorithm Design Canvas

License: MIT

A modern, open-source platform that transforms algorithm design from a mental process into a structured, visual workspace. Built on the principles from hiredintech's Algorithm Design Canvas, this tool helps developers, students, and interviewees better plan, document, and share their algorithmic solutions.

Live App · Report Bug · Request Feature

🌟 Features

  • 📝 Interactive Canvas Interface

    • Structured sections for constraints, ideas, test cases, and code
    • Real-time editing and auto-saving
    • Clean, intuitive UI with dark/light mode support

  • 💾 Data Management

    • Automatic local storage with offline support
    • Multiple canvas management
    • Last edited canvas tracking

  • 🛠️ Developer Experience

    • Modern React with TypeScript
    • Tailwind CSS for styling
    • TanStack Router for navigation
    • Vercel Analytics and Speed Insights

  • 🚀 Coming Soon

    • Real-time synchronization
    • Multi-user collaboration
    • Canvas sharing and export

🚀 Getting Started

Prerequisites

  • Node.js (v18 or higher)
  • npm or pnpm

Installation

  1. Clone the repository

    git clone https://github.com/kimbasn/algorithm-design-canvas.git
cd algorithm-design-canvas

  2. Install dependencies

    npm install
# or
pnpm install

  3. Start the development server

    npm run dev
# or
pnpm dev

  4. Open http://localhost:3000 in your browser

Building for Production

npm run build
# or
pnpm build

🏗️ Tech Stack

  • Frontend Framework: React 19
  • Language: TypeScript
  • Styling: Tailwind CSS
  • Routing: TanStack Router
  • Form Handling: React Hook Form + Zod
  • UI Components: Radix UI + shadcn/ui
  • State Management: React Context
  • Analytics: Vercel Analytics
  • Performance: Vercel Speed Insights
  • Build Tool: Vite

🤝 Contributing

We welcome contributions! Please follow these steps:

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

Development Guidelines

  • Follow the existing code style
  • Write meaningful commit messages
  • Add tests for new features
  • Update documentation as needed

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

  • hiredintech for the Algorithm Design Canvas concept
  • shadcn/ui for the beautiful UI components
  • All contributors who have helped shape this project

📧 Contact

Kimba SABI N'GOYE - @linkedin - <kimbasabingoye at gmail . com>

Project Link: https://github.com/kimbasn/algorithm-design-canvas