Core HTML/CSS/Javascript Frameworks [closed] - javascript

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I'm trying to improve my web development skills. I'm already familiar enough with HTTP, HTML, CSS, and Javascript, but I'd like to take advantage of some frameworks/helpers for site layout, CSS, and Javascript support.
What are the best HTML/CSS/Javascript web tools/frameworks out there? (In this question, I'm not looking for scripting-language-based frameworks like PHP, Ruby on Rails, or Django - but more "raw" HTML/CSS/Javascript frameworks.)
So far, I've done a quick look at things like YUI, jQuery, Prototype, Scriptaculous, and a few others, but I'm curious to know what people have had good experiences with.
One item per answer would be nice!

I (and many many other people) recommend jQuery.
It's simple and extremely powerful, and has a very large userbase.

JavaScript
According to Google trends (and SO trends), jQuery is the framework of choice.
After using it for a very large project, I do not recommend Dojo, aside from its package management and perhaps its internationalization.
CSS
I recommend Blueprint CSS.

jQuery is the most popular (especially but not exclusively on Stack Overflow), but I don't have much personal experience with it.
Dojo is the second most popular (measuring by search hits on the web for "X javascript" for various framework names as X) and my personal favorite (highly modular, clean "pythonic architecture", rich, always in the vanguard providing browser-independent access to new features such as [[in the recent past]] browser-local storage &c).

I've always really liked Prototype/Scriptaculous despite some involved work with YUI and to a lesser extent jQuery. Perhaps it's because Scriptaculous "gets out of the way" best.

There's a old, but still pretty relevant article at Smashing Magazine on CSS frameworks:
http://www.smashingmagazine.com/2007/09/21/css-frameworks-css-reset-design-from-scratch/
That said I've found Blueprint CSS to be great for HTML wireframes and prototyping, but basically write raw CSS with no framework for every project. Designs are so unique that it really makes sense to write the CSS on a per-project basis.
I tend to start out using reset.css as a baseline and then creating a site-specific screen style sheet.

... as far a css frameworks go, *{padding: 0; margin: 0} works fine, beyond that projects vary a little too much for me.
... +n for jQuery! Does the job just fine with sprinkles of hand rolled js.
IMHO, after a while there comes a point of diminishing returns when trying to rely too much on frameworks. What was originally making life easier can turn into a hammer.

Prototype is still the superior framework if you care about closures and each. JQuery is good for simple projects but when you have to do more than just manipulate DOM elements you're better off with Prototype.
Some good reading

I prefer JQuery, but if you are looking for a really robust UI framework you should check out ExtJS.

Related

Application bloat by using third parties library in NPM & Javascript [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I'm working on a project with a friend.
He is by far a better programmer than I am, as I have been programming for a little over a year.
I noticed he often builds components, and functionality from scratch. I'd consider him almost a "hipster" in terms of building functionality from scratch.
Is there any downside to my approach of utilizing npm libraries, etc for use? Ie. Date Pickers, Map Components, etc?
One reason I might conjure up is that perhaps there's a performance hit. Will load time be affected significantly? I'm not building a large application, in fact I'd consider it small, BUT! I'm wondering if I'm "cheating", OR this will lead to bloat.
As a quick preview, my basic functionality would currently look to include:
Emoji Picker
Date Picker
Google Maps API Maps Component & Places
Form Validation Library
Superagent
Moment.js
First of all you're not cheating.
It's quite common for developers to use third party packages.
But it can be good experience learning to build your own components.
Don't forget you can always swap them out as your experience, knowledge grows
Pros.
They can save you development time.
They can do things that you may find difficult to implement.
They can be better written and tested.
Cons.
They can be badly written, unreliable, unsupported.
If you don't know how they work they can be problematic if there's a bug or if you need to extend the functionality.
You could end up including a lot of script that is unused.
You might be able to write something better and more maintainable.
Bundling, minifying, uglifying your JavaScript and tree shaking with tools like rollup can help keep your download sizes down.
If you use packages, use reliable ones, look at reviews and ratings, check out the activity and issues log.
As with all concerns performance related - test.
Use fiddler or chrome to see how big your downloads are, measure your download times.
Where possible test under realistic device/network/load conditions.
It's a good test of knowledge on your part, since you are new, to attempt to write all of those things yourselves. It's how a good portion of the users of stackoverflow learned: take on a project that sounds doable, but has an unknown section for you at the time. It's how I personally learned just about everything I know.
That being said, I don't think it's cheating. There's a common phrase in English: "Don't reinvent the wheel." The reason that those libraries exist is because someone took a lot of time to make them, and then realized that other people could probably benefit from it as well. With the example of Moment, working with Date/Time in any language is a huge pain, and the reason Moment is so popular is because no one wants to go through all of what Moment's creator(s) went through already. Why waste time reinventing a perfectly good, well tested, and reliable wheel?
Now if ever you go "man, this wheel is nice, but wouldn't it be better if they were made out of something more durable so that they can go over more bumps?" then in this case you are improving the wheel -- and similarly there are many projects that started off as a fork from an already existing one looking to add what the author felt was missing functionality.

Which forms of JavaScript for intermediate-level Rails developer, only dev on team? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I am acting as web developer for a small startup, taking over as the only in-house developer to maintain and adapt the application that was initially put together by a team of contractors. I would consider myself to be at an intermediate level with Ruby on Rails. I know enough about front end technologies like HTML and CSS to use Bootstrap or Foundation effectively and write my own tweaks when necessary. However, I only can read the JavaScript code of other developers well enough to make small modifications to what's already in place.
I would like to become proficient in JavaScript to help round out my skillset but there seem to be a lot of JavaScript "options" out there and I'm not sure what's on the way in, what's on the way out, what's popular, what's most useful, easiest to start with, best fit for Rails applications and so forth. And by "options" I mean "regular" Javascript, jQuery, Node, Angular, etc etc.
In hopes that my question will meet SO terms as "answerable" I'd like to focus on the question of what kind of Javascript fits best with Rails and which technologies are the most generally relevant today (i.e. not on the way out of popularity already).
Your choice should depend on what you're doing. One case might be using Rails primarily on the back-end, pulling data from it, and then generating your markup and displaying content primarily on the front-end with JavaScript. In that case, you should look into a JavaScript framework like Ember.js or AngularJS. If you're going to be generating your markup primarily on the back-end with Rails, having that markup being pre-populated with content before being sent to the user, you might be better off using jQuery for DOM manipulation and the occasional AJAX request to your Rails back-end.
In the case you're looking for a framework: Yehuda Katz is a leading voice in the Ruby on Rails core team, and has a similar role inside of the Ember.js project. While this isn't strictly objective, I'd say that Ember is the JavaScript framework that most closely matches "The Rails Way". That said, any framework will integrate well if you're using Rails as a backend, and AngularJS is currently more popular and might be easier if you're looking for examples and helper libraries.
I'd like to point out that Ember is just a framework, just like jQuery is just a library. Knowing JavaScript from the bottom up is a very helpful thing when working with anyone's code. I highly recommend checking out the Learn JavaScript page on MDN, and maybe picking up a copy of JavaScript: the Good Parts by Douglas Crockford. The former has a bunch of free information about getting up to speed on JavaScript. The latter is a dense, and somewhat controversial book, but (in my opinion) is one of the best books about dealing with the language's rough edges.

Is it worth of learning cfclient API for mobile application development? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I am ColdFusion developer working in ColdFusion since last 2 years. Recently before few weeks i have started learning cfclient API of ColdFusion Splendor as I am always interested in Mobile application development. But today after reading comments on the blog
http://blogs.coldfusion.com/post.cfm/coldfusion-mobile-features-are-not-just-about-cfclient-but-it-is-necessary#comment-08603915-B031-CC32-1C2DE6521C233F65
I am in big dilemma, Is it worth of spending time for learning cfclient. Some of conclusions that I found after reading the comments on the blog are.
Adobe never have a good track record on generating JS. They generate very ugly looking js.
cfform and cfgrid were introduced with some client side functionality.But now a days no one loves to use it because they have not been updated since long and we can get more flexibility using custom js library.The same may happen to cfclient.
It's a crappy decision from Adobe to focus on mobile application development instead of making the server side language more robust and fixing old bugs.
cfclient inspires the developers not to learn JavaScript.
Adobe is trying to solve a problem that does not exist.
I think you've answered your own question here, to be honest: don't waste your time.
Basically <cfclient> is, by Adobe's own admission, just a hook into the language to tell how the compiler should treat the code: translating it into JavaScript instead of compiling it to bytecode like with normal CFML. And it's a really crap way of achieving that.
The other reason is that they couldn't work out how to implement the hooks into ColdFusion Builder to make all its mobile-dev workflow work.
Another problem is that the Adobe guys are just... not any good at writing anything other than Java. This has been borne out by every single foray into anything other than Java that they write (this includes CFML, incidentally: they can't even write that).
So do you really want journeymen developers who aren't comfortable in the language writing wizards to write your JS for you? No.
Do yourself a favour, and just learn to do it properly. <cfclient> is just an example of Adobe having not learned their lessons over the years after all the <cfform>, AJAX-enabled layout widgets like <cfpod>, and Flash forms. They have never had the skillset to do this work properly, so don't put yourself at their mercy.
Oh, and I'm also voting to close the question as it's not one that can be answered objectively.
This is my take on it
Even if it were good approach today, it is not future proof. New browsers will come, new javascript features will come. I fear that this won't move ahead.
I could not agree more
And some of the existing bugs really need to be addressed.
<cfclient> asserts that client side development should be in cfml. IMHO, Coffeescript covers some of those concerns.
There is a demand for Mobile friendly websites. If I had to pick ONE thing to move ColdFusion forward in this arena it would be: Can we get the JSON functions to work right
There are many ways that Adobe could have moved forward on the mobile application front. If they promoted various community based solutions that would be useful. I know Bootstrap + FW/1 + ColdFusion. But I don't know PhoneGap/Cordova + ColdFusion. I would be good to see those work together.
True, But if you're using CFClient, you're not wanting to write JS anyway, so what do you care what it looks like on the client.
I believe Adobe has promised that we would be able to update the core underpinnings of CFClient (probably PhoneGap/Cordova) and other JS libraries.
Agreed.
I don't know about inspires.
I disagree here. I'd love for a way to quickly deploy to mobile.
PS> I'm sure since this question isn't code related, it will get downvoted / deleted; Might be a better topic for the CF-Talk mailing list or some ColdFusion forum somewhere.

Best Interactive UI using JavaScript frameworks or simply html5 + pure javascript? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I will be working on a web application project that will be demanding a rich UI interactive & high performance website.
Interactive in every possible sense that could be shown. That includes various types of interaction in terms of keyboard events, animations, simple yet effective usability, drag and drop, lightweight (while loading and rendering) etc.
I know a bit of ExtJS (Sencha JavaScript Library), javascript and some html5 coding.
My question is
Do I need to mix up all possible available JavaScript UI framework (ExtJS, jQuery, MooTools, Prototype, Angular JS etc ... ) libraries to make rich interactive UI ? If yes, are there any sample demo for the same ?
If not, is my goal achievable by using only pure html5 and pure javascript ?
Jquery UI, CSS and HTML5 would be enough...if you are really an expert in javascript and enjoy playing with objects, json, events, then it shoudn't be that difficult...otherwise, you have to import loads of libraries which will end up in performance issue, scalability and manageability.
A good approach is to have one single JS file, and one single image on webpage for icons...that you adjust its x, y positions...you can play with animations, no need to use flash objects. ExtJS is no doubt a great library...Use one library, and chose the best which can fulfill all your requirements.
I hope this helps.
MooTools and Prototype actually do DOM alterations whereas jQuery works in its own namespace. I've been only projects that mixed both jQuery and Prototype. You just have to set jQuery to no conflict mode and it should they should fine together although I'd highly suggest using only one.
I'm partial to jQuery since it has a large userbase and jQuery UI has a lot of stock widgets to use as a base, but it really comes down to your own coding style and project needs.
Good luck!
Without knowing about your application, there is no way to know if it can be built using only client-side technologies. Most applications of any significant complexity require at least some server-side logic. Of course you could use node.js to handle this to only require use of javascript.
I would not recommend mixing multiple frameworks if you don't have to. If you do see a framework that you think meets most all of your needs (i.e,. jQuery UI, etc.) then go for it. I would probably recommend jQuery as your main framework however, as there is simply a lot more plug-ins, libraries, etc. that use it than there are for competing frameworks, and a much larger user base to get help from through places like StackOverflow.
I would not expect to find the magic bullet framework that exactly meets all your needs, but with some investment in learning jQuery, you will find it is VERY flexible and VERY powerful to meet most UI needs.
For very complex thick client apps (which it sounds like you are shooting for), I would be remiss not to point out the excellent Backbone.js and Underscore.js libraries. They make building complex javascript applications much easier and play nicely with jQuery.

Javascript Best Practices [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
What are some good resources to learn best practices for Javascript? I'm mainly concerned about when something should be an object vs. when it should just be tracked in the DOM. Also I would like to better learn how to organize my code so it's easy to unit test.
Seconding Javascript: The Good Parts and Resig's book Secrets of the Javascript Ninja.
Here are some tips for Javascript:
Don't pollute the global namespace (put all functions into objects/closures)
Take a look at YUI, it's a huge codebase with only 2 global objects: YAHOO and YAHOO_config
Use the Module pattern for singletons (http://yuiblog.com/blog/2007/06/12/module-pattern/)
Make your JS as reusable as possible (jQuery plugins, YUI modules, basic JS objects.) Don't write tons of global functions.
Don't forget to var your variables
Use JSlint : http://www.jslint.com/
If you need to save state, it's probably best to use objects instead of the DOM.
I disagree to the "use a framework" statement to some degree. Too many people use frameworks blindly and have little or no understanding of what's going on behind the curtains.
I liked JavaScript:The Good Parts by Douglas Crockford although it's focused entirely on the language and ignores the DOM altogether.
If you don't feel like reading you can watch this video: JavaScript the good parts by Doug Crockford.
Probably the single most important thing is to use a framework, such as jQuery, or prototype, to iron out the differences between browsers, and also make things easier in general.
YUI Theatre has a bunch of videos (some with transcripts) by Steve Souders, Douglas Crockford, John Resig and others on JavaScript, YUI, website performance and other related topics.
There are also very interested google tech talks on Youtube on jQuery and other frameworks.
You can pick up a lot from Pro JavaScript Techniques, and I'm looking forward to Resig's forthcoming Secrets of the JavaScript Ninja.
As an addendum to the Crockford book, you may also want to check out this piece Code Conventions for the Javascript Programming Language. I also have a slightly different suggestion: instead of using a JS library off the bat, why not create your own? You may write a crappy library (as I did), but you'll learn something in the process. You have existing examples you can use as models. Also, to help give you an understanding of JS design patterns, I shall recommend another book, 'Pro Javascript Design Patterns'.

Categories