{"id":27957453,"url":"https://github.com/mohyware/clip-js","last_synced_at":"2025-05-07T18:13:05.457Z","repository":{"id":291684559,"uuid":"968724213","full_name":"mohyware/clip-js","owner":"mohyware","description":"online video editor built with nextjs, remotion and ffmpeg (web assembly port) for render.","archived":false,"fork":false,"pushed_at":"2025-05-06T13:52:57.000Z","size":3145,"stargazers_count":10,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-05-07T18:13:00.516Z","etag":null,"topics":["canvas","editor","ffmpeg","nextjs","reactjs","remotion","remotion-video","render","video-editing","webassembly"],"latest_commit_sha":null,"homepage":"https://clipjs.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mohyware.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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-18T16:02:11.000Z","updated_at":"2025-05-06T16:47:35.000Z","dependencies_parsed_at":"2025-05-06T02:36:00.134Z","dependency_job_id":"6001fca8-a284-4ab7-b0e5-ceee5f225512","html_url":"https://github.com/mohyware/clip-js","commit_stats":null,"previous_names":["mohyware/clip-js"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mohyware%2Fclip-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mohyware%2Fclip-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mohyware%2Fclip-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mohyware%2Fclip-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mohyware","download_url":"https://codeload.github.com/mohyware/clip-js/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252931554,"owners_count":21827112,"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":["canvas","editor","ffmpeg","nextjs","reactjs","remotion","remotion-video","render","video-editing","webassembly"],"created_at":"2025-05-07T18:13:05.010Z","updated_at":"2025-05-07T18:13:05.446Z","avatar_url":"https://github.com/mohyware.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"## Overview\n\nThis is an online video editor built with nextjs, remotion for real-time preview and ffmpeg (web assembly port) for high-quality render.\n\n## Features\n\n- 🎞️ Real-time Preview: See immediate previews of edits.\n- 🧰 Render with ffmpeg (web assembly port) with various options supports up to 1080p export.\n- 🕹️ Interactive Timeline Editor: Precisely arrange, trim, and control media through a custom-built timeline.\n- ✂️ Element Utilities: Easily split, duplicate, and manage individual media layers.\n- 🖼️ Flexible Media Support: Import and mix videos, audio tracks, images, and text elements seamlessly.\n- 🛠️ Advanced Element Controls: Adjust properties like position, opacity, z-index and volume per element.\n- ⌨️ Keyboard Shortcuts: Quickly play, mute, move in time with arrows, split, duplicate, etc .\n\n![Alt Text](/images/image.png)\n\n## Installation\n\nClone the repo, install dependencies, and run the dev server:\n\n```bash\nnpm install\n\nnpm run dev\n```\n\nThen navigate to [http://localhost:3000](http://localhost:3000)\n\n## TODOs\n\nPrioritized tasks contributions are welcomed!\n\n- [x] render option with ffmpeg (web assembly port).\n- [x] add various font types\n- [x] option for marker to be tracked or not.\n- [x] add zoom in out for timeline **(ui)**\n- [x] duplicate and split for each element on timeline\n- [x] bug with duplicated and split elements\n- [x] z-index bug with timeline elements\n- [x] elements and timeline names bug\n- [x] font is bold in render bug\n- [x] change error and not found pages style\n- [x] add toasts **(ui)**\n- [x] Allow changing the playback time not only through the built-in Remotion player but also via the custom timeline.**(ui)**\n- [x] add loading to each page \n- [ ] shortcuts\n\t- [x] space\n\t- [x] mute\n\t- [x] split with s\n\t- [x] duplicate with d\n\t- [x] delete with del\n\t- [ ] ctrl + z\n- [ ] handle left resize in timeline elements\n- [ ] add crop, positioning to elements with react-moveable\n- [ ] functionality to separate audio from vids\n- [ ] add playback speed for vids and audio\n- [ ] add close option to each sidebars **(ui)**\n- [ ] responsive for phones **(ui)**\n- [ ] Refactor timeline components cause it has a lot of repetitive code.\n- [ ] add elements as shapes blur effects.\n- [ ] more effects for text\n- [ ] PWA Mode: So users can edit offline.\n- [ ] insert elements in timeline with https://www.npmjs.com/package/react-moveable (already used in timelines) **(ui)**\n- [ ] thumbnail for listed vids and imgs **(ui)**\n- [ ] add option to use gpu with WebGL or WebGpu library like https://github.com/diffusionstudio/core\n\nThere are also other various TODOS across the project (search with TODO)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmohyware%2Fclip-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmohyware%2Fclip-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmohyware%2Fclip-js/lists"}