You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@flex.apache.org by OK <po...@olafkrueger.net> on 2017/04/26 08:59:32 UTC
[FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Hi guys,
I remember that there were some discussions that it would be nice to have
something like JSFiddle or CodePen for FlexJS.
I also remember that Alex introduced a POC for live editing a couple of
months ago.
Cause I've no idea if something like this could be achieved as-a-service and
I'm honestly not smart enough to improve this approach I wonder if it would
be an option to just make the compiler available as-a-service and build an
app around it that consumes this service.
Although this approach is far away from live editing and you have to wait
until the compiler is done I think that FlexJS would benefit a lot from
something like this:
There would be no more entry barrier to get in touch with FlexJS: Just call
the (web) app, code and compile it with one click.
Folks could share useful FlexJS snippets and with the ability to store this
stuff it could automatically grow to an archive of code snippets.
It would be very ergonomic to compile the code with different FlexJS
versions or compiler options.
At least you would have one browser window that contains the code and the
result so I think this could be also a little helpful tool during regular
app development.
So I started a little POC regarding the service:
I've just installed nodejs express and make Josh's asconfigc available via
an http endpoint.
This is just a few lines of code and it works as expected [1][2].
In the real world, the service would expect some FlexJS code and response
with the compiled code or an URL where the code lives.
Next step would be to build a FlexJS app that implements a CodePen inspired
UI and consumes the service.
Before starting with this I'd like to ask if you think that this approach is
worth following it or if you expect too many issues (maybe also legal
issues) or if you think it's completely useless.
Of course, it's a long way to making it happen and a powerful backend is
needed and this is probably not for free. I'm not yet familiar enough with
the various cloud services out there but I could imagine that something like
'AWS lamda' would work. Maybe Apache Infra provide something like this?
Thanks,
Olaf
[1] https://snag.gy/Bb83sq.jpg
[2] https://snag.gy/crM43o.jpg
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by OK <po...@olafkrueger.net>.
Greg Dove wrote
> https://try.haxe.org/
Never seen this before, the haxe guys have done a great job and I think
you're right that this is something from which FlexJS could really benefit
from...
Thanks,
Olaf
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61405.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Greg Dove <gr...@gmail.com>.
try haxe has a great example of this type of thing also, with a lot of
pre-defined examples (but no mxml :) ).
https://try.haxe.org/
It may also be a useful reference for planning for future versions of
whatever we do.
On Fri, Apr 28, 2017 at 3:29 AM, Josh Tynjala <jo...@gmail.com> wrote:
> Yes, I'm trying to say that a simpler starter project could be to display
> the generated JS code side by side with the AS/MXML. And it would do
> nothing more than that.
>
> I'm not trying to tell you to do this instead of the CodePen/JSFiddle
> project. I'm saying that this simpler project could benefit your
> CodePen/JSFiddle project. It has a smaller scope, so you could release
> something more quickly. Something that potential FlexJS users would find
> useful too! Both projects will integrate with the compiler, though, so a
> lot of the code that you'd write for the simpler project could probably be
> reused in the more complex project.
>
> Maybe you'd prefer to jump right into the more complex CodePen/JSFiddle
> project, and that's totally fine! Just a suggestion.
>
> - Josh
>
>
>
> On Thu, Apr 27, 2017 at 7:42 AM, OK <po...@olafkrueger.net> wrote:
>
> > Josh Tynjala wrote
> > > In this simpler project, the generated code wouldn't even be run (maybe
> > > that's the part that you missed?)
> >
> > I think this is the part that I don't understand. Where do you think the
> > generated code comes from?
> > I thought if it comes from the compiler it always runs?
> >
> > Or is the idea to just prepare some pre-compiled examples and display the
> > MXML/AS3 and HTML/JS side by side?
> >
> > Sorry, I'm lost ;-)
> >
> > Thanks,
> > Olaf
> >
> >
> >
> >
> >
> >
> > --
> > View this message in context: http://apache-flex-
> > development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-
> > FlexJS-Compile-as-a-service-tp61369p61388.html
> > Sent from the Apache Flex Development mailing list archive at Nabble.com.
> >
>
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by OK <po...@olafkrueger.net>.
Josh Tynjala wrote
> It has a smaller scope, so you could release
> something more quickly. Something that potential FlexJS users would find
> useful too! Both projects will integrate with the compiler, though, so a
> lot of the code that you'd write for the simpler project could probably be
> reused in the more complex project.
I've got it, Josh! :-))
You're definitely right that this would mean to release faster... but I'm so
curious how a compiler-as-service would work ;-)
Thanks,
Olaf
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61403.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Josh Tynjala <jo...@gmail.com>.
Yes, I'm trying to say that a simpler starter project could be to display
the generated JS code side by side with the AS/MXML. And it would do
nothing more than that.
I'm not trying to tell you to do this instead of the CodePen/JSFiddle
project. I'm saying that this simpler project could benefit your
CodePen/JSFiddle project. It has a smaller scope, so you could release
something more quickly. Something that potential FlexJS users would find
useful too! Both projects will integrate with the compiler, though, so a
lot of the code that you'd write for the simpler project could probably be
reused in the more complex project.
Maybe you'd prefer to jump right into the more complex CodePen/JSFiddle
project, and that's totally fine! Just a suggestion.
- Josh
On Thu, Apr 27, 2017 at 7:42 AM, OK <po...@olafkrueger.net> wrote:
> Josh Tynjala wrote
> > In this simpler project, the generated code wouldn't even be run (maybe
> > that's the part that you missed?)
>
> I think this is the part that I don't understand. Where do you think the
> generated code comes from?
> I thought if it comes from the compiler it always runs?
>
> Or is the idea to just prepare some pre-compiled examples and display the
> MXML/AS3 and HTML/JS side by side?
>
> Sorry, I'm lost ;-)
>
> Thanks,
> Olaf
>
>
>
>
>
>
> --
> View this message in context: http://apache-flex-
> development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-
> FlexJS-Compile-as-a-service-tp61369p61388.html
> Sent from the Apache Flex Development mailing list archive at Nabble.com.
>
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by OK <po...@olafkrueger.net>.
>Do we need a server? We could use my CI server for now.
Thanks for your offer!
I think we'd definitely need a powerful server that provides the service. I
don't know for now if we'll get the power that would be needed for
productive use for free.
>Do we need a repo to share the code?
If it's ok for all of you I'd like to improve my little POC step by step and
if it's worth to share I'll put it to github repo including a working demo.
>Or should this go in TourDeFlexJS?
Don't know, I'd like to focus on the compile-as-service feature for now ;-)
Thanks,
Olaf
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61404.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Alex Harui <ah...@adobe.com>.
These are all great ideas.
But it might be easier to understand the words if we could play with
actual code. What do we really need to do in order to make this available
to the rest of the committers and our community? Let's focus on that
first.
Do we need a server? We could use my CI server for now.
Do we need a repo to share the code? Or should this go in TourDeFlexJS?
What else do we need?
Thanks,
-Alex
On 4/27/17, 7:42 AM, "OK" <po...@olafkrueger.net> wrote:
>Josh Tynjala wrote
>> In this simpler project, the generated code wouldn't even be run (maybe
>> that's the part that you missed?)
>
>I think this is the part that I don't understand. Where do you think the
>generated code comes from?
>I thought if it comes from the compiler it always runs?
>
>Or is the idea to just prepare some pre-compiled examples and display the
>MXML/AS3 and HTML/JS side by side?
>
>Sorry, I'm lost ;-)
>
>Thanks,
>Olaf
>
>
>
>
>
>
>--
>View this message in context:
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-fle
>x-development.2333347.n4.nabble.com%2FFlexJS-POC-JSFiddle-for-FlexJS-Compi
>le-as-a-service-tp61369p61388.html&data=02%7C01%7C%7Cf19acdb8c61746b360ed0
>8d48d7d4467%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C63628901653899154
>2&sdata=5rfzxW2roJDMTbi%2Bs8pdjT5AePwC3Lr8Z%2FMVrtKBy%2Fo%3D&reserved=0
>Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by OK <po...@olafkrueger.net>.
Josh Tynjala wrote
> In this simpler project, the generated code wouldn't even be run (maybe
> that's the part that you missed?)
I think this is the part that I don't understand. Where do you think the
generated code comes from?
I thought if it comes from the compiler it always runs?
Or is the idea to just prepare some pre-compiled examples and display the
MXML/AS3 and HTML/JS side by side?
Sorry, I'm lost ;-)
Thanks,
Olaf
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61388.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Josh Tynjala <jo...@gmail.com>.
I was talking about how I thought displaying the AS/MXML and JS side by
side could be a simpler project that acts as a stepping stone to the larger
CodePen/JSFiddle project. In this simpler project, the generated code
wouldn't even be run (maybe that's the part that you missed?), but seeing
the generated JS code would still be beneficial to users considering FlexJS
and AS/MXML. I suspect that a lot of the code from the simpler project
could be reused in the more complex project, so that's why I brought it up.
- Josh
On Thu, Apr 27, 2017 at 6:59 AM, OK <po...@olafkrueger.net> wrote:
> Josh Tynjala wrote
> > With the dev tools, you need to set up a project and build it first.
>
> Probably I don't understand this.
> My approach would be to just pass the compiled HTML/JS code to an iframe
> and
> to offer a link
> to be able to open the iframe content in a new window.
> I thought this way anybody would able to inspect the source code by just
> opening the browsers dev tool?
>
> Thanks,
> Olaf
>
>
>
>
>
>
> --
> View this message in context: http://apache-flex-
> development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-
> FlexJS-Compile-as-a-service-tp61369p61386.html
> Sent from the Apache Flex Development mailing list archive at Nabble.com.
>
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by OK <po...@olafkrueger.net>.
Josh Tynjala wrote
> With the dev tools, you need to set up a project and build it first.
Probably I don't understand this.
My approach would be to just pass the compiled HTML/JS code to an iframe and
to offer a link
to be able to open the iframe content in a new window.
I thought this way anybody would able to inspect the source code by just
opening the browsers dev tool?
Thanks,
Olaf
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61386.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Josh Tynjala <jo...@gmail.com>.
The difference between an online playground that shows the generated JS and
opening the browser dev tools is that you get instant results from the
playground. With the dev tools, you need to set up a project and build it
first. I think the playground would be useful for more casual visitors that
are still trying to figure out if they're going to download FlexJS at all.
- Josh
On Apr 27, 2017 1:10 AM, "OK" <po...@olafkrueger.net> wrote:
> >Simply let people see the JavaScript that gets produced from
> >ActionScript and MXML with FlexJS.
> This might be helpful but on the other side, this is already provided by
> any
> browsers dev tools.
>
> >Maybe provide a couple of sample MXML/AS
> >files alongside an option to write your own code from scratch.
> Yes, I think a combination of pre-compiled samples and the option to
> compile
> is a good idea.
>
> >I think Microsoft's Monaco editor would be good for this sort of thing
> WoW, it really seems that Microsoft is transforming itself to a completely
> new company!
>
> >but it would be really cool to see IntelliSense/completion
> >working from the browser.
> Definitely! But for now, I'd be happy to be able to build a very simple app
> that probably will just provide some text areas, we'll see ...
>
> Thanks,
> Olaf
>
>
>
>
>
>
>
> --
> View this message in context: http://apache-flex-
> development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-
> FlexJS-Compile-as-a-service-tp61369p61381.html
> Sent from the Apache Flex Development mailing list archive at Nabble.com.
>
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by OK <po...@olafkrueger.net>.
>Simply let people see the JavaScript that gets produced from
>ActionScript and MXML with FlexJS.
This might be helpful but on the other side, this is already provided by any
browsers dev tools.
>Maybe provide a couple of sample MXML/AS
>files alongside an option to write your own code from scratch.
Yes, I think a combination of pre-compiled samples and the option to compile
is a good idea.
>I think Microsoft's Monaco editor would be good for this sort of thing
WoW, it really seems that Microsoft is transforming itself to a completely
new company!
>but it would be really cool to see IntelliSense/completion
>working from the browser.
Definitely! But for now, I'd be happy to be able to build a very simple app
that probably will just provide some text areas, we'll see ...
Thanks,
Olaf
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61381.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Josh Tynjala <jo...@gmail.com>.
I think Microsoft's Monaco editor would be good for this sort of thing:
https://github.com/Microsoft/monaco-editor
It's the core editor used by Visual Studio Code, packaged up as a
standalone component.
I recently saw that a company called TypeFox found a way to make Monaco to
speak the "language server protocol" used by VSCode, with the language
server running on the backend instead of in a separate process on the
client.
http://typefox.io/teaching-the-language-server-protocol-to-microsofts-monaco-editor
Getting Monaco to work with the NextGenAS language server on the backend is
probably not trivial (and it definitely should wait for a future
iteration), but it would be really cool to see IntelliSense/completion
working from the browser.
- Josh
On Wed, Apr 26, 2017 at 2:55 AM, yishayw <yi...@hotmail.com> wrote:
> I certainly don't think it's useless. I've been imagining something similar
> and it's great to see you take it up. I wonder what the effort would be to
> adapt Moonshine to be the web text editor...
>
>
>
> --
> View this message in context: http://apache-flex-
> development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-
> FlexJS-Compile-as-a-service-tp61369p61370.html
> Sent from the Apache Flex Development mailing list archive at Nabble.com.
>
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by yishayw <yi...@hotmail.com>.
I certainly don't think it's useless. I've been imagining something similar
and it's great to see you take it up. I wonder what the effort would be to
adapt Moonshine to be the web text editor...
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61370.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Justin Mclean <ju...@classsoftware.com>.
Hi,
> There would be no more entry barrier to get in touch with FlexJS: Just call
> the (web) app, code and compile it with one click.
Great idea!
> Before starting with this I'd like to ask if you think that this approach is
> worth following it or if you expect too many issues (maybe also legal
> issues) or if you think it's completely useless.
No major legal issues that I’m aware of that will trip you up. As long as you respect Apache’s trademarks (which is easily done by adding a disclaimer in a footer) and select a domain name that’s not likely to cause an issue.
Thanks,
Justin
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Josh Tynjala <jo...@gmail.com>.
Looks good, Olaf. Keep it up!
- Josh
On Fri, Apr 28, 2017 at 7:26 AM, OK <po...@olafkrueger.net> wrote:
> Hi again,
> I've had some time yesterday evening and improved the POC.
> It is possible now to compile FlexJS code that is coming from the browsers
> Textarea. The compiled result is displayed via an Iframe [1].
>
> The current worklfow is like this:
> - Enter some code
> - Click "Compile and run"
> - The POST service is invoked with the code as payload
> - A new tmp project dir is created at server side
> - A Main.mxml with the passed code is created inside the tmp project dir
> - The compiler is invoked
> - The service response with the URL to the compiled js project and the
> compiler output
>
> I'm using nodejs as server. [2]
> Cause I've none at all experience with nodejs the code might be weird ;-)
> All in al this is just a quick hack...
>
> Next step would be to pimp the UI and try to integrate the Monaco or Ace
> editor.
> Unfortunately, I've no proper internet connection at home for some days so
> this will take some time...
>
> I'd appreciate any feedback if I'm on the right track!
>
> Thanks,
> Olaf
>
> [1] https://snag.gy/4Md0lJ.jpg
> [2] https://gist.github.com/anonymous/2632b00bf51bc77565657569217c75a4
>
>
>
> --
> View this message in context: http://apache-flex-
> development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-
> FlexJS-Compile-as-a-service-tp61369p61406.html
> Sent from the Apache Flex Development mailing list archive at Nabble.com.
>
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by OK <po...@olafkrueger.net>.
Hi again,
I've had some time yesterday evening and improved the POC.
It is possible now to compile FlexJS code that is coming from the browsers
Textarea. The compiled result is displayed via an Iframe [1].
The current worklfow is like this:
- Enter some code
- Click "Compile and run"
- The POST service is invoked with the code as payload
- A new tmp project dir is created at server side
- A Main.mxml with the passed code is created inside the tmp project dir
- The compiler is invoked
- The service response with the URL to the compiled js project and the
compiler output
I'm using nodejs as server. [2]
Cause I've none at all experience with nodejs the code might be weird ;-)
All in al this is just a quick hack...
Next step would be to pimp the UI and try to integrate the Monaco or Ace
editor.
Unfortunately, I've no proper internet connection at home for some days so
this will take some time...
I'd appreciate any feedback if I'm on the right track!
Thanks,
Olaf
[1] https://snag.gy/4Md0lJ.jpg
[2] https://gist.github.com/anonymous/2632b00bf51bc77565657569217c75a4
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-Compile-as-a-service-tp61369p61406.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS][POC] JSFiddle for FlexJS / Compile as-a-service
Posted by Josh Tynjala <jo...@gmail.com>.
For a while now, I've wanted to build something similar to TypeScript's
playground. I just haven't found the time yet.
https://www.typescriptlang.org/play/
Basically, one file/class in and one file out. The idea would be to keep it
super basic. Simply let people see the JavaScript that gets produced from
ActionScript and MXML with FlexJS. Maybe provide a couple of sample MXML/AS
files alongside an option to write your own code from scratch.
This could be a good MVP because it is something people will find useful,
but it can also serve as a foundation for a more complex CodePen-like
experience with multiple files in a simple project.
- Josh
On Apr 26, 2017 2:10 AM, "OK" <po...@olafkrueger.net> wrote:
Hi guys,
I remember that there were some discussions that it would be nice to have
something like JSFiddle or CodePen for FlexJS.
I also remember that Alex introduced a POC for live editing a couple of
months ago.
Cause I've no idea if something like this could be achieved as-a-service and
I'm honestly not smart enough to improve this approach I wonder if it would
be an option to just make the compiler available as-a-service and build an
app around it that consumes this service.
Although this approach is far away from live editing and you have to wait
until the compiler is done I think that FlexJS would benefit a lot from
something like this:
There would be no more entry barrier to get in touch with FlexJS: Just call
the (web) app, code and compile it with one click.
Folks could share useful FlexJS snippets and with the ability to store this
stuff it could automatically grow to an archive of code snippets.
It would be very ergonomic to compile the code with different FlexJS
versions or compiler options.
At least you would have one browser window that contains the code and the
result so I think this could be also a little helpful tool during regular
app development.
So I started a little POC regarding the service:
I've just installed nodejs express and make Josh's asconfigc available via
an http endpoint.
This is just a few lines of code and it works as expected [1][2].
In the real world, the service would expect some FlexJS code and response
with the compiled code or an URL where the code lives.
Next step would be to build a FlexJS app that implements a CodePen inspired
UI and consumes the service.
Before starting with this I'd like to ask if you think that this approach is
worth following it or if you expect too many issues (maybe also legal
issues) or if you think it's completely useless.
Of course, it's a long way to making it happen and a powerful backend is
needed and this is probably not for free. I'm not yet familiar enough with
the various cloud services out there but I could imagine that something like
'AWS lamda' would work. Maybe Apache Infra provide something like this?
Thanks,
Olaf
[1] https://snag.gy/Bb83sq.jpg
[2] https://snag.gy/crM43o.jpg
--
View this message in context: http://apache-flex-development
.2333347.n4.nabble.com/FlexJS-POC-JSFiddle-for-FlexJS-
Compile-as-a-service-tp61369.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.