{"id":27779350,"url":"https://github.com/likedreamwalker/mirrorlake","last_synced_at":"2025-04-30T09:58:11.794Z","repository":{"id":287350785,"uuid":"964437308","full_name":"LikeDreamwalker/mirrorlake","owner":"LikeDreamwalker","description":"AI powered Color Agent App.","archived":false,"fork":false,"pushed_at":"2025-04-27T16:45:55.000Z","size":11747,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-27T17:19:45.599Z","etag":null,"topics":["ai","color-picker","colord","colors","design","mcp-client","nextjs","python","react","shadcn-ui","theme","tool-calling","vercel","zustand"],"latest_commit_sha":null,"homepage":"https://mirrorlake.ldwid.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/LikeDreamwalker.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-04-11T08:02:16.000Z","updated_at":"2025-04-27T16:43:51.000Z","dependencies_parsed_at":"2025-04-18T12:00:09.450Z","dependency_job_id":null,"html_url":"https://github.com/LikeDreamwalker/mirrorlake","commit_stats":null,"previous_names":["likedreamwalker/mirrorlake"],"tags_count":3,"template":false,"template_full_name":"ldw-templates/nextjs-shadcn-template","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LikeDreamwalker%2Fmirrorlake","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LikeDreamwalker%2Fmirrorlake/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LikeDreamwalker%2Fmirrorlake/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LikeDreamwalker%2Fmirrorlake/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LikeDreamwalker","download_url":"https://codeload.github.com/LikeDreamwalker/mirrorlake/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251682340,"owners_count":21626946,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai","color-picker","colord","colors","design","mcp-client","nextjs","python","react","shadcn-ui","theme","tool-calling","vercel","zustand"],"created_at":"2025-04-30T09:58:10.625Z","updated_at":"2025-04-30T09:58:11.788Z","avatar_url":"https://github.com/LikeDreamwalker.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Mirrorlake Color Agent\n\nAn aggregated color agent with LLM, engineering, and other AI capabilities.\n\n![Screen Shot](public/screenshot.png)\n\n## Getting Started\n\n### Online\n\nVisit [mirrorlake.ldwid.com](https://mirrorlake.ldwid.com).\n\n\u003e _The online version is hosted on Vercel and uses my own DeepSeek API key._\n\u003e\n\u003e _The online version and the original project won't save your data on the server side._\n\n### Local\n\n\u003e **This project is designed to deploy on Vercel.**\n\u003e\n\u003e If you want to deploy on other services (including your own server), you should extract the Python part to an independent service.\n\u003e\n\u003e _Before you get started, please make sure you have Python 3.12+ in your local environment_\n\n1. Clone this repository\n2. Run `python3 -m venv venv`\n3. Run `source venv/bin/activate` on Mac or `venv\\Scripts\\activate` on Windows\n4. Install dependencies with `pnpm i`\n5. Run the development server with `pnpm dev`\n6. Open [http://localhost:3000](http://localhost:3000) with your browser to see the app\n7. To use the Reasoning Engine, you need to set up the DeepSeek API KEY in the `.env.local` file. We're using AI SDK, so you can change the actual reasoning engine to any provider you prefer.\n\n```bash\nDEEPSEEK_API_KEY=your_deepseek_api_key\n```\n\n## How to Use\n\nYou can pick a color from the color picker and view related basic color information. The agent will also provide advice about this color.\n\nYou can also talk to the agent to perform various tasks, such as:\n\n- \"Give me a random color\"\n- \"Give me a 'You need a blue sky holiday' theme and add it to my theme\"\n- \"Reset my theme to default\"\n- \"Tell me more about `#0066FF`\"\n\n## Annotation\n\n### What is this agent about?\n\nThe Color Picker, or the Color Agent idea, comes from my earlier project [Mirrorlake Theme Editor](https://github.com/LikeDreamwalker/mirrorlake-theme-editor), which I used to help myself set up custom themes in Vuetify.\n\nBuilding on this foundation, I developed Mirrorlake as a complete modern AI agent, aimed at offering a better experience in selecting colors and building themes. It uses AI to replace some traditional UI/UX elements and manual tasks.\n\n\u003e _This project is not designed for commercial use, but rather serves as a best practice template for myself, incorporating multiple capabilities I use today._\n\n### Details\n\nMirrorlake uses a multi-layered architecture:\n\n- **Client Side Runtime (Next.js Client Side)**: Handles states and responds to user actions immediately\n- **Server Side Runtime (Hybrid)**: Controls basic logic and computing, bridging the client side and reasoning engine\n  - **Next.js Server Side**: Handles rendering, routing, and API calls; connects to edge services and the reasoning engine\n    - Reserved for connecting to databases and fetching specific data\n  - **Python Server Side**: Handles complex computing and color analysis jobs; runs on Vercel Edge Services or with Liquid Computing\n    - Since Mirrorlake is designed for Vercel deployment, its actual power is limited by Edge Services. It would be more common to build an independent Python server to handle complex computing tasks\n- **Reasoning Engine (DeepSeek Online Services)**: Handles complex logic and understands user inputs; uses Tool Calling to execute actions for users on the client side; reserved for bidirectional MCP communication\n\nFrom a business perspective, we have three service levels:\n\n- Basic color actions are handled by the Next.js Client Side\n- Color analysis is performed by the Next.js Server Side and Python Server Side working together\n- Specific user needs are addressed by the Reasoning Engine, which coordinates with both server and client sides\n\nBy working together, these components allow Mirrorlake to offer a flexible experience with lower costs.\n\n### Thanks to\n\n- **[nextjs-fastapi](https://github.com/digitros/nextjs-fastapi)** for inspiring the project structure, offering a brilliant way to combine Python Runtime and Next.js Runtime in both local and production environments.\n- **[colord](https://github.com/omgovich/colord)** for color analysis on Next.js runtime. This is the core of Mirrorlake, saving me significant time in building basic color capabilities.\n- **[color-names](https://github.com/meodai/color-names)** for generating color names. We built a server action to fetch specific color names from the Next.js Server Side, avoiding memory costs on the Client Side.\n\n...and all the dependencies this project uses!\n\n## Why This?\n\nI appreciate the AI era, but I believe we often expect too much from reasoning models while neglecting traditional engineering that can accomplish many tasks efficiently. Mirrorlake is designed with this philosophy in mind—we only use AI when truly needed and to improve performance, rather than simply offering users a chat interface to do their work. What's the difference between that and giving users a terminal to command themselves?\n\nAn agent, or an app that truly integrates AI with engineering, represents the future of AI applications.\n\n## To Contribute\n\nFeel free to open an issue or a pull request! Mirrorlake has potential for many additional features, such as asking AI to provide information about specific colors, or using AI-generated content to create images or videos based on the current theme. I don't have enough time to implement all these ideas, so if you're interested in this project, you're welcome to contribute.\n\n## License\n\nMIT License and All Rights Reserved.\n\n![LikeDreamwalker](public/ldw.svg)\n\nMeet me at [likedreamwalker.space](https://likedreamwalker.space)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flikedreamwalker%2Fmirrorlake","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flikedreamwalker%2Fmirrorlake","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flikedreamwalker%2Fmirrorlake/lists"}