I'm wondering if anyone has any recommendations of what frontend javascript framework/library I should try to learn first and any resources to use ...
For further actions, you may consider blocking this person and/or reporting abuse
You asked which
frontend JS framework/libraryyou should learn, but I wonder whether thefrontendor theJSpart is more important to you.If it's the former, then honestly,
Elmis far simpler to learn than any JS framework IMO, thanks to the compiler being so helpful and actively giving you a hand figuring out what you need where. Any JS library or framework will help you get something on the screen faster, but actually getting to where you want to be will likely take a lot longer. As for learning resources, you can't go wrong with: frontendmasters.com/courses/elm/But if you want to look at something free first, before diving in (with your wallet), then I'd also recommend the "Elm For Beginnners" course, which is free on knowthen.com
Honestly, I love JS, but I don't think it's a good starting point for anyone looking to learn about front-end development. I think it'll cause you to pick up bad habits without realising it, as well as not giving you especially helpful error messages when things go wrong, which leads to confusion and frustration.
The JS is important to me a little because I want to be more well versed with it and it's different frameworks. That being said I hadn't thought about elm and I'll definitely look into it.
If JS itself is a priority for you, then I agree with the people who have advised that you look to gain a better grasp of JS as a language, rather than just diving into a framework. This is just a personal recommendation mind, you may not find that this works for you if you're motivated more by instant gratification. You'll know how you learn best here. :-)
If you're looking for a great course that will really help you understand the depths of JS I'd highly recommend Anthony Alicea's course "JavaScript: Understanding The Weird Parts" which you'll be able to find on udemy.com :-)
This can be answered by a bunch of RFCs and W3c specs. These are the frameworks those other frameworks are built on top. So here re some recommendations
This should be some of the underlying theorycraft behind a website. If you not only try the things (build a website, deliver it with a webserver and make it "clicky" with Javascript stuff. If you mastered this, there is much more. The authors of those said framworks just have read the same documents (hopefully) a bit earlier. The list is too short .. but my answer stays: Learn the basics, before a framework.
I am not saying read that and learn all contents like in school. Just try the things in there and read up on the theory to the practice. As pointed out other places: You will encounter problems, know what they are and use frameworks to solve them. But just try practically do it yourself for a moment
I appreciate the advice. I've already gotten some knowledge on the things you mentioned above, though I haven't read those specific documents. At this point I'm just trying to decide what tools I want to use to build the frontend of my next project and A JavaScript framework seemed to be where I should start. I was also hoping to work on my JavaScript skills in the meantime.
I went down this rabbit hole recently. This is probably not what you're looking for, but I eschewed everything. I learned Scheme in college, and still think about programming functionally. I went with Clojure/ClojureScript and reagent. It's a lightweight interface to React. I did some of the Clojure koans maintained by 8th Light, then read Web Development with Clojure. ClojureScript uses a completely different mental model, but to me is way more readable and understandable: everything is a map, everything is immutable, everything is data.
I've been programming in CoffeeScript, Python and R for a while, and when I look at modern JavaScript my eyes blur.
It's funny to look back on this comment because now I maintain a few Angular/Ionic apps and like JavaScript just fine.
I think most people will answer this in a "this one is my favourite" kind of way. To that end; I'm really feeling Angular lately... But, to misquote the axiom - when you REALLY like the hammer, everything looks like a nail.
For just starting off in front end, I think React is probably the safest bet. Plenty of resources, simple concepts that give you powerful results, and paradigms that translate across to most other modern front end frameworks.
Find something you enjoy writing :)
This echoed my thoughts exactly. I'm a React guy but I honestly think that you hit the nail on the head with your first sentence (you know... to keep these hammer metaphors going).
I'm with Sebastian Schürmann here.
Learn the basics and current Vanilla Techniques (e.g. Service Workers and Web Components) first. Then you might be able to create an application without any of those big frameworks (at least for the most modern browsers).
I'm basically not a big fan of react, because I dislike the mix of HTML and JS (and possibly even CSS) into one JS file.
Angular (without proper tree shaking) is "huge" in file size for initial loading.
Honestly I can't really say anything about the other current frameworks like Vue.js or Aurelia or anything else.
Any suggestions on where to learn more about "current vanilla" techniques? I feel like I have a good enough grasp on basic vanilla JavaScript, but not as it pertains to application development. I can get basic things to change on a page using JavaScript or jquery or whatever else, but have ever heard of services workers or web components. Though I'll definitely look them up.
I found this article really helpful including the links to further reading:
dev.to/vinay20045/building-a-singl...
Hello Omar, it happened that I answered the same question a couple of days ago.
In my work life I spent 3/4 years working with jQuery, a couple years working on Angular, and a couple of years going Vanilla. I learnt EmberJS, VueJS and ReactJS ( but still no luck in working with them ).
Instead of looking at the reason why you should pick one of your proposed framework/library, I'd like to focus on why not you should choose one or the other.
I'm assuming that you are not focusing on job search ( so you're learning for the sake of learning and gathering experience ). If you are searching job, my advice is just go with the one you find more offer in your area.
If, instead, you are curious, here are my thoughts!
I'm assuming you have a basic to intermediate knowledge of JavaScript as a language ( ECMAScript 5 ).
AngularJS
Awesome framework, lots of features, but:
ReactJS
This is not a framework. A really beautiful and easy engine library, but:
EmberJS
As a rubyist I found this framework totally awesome. But:
VueJS
Vue is like a Angular1 with a cleaner structure. Is a modular framework, which means you can "plug" functionalities when you need them ( as opposed a monolithic framework like AngularJS, where everything is there, with some minor exceptions ).
But:
The major advantage I see in Vue is that you can start in plain old ECMAScript 5, then "improve" to components, then add transpiler, then add ECMAScript 2016, then add routing, then add (chose another one).
Conclusion
Obviously you should try to learn them all! :D
The more things you learn, the more you are exposed to different concepts, structure, way of doing things.
As pretty much everybody else noted, if you do not have a strong grasp in JavaScript, get it. Every JavaScript framework is, essentially, JavaScript :) A solid knowledge of it will help you down the path.
Happy learning!!
First - a distinction: Angular is a Framework, React is a library.
Frameworks and libraries are useful because they help you built sites faster. While a "traditionally" built sites can be built fast enough, there are always libraries, utilities, helpers making this faster. Framework is just a level up on a library.
Example: you can develop a site to support all browsers (desktop, mobile), operating systems (Windows, OS X, iOS, Linux, Android etc) without jQuery or any CSS reset or grid or helpers. People do that and there are sometimes very good reasons to do it like this.
Learn all the above languages here: hackr.io/
But it would take a lot of effort to make sure everything worked on all browsers. From, ie. how you need to attach event listeners, and how to handle them, to creating Ajax requests, doing a lot of things. The same with CSS resets, grid systems etc - if you don't use libraries, you have to take care of all the vendor prefixes and similar.
Now, let's say you use jQuery - now your JavaScript stuff takes a whole lot less effort - because you'd do ajax with jQuery, and jQuery will take care of the underlying platform.
So - you can create your site faster, and with more confidence that you didn't forget something peculiar.
React is a library that helps you make reusable views. You can create components - let's say a simple login form - and reuse it accross projects. With it, you don't have to repeat it every time.
Similarly, you can create an Angular or Polymer component.
So, when developing a new site, you add a and you're done - and you know it's working in all browsers and all OS-es.
Another thing you get is testability. You can write tests for your components, and be certain that your site is built as you intended it to be built.
Finally, the frameworks like this make it a lot easier to detach yourself from the backend perspective. You just know there's some sort of backend service that'll feed you JSON for your sites, but you don't care about it.
If you do your sites without libraries and utilities, you would have to build your own components to communicate with the backend each time you start a new site or add a new resource.
If you are a developer that already has a software and "just wants to get stuff done" and add a front-end to it, probably every framework you mentioned is okay.
But here a bit more detail:
If you like C# or something like this, you're probably better off with Angular 2, which is written in TypeScript, that shares some ideas with C#. It makes heavy use of observables, if that is your thing.
Cycle.js is, in my opinion, the better obsevable based framework, more lightweight etc.
If you don't like or know observables this could be an overkill, but if you got a push API (WebSockets, etc.) this could really help.
If you not into this, React is nice, small API surface, gets you going quick, also
has a big eco system. It's more imperative, push down props to your components and they push up events. If you like to learn it so you know a framework (jobs, other projects, etc.) I think this is the way to go, since its more than a web framework, there are also things like React-Native or React-VR that allow you to re-use your React skills later, but if you just want this one project done, this probably doesn't matter.
If you think all the big corps are wanna steal your bacon, go with Ember or Vue, since they are community based. Ember is a way more mature than Vue, but also way more old school.
If you know jQuery and don't want to build a too big app, Vue probably could be right for your. Not because Vue isn't suited for big apps, but it recommends different concepts for them. Data-binding for small to medium apps and components for medium to large apps.
People described Vue to me as a mix os of Angular and React concepts, the bad or good parts depending on who you talk to. The last time I used Ember they just added components to their, already long, list of concepts.
If you into tiny things and want to do many things yourself, you could look into Preact (a React clone) or HyperApp.
This worked for me and I have recommended it to others based on my experience learning and through interviews.
I always recommend gaining a very strong, deep grasp of JavaScript. The frameworks ultimately are JavaScript.
I built a few web apps first in just Pure JavaScript. I think it was very important to understand core concepts such as event handling, async programming, promises, prototypical inheritance, function composition, error handling, data validation, and many more.
I personally like the No Starch Press books. I would recommend this sequence:
Principles of Object-Oriented JavaScript
by Nicholas C. Zakas
Understanding ECMAScript 6
by Nicholas C. Zakas
The Mozilla Developer Network is another fantastic resource to learn about Web Technologies.
MDN
Try making something like a Calculator web app in pure JavaScript. It will help you explore different topics and find and understand some of the quirks of the language.
Once you are solid on JavaScript, then whatever framework you choose would feel easier to learn. You are learning an application of the JavaScript language and can make sense at a deeper level of what the framework is doing for you. I like to think that Frameworks are Tamed Wild Beasts. You can surely play with them safely most of the time, but it is a good idea to anticipate that they may bite and you would need to be ready to handle that (look into their source code and figure out why something is not working or failing - for example).
Angular
I have had a not so great time learning AngularJS. I did not find the documentation too satisfying. It was a bit difficult to find a good book (I am a book person more than videos). However, Coursera has an AMAZING course to learn Angular that goes deep from the get go yet teaches in a very friendly nature:
Single Page Web Applications with AngularJS
Todd Motto and John Papa will also be good sources to learn intricacies of the framework, style guides, and best practices.
React
React seems very cool since it has this functional programming vibe. The book that I am using has an introduction to Functional Programming that is aimed to make the learning of React better.
Learning React
Functional Web Development with React and Redux
By Alex Banks, Eve Porcello
The book so far has been pretty good!
I like that React has a reputation of being performant and also comes with a strong mobile application framework, React Native.
Vue
To be honest, I just started reading about this framework and it sounds very promising. I have a feeling Vue is like the offspring of Angular and React - in a way. I am going to be checking it out for pure experimentation. It is said that it is simpler than both React and Angular to learn and get started to make “non-trivial applications” - from their docs.
I wish that Vue had something such as React Native up and running. There is something called Weex but it is not at the position of React Native yet from what I have heard.
Conclusion
I feel that my next framework is going to be React purely for the fact that React Native is getting great reviews on mobile performance. I have always wanted to get into mobile apps but I did not have the time to learn Java and Swift/ObjectiveC to make cross platform apps. I think JavaScript opened a new ground to streamline cross-device, cross-platform development for certain use cases for apps.
Best of luck in your JS adventures!
You can learn Front End Javascript, Angular, React and lots many other languages only at: hackr.io/
Don't just read the books. The best way to learn how to program is by doing it. It's easy to spend hours reading about syntax, but computer languages like human languages require you to use them in order to understand them.
Try starting with simple projects. If you're going the HTML / CSS route, play with JavaScript and get a simple div to move around on the page when you click on something. Then work your way up to more complex ones. For instance, write a simple todo list with HTML form elements. You have to learn DOM manipulation to properly handle when the user interacts with the page.
At Stanford, they teach beginning CS with games. Try building a hangman game using JS, or even just on the command prompt using Ruby or Python.
If you want to use a JavaScript framework, First you need to know the basics of JavaScript.
I recommend to start with the Understandings JavaScript: The weird parts course, on Udemy (10$)
After that you can make a lot of experiments or the basics “hello world” app of each js framework that you want. When you feel confortable with any fmwrk you can afford with it.
As first framework to learn. I think I should be React.
Becouse React teach you component architecture, and learning React you will improve your JavaScript.
But I'm not saying you shouldn't continue to improving you knowledge with JavaScript.
And how you will understand you already learned React enough? You need adequate metrics.
Learning React is about have good understanding of state-setState, and component life cycles.
Write authentication with React, then same with Redux, and then try mobx.
Adopt flow-type for you applications.
Maybe then it will be interesting to try different solutions, for example Angular4 or Vue.
You only at the beginning
If you're still looking for JS learning resources, check out freecodecamp.com. Go to their "Map" and search for the JavaScript/Algorithm challenges. It'll help you solve problems using just JavaScript, and that will help build your understanding of the language, when to use certain patterns, methods, etc.
My current favourite, after trying Angular2, React and Vue is Cycle.js (I might be biased, I'm a core contributor), because the Stream based approach makes combining HTTP, websockets and other effects easy. What I also like is the flexibility of the Framework. The app/driver seperation makes it very adaptable. It uses Snabbdom like Vue and is quite fast. In fact, it was the framework with the highest (percieved) performance in the pythagora's tree example. Plus it is amazing for testing as seen in Nick's and my Talk.
This is the never ending debate...There will be comments saying react. They will be comments saying angular. But I would say start learning what the frameworks solve and they find apps you can build with the frameoworks
Do you need a framework? I'm also a junior FED and as I started learning JS through Angular 1.x, I never really knew that one could write a single-page-app sans framework. It is much harder, but I can see the point in not bloating up a website by installing a whole framework and using multiple dependencies, also improving performance if you are building a small site with no need for user logins, live updates of content or databasing. Then a year later, they rewrote the entire language and I hate it! Time to try a new framework, but I still don't know how to javascript well.
I've had a lot of conflicting advice from senior devs of different backgrounds. Are you coding for fun or for industry? The "all fun" side of me would try the frameworks out and see which has the highest learning gradient vs the industry-oriented side of me would feel driven to try writing a small project in vanilla JS. However the latter might be so offputting as a starter I just might as well start with a wee demo project like a to-do list or a shoutbox.
This is a really good question, do you have a specific project in mind?
I have a few things in mind. Mainly my goal is to learn, I just graduated and are trying to fill the downtime between that and starting my first job with something productive.
One of my side projects I have been planning is re-writing a project I did during the school year, but wasn't able to complete as well as I would have liked due to time constraints and other factors. It was originally written using Django, I'm a go-to python guy, its what they taught in school. My hope was to still use Django, utilizing the Django REST framework for my backend and try to use something else for the frontend, which is why I thought of javascript frameworks.
Another project I've been looking to work on is with a friend of mine for a possible start up, for that we only need a basic webpage/mockup for now, that would later need to be extended out to allow basic app functionality, logging in/out, signup, etc. So again for that project I thought javascript would make sense for the front end. Hope that gives you more insight. I'm really just a soon to be junior developer trying to make to most of a boring summer haha.
If you have decided on learning React, this is the best one so far.
kirupa.com/react/index.htm
Make some experiments with all the frameworks, when any experiment fulls your curiosity go for something bigger.