Javascript projects to learn from [closed] - javascript

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I like javascript, but I have problem with learning it :)
I mean, i use it at work but I would like to know more, and I think the best way to do it is to read and understand someone else's code.
I use ASP.Net MVC and there are some great opensource projects you can use to learn new technology, like NerdDinner, Oxite or SharpArchitecture or even MS starterkits.
I was trying to read frameworks like jQuery, but it's really complicated, and I don't think that it was created to learn new things from it.
Do you know any good JS projects that can help with learning javascript ?
I'll try to paste all good sources here :
Github - javascript
JS Made Easy
Nice JS tutorial: Eloquent Javascript

Have a look at some of the JavaScript projects hosted on Github: https://github.com/search?q=javascript&ref=cmdform

There's a great interactive tutorial for learning JS, Eloquent Javascript which I would really recommend. Since you already mentioned you tried learning jQuery by the source and it was hard, why not just go this route?

In essence all javascript is open source. You just go to the webpage and view source.
If you open the JS file directly you will see its source.
There are of course exceptions, with people trying to obfuscate javascript, but they are the minority.
Checkout jQuery and the jQuery plugins to learn more.
Another good source is the talks of Douglas Crockford on javascript. Google has a bunch of them, here.

I would recommend to take a look at OpenLayers project.
It's an open source javascript library for creating web mapping "Google Maps"-like applications.
It's a good example of how to write solid, testable and maintainable object oriented javascript code.

Did you check out the JQuery tutorial pages? They contain a lot of practical examples
http://docs.jquery.com/Tutorials

http://www.jsmadeeasy.com/
scripts exaples - learn by example

http://learn.appendto.com/
A FREE video course on Javascript/jQuery
The best thing I've found so far to grasp JS/jQuery quickly.

backbone.js # http://backbonejs.org/
Also,
The Narcissus meta-circular JavaScript interpreter - https://github.com/mozilla/narcissus

Related

How to refactoring legacy simgle web page/app to MVC with a modern js framework like backbone.js or angular.js [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I'd to know examples, recommendations and frameworks to start in a right way to refractory a single page web app with html, css and js files (jquery) in a MVC/MVP js application that needs to works in a ie 7 at least (this is mandatory), but if its possible I'd like that this app could works well in others browsers too.
The code is a lot of ifs and else and each one use the document.write() js method to write page elements. To 90's style yet, like bellow:
if ($auth$ == 19) {
document.write("<TR>");
document.write("<TD NOWRAP WIDTH='100%' height='26'>");
document.write("<font face='Arial, Helvetica'><B>$username$</B> you cannot access your account.<p>Please contact your Security Administrator or Help Desk.</font>");
document.write(" </TD>");
document.write("</TR>");
}
80% percent of this web app is written in this way depends of the external variable values
What are the js modern frameworks or a modern approach that let me able to prototype this in a MVC/MVP js way?
Some references? tutorials?
I'm glad for your help, thanks!
I spent quite a bit of time researching whats available. KnockoutJS has a great tutorial site. Then I found AngularJS which is much more complex because it does so much more. Angular is a full framework to do your routing, databinding (without observables), as well as letting you build your app domain centric by using directives.
Another thing I love about the Angular team is that they are all about testing. They released the Testacular test runner which watches your file system and when any file changes, it runs your unit tests in a browser of your choosing. Automated browser based unit testing, I became hooked pretty quickly.
I have read many people not preferring AngularJS because the there are so many other bits out there that are constantly evolving that are focused on specific aspects of SPA, such as historyJS, backboneJS, sammyJS...Each of these have their own focus and may do the job better. I personally trust AngularJS as its backed by google, and its community is really growing.
John Lindquest has a great set of tutorials he just started recently at egghead.io.
There is a modules community at ngmodules.org which demonstrates the ease of building expansion modules into an angular app.
The youtube page for AngularJS has been very helpful for me to keep up with the suggested structures for your angular app.
I would suggest checking them out. Once you wrap your head around doing it the angular way, you really change your way of thinking.

Some hints to improve writing of JavaScript code [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 11 years ago.
The basic idea for writing good code is that the code must be readable, well-commented and documented.
Other basic facts for writing good code regarding all the program languages are structuring the code in directories and files and indentation of course.
In the case of javascript the things could be more complicated,
because the language allows you to use different style to accomplish similar task.
For example there are three different ways to define a JavaScript class.
Said that, which are the best resource (books/sites) or suggestion for writing good code (library) in javascript?
I'd highly recommend reading JavaScript: The Good Parts by Douglas Crockford to get you started on writing quality JavaScript code.
If you're working for a company, is there a standards manual, or something jotted up saying "this is how we want things to be coded"? Yes, it's kinda Dictatorial, but it helps keep things "neat". ---Now, if you do not have one at your company, be proactive, talk to a few higher ups if they think it'd be useful, tactfully get them to delegate it to yourself and then make it. Get some brownie points and a good thing for your resume ---
There's ton's of books on the subject, blogs, pod casts, and probably a radio station somewhere.... that all talk about this subject.
But the #1 thing you will get from people is: Do not put many operations on the same line!
How many times do you look at a script and see a kerfuffle of statements/commands/initiators/setters/getters on one line. Or 4 nested ternary statements.
Sure, it "looks" cool if you're 15, but it is counter productive, not intuitive and not helpful. (yes this is a sour point). Code/Script is supposed to be maintainable. The biggest cost to some companies is maintenance on a product. When you go back to something years/months/days/hours after something is written, you want to be able to understand it without having to tape your eye lids open.
Here's a couple good articles I've read about this. They're not the most up-to-date but the information in them is still strong.
http://amix.dk/blog/post/19496
http://www.codinghorror.com/blog/2008/08/secrets-of-the-javascript-ninjas.html (yes from SO's very own Jeff)
http://www.bobbyvandersluis.com/articles/javascript_good_practices/index.html
Javascript - The Definitive Guide by David Flanagan (O'Reilly)
Pro Javascript Techniques by John Resig (APress)
http://jquery.com/
http://www.crockford.com/
http://developer.yahoo.com/yui/
This list will probably get fairly long, but don't forget you can study most of the code that is out there & you will soon learn what is good and bad - that's one big, great resource.
At the first place i would suggest you to get more familiar with JS object model
I would suggest you to take Douglas Crockford's article on prototypal inheritance:
http://javascript.crockford.com/prototypal.html
and make comparison with classical inheritance model
http://javascript.crockford.com/inheritance.html
More systematic approach of pros and cons of JavaScript can be found in his book
JavaScript: The Good Parts
http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742
If you search for more broader architectural approach
JQuery, ExtJs (a.k.a. Sencha), MooTools are great java script libraries/frameworks to start looking at their design principles.
I would start with JSLint
I would recommend coffee script as a good tool to help write good javascript. It is very readable, and includes some very clever improvements to vanilla javascript, including a very well thought out class declaration system (not trivial in javascript, which is prototype based rather than class based in it's language definition).
For comments, I would recommend JSDoc, which is a javascript version of JavaDoc. I find it to be very easy to maintain comments in the code, and the output is in a standard format that many editors/tools are able to utalise - so not only for people to read. Google have also provided a good set of guidelines of how best to write comments using JSDoc in a standardised manner.

Want to know the base level (not the basics) architecture of the JavaScript [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 12 years ago.
I am having a good knowledge of JavaScript, I have a passion to know more and in-depth about it. So I am start searching for the base or structural level and also various concept like event delegate, event bubbling etc. is there is any resource for it?
I can think of two.
Douglas Crockford's javascript page is full of awesome knowledge pearls about the language (both basics and advanced stuff).
The Secrets of the Javascript Ninja book is an advanced resource. It's written by John Resig, the guy bejind jquery. It's still not out, but if you pre-buy it you have access to the beta editions (a new one popped out 2 weeks ago)
One of my favorite resources is Douglas Crockford's series of videos on Javascript: http://javascript.crockford.com/
He gives you a whole history lesson wrapped up into practical usage that explains the how and why the system works. Beyond that, check out the resources that John Resig has available on his blog (the creator of JQuery, a very popular Javascript library): http://ejohn.org/blog/
This is a fun one after you have gone through the Crockford videos: http://ejohn.org/apps/learn/
If you can understand what both Crockford and Resig discuss, you'll be able to handle just about any problem JS can throw at you.
I think quirksmode.org has a very good introduction to events:
Introducation
Event Order
Early event handlers
Traditional event registration model
Advanced event registration models
Event properties
Event compatibility tables
Then of course there is MDC JavaScript Guide and various books such as
High Performance JavaScript
JavaScript Patterns
To really get stuck into the architecture of javascript you should have a good thorough read of the Specification.
The specification will let you have a better understanding of the internals of JavaScript and gives an insight into how things work under the hood. You may also get a feeling for what non-standard parts of javascript you've been accidentally using.
Another route to getting a better understanding would be to read well known and (hopefully) well structured open source libraries.
Reading such libraries is a great way to learn javascript design patterns and how to utilise various parts to the maximum effect.
A third, (and significantly more advance) option would be to read the open source implementation of chrome.
This would give you an understanding of the low level implentation of javascript. You know exactly what the interpreter is doing with your code under the hood.
If your interested in the DOM more then JavaScript itself you can always read the HTML5 spec

Are jQuery and its peers helping or hurting JavaScript Knowledge? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I noticed most questions related to client-side script on SO are jQuery related and that got me thinking. I'm wondering what the ease of these libraries is doing to actual KNOWLEDGE of JavaScript and the DOM.
So much is done for you that my fear is there is a growing number of web developers that actually know very little about JavaScript besides how to include the jQuery library and use the plug-ins they download. It's the "fast food" approach to software development and, based on nothing more than anecdotal evidence, I think a lot of web "developers" would be in the dark when it comes to client script if they were suddenly unable to use the jQuery library.
My question: are these libraries helping or hurting REAL knowledge of client-side scripting?
In my opinion jQuery is to DOM as the .NET Framework is to the Win32 API, or GTK+ is to X11 programming. It's another layer on top of the "raw" API. It makes things a lot easier to work with, at the "cost" of abstracting the lower level details. Usually this is OK, but sometimes these details are important. It can help at times to be familiar with the underlying API (I think moreso in the jQuery/DOM case than .NET/Win32), but I wouldn't worry overmuch if someone has to hit a reference site or two before coding a pure DOM solution.
It's also important to recognize the difference between "JavaScript" and "the DOM". The DOM is not part of the JavaScript language; it is merely an API exposed by to the JavaScript engines in the major browsers. So while using jQuery might hinder one's knowledge of the DOM, it won't hurt their knowledge of the JavaScript language itself.
This is common question in programming.
Libraries and high levels of abstractions, in general, make things that were once difficult, much simpler. This tends to make the number of people who understand low-level internals smaller, but also increases the overall productivity of the industry.
jQuery have hurt my knowledge of DOM: I forget this **** DOM as a nightmare.
jQuery will never hurt my knowledge of JavaScript. You can't forget JavaScript after Crockford's texts
I started by learning Javascript as a child - HTML + Javascript was the easiest thing to deploy without having to actually know much about how computers worked. Since then, I feel that I know more about Javascript than I ever would have to.
However, there are very few projects now for which I use Javascript without jQuery. In fact, before I knew about jQuery, I made my own libraries. They weren't great, but they worked, and saved me loads of time and repeated code.
I guess my point is that the Javascript pros would have produced great libraries for themselves, no matter how many n00bs ended up grabbing onto them. Even if we're hurting beginners' knowledge of Javascript (an assertion which I'm not even going to make), jQuery is still definitely a good thing. What it does to beginners is a question of the learning process we offer beginners, rather than the tool itself.
I think that jQuery and its peers are probably greatly increasing general knowledge of Javascript. When I discovered jQuery I went from disliking Javascript and using it as little as possible to thinking it was a wonderful and beautiful language. Indeed, it might now be my favourite language in which to program, and I've learned an awful lot by reading the source code of the jQuery library. I can't believe that my experience is in any way unusual.
Why do you care about the "real" knowledge? The end result is all that matters.
If a developer can make a website that loads really fast with a great interface and layout, then he or she is a successful developer. How (s)he did it is irrelevant.

Is there any good Markdown Javascript library or control? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I want to build a site where the user can enter text and format it in Markdown. The reason I'd like a Javascript solution is because I want to display a live preview, just like on StackOverflow.
My site is not targeted at developers, however, so an editor control would be ideal.
I gather that on StackOverflow, the WMD editor is being used.
A quick search on Google also turns up Showdown library, which I think is actually being used by WMD.
Are there any other options? Are WMD/Showdown great tools already? What have been your experiences with the different options?
We've been pretty happy with WMD. There are a few niggling bugs in it, however. Nothing major, but I would love if John Fraser (the author) made the code open source so we can fix some of them. He's promised to do so but other real life projects are getting in the way.
I do follow up with John every week. I'll post on the blog once the WMD source is finally available. Haven't been able to contact John Fraser in over a year now.
We have open sourced both the JavaScript Markdown library
http://code.google.com/p/pagedown/
and the server-side C# Markdown library
http://code.google.com/p/markdownsharp/
If you're not averse to using Ajax to generate the live preview, then another option is markItUp!. markItUp! is a universal markup-editor, and very flexible. It does provide
an easy way of creating a markup editor, but unlike WMD, it doesn't provide its own live preview.
I used markItUp!, along with a simple JSP (using MarkdownJ) for one of my open-source projects (a Markdown plugin for Roller). If you're using another server-side technology, replace that simple JSP as appropriate.
I actually starting using this before I came across WMD. I'd agree, WMD is great, but has only just been open-sourced and is, at this stage, more difficult to customize the behavior of.
I would recommend marked, which is lightweight, efficient, easy to use and supports GitHub Flavored Markdown (GFM) as well. It can be used in either server(nodejs) or client(browser) sides.
As far as I know there really isn't any other browser-based editor for Markdown, at least none as extensive as the WMD editor.
Showdown is a Markdown converter in JS, which forms the basis for the HTML preview of WMD. They're both made by http://attacklab.net/.
And as far as I know there haven't been any big complaints about both (at least not on the Markdown mailing list). So go for it.
There is one named Showdown and it is currently hosted here: https://github.com/coreyti/showdown
And there is https://github.com/evilstreak/markdown-js :)
Strapdown.js, which was recently released, "makes it embarrassingly simple to create elegant Markdown documents. No server-side compilation required."
I've not tested this, but here is another option:
Markdown wysiwyg
The question is even more ancient now but also even more relevant since much of the mentioned code is several years out of date.
However, I did find a few that still seems current:
Jquery-Markedit - This was forked from wmd-edit quite some time ago and refactored to use jQuery. Seems good at first sight.
EpicEditor - is also still maintained, has a flexible parser and, as you can see below, the author is highly responsive (see below). IT seems to have good documentation as well. Sadly not working with IE9.
MarkdownDeep is a third option that is still current. The interesting point with this one is support for Markdown Extra. Has a dependency on JQuery (actually you can also implement without JQuery). Based on the .NET version so documentation is more aligned to that than the JS version. This also works with IE9. It is very easy to use (with JQuery) & very simple. No significant development happening with this though as far as I can see.
js-markdown-extra is a fairly accurate port of the PHP library and is still under maintenance. It supports Markdown Extra of course.
The question is ancient but hopefully this might help someone. I have just recently published a working version of my own Javascript markdown editor, uedit. You can find the source code here. It works on most browsers (including IE6+) and doesn't depend on any external JS libraries.
After trying with several plugins to solve my own needs of offering a MarkDown seudo-WYSIWYG I ended implementing my own one:
http://fguillen.github.com/MDMagick/
Maybe is not as powerful as all the solutions commented here but I think that none is as simple and easy to integrate and customize.

Categories

Resources