[HN Gopher] CodeMirror 6
___________________________________________________________________
CodeMirror 6
Author : gtirloni
Score : 166 points
Date : 2021-02-05 17:52 UTC (5 hours ago)
(HTM) web link (codemirror.net)
(TXT) w3m dump (codemirror.net)
| umvi wrote:
| This is such a great library, you should definitely donate to it
| if you use it or even do a support contract with the maintainer
| if it's a part of your core business (i.e. if you use it for some
| repl.it or leetcode style service where coding is central to the
| product). This is developed and maintained by a single person.
| dmitryminkovsky wrote:
| Yes Marijn spends countless hours on ProseMirror and
| CodeMirror. He does the coding, issues/PRs and support on
| discuss.(code|prose)mirror.net. It's the heart of my product
| and I will definitely contribute if possible.
| cmroanirgo wrote:
| An interesting way the dev handles the licensing, by asserting
| that commercial ventures have a social obligation to pay:
|
| > _CodeMirror is open source (MIT or GPL3). It is being developed
| on GitHub. Contributions are welcome._
|
| > _If you are using CodeMirror commercially, there is a social
| expectation that you help fund its maintenance_
| jez wrote:
| One of the things I was hoping to see in this release was first-
| class LSP (language server protocol) support.
|
| VS Code's editor is actually available as a separate NPM package
| as Monaco[0], which is great because it means that you can
| trivially get LSP support. For example:
|
| https://sorbet.run
|
| ^ Sorbet (Ruby type checker) implements the LSP protocol and can
| be compiled to WASM. So by using Monaco in the browser, we get a
| playground that supports all the same features as you'd get in VS
| Code.
|
| It's the same for the TypeScript Playground[1].
|
| There's a lot of great work in this release of CodeMirror. I'm
| especially excited to see mobile support as a headline feature,
| because that's completely lacking in Monaco. Maybe LSP support
| can be a future improvement.
|
| [0] https://microsoft.github.io/monaco-editor/index.html
|
| [1] https://www.typescriptlang.org/play
| benatkin wrote:
| It might be outside the scope of CodeMirror. CodeMirror is not
| an IDE. Monaco is extracted from one.
| ComputerGuru wrote:
| VS Code is not really an IDE, either. Of course, what is an
| isn't an IDE isn't so clear-cut these days.
| Turing_Machine wrote:
| Yes, mobile support is the Holy Grail here.
|
| It's not just Monaco... pretty much all the available text
| editor components (beyond a plain raw textarea) suck bigly on
| mobile.
|
| Editing structured text on a phone is always going to suck to
| some degree, so it's always nice to see anything that promises
| to make it suck less.
| lhenk wrote:
| There's still no way to use create-react-app with monaco out of
| the box with offline support (@monaco-editor/react includes
| calls to a CDN instead of using the bundled JS).
| umvi wrote:
| I see a lot of import statements in the examples like:
| import {EditorState, basicSetup}
|
| ...does this mean you need webpack or browserify or something in
| order to use CM6?
| [deleted]
| okanesen wrote:
| No, not necessarily.
|
| There is a dedicated page under examples, if you're interested:
| https://codemirror.net/6/examples/bundle/.
| capableweb wrote:
| No, import/export statements are part of ES6 modules. If you're
| targeting modern browsers
| (https://caniuse.com/?search=es6%20modules) you can just use it
| straight up, no need for complicating things with webpack,
| browserify and/or et al.
| umvi wrote:
| What does it mean for it to be dual licensed under MIT/GPL?
| tingletech wrote:
| GPL was added at the request of the Wordpress Foundation. "This
| means that you, as user, may choose one of these licenses to
| abide by. I.e. if complying with the GPL is problematic for
| you, you can choose the more liberal MIT license."
|
| https://github.com/codemirror/codemirror.next/commit/8a8dc87...
| gidan wrote:
| I tried codemirror and draftjs. Draftjs was actually much better
| than codemirror, the api for the former is so difficult to deal
| with, the latter was a bliss.
| spankalee wrote:
| One is for code, the other is for rich text. Are you sure it's
| an apt comparison?
| slantyyz wrote:
| You can do some interesting non-code things with CodeMirror.
|
| HyperMD[0] is probably the craziest (in a good way) thing
| I've seen done with CodeMirror.
|
| [0] https://laobubu.net/HyperMD/#./docs/zh-CN/README.md and
| https://github.com/laobubu/HyperMD
| bityard wrote:
| Is this an official release or did the submitter just stumble
| across it? Last I looked version 6 has been in development for a
| few years.
|
| (Disclaimer: I do use CodeMirror in a personal project of mine
| but haven't tried 6 because I'm not great at Javascript and there
| are not many examples of how to use it, although there are tons
| for 5.)
| isaacimagine wrote:
| Neat! I've been following 6 for a while, glad to hear it's in
| beta :)
| _glass wrote:
| Does someone know why this project was supported by the German
| ministry for research and education?
| Finnucane wrote:
| I make a guess: they find it useful and want to see work on it
| continue, and have some funds they can use for that?
| merlinscholz wrote:
| The German ministry for research and education sponsors a lot
| of open-source projects they think will be useful for the open-
| source-landscape or their own projects some day.
| derhuerst wrote:
| specifically, Codemirror got funding [0] via the Prototype
| Fund [1], which is a partnership beteeen the Open Knowledge
| Foundation Germany [2] and the German federal ministry of
| education and research [3].
|
| they fund public-interest open source projects, several per
| funding round.
|
| [0] https://prototypefund.de/en/project/codemirror/
|
| [1] https://prototypefund.de/en/about-2/
|
| [2] https://okfn.de/en/
|
| [3] https://www.bmbf.de/en/index.html
| zaczekadam wrote:
| Hey! I was making Freecodecamp like app for mobile devices for
| quite some time (you might have seen it - CodeNGo) and CodeMirror
| was the only library that worked well on mobile. Thanks for all
| the hard work!
| marcus_holmes wrote:
| Just out of curiosity: does anyone use touchscreen functionality
| while coding?
|
| It seems like devs generally consider productivity as keyboard >
| mouse, and I'd assume that mouse > touchscreen, but I've never
| tried it.
| ews wrote:
| I do sometimes on my dell xps 13 (scrolling, not selecting)
| lhorie wrote:
| > This version of CodeMirror was designed from the start with
| accessibility in mind, avoiding a number of pitfalls that the
| current crop of editors suffer from
|
| Would love to read more about the details. What makes a code
| editor accessible and conversely what makes it not accessible?
| umvi wrote:
| It's referring to a11y[0]/WCAG[1] type accessibility (i.e. the
| ability for screen readers and other a11y tools to be able to
| easily parse and navigate a CM editor).
|
| Example from: https://codemirror.net/6/examples/tab/
|
| > By default, CodeMirror does not handle the Tab key. This
| isn't an oversight--it is an intentional decision to make the
| default configuration pass the "no keyboard trap" criterion of
| the W3C Web Content Accessibility Guidelines. Some users browse
| the web without access to a pointing device, and it is really
| unfriendly towards such users to have focusable inputs that
| they cannot escape from.
|
| [0] https://www.a11yproject.com/checklist/
|
| [1] https://www.w3.org/WAI/standards-guidelines/wcag/
| numlocked wrote:
| The accessibility support here is a BIG deal! The previous
| versions of CodeMirror confused the heck out of screenreader
| applications (the way the DOM was constructed). I used CM in an
| open source side project which wound up getting legs, and was
| the horrified to learn I had built something with a reasonably
| large user base, that was quite inaccessible, without a great
| path to fix it.
|
| I / my company (Grove Collaborative) got in touch with Marijn
| (the developer of CM) in 2018, asking if we could fund the
| project specifically to support accessibility. He very kindly
| shared that the next version (which appears to have been 6) was
| not yet under development and there was no way to put those
| dollars to work on that theme at that time -- but please check
| back in six months because he is thinking about it.
|
| The integrity here is pretty amazing; he actually turned down
| the funding because the dollars couldn't, at that time, be
| allocated to accessibility in good faith _even though he was
| actually preparing to do the work_.
|
| It's so SO cool to see that he was taking it seriously, and
| that the work got done, and I can finally update the open
| source project.
|
| And, yes - accessibility should be a focus at the
| beginning...but if the best time to do it was years ago, the
| next best time is now.
| jp1016 wrote:
| CodeMirror is such an awesome library, its one of the core
| components in our snippet management tool https://codekeep.io
| capableweb wrote:
| Since it seems you're using CodeMirror commercially and it's a
| core part of your offering, can I ask if you are currently
| supporting the development financially?
| xyzzy_plugh wrote:
| CodeMirror is dual licensed under MIT and GPLv3.
|
| I don't mind the question but I do mind the implied shame it
| brings if the reply is "no". Which would be a perfectly fine
| reply. No one owes CodeMirror anything.
| capableweb wrote:
| Not sure where the "implied shame" comes from, I certainly
| never put any shame if someone chooses not to donate to
| something where it's not required. I just saw the statement
| about the author wanting donations and thought I ask
| because I was curious. Both yes and no would have been fine
| in my book since as you say, no one owes CodeMirror nor the
| people behind it, anything.
| amelius wrote:
| ProseMirror (by the same original author) has this on its
| homepage:
|
| > If you are using ProseMirror to make profit, there is a
| _social_ expectation that you help fund its maintenance.
|
| But I don't see anything similar on the CodeMirror homepage.
| mwest217 wrote:
| There is something similar - it's under the About section:
|
| > CodeMirror is open source (MIT or GPL3). It is being
| developed on GitHub. Contributions are welcome.
|
| > If you are using CodeMirror commercially, there is a
| social expectation that you help fund its maintenance.
| Start here.
| xyzzy_plugh wrote:
| That's a pretty shitty thing to do, in my opinion. Guilt
| tripping isn't the right way to go about this. If you
| want your cake and to eat it too, then use a license that
| expects financial compensation from commercial uses.
| soamv wrote:
| I'm so perplexed that someone would feel the need to
| attack an open source developer for a gentle suggestion
| of an optional donation.
|
| You're free to pretend there's a constrained license, and
| pay the project for their work. Are you saying you'd
| rather be forced to do so by a license? That makes no
| sense -- you can do it without being forced, if you want
| to.
| orra wrote:
| Yeah, it's an absurd complaint.
|
| I mean, I like copyleft licensing. But it's perfectly
| reasonable (albeit possibly naive) to _request_
| commercial donations on a non-copyleft project.
| brasetvik wrote:
| > That's a pretty shitty thing to do, in my opinion.
|
| The founder and main developer has shared some of his
| thoughts in this matter here:
| https://marijnhaverbeke.nl/blog/sustainable-
| maintenance.html
|
| He has put thousands of hours into these projects, and
| are giving them away for free - that is, if you can
| stomach the slight hint that if you're making money on
| it, then maybe contribute a tiny bit.
|
| He hasn't blogged about burnout yet, like many other open
| source maintainers do. A recurring theme is about toxic
| community members. I hope he scrolls past your comment.
| [deleted]
| crystaln wrote:
| Consensual financial support based on social expectation
| seems a lot less shitty to me than non-consensual
| financial support based on legal recourse.
| capableweb wrote:
| > If you want your cake and to eat it too
|
| Indeed, so let's assume because CodeMirror doesn't have a
| license like that, the authors don't "want their cake and
| eat it too", as the license is simply open source. Don't
| know where you get the whole "guilt tripping" stuff from,
| having a message that says "if you enjoy this, please
| donate" is guilt tripping...
| raphlinus wrote:
| The use of a permissive license allows CodeMirror to be
| integrated into a _lot_ more settings than would be
| possible with a copyleft license, even with a paid dual-
| license for proprietary applications.
|
| Marijn has given CodeMirror to the world for free, and it
| is in my opinion a very valuable contribution indeed.
| Comments like yours reflect an entitled view of what
| proper behavior is for an open source developer.
|
| Obviously anyone who wants to use CodeMirror commercially
| but doesn't feel Marijn is due any compensation for his
| work is free to act on that belief. I fail to see how
| that's "shitty."
| swalsh wrote:
| Anyone know how this works with React? The old version has a
| wrapper, but it's pretty crude.
| pier25 wrote:
| I've never used CodeMirror, but I'm using ProseMirror by the
| same author and it relies a lot on having control of the DOM.
|
| I'm guessing the integration will be basically a wrapper
| component with a ref of a DOM node where CodeMirror will do its
| thing.
| dmitryminkovsky wrote:
| > I'm guessing the integration will be basically a wrapper
| component with a ref of a DOM node where CodeMirror will do
| its thing.
|
| Pretty much. This is how my React ProseMirror integration
| works: https://github.com/dminkovsky/use-
| prosemirror/blob/main/src/.... Though there are some
| complexities. I believe CodeMirror would be the same.
| nicoburns wrote:
| You'd likely be better off using the library directly and
| writing your own wrapper. You could probably setup a basic one
| in 10 lines of code.
| CoffeePython wrote:
| Not sure on using CodeMirror but I'm using Ace on my vim
| learning tool because it has vim key bindings. It's been a
| great tool! Would like to check out code mirror also though too
| and see if I like it better.
| jrv wrote:
| I use it in React by pointing the setup code at a ref of the
| CodeMirror div container and then I store the CodeMirror View
| object in another separate ref of the component so I have
| access to it from other places. Slightly awkward, but seems to
| work fine.
| joelg wrote:
| I've been using it with React for a couple months now. In my
| experience it's been a little awkward but overall fairly
| usable. It seems like it would be easy to write a wrapper for.
| jrv wrote:
| I'm using CodeMirror 6 for https://promlens.com and together with
| the lezer parser generator, it was great for developing syntax
| highlighting, contextual autocompletion, and inline linting for
| PromQL (that part is OSS actually, in
| https://github.com/prometheus-community/codemirror-promql, much
| of it built by Augustin Husson, some by myself).
| benbristow wrote:
| Awesome, CodeMirror is a great online editor. Nice to see it
| getting modernized.
| breck wrote:
| Amazing! In the past I used Ace, Monaco, and CM, and CM was
| always the best. But the API was a bit behind a couple years ago
| (typescript was wanting), so very excited about this and can't
| wait to check it out.
| bob1029 wrote:
| I actually moved from CM to Ace recently because of performance
| issues with very large JSON documents. I also like the
| collapsible code and integrated search capabilities in Ace.
___________________________________________________________________
(page generated 2021-02-05 23:01 UTC)