Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alisamirali/code-capture
An advanced replica of Ray.so (an influential tool for sharing code snippets) with added functionalities. Showcase captivating code screenshots effortlessly across your social media channels.
https://github.com/alisamirali/code-capture
highlightjs reactjs shadcn-ui tailwindcss vercel vite zustand
Last synced: 14 days ago
JSON representation
An advanced replica of Ray.so (an influential tool for sharing code snippets) with added functionalities. Showcase captivating code screenshots effortlessly across your social media channels.
- Host: GitHub
- URL: https://github.com/alisamirali/code-capture
- Owner: alisamirali
- Created: 2023-11-30T18:32:21.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-06-02T08:07:11.000Z (7 months ago)
- Last Synced: 2024-06-02T09:27:25.469Z (7 months ago)
- Topics: highlightjs, reactjs, shadcn-ui, tailwindcss, vercel, vite, zustand
- Language: JavaScript
- Homepage: https://code-capture.vercel.app
- Size: 142 KB
- Stars: 1
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# CodeCapture
A fully functional Ray.so clone (a powerful tool for sharing code snippets) with additional features. Share beautiful screenshots of your code on your social media platforms.
**Project live at:** [https://code-capture.vercel.app](https://code-capture.vercel.app)
[](https://code-capture.vercel.app)
---
## Features
- 10+ elegant themes (light + dark theme included).
- 12+ font styles (popular monospace fonts).
- Support for all popular languages with auto-detection and syntax highlighting.
- Multiple export options: save as SVG/PNG, copy to clipboard, and copy link.
- Other customization options like font size, padding, background, etc.
---
## Technologies used
- [React](https://es.reactjs.org/) - Front-End JavaScript library.
- [Tailwind CSS](https://tailwindcss.com/) - A utility-first CSS framework.
- [ShadCN UI](https://ui.shadcn.com) - Re-usable components built using Radix UI and Tailwind CSS.
- [Zustand](https://zustand-demo.pmnd.rs/) - Bear necessities for state management in React.
- [Highlight.js](https://highlightjs.org/) - Syntax highlighter.
- [React Simple Code Editor](https://www.npmjs.com/package/react-simple-code-editor) - Browser based code editor.
- [HTML to Image](https://www.npmjs.com/package/html-to-image) - Generates an image from a DOM node using HTML5 canvas and SVG.
- [React Hot Toast](https://react-hot-toast.com/) - Toast notifications for React.
- [React Hotkeys Hook](https://www.npmjs.com/package/react-hotkeys-hook) - A React hook for using keyboard shortcuts in components in a declarative way.
- [Resizable](https://www.npmjs.com/package/re-resizable) - A resizable component for React.
- [Vite](https://vitejs.dev/) - Frontend Tooling
---
## How to run the project on your device:
1. Clone this repo
```
git clone https://github.com/alisamirali/code-capture.git
cd code-capture
```
2. Install project dependencies
```
npm install or npm i
```
3. Run the project
```
npm run dev
```