# Source code editor widget

**URL:** <https://discuss.emberjs.com/t/source-code-editor-widget/16505>\
**Category:** Uncategorized\
**Created:** [April 30, 2019, 5:14pm UTC](https://discuss.emberjs.com/t/source-code-editor-widget/16505 "2019-04-30T17:14:35Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![HolgerPeters](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/holgerpeters/32/14122_2.png) [@HolgerPeters](https://discuss.emberjs.com/u/HolgerPeters)\
**Post date:** [April 30, 2019, 5:14pm UTC](https://discuss.emberjs.com/t/source-code-editor-widget/16505/1 "2019-04-30T17:14:35Z")

</div>

Hi,

I thought I’d quickly find a source editor component for an ember application on the web. Unfortunately, due to the proximity to ember editor plugins, its actually hard to find something. So, I’d like to offer source code editing in an ember application, syntax hightlighting would be a plus (goal is that the user edits Python code). Any hints / links / projects?

---

<div class="post-metadata">

**Author:** ![Panman8201](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/panman8201/32/17727_2.png) [@Panman8201](https://discuss.emberjs.com/u/Panman8201)\
**Post date:** [April 30, 2019, 5:45pm UTC](https://discuss.emberjs.com/t/source-code-editor-widget/16505/2 "2019-04-30T17:45:32Z")

</div>

It’s unclear if you’re trying to avoid an ember addon, but `ember-ace` sounds like exactly what you’re going for: [Ember Observer](https://www.emberobserver.com/addons/ember-ace)

---

<div class="post-metadata">

**Author:** ![ef4](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ef4/32/13470_2.png) [@ef4](https://discuss.emberjs.com/u/ef4)\
**Post date:** [May 1, 2019, 2:11pm UTC](https://discuss.emberjs.com/t/source-code-editor-widget/16505/3 "2019-05-01T14:11:44Z")

</div>

[CodeMirror](https://github.com/codemirror/CodeMirror) is a good, non-ember-specific library for that. You can add it to an Ember app via [ember-auto-import](https://github.com/ef4/ember-auto-import), or you can use an addon that already wraps it like [ivy-codemirror](https://github.com/IvyApp/ivy-codemirror).
