Convert Figma logo to code with AI

haishanh logoyacd

Yet Another Clash Dashboard

4,027
721
4,027
69

Top Related Projects

3,710

🏀 💻 The finest NBA CLI.

A Clash GUI based on tauri. Supports Windows, macOS and Linux.

Quick Overview

yacd (Yet Another Clash Dashboard) is a web-based dashboard for Clash, a rule-based tunnel in Go. It provides a user-friendly interface for managing and monitoring Clash proxy configurations, allowing users to easily switch between different proxy modes, view traffic statistics, and manage rules.

Pros

  • Clean and intuitive user interface
  • Responsive design, works well on both desktop and mobile devices
  • Supports multiple languages
  • Lightweight and fast-loading

Cons

  • Requires a running Clash core to function
  • Limited customization options compared to some other Clash dashboards
  • May not support all advanced Clash features
  • Documentation could be more comprehensive

Getting Started

To use yacd, follow these steps:

  1. Ensure you have Clash core running on your system.
  2. Visit the yacd dashboard at https://yacd.haishan.me
  3. Enter your Clash API endpoint (usually http://127.0.0.1:9090)
  4. Click "Add" to connect to your Clash instance

Alternatively, you can self-host yacd:

# Clone the repository
git clone https://github.com/haishanh/yacd.git

# Navigate to the project directory
cd yacd

# Install dependencies
yarn install

# Build the project
yarn build

# Serve the built files
npx serve dist

Then open your browser and visit http://localhost:5000 to access the dashboard.

Competitor Comparisons

3,710

🏀 💻 The finest NBA CLI.

Pros of nba-go

  • Focused on a specific domain (NBA statistics and game information)
  • Provides a command-line interface for easy access to NBA data
  • Offers real-time game updates and player statistics

Cons of nba-go

  • Limited scope compared to yacd's broader network monitoring capabilities
  • Less actively maintained (last update was 5 years ago)
  • Fewer contributors and stars on GitHub

Code Comparison

nba-go (JavaScript):

const NBA = require('nba');
const player = await NBA.findPlayer('Stephen Curry');
console.log(player.playerId);

yacd (TypeScript):

import { getConnections } from './api';
const connections = await getConnections();
console.log(connections);

Summary

nba-go is a specialized tool for NBA enthusiasts, offering command-line access to game data and statistics. It's user-friendly for sports fans but has a narrow focus. yacd, on the other hand, is a more general-purpose network monitoring dashboard with broader applications in system administration and network management. yacd has more recent updates and a larger community, making it potentially more reliable for ongoing use and support.

A Clash GUI based on tauri. Supports Windows, macOS and Linux.

Pros of Clash Verge

  • Built as a desktop application, offering a native user experience
  • Includes a built-in Clash core, eliminating the need for separate installation
  • Supports profile subscription and automatic updates

Cons of Clash Verge

  • Limited to desktop platforms, lacking web-based accessibility
  • May have a steeper learning curve for new users due to additional features
  • Requires more system resources compared to a web-based dashboard

Code Comparison

Yacd (React):

const App = () => (
  <Provider store={store}>
    <Router>
      <Layout>
        <Switch>
          <Route exact path="/" component={Overview} />
          <Route path="/proxies" component={Proxies} />
        </Switch>
      </Layout>
    </Router>
  </Provider>
);

Clash Verge (Tauri + React):

const App = () => (
  <HashRouter>
    <Layout>
      <Routes>
        <Route path="/" element={<Overview />} />
        <Route path="/proxies" element={<Proxies />} />
      </Routes>
    </Layout>
  </HashRouter>
);

Both projects use React for the frontend, but Clash Verge integrates with Tauri for desktop application functionality. Yacd focuses on providing a web-based dashboard, while Clash Verge offers a more comprehensive desktop experience with additional features and built-in Clash core support.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

yacd

Yet Another Clash Dashboard

Usage

The site http://yacd.haishan.me is served with HTTP not HTTPS is because many browsers block requests to HTTP resources from a HTTPS website. If you think it's not safe, you could just download the zip of the gh-pages, unzip and serve those static files with a web server(like Nginx).

Docker image

docker run -p 1234:80 -d --name yacd --rm ghcr.io/haishanh/yacd:master

# and then open http://localhost:1234 in your browser

Supported URL query params

ParamDescription
hostnameHostname of the clash backend API (usually the host part of external-controller)
portPort of the clash backend API (usually the port part of external-controller)
secretClash API secret (secret in your config.yaml)
themeUI color scheme (dark, light, auto)

Development

# install dependencies
# you may install pnpm with `npm i -g pnpm`
pnpm i

# start the dev server
# then go to the url printed on the screen
pnpm start


# build optimized assets
# ready to deploy assets will be in the directory `public`
pnpm build