{"id":15637093,"url":"https://github.com/raathigesh/semantic-edit","last_synced_at":"2026-03-04T03:01:34.106Z","repository":{"id":83260026,"uuid":"46166710","full_name":"Raathigesh/semantic-edit","owner":"Raathigesh","description":":pencil2: Real-time Preview Enabled Semantic UI Composer","archived":false,"fork":false,"pushed_at":"2018-06-30T10:47:34.000Z","size":2423,"stargazers_count":110,"open_issues_count":1,"forks_count":12,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-04-15T21:43:06.844Z","etag":null,"topics":["composer","dev-tool","online-editor","semantic-ui"],"latest_commit_sha":null,"homepage":"http://raathigesh.com/semantic/","language":"JavaScript","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/Raathigesh.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}},"created_at":"2015-11-14T08:02:28.000Z","updated_at":"2024-07-29T12:17:55.000Z","dependencies_parsed_at":null,"dependency_job_id":"c5330cc8-37ce-4bec-84c5-3c19dfe8145d","html_url":"https://github.com/Raathigesh/semantic-edit","commit_stats":{"total_commits":32,"total_committers":3,"mean_commits":"10.666666666666666","dds":0.1875,"last_synced_commit":"965d8bb87b41c8cdc4f0d2dca4adf8d76012534e"},"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/Raathigesh/semantic-edit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Raathigesh%2Fsemantic-edit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Raathigesh%2Fsemantic-edit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Raathigesh%2Fsemantic-edit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Raathigesh%2Fsemantic-edit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Raathigesh","download_url":"https://codeload.github.com/Raathigesh/semantic-edit/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Raathigesh%2Fsemantic-edit/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30070479,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-04T01:03:42.280Z","status":"online","status_checked_at":"2026-03-04T02:00:07.464Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["composer","dev-tool","online-editor","semantic-ui"],"created_at":"2024-10-03T11:09:58.230Z","updated_at":"2026-03-04T03:01:34.092Z","avatar_url":"https://github.com/Raathigesh.png","language":"JavaScript","readme":"![Logo](https://raw.githubusercontent.com/Raathigesh/SemanticEdit/master/assets/SemanticEditLogo.png)\n\n# SemanticEdit - http://raathigesh.com/semantic/\nReal-time Preview Enabled [Semantic UI](http://raathigesh.com/semantic/) Composer\n\n## How?\nCopy the following Semantic-UI markup to [Semantic Edit](http://raathigesh.com/semantic/) editor.\n\n```html\n\u003cdiv class=\"ui card\"\u003e\n  \u003cdiv class=\"image\"\u003e\n    \u003cimg src=\"http://semantic-ui.com/images/avatar2/large/kristy.png\"\u003e\n  \u003c/div\u003e\n  \u003cdiv class=\"content\"\u003e\n    \u003ca class=\"header\"\u003eKristy\u003c/a\u003e\n    \u003cdiv class=\"meta\"\u003e\n      \u003cspan class=\"date\"\u003eJoined in 2013\u003c/span\u003e\n    \u003c/div\u003e\n    \u003cdiv class=\"description\"\u003e\n      Kristy is an art director living in New York.\n    \u003c/div\u003e\n  \u003c/div\u003e\n  \u003cdiv class=\"extra content\"\u003e\n    \u003ca\u003e\n      \u003ci class=\"user icon\"\u003e\u003c/i\u003e\n      22 Friends\n    \u003c/a\u003e\n  \u003c/div\u003e\n\u003c/div\u003e\n```\nYou could copy and paste any [Semantic UI components](http://semantic-ui.com/elements/button.html).\n\n## But Why?\n[Semantic UI](http://semantic-ui.com) is an awesome library with excellent components that you can use to quickly\nbuild web interfaces. But I felt like it would be nicer if we can compose bunch of elements and see in realtime how they\nfit together. That's why Semantic Edit.\n\n## Features\n- Beautifier\n\n## Run \u0026 Build from sourcecode\nClone the sourcecode: \n```\ngit clone https://github.com/Raathigesh/semantic-edit.git\n```\nInstall the dependencies:\n\n```\nnpm install\n```\n\nInstall webpack and the development server:\n\n```\nnpm i webpack-dev-server webpack -g\n```\n\nYou can simply run webpack build using this command: \n\n```\nnpm run build\n```\n\nIf you want to run with webpack-dev-server simply run this command: \n\n```\nnpm run dev\n```\n\nOpen the web browser to `http://localhost:8080/`\n\n\n## What's Under the Hood?\nJavaScript! \n\nSemanticEdit uses the following\n- [Semantic UI](http://semantic-ui.com)\n- [React JS](https://facebook.github.io/react/)\n- [WebPack Build System](https://webpack.github.io/)\n- [Ace Editor](https://ace.c9.io/#nav=about) \u0026 [react-ace](https://www.npmjs.com/package/react-ace)\n\n## That's It?\nI'm hoping to add features as I move along. Got a feature suggestion? Would love to hear about it. Please create a new issues. \n\n## Stay Updated\n- Follow us [@SemanticEdit](https://twitter.com/SemanticEdit)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fraathigesh%2Fsemantic-edit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fraathigesh%2Fsemantic-edit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fraathigesh%2Fsemantic-edit/lists"}