{"id":21279478,"url":"https://github.com/tzuyi0817/code-immediate","last_synced_at":"2025-07-11T09:31:09.006Z","repository":{"id":59360351,"uuid":"517565042","full_name":"tzuyi0817/code-immediate","owner":"tzuyi0817","description":"Online code editing and preview tool, similar to CodePen.","archived":false,"fork":false,"pushed_at":"2025-07-04T08:51:36.000Z","size":11270,"stargazers_count":7,"open_issues_count":1,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-07-04T09:44:32.520Z","etag":null,"topics":["code-editor","codepen","msw","rwd","tailwindcss","vite","vitest","vue3-typescript"],"latest_commit_sha":null,"homepage":"https://code-immediate.vercel.app","language":"JavaScript","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/tzuyi0817.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":"2022-07-25T07:38:06.000Z","updated_at":"2025-07-04T08:51:37.000Z","dependencies_parsed_at":"2023-10-11T08:53:41.891Z","dependency_job_id":"985f30c4-0dba-4a46-964e-9ce5fdd6033f","html_url":"https://github.com/tzuyi0817/code-immediate","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/tzuyi0817/code-immediate","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tzuyi0817%2Fcode-immediate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tzuyi0817%2Fcode-immediate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tzuyi0817%2Fcode-immediate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tzuyi0817%2Fcode-immediate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tzuyi0817","download_url":"https://codeload.github.com/tzuyi0817/code-immediate/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tzuyi0817%2Fcode-immediate/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264777651,"owners_count":23662525,"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":["code-editor","codepen","msw","rwd","tailwindcss","vite","vitest","vue3-typescript"],"created_at":"2024-11-21T10:23:36.345Z","updated_at":"2025-07-11T09:31:07.363Z","avatar_url":"https://github.com/tzuyi0817.png","language":"JavaScript","readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"./public/logo.png\" height=\"150\"\u003e\n\u003c/p\u003e\n\n\u003ch1 align=\"center\"\u003eCode Immediate\u003c/h1\u003e\n\n\u003cp align=\"center\"\u003e\n  This is an online code editing and preview tool, similar to \u003ccode\u003eCodePen\u003c/code\u003e.\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/tzuyi0817/code-immediate/blob/master/LICENSE\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/license/tzuyi0817/pdf-signature?color=%23facc15\" alt=\"License\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://code-immediate.vercel.app\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/code--immediate-demo-%23facc15?style=for-the-badge\" /\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cbr\u003e\n\u003cbr\u003e\n\n![image](./public/cover.png)\n\n## Features\n\n[o] Built-in many frontend templates  \n[o] Support multiple preprocessing languages  \n[o] Support `Vue 3 SFC`  \n[o] `Vue 3 SFC script` language is support `js` and `ts`  \n[o] `Vue 3 SFC template` language is support `html`, `haml`, `markdown` and `pug`  \n[o] `Vue 3 SFC style` language is support `css`, `less`, `scss`, `sass`, `stylus` and `postcss`  \n[o] Support for save code  \n[o] Built-in support for using ES module syntax on browsers using [jsdelivr](https://cdn.jsdelivr.net), [esbuild](https://esbuild.vercel.app) and [importmap](https://github.com/WICG/import-maps)  \n[o] Support code formatting  \n[o] Support setting [CDNjs](https://cdnjs.com/) for use  \n[o] Support github third-party login  \n[o] Support export `zip`  \n[o] Support embedded mode for easy use in documentation sites, making documentation examples easier  \n[o] Support sharing code URL to others to view  \n[o] Support console results to facilitate coding\n\n## Development\n\nTo get started with development, clone this repository and install dependencies using `pnpm`:\n\n```sh\ngit clone https://github.com/tzuyi0817/code-immediate.git\ncd code-immediate\npnpm install\n```\n\nThen, you can use the following commands:\n\n- `pnpm dev`: Run in development mode\n- `pnpm build`: Build for production\n- `pnpm preview`: Run a local server to preview the production build\n\n## Built-in frontend framework\n\n- React\n- Vue\n- Vue3 SFC\n- Angular\n- SolidJs\n- RxJS\n\n## Support ES module syntax\n\nCurrently, ESM can be used in `JavaScript`, `TypeScript`, `CoffeeScript`, etc. By default, if you directly import a module like this:\n\n```js\nimport moment from 'moment';\n```\n\nIt will be converted into a `script` tag and placed in the `html` head:\n\n```html\n\u003cscript src=\"https://esbuild.vercel.app/moment@latest?format=iife\"\u003e\u003c/script\u003e\n```\n\nIn the case of `script type=\"module\"` (e.g., `Vue3 SFC` or `SolidJs`), it will be converted into:\n\n```js\nimport moment from 'https://cdn.jsdelivr.net/npm/moment/+esm';\n```\n\n## Support Languages\n\n| Category | Language                                    |\n| :------- | :------------------------------------------ |\n| HTML     | Haml, Markdown, Pug                         |\n| CSS      | Less, SCSS, Sass, Stylus, PostCSS           |\n| JS       | Babel, TypeScript, CoffeeScript, LiveScript |\n\n## Technologies Used\n\n- Frontend: vue3, typescript, tailwindcss, pinia\n- Environment construction: vite, eslint, prettier\n- Code editor: monaco editor\n- File load: loadjs\n- ZIP Handling: jszip, file-saver\n- Test: vitest, @testing-library, msw\n\n## License\n\nThis project is licensed under the [MIT](./LICENSE) License.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftzuyi0817%2Fcode-immediate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftzuyi0817%2Fcode-immediate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftzuyi0817%2Fcode-immediate/lists"}