We Keep Coding

Using Typescript with transpiled, unsupported/custom language files

The Problem
I have JavaScript-like files with extension .gml
I can convert the source to valid JavaScript via magic-string, and can go back the other way using trace-mapping.
I want to leverage Typescript on my .gml files to get strong Intellisense, e.g. by:
Creating a Typescript "program" that acts on the .gml->.js transpiled files and reports issues back; and
Creating a VSCode extension that proxies functionality to the Typescript language server and reverse-source-maps the results back to the editor.
It feels like there should be a relatively straight forward and generalizable approach to this, but my experiments have not worked out. Reference projects are either for much-more-complex scenarios or much simpler ones, and documentation on the matter is very light.
Prior Art
VueJS and Svelte use custom filetypes (.vue and .svelte), which they pre-process into valid Typescript, HTML, and CSS prior to proxying through to those respective language servers.
Their use cases are far more complicated than mine, and their code bases to accomplish this are extensive. I'm hoping to find a much more streamlined approach.
Possible approaches
I've had a little luck following the Svelte approach of creating a Typescript service and hooking up VSCode operations onto it, but this is extremely tedious.
I suspect that there's some possibility of using a Typescript plugin, but as far as I can tell that approach doesn't support using non-js/ts extensions nor source maps.
In any case I know I'll have to do significant work with the to-and-from-sourcemap conversions, but ideally that's the only difficult work I'd need to do.
Questions
Have you seen any examples in the wild of people solving a similar problem, or solved similar problems yourself?
Are there any deep-dive write-ups about this (I've found a few shallow ones)?
Is the plugin approach viable?
What are the possible ways to get non-js/ts extensions recognized by Typescript?

Textmate: jsdoc comment?

I'm pretty new to TextMate and I just can't figure out how to make JSDoc like comment when editing .js file. I'm using the PHP bundle and there it is pretty easy - I just type doc and then tab. I've already added custom snippet but the problem is that it does not handle new lines properly (it doesn't insert trailing *).

You'll need to install a JSDoc bundle, but it doesn't look like there's much available. A quick google search did bring up something though: https://github.com/tysontate/javascript-jsdoc-tmbundle
No idea if it's any good, and it actually says that the commands don't yet work, but it appears to have seen at least some activity lately (unlike the others I found). It looks like there just aren't that many people who are using JS Doc (or, at least not that many TextMate users who are using it).
Usually, googling for "something bundle textmate" will yield the right results, but apparently JSDoc just isn't that commonly used.
However, maybe someone has added some JSDoc functionality to the existing JavaScript bundle (much like you've started doing). Didn't try looking for that, but you might get lucky.
But hey, it's a good excuse to get your hands dirty (and learn a lot about TextMate in the process) by messing around with whatever the available bundles have to offer, maybe even fixing a few bugs, and giving something back to the community (you don't have to of course, it's just a suggestion).
Not much of an answer, but hopefully you'll find our way from here

An updated bundle with tools for editing JSDoc comments in TextMate 2 is available at https://github.com/rootworkit/JsDoc-Toolkit.tmbundle

How to start developing Javascript apps?

I started out with Rails development, but soon I realized Rails without JS is pretty much useless. So, I am trying to play with JS in my free time.
So, what are the "tools of trade (IDEs if any)" for JS development?
My primary focus is usage of APIs, Ajax etc, so that I don't get lost when I get develop Rails apps which uses JS.
There are many tutorials for using JS for Open graph API or twitter API, but that is to get things done and abstract some feature sets which a beginner should know.
I generally start learning a language by making a calculator, end to end (always works for me). But I cannot make a calculator and use API/Ajax calls.
So, what are your suggestions?
PS: I am aware about Douglas Crockford's video lectures, they are awesome, but I need some thing more concrete.
UPDATE:
My 2 original questions:
1. What are the tools of trade for JS? Like Eclipse:Java::X:Javascript, What is X (multiple Xs are allowed)?
2. What sample app do you recommend for me to start with?

I think the most important thing is: Know your language!
JavaScript libraries are useful, but if your do not know the language, you have no chance of getting something done that cannot be achieved using your library of choice. For example: JavaScript's prototype-system is very valuable and important for building robust applications. I really recommend that you experiment with this before diving into something you barely know. Closures are also very important to understand.
One thing is important, though: Do not spend too much time on browser incompatibilities. This is what most libraries are for. What you need to know is how the language works. Implementation-specific things are not worth learning (in most cases), since somebody already fixed those for you.
#PS: Douglas Crockford indeed does a pretty awesome job on explaining how JavaScript really works. You should keep watching this.
#UPDATE:
I think the X has it's origin in JavaScript's MIME-type: application/x-javascript. My tool of choice for web-development (including JavaScript) is NetBeans IDE. I use it in my workplace and it is very reliable and comfortable to work with. This is subjective (of course). Most other IDE's will do, too.
This is difficult to answer. I will update my post if something comes to my mind.

(I realize my comments below typically refer to using javascript with regards to websites, so ymmv if you're using js for a different environment, like couchDB)
For an ide, any text editor will do, but I prefer convenient features like:
syntax coloring (because it's so pretty)
(s)ftp plugins - makes saving files convenient
I would probably go with something like notepad++, or aptana studio (although I find aptana to be a bit of overkill at times, but very powerful). Adobe Dreamweaver works nicely too, if you wanna pay. Otherwise, the bare minimum would be notepad and an ftp client (again, with regards to front-end web development work)
For debugging or trying out quick javascript, I find safari's and chrome's built-in development tools handy, but on firefox, it's firebug all the way. Firebug is awesome.
I notice that in my work environment that some people (particularly the business side) use the words javascript and the DOM interchangably, but I find that their attempts at explaining something simply leads to confusion. That being said, if you're writing web apps, I find the mozilla DOM reference to be pretty awesome and used to hit it up all the time before I got familiar: https://developer.mozilla.org/en/DOM
Actually developer.mozilla.org is overall pretty awesome.
Other than that, getting started is simply a matter of learning the syntax. I would probably get used to the syntax first (which should be pretty quick anyways) before I start thinking about other concepts like learning how to prototype and whatnot (which you can look up on this site).
A framework like jQuery is very convenient for various repetitive tasks, but I wouldn't necessarily jump straight into using jQuery without being familiar with the js syntax first.

The most important thing you should learn is jQuery. It is now the de facto standard javascript library.
jQuery is great regardless of what you are doing with it, but since you mentioned AJAX, I'll point out that jQuery makes AJAX stupid easy, because you can do things like this:
$.ajax({
url: 'some/ajax/endpoint',
success: function(data) {
// do something with data
}
});
Obviously there are a lot of other options you can pass along, but the basic structure is really simple and easy to use.
jQuery also has a really powerful syntax for selecting parts of the DOM and adding events. For example, if you wanted to catch anytime some clicked on an image and tell them the image src, you can do something like this:
$('img').click(function() {
alert($(this).attr('src'));
});

Should I use ScriptSharp

I am developing my first ASP.NET MVC application and I beleive that Script# can help me a lot. But it cannot find the resource necessary to support my development.
I could not find The codeplex site;
There is only one manual, which is very good, but it is not enough;
I could find very few tutorials;
I know that Script# was used to develop ASP.NET MVC scripts and that the source of MVC distributes the library.
But it seems that it is used only internally in Microsoft.
Where can I find other resources???
Do you really think that Script# will be continued and new versions will be deployed and it should be used by third-party projetcs ???
Thanks in advance

Don't be afraid of Javascript, it's a beautiful and powerful language. And with frameworks like jQuery, Prototype and Dojo, DOM manipulation and AJAX are greatly simplified and cross-browser issues are mostly history.
About Script#, I agree with this answer by mcintyre321. Last release over a year ago + closed source = no go for me.
UPDATE Jan/2010: there have been new Script# releases since the original writing of this answer. It's still closed-source but the author mentions open sourcing it after 1.0
UPDATE May 2011: Script# is now open source.

In short, my answer is: if you like powerful IDEs that run on Windows, OOD and C#, use ScriptSharp. It is more maintainable and structured, and demonstrably stable enough to use on serious projects. It can also be easily extended, as illustrated below and by other projects.
Since this is yet another Google indexed thread where people refer to Script# and jQuery as mutually exclusive I just wanted to point out some people are merging these two worlds, and in my case unleashing a lot of power by doing so. I'm offering a completely free and reusable library to access jQuery 1.4 from Script# projects, and full source code for the solution that generates it (almost exclusively from jQuery's own API documentation file):
http://www.christophercrooker.com/visual-studio-2010-rc-custom-tool-for-code-generation-and-jquery14-with-intellisense-for-scriptsharp

IMHO Script# fits well for large projects only, with really "rich" web client. Participating in such kind of project, I could only say that Script# helped us much. josephhemingway's remark about strongly typed is 100% true for such case. Also it allowed us to introduce new .NET developers without any JS background quickly. Assuming Nikhil Kothari's plans to open-source it in the summer 2008, we even decompiled (don't tell anybody! it's illegal) it and introduced generics, operators overloads, various bug fixes, etc.
BUT. Then Script# support faded away. Project on CodePlex with discussions and issue tracking was closed (interesting that parts of framework were published there shortly before). No updates, no future plans, no explanations. After such thing I'd consider Script# only after it goes open source to give the community ability to support it. E.g. on CodePlex.

I use Script#, I think it is great. You can use it with any framework, jQuery, dojo whatever, you would however have to wrap the framework, this could be a big job...
It's only benefit as I see it is that it allows you to develop javascript in a strongly typed environment. I think this is a HUGE benefit. I refuse to develop in weakly typed languages as maintenance is a nightmare.
If however you like to work in a weakly typed language then you wont need Script#.

Short answer NO. Wait for TypeScript.
Script# is really cool, but MS decided not to support it at all. The reason for that turns out to be that they were working on a better version of that - TypeScript (http://www.typescriptlang.org/)
It adds support for everything you need in a static language (intellisense, type checking, interfaces, classes etc.), but still looks very much like JS, and more importantly - confirms to the upcoming ECMA Script 6 standard. (unlike Script# or google's Dart)

Like the others have I would recommend some JavaScript (namely jQuery). Should you wish to continue with Script#, Nikhil Kothari's blog may be a good resource for you. http://www.nikhilk.net/ScriptSharpIntro.aspx -- That being said, I think you'll find that you are more productive with jQuery. There is a large database of community written plugins so you wouldn't necessarily have to reinvent the wheel on everything you want to do. jQuery plugins instead of ASP.NET Controls

Wow Val you got generics to work in
it, I'm impressed, was it hard?
Generics support would be great, so
would method and operator overloading.
josephhemingway
The whole point is that ScriptSharp's parser supports full C# 2.0 syntax. The only thing needed is to generate the proper JS. Not much work, considering JS dynamic nature. Generics would act as Java-style ones, i.e. no generation for each closed type argument set, just one class.
Are you sure that it is illegal to
decompile it, I will have to have a
look to see if it is the terms of use.
josephhemingway
Yep, it's illegal. EULA showed in setup clearly mentions that.

A release went out today, so it is good to see that it is still active.
Regardless of the previous lack of updates and that it not been open sourced I would still use it over plain js. You can stop using Script# at any time and more forward with the 'compiled' js if you don't like it.
I agree with you Val though that it really only fits large js based projects. I don't think you would get much benefit out of using it to perform basic page functionality like validate form input etc. It probably wouldn't be worth setting it up.
If however you are heavily using javascript and need to replicate OOP then I think it is a must. Things like refactoring becomes so easy, with plain js I would never refactor because it was just too hard to implement, over time my code became a mess.
Wow Val you got generics to work in it, I'm impressed, was it hard? Generics support would be great, so would method and operator overloading. Are you sure that it is illegal to decompile it, I will have to have a look to see if it is the terms of use.

The other advantage of using ScriptSharp that no one has mentioned is that if you need to interact with C# (using AJAX/REST/SOAP) you can use the same class definitions in both places and be sure that you have the interface defined properly, because it's the same source file! I have tried to use logic in shared source files with minimal success due to the way ScriptSharp's corelib is not 100% compatible with the C# corelib. But it works great for data file definitions.

I am using jQuery. It is really good. But I beleive that It is more confortable to me to work with C#. Even if it is a subset.

Also I would like to add that you certainly should use ScripSharp when you are planning to develop multiplatform projects. For example, at present time I write my image processing library code for .NET, JavaScript (ScriptSharp), Android (Mono) platforms on C#. Also I am planning to port my code on iOS (Mono) and Windows Phone in the future. And I think it's great code reusing and developer time minimization!

How to improve the way I use Textmate for Ruby on Rails, HTML, CSS and Javascript?

I use the latest version of textmate for all my Rails development needs and I feel that I'm under-using the possibilities or this software. I only installed the Ruby on Rails bundle and use little to no snippets / shortcuts.
What do I absolutely HAVE to know / do in order to get the most out of my textmate in a web development environment?
I would prefer Ruby on Rails oriented answers, but any html/js/css answers would be helpful.
Edit: Added a bounty to get more inputs on this.

I was on the same boat some time ago. My biggest advice would be to reserve some time to learning your tool. It will do wonders to your productivy.
I started installing the GetBundles bundle:
cd ~/Library/Application\ Support/TextMate/Bundles
svn co http://svn.textmate.org/trunk/Review/Bundles/GetBundles.tmbundle/
With it, you can check and find new bundles. Be sure to go through most of the options of each one you install.
Next, try learning some Textmate skills. I'd recommend the Peepcode screencast. It covers Rails related productivy tips and information, and will give you some new ways to develop.
Then, you try reading most Textmate tips you can find on the Internet. There are a few I read from time to time: Textmate Tips, Cool Textmate Tips, Textmate Tips from Macromates, Mactips, Textmate Productivity Tips.
There is a Textmate book, but haven't been able to get into it yet. Should be useful, though.
Lastly, the best way to improve your skills is to practice. I try to come up with small week-length projects to use new tips or to remember features I had forgotten.
Good luck :)

Ctrl-Cmd-T allows you to search for commands, so every time I want to do something new (like a validation macro) I hit Ctrl-Cmd-T, type vpo and it finds the correct macro for validate_presence_of, and even tells me to just type v-p-TAB next time. It's quite the education.
Also, I managed to use text mate for a year without realising that Esc auto completed. Don't miss that one.
Ctrl+Opt+Cmd+V to see your clipboard history is also a life saver.

I've been using TextMate for a while now, and one of the best things about the application is the ability to extend it using bundles. As Yaraher said, there are lots of resources out there, and you should go and take a look.
My only other piece of advice is this: when you find yourself doing something with TextMate over and over, and it is a pain, or you think that it could really do with this or that feature, think about how you could do that with your favourite scripting language. If you can write a script for your feature, you can add it as a command that TextMate can use - have a look at the bundle editor (Ctrl+Opt+Cmd+B) and the existing commands, it is pretty straightforward.

Not Rails-related, but I can't say enough good things about the Zen Coding plugins for HTML & CSS coding. A huge bunch of keyboard shortcuts that will completely change the way you use Textmate (if you do a lot of XHTML/CSS like I do). Watch the Screencasts to see just how quickly you can do common tasks with them.
Another plugin that's been super awesome for me along the same lines is the jQuery Bundle that adds keyboard shortcuts for a bunch of jQuery methods.
Essentially, what I'm getting at here, is that with some diligent searching you can uncover a ton of community-built addons for Textmate that increase the functionality of this already awesome program.
Most of the coders in my office use some variant of Eclipse, but I say they can pry my copy of Textmate from my cold, dead hands. :D

Cmd-T ENTER lets you go back to the file you were previously editing. This is specially useful as TextMate doesn't support window split.
Also, check out the rails-footnotes plugin. It adds links to the bottom of your rail-app layout that automatically open the view or controller files in TextMate. Those links only appear in development mode.
Some of the other features that I use frequently are:
Duplicate line: CTRL-SHIFT-D
Select line: Triple Click (works outside TM too)
Move selection: CTRL-CMD-Arrow
Comment/Uncomment: CMD-/
Also, for maximum productivity, don't forget to set your keyword repeat rate to its maximum or beyond.

Probably the most useful TextMate trick I've found out about is Cmd-T, which shows a quick open dialog for the files in a project.
Another good trick I've learned is opening a TextMate project from Terminal (assuming you installed the TextMate Terminal Usage [via the Help menu]). mate . from the Terminal will open a TextMate project from the current directory.
If you watch Railscasts, you'll see how useful the various text completion and other Bundle options are. I'd second Yaraher in checking out all the stuff in the Rails bundle (Cmd+Opt+Ctrl+B).

I can recommend looking at these (Note: PDFs):
http://pragmaticstudio.com/rails (Rails TextMate Cheat Sheet)
http://www.g-design.net/textmate.pdf (HTML/CSS/Javascript/Other TextMate Cheat Sheet)
It would also be beneficial to look at the bundle editor (Cmd+Opt+Ctrl+B) and just look around at how the general bundles are setup. I did that, then shortly after started making little snippets in my own bundle to expedite things which I do most often.
Hope this helps, and good luck!

Indeed, take a look at the bundles that are available and definitly keep it in mind if you find that you are repeating or using the same stuff a lot. You'll end up with a lot of snippets in no time!
Think like <link rel="stylesheet" href="/public/stylesheets/screen.css"> can very easily be extracted into a snippet so the only thing you would have to type would be the link to the stylesheet itself.
This might seem like not a big deal but just think about the amount of times you've had to type something like this. Mastering Textmate is all about saving yourself from unnecessary keystrokes and making it work for you instead of the other way around.

For a list of most useful keyboard shortcuts for Rails development see my blog post: http://szeryf.wordpress.com/2010/02/15/textmate-shortcuts-you-should-be-using/
You might also want to check out this bundle: http://github.com/szeryf/rails-routes.tmbundle