Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / NewStats: 3,195,087 members, 7,957,069 topics. Date: Tuesday, 24 September 2024 at 06:20 AM |
Nairaland Forum / Science/Technology / Programming / Javascript Frameworks, Libraries & Tools (2810 Views)
A Curated List Of Awesome Python Frameworks, Libraries, Software And Resources. / Most Popular Javascript Frameworks To Learn In 2017 / Javascript Frameworks In 2016 (2) (3) (4)
Javascript Frameworks, Libraries & Tools by Olumyco(m): 10:00am On Nov 30, 2015 |
JavaScript Frameworks, Library and Tools It seems like almost every other week there is a new JavaScript library taking the web community by storm! The web community is increasingly vibrant, diverse and is moving rapidly on multiple fronts. It would be an impossible feat to survey every major JavaScript framework and library. Instead,I will share some of the most famous and influential ones for front-end development. So let’s take a look at the top JavaScript web front-end framework, libraries & tools and when to use them. AngularJS Angular is the popular enterprise framework that many developers are using to build and maintain complex web applications. Angular’s popularity is immense, and companies using it are as diverse as Domino’s Pizza, Ryanair, iTunes Connect, PayPal Checkout, Google. Angular is an open source framework supported by Google. Angular describes itself as an extension to HTML for building complex web apps. Also if you’re familiar with TypeScript , that’s how Angular 2 was written. Angular is an MVC-type framework. It offers two-way data binding between models and views. This data binding allows for an automatic update on both sides whenever there is a data change. It enables you to build reusable View Components. It provides a services framework to allow easily backend-frontend server communication. Finally, it is just plain JavaScript. When to use AngularJS? When you are building a complex web front-end application and need a single modular framework to handle everything. GitHub: https://github.com/angular/angular.js Current Version: 1.4.7/1.2.29 Website: angularjs.org React React is this year’s favorite JavaScript project! Everyone seems to be talking about ReactJS. Every conference I have been to in the last year had at least a couple of talks on React and other libraries in the same family ( Flux , Redux ) React is open-source and developed mostly by Facebook with contributions from other major tech companies. React describes itself as a JavaScript library for building user interfaces. React is mostly the V in MVC. Itfocuses entirely on that piece of MVC and disregards the architecture of the rest of your application. It provides a component layer that makes it easier to make UI elements and combine them together. It abstracts the DOM away so that it optimizes rendering and allows you to render React from node.js. Further, it implements a one-way reactive data flow that makes it easier to understand and use than other frameworks. Being the V in MVC, several projects combine React with the likes of Angular or Ember. When to use React? When you want a powerful View layer but don’t need an elaborate framework for the rest of your application or when you want a View layer to go with your Angular, Backbone, or Ember application. When you are trying to build an isomorphic web framework. GitHub: https://github.com/facebook/react Current Version: v0.14.0 Website: Facebook.github.io/react/ NativeScript NativeScript is an open source framework for building cross-platform truly native iOS and Android mobile apps using JavaScript. With the NativeScript framework you can use your JavaScript and CSS skills to write native mobile applications for iOS, Android and (soon) Windows Phone. There is no WebView involved in rendering the app, as the UI is rendered by the native platform's rendering engine. Because of that, the app's entire UX is native. The NativeScript framework enables you to use a complete stack of cross-platform APIs to write your application code or, if you need to, you can directly access all platform-specific native APIs using JavaScript only. That’s right—you can access all native APIs, not only the ones we thought would be useful! GitHub: https://github.com/NativeScript/NativeScript Current Version: v1.5.2 Website: http://www.nativescript.org Backbone Backbone is a famously simple framework that fits into a single JavaScript file. Backbone has been around for a while; developed by Jeremy Ashkenas from CoffeeScript and Underscore fame. Backbone is especially popular with teams looking for a simple structure for their small web applications without bringing in a large framework like Angular or Ember. Backbone provides a full MVC framework along with routing. The Models allow for key-value binding and events for handling data changes. Models (and Collections) can connect to RESTful APIs. The Views have declarative event handling, and the Router does an excellent job of handling your URL and state management. Everything you need to build a Single Page Application without offering too much and without unnecessary complexity. When to use Backbone? Backbone is my GOTO framework for simple web applications. GitHub: https://github.com/jashkenas/backbone/ Current Version: 1.2.3 Website: backbonejs.org Ember Ember is an opinionated web app framework focusing on programmer productivity. Ember is relatively popular, and the core team includes smart people like Yehuda Katz, who was part of the Ruby on Rails and jQuery Core Teams. Ember describes itself as “a framework for creating ambitious web applications” that doesn’t waste your time. It is very opinionated and makes many choices for you. Ember is also an MVC framework. It includes a templating and view engine that automatically updates when data changes, just like Angular, Backbone, and React. It includes the concept of web components that let you extend HTML with your own tags (just like Angular). It also has a routing and model engine that knows how to work with your RESTful API. When to use Ember? When you just want a framework that just works. Use Ember when you do not need flexibility because you are on a tight budget or a hard deadline. GitHub: https://github.com/emberjs/ember.js Current Version: 2.1.0 Website: emberjs.com jQuery jQuery is the library that needs no introduction. It is single-handedly responsible for making cross-browser sites a reality and for bringing the web to where it is today. Web Standards have been adopted and genuinely respected by most major browser manufacturers and jQuery is one of the reasons why. The mission of jQuery Foundation is “to improve the open web, making it accessible for everyone, through the development and support of open source software, and collaboration with the development community.” jQuery is the most used JavaScript library in the world, and no app should ever go without it unless you dislike programmer productivity. It makes DOM traversal, event handling, animation, AJAX so much simpler and easier across all browsers. When to use jQuery? Always, unless you want to use a lighter- weight version like Zepto. GitHub: https://github.com/jquery/jquery Current Version: v1.11.3 or v2.1.4 Website: jquery.com Sails Sails.js is a web framework that makes it easy to build custom, enterprise-grade Node.js apps. Sails is a comprehensive MVC-style framework for Node.js specifically designed for rapid development of server-side applications in JavaScript. It’s robust service-oriented architecture provides different types of components you can use to neatly organize code and separate responsibilities. And if you’re disciplined, then developing an enterprise-level application with it is even possible. Written in JavaScript, Sails gives you the additional benefit of being able to share your code between the server and client . This could be very helpful, for example, for implementing data validation where you need to have the same validation rules both in the client and on the server. Also, with Sails you need to master only one programming language, instead of several. Github: https://github.com/balderdashy/sails Current version: V 0.12 Website: http://sailsjs.org Underscore &lodash Sometimes what comes built-in to JavaScript is just not enough for programmers to be truly productive. There’s always a utility function that is missing or a function that would simplify the code. Underscore (and lodash) is a JavaScript library that provides a whole suite of utility functions without monkey patching the built-in JavaScript objects. Both libraries provide over 100 functional helpers and other specialized goodies; including functions like map, filter , invoke, reduce, template , throttle , bind, extend, pick , clone and so much more. When to use Underscore? When you want a single JavaScript file that immediately augments programmer productivity. Underscore GitHub: https://github.com/jashkenas/underscore Underscore Current Version: 1.8.3 Underscore Website: underscorejs.org When to use lodash? When you want amodular and slightly more performant version of Underscore with easier support for AMD and community plugins. LodashGitHub: https://github.com/lodash/lodash LodashCurrent Version: v3.10.1 LodashWebsite: lodash.com D3.js Data visualization and charting is a common requirement for web applications. D3.js is the defacto standard when it comes to any data manipulation and visualization. It is one of the most popular projects on GitHub and is used by hundreds of organizations. Plenty of graphing, charting and visualization libraries build on top of D3. D3 allows you to manipulate data documents from any source and apply a transformation into the DOM or/and SVG or/and CSS. D3 focuses on modern web standards and ensures you are free from any proprietary format like Flash or Silverlight. When to use D3.js? Anytime you need visualization of any kind. GitHub: https://github.com/mbostock/d3 Current Version: 3.5.6 Website: d3js.org Babylon.js Looking to build a video game that runs entirely on modern web standards and across browsers? Take a look at Babylon.js, a 3d game engine based on WebGL and JavaScript. You can create incredibly high-quality games complete with physics, audio and particle systems among other things. When to use Babylon.js? Whenever you are building a video game or a complex 3D scene of any sorts. GitHub: https://github.com/BabylonJS/Babylon.js Current Version: 2.2 Website: babylonjs.com Three.js Want to build a 3D visualization but do not need a full-blown game engine? Three.js provides a lightweight 3D library that allows rendering 3D to an HTML5 canvas, SVG, and WebGL. It is quite a straightforward library, and there are hundreds of beautiful examples in the three.js showcase. When to use Three.js? Whenever you need a simple 3D visualization that can output to a Canvas. GitHub: https://github.com/mrdoob/three.js/ Current Version: r73 Website: threejs.org Mocha& Chai Testing JavaScript has been incredibly annoying for a long time. Scratch that, testing any code is typically seen as annoying, but it is something that every developer should do. Instead of testing their code, every developer seems always to disdain and ignore it. There is a fix to this hatred, and it comes in the form of Mocha and Chai. While both libraries take their names from yummy hot beverages, both libraries do help you test your code but in different ways. Mocha is a JavaScript test framework that makes it easy to test the async code in your node module or browser app. Mocha tests can run in series and have the added quality of tracing exceptions to the correct test cases. Chai is a behavior-driven development/test-driven development assertion library that can be paired with Mocha. It makes it simple to express what you are testing in a readable style. When to use Mocha & Chai? ALWAYS! Please test your code and make the world a better place. Mocha GitHub: https://github.com/mochajs/mocha Mocha Current Version: 2.3.3 Mocha Website: mochajs.org Chai GitHub: https://github.com/chaijs/chai Chai Current Version: v3.4.1 Chai Website: chaijs.com Karma Having included Mocha and Chai on this list, it would be incomplete not to include a test runner to run these tests or perhaps to setup continuous integration testing. Karma is a tool designed to help automate running your tests against different browsers. It will help you run your Mocha and Chai tests on all the browsers out there. Not every browser runs on every platform but luckily there are a couple of free tools you can use to test other browsers, take a look at Browser Screenshots. If you are running on OS X and want to test Edge or Internet Explorer, you can use this tool for free . When to use Karma? Whenever you have a comprehensive test suite for your applications and want to ensure the tests pass on all the browsers. GitHub: https://github.com/karma-runner/karma Current Version: v0.13 Website: karma-runner.github.io PhantomJS Running full browsers to test your code is memory and CPU intensive. PhantomJS allows you to run a headless WebKit – the rendering engine behind Safari and previously Chrome (now Blink). It enables you to run your tests, capture screenshots, monitor the network and automate page browsing from a JavaScript API. When to PhantomJS? When you need to do more testing, manipulate pages and monitor network requests. GitHub: https://github.com/ariya/phantomjs Current Version: v2.0 Website: phantomjs.org Grunt & Gulp Building websites for production typically involvesome tasks to improve performance like minification of JavaScript and CSS, compilation of CoffeeScript/TypeScript, unit testing, lintin. Perhaps you already have a toolchain ready to prepare your website for production but if you do not, you want to use a task runner like Grunt or Gulp. Both have endless plugins to do just about any transformation to your website to get it ready for production. When to use Grunt? When you prefer writing configuration files and don’t mind your task runner generating intermediary files. Grunt GitHub: https://github.com/gruntjs/grunt Grunt Current Version: v0.4.5 Grunt Website: gruntjs.com When to use Gulp? When you prefer to write code over configuration and want to take advantage of node.js’ streaming capabilities for faster task execution. Gulp GitHub: https://github.com/gulpjs/gulp Gulp Current Version: v3.9.0 Gulp Website: gulpjs.com Babel JavaScript as a language is evolving quickly. ECMAScript2015 was released last summer and many of its new features are implemented in the latest browsers. If you want to take a look at ECMAScript 2015 compatibility, you can take a look at this table from @kangax. You’ll notice that the latest versions of Edge, Firefox and Chrome have near-complete compatibility. We do not live in a perfect world. As developers, we will need to continue supporting older browsers that do not have the latest and greatest JavaScript features. We do want to advance the web and improve our code bases. Babel is a JavaScript compiler that compiles the latest JavaScript standard to ES5-compliant JavaScript allowing you to run on browsers as old as IE9. It has some plugins that make it easier to develop with React and even use features that are not part of the specification (e.g. ES7). When to use Babel? When you want to use new JavaScript language features and still support older browsers. GitHub: https://github.com/babel/babel Current Version: 6.1.2 Website: babeljs.io ............. Put together by Rami Sayer, Technical Evangelist @ Microsoft on Web development 2 Likes 1 Share |
Re: Javascript Frameworks, Libraries & Tools by maekhel(m): 12:00pm On Nov 30, 2015 |
What of vuejs? Have been hearing some good stuff about it, though I have not used it. |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 12:22pm On Nov 30, 2015 |
maekhel:I too I think I av come across it. But don't know what it really does |
Re: Javascript Frameworks, Libraries & Tools by Nobody: 12:34pm On Nov 30, 2015 |
maekhel: My colleague uses it and I have evaluated it, it's the next best thing if not for Angular 2 it's minimal and Component oriented, compared to the crap called Angular 1 1 Like |
Re: Javascript Frameworks, Libraries & Tools by Nobody: 12:34pm On Nov 30, 2015 |
What of Dojotoolkit, the next version is going to be in TypeScript and it's going to have much more components than ever, Deliteful is already in the works that's the Web Component aspect of it. |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 2:49pm On Nov 30, 2015 |
In fact this TypeScript is a threat to JavaScript. The moving away of these frameworks from JavaScript to TypeScript is something else dis days. Before we know of Angular 2 now dojo too is moving again. This shit must stop o. Well I thank God that what is making them to run after TypeScript has already bin resolved with d coming in of JavaScript ES6. JavaScript all d way |
Re: Javascript Frameworks, Libraries & Tools by Metalzoa: 10:33am On Dec 01, 2015 |
React is the only thing on that list worth considering. |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 10:42am On Dec 01, 2015 |
Metalzoa:Lol. React is the JS Library of the Year. |
Re: Javascript Frameworks, Libraries & Tools by Nobody: 5:13pm On Dec 01, 2015 |
Olumyco: Already jumping to TypeScript, never really liked JS that much, because i prefer Static typed languages. 1 Like |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 8:13pm On Dec 01, 2015 |
pcguru1: Haaaaaaaaaaaaaaaaaaaa! ! |
Re: Javascript Frameworks, Libraries & Tools by Nobody: 2:35pm On Dec 02, 2015 |
Olumyco: lol i started with C++, then Java and C# so JavaScript syntax took me the longest and compared to others it's easy to structure my code because of strict type, but mehn in JavaScript it was hard for me took me years to master it but with TypeScript i can code like C#. Also fear not JavaScript Syntax is 100% valid in TypeScript, TypeScript is just a superset of JS only thing i fear is debugging but TypeScript aligns with ES6 so no wahala. Come to the dark side |
Re: Javascript Frameworks, Libraries & Tools by Metalzoa: 5:39pm On Dec 02, 2015 |
JavaScript or bust, bro. |
Re: Javascript Frameworks, Libraries & Tools by Nmeri17: 3:27pm On Jan 25, 2016 |
Nice one from you Olu |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 2:24am On Jan 26, 2016 |
Nmeri17:Thanks bro |
Re: Javascript Frameworks, Libraries & Tools by Nmeri17: 7:38am On Jan 26, 2016 |
Olumyco:uwc. Ermmm...isn't NativeScript worth mentioning? |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 12:46pm On Jan 26, 2016 |
Nmeri17: Yea Nativescript is anoda strong JavaScript framework. It's worth mentioning. Though it's drive in d mobile industry is bin contested by react native. React/React native is anoda beast ..... |
Re: Javascript Frameworks, Libraries & Tools by Nmeri17: 9:59pm On Jan 26, 2016 |
Olumyco:Oya naa. maybe you should update the list there for the many that don't know about it Why does react native topple NativeScript |
Re: Javascript Frameworks, Libraries & Tools by WafiJoe(m): 1:49pm On Jan 28, 2016 |
I salute all you web developers and app developers in the house. Olumyco: Please don't forget to invite for the next conference you will be attending. |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 9:55pm On Jan 30, 2016 |
WafiJoe: Lol I no go d conference myself o. Rami Sayer - the "putter" of the article did |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 9:57pm On Jan 30, 2016 |
NativeScript Framework added.... |
Re: Javascript Frameworks, Libraries & Tools by WafiJoe(m): 8:31am On Jan 31, 2016 |
Olumyco: Okay boss. Nice write up anyway. |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 10:54pm On Jul 29, 2016 |
Sails added..... |
Re: Javascript Frameworks, Libraries & Tools by Nobody: 1:01pm On Jul 30, 2016 |
What about NodeJS? |
Re: Javascript Frameworks, Libraries & Tools by stack1(m): 9:55pm On Jul 30, 2016 |
in any case sha lemme put my own framework written from scratch by my self its called tigerjs, its a full-fledged library with many advanced modules like an Iterator modelu, an IO module, a utility module, widgets module(s) amd much more.. see it here https://sourceforge.net/projects/tigerjs/ hope u guyz wouldn't mind taking it for a spin, i have actually used it on an already released project and its the only library i needed. |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 1:00pm On Aug 01, 2016 |
stack1: Wao! U mean U did that urself..... kudos I can see d library does many tins..... But what do u mean by Fx library and small memory footprint...... |
Re: Javascript Frameworks, Libraries & Tools by stack1(m): 2:06pm On Aug 01, 2016 |
Olumyco: the Fx module allows you apply lots of animation and transition effect to an element via script, see the conntained documentation for examples, small memory footprint means it doesn't signigicantly increase the memory usage of the page its running on, i actually did bemchmarks and compared with sench and dojo libraries... |
Re: Javascript Frameworks, Libraries & Tools by Olumyco(m): 4:08pm On Aug 01, 2016 |
stack1: Wao! nice one. Try and put it on Github and give it heavy documentation |
Re: Javascript Frameworks, Libraries & Tools by stack1(m): 5:59pm On Aug 01, 2016 |
Olumyco: wouuld definitely do that, thanks |
(1) (Reply)
Between HDD And SSD Hard Drives Which Is Better / Urgent Help On Sparql Query Ontology / Cybersecurity Community For Starters
(Go Up)
Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health religion celebs tv-movies music-radio literature webmasters programming techmarket Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10) Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 67 |